connect-the-dots

A site for creating a dot line game when the user enters a picture and it creates a dot line game for him for coding hackathon.

Stars
7

📔 Table of Contents

🌟 About the Project

This repository houses an stunning Responsive Website that make a connect the dot game from given image .

Our mission is to bring you back to childhood!

for more information you can see the project documentation we did at the link below and also look at the project video!

‼️ Folder Structure

Here is the folder structure of the website

connect-the-dots/
|- Front/
  |-- assets/
    |-- img/
      |-- about/
        |-- 1.jpg
        |-- 2.jpg
        |-- 3.jpg
        |-- 4.jpg
      |-- team/
        |-- alon.jpg
        |-- liron.jpg
      |-- close-icon.svg
      |-- convert-header-bg.jpg
      |-- gallery-bg.jpg
      |-- header-bg.jpg
    |-- favicon.ico
  |-- css/
    styles.css
  |-- js/
    |-- filters..js
    |-- gallery.js
    |-- imageProcessing.js
    |-- main.js
    |-- pathProcessing.js
    |-- scripts.js
  |-- convert.html
  |-- gallery.html
  |-- index.html
  |-- package-lock.json
|-- Server/
  |-- src/
    |-- DatabaseInterface.ts
    |-- Server.ts
|-- README.md
  |-- Package-lock.json
  |-- package.json
|-- gitignore  

🤖 Tech Stack

🧰 Getting Started

⚙️ Installation

Step 1:

Download or clone this repo by using the link below:

 https://github.com/lironmiz/connect-the-dots.git

Step 2:

make sure that Node.js is installed by execute the following command in console:

  node -v

🏃 Run Locally

Step 1:

Use npm install to download the required dependencies:

  npm install ...

Step 2:

At the main folder execute the following command in console to run the server:

  npx ts-node Server/src/server.ts

💪 Features

  • Turning a picture into a dot line game
  • Option to print the image or download it
  • Manual background removal
  • Possibility to create the game as several objects in the picture
  • Gallery to display all games
  • Option to sort the games by category int the gallery
  • Support for all image file types
  • Option to uplode image from API that give you cute pictures of dogs!

📹 Video Of The Project

https://user-images.githubusercontent.com/91504420/222888487-14944014-fe49-44d3-a459-26ab7580b67e.mp4

🖼️ Screenshots

☎️ About the authors

  • Alon Regev - A soldier in a technological unit in the army

  • Liron Mizarhi - Navy soldier and programmer

:octocat: Project Status

Project is: Done!

Related Projects