Skip to content

Latest commit

 

History

History
32 lines (20 loc) · 1.67 KB

README.md

File metadata and controls

32 lines (20 loc) · 1.67 KB
Raw

Sketchpad

A browser implementation of a sketchpad using javascript. Basic dynamic and interactive website with grid of squares where users can "sketch" by hovering their cursor over the squares. Clicking on the various options allow the user to change the grid size of the drawing area. The user is able to change the grid size, change the sketch color, erase, and download the sketch as an image upon completion. User toggles between two modes, sketching and not sketching. By default the user is not sketching. To change mode, user must click anywhere in document. The bottom border color of the navigation bar describes which mode the user is in: green is sketching, red is not sketching.

Buttons:

  • Clear: Resets all the squares in grid to their default color.
  • Resize: Choose from a selection of sizes to resize grid. This will also clear the grid.
  • Download: Downloads the sketch as a png file.
  • Erase: Changes to the default background color (lightgray).
  • Help: Opens a help box.
  • Spectrum Color Picker: Choose any color. The default color is black.

Sketchpad

View Project

Built With

  • jQuery - Javascript library
  • Bootstrap - Used for a responsive navigation bar
  • Spectrum - jQuery plugin used for colorpicker
  • html2canvas - Used to download sketch as a png file

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

  • This project was created as part of The Odin Project curriculum.