Sticky-Notes

Sticky notes is an application you can use to create sticky notes.

FEATURES

  • Ability to add/remove/edit highlights
  • Ability to create buckets to group highlights in
  • Ability to group highlights into buckets
  • Ability to move highlights from one bucket to another.
  • Ability to zoom in/zoom out of the whiteboard, resizing the tool components themselves.

BROWSER SUPPORT

Chrome, Firefox 3.5+, Safari 4+, Opera 10+, Internet Explorer 8+, Brave

Set-up

git clone https://github.com/KhushiChaudhary744/Sticky-Notes.git

Make sure the three files are in same folder. Simply open the index.html file using any browser.

What I have done

The site is designed to have a very retro look. I have implemented the code using simple HTML, CSS, and pure javascript. The entire knowledge aggregation product is organized into two separate parts. The first part under the stickies-container division is responsible for the creation,editing, dealition along with the dragging and dropping of the sticky notes. The second portion in GroupList division is responsible for the creation and deletion of buckets. The sticky notes are dynamically generated after taking input from the user. The drag feature is implemented using basic js modules and functions like addEventListener. The sticky note can be dragged across the whiteboard and even outside if needed. The buckets are implemented dynamically using a stack based approach. The user can create and delete them. We can easily drag the notes across the platform and place them as need be. There is no bar on the number of containers that can be generated or the no of sticky notes.

Video link = https://drive.google.com/drive/folders/13iCFIii5jcLEGPwmtvTIPF4chJWW7MUB?usp=sharing