/Projet-fullstack

Un site de type "Paint" qui permet de manipuler des formes et du texte.

Primary LanguageJavaScript

Projet Fullstack "Paint"

Les participants au projet :

Personne Rôle Github Linkedin
ARUMAINATHAN Rijenth Backend @Rijenth A_Rijenth
HUANG Victor Frontend @Victor H_Victor
BESSON Victor Frontend @Victor B_Victor
MABROUKI Rayane Frontend @Rayane M_Rayane
AIDIBE Hassan Frontend @Hassan A_Hassan
BAYEL Clement Frontend @Clement B_Clement

Comment accéder au site

  1. Lien vers le site : https://paint.arijenth.com
  2. Vous pouvez vous inscrire sur le site en renseignant le code secret "paint" dans le champ correspondant.

Comment utiliser le site (Fonctionnalité disponible)

  1. Création de carré(s), triangle(s), cercle(s). Pour recréer une forme, il faut réappuyer sur le bouton correspondant à la forme que vous souhaitez créer.
  2. Sélection et déplacement des formes qui ont été créés. (Pour la sélection d'une forme, si un clic ne suffit pas, tenter un double-clic)
  3. Les formes sont redimensionnables. (Depuis les côtés et les coins)
  4. Resélectionner une autre forme en cliquant dessus puis la désélectionner en cliquant dans la zone blanche de dessin.
  5. Effacer une forme existante en cliquant sur la gomme puis en sélectionnant une forme.
  6. Créer une zone de texte et la déplacer.
  7. Choisir une police d’écriture pour la zone de texte. (Choisir la police puis cliquer sur le texte pour modifier la police du texte.
  8. Changer la couleur d’une forme ou d’un texte en sélectionnant une couleur, puis en cliquant sur la forme en question.
  9. Changer la couleur des bordures des formes. La procédure est similaire au changement de couleur.
  10. Effacer entièrement le plan de dessin avec le bouton « Clear »
  11. Récupérer un fichier « .pdf » de votre dessin sur votre ordinateur.
  12. Récupérer un fichier « .png » de votre dessin sur votre ordinateur.
  13. Sauvegarder un dessin avec le bouton « sauvegarder » pour pouvoir le reprendre plus tard.
  14. Choisir une sauvegarde de dessin à charger avec le bouton « Choisir », puis charger la sauvegarde avec le bouton « Charger ». /!\ Cette fonctionnalité présente un bug qui ne fait apparaitre que la première forme du dessin sauvegardé. Ce bug prend fin lorsque vous faites apparaitre une nouvelle forme dans la zone de dessin. /!\
Fonctionnalité Disponibilité Bug
Dessiner un rectangle
Dessiner un cercle ou une ellipse
Dessiner un triangle (pointe vers le haut)
Dessiner une zone de texte
Une couleur "primaire" utilisée pour le contour des formes ou pour la couleur du texte
Une couleur "secondaire" utilisée pour le remplissage des formes ou le surlignement du texte
Un menu déroulant permettant de sélectionner une police parmi trois (minimum)
Présence d'une grande zone blanche pour y dessiner des formes
Déplacer la forme
Modifier les dimensions de la forme
Changer les couleurs de la forme
Une gomme pour pouvoir effacer une forme
Sauvegarder ce dessin (pour la reprendre plus tard)
Choisir un dessin (parmi les sauvegardes)
Charger un dessin (parmi les sauvegardes) dans la zone de dessin Lors du chargement, seul la toute première forme du dessin apparait. Il faut créer une nouvelle forme pour voir toute la sauvegarde se charger complètement.
Exporter le dessin au format image
Exporter le dessin au format PDF
Login
Signup
Dashboard des dessins qui on été sauvegardé par l'utilisateur