Please use Conventional Commits for commits.

Once you've installed dependencies with npm install, start a development server:

npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open

To create a production version of your app:

npm run build

You can preview the production build with npm run preview.

(non si possono editare i messaggi dopo 48 ore)

1. UML
   1. Associations creation
   2. Association classes
   3. Generalization creation
   4. Validated UML (no two attributes with same name, no two classes with same name etc...)
   5. "is identifier" isn't enough, you need to be able to specify an optional id number
   6. Add support for use-case diagram
   7. Add support for instances (links and objects), and arrows that connect instances to classes (dashed)
2. Functionality
   1. Import JSON
   2. Export JSON
   3. GitHub action that compiles the website to HTML and publishes it to GitHub Pages
   4. Offline application (with a ServiceWorker or something, if it's enough to download the html even better)
      • An option would be to release a zip with the html files, and a python script that serves the files or something
   5. Create a conf global object
      • fontSize, gridSize,
      • fontFamily, defaultStyle etc...
        • Menu to edit config (settings)
   6. Keep history of changes in order to go back and forth (JSON TO STACK)
   7. Remove grid and stuff when exporting JSON (and export just the graph components)
   8. Add support for exporting only selected items
   9. Save history to localStorage
3. UI
   1. Snap class dimensions to grid
      • The width and height are multiples of conf.gridSize * 2
      • The width is at least the length necessary to show the attributes / operations and at most the width choosen by the user (and snapped)
      • The width and height are the least length necessary to keep all links on
   2. Icons tooltips
   3. UI for selection
      • Bring selection rectangle to the foreground
      • Highlight selected items
   4. Adjust UI (font sizes of stuff etc...)
   5. Update paper size when window is resized
   6. Association delete button (or something) when association is selected (and is only one)
   7. Add fixed points to associations (and generalizations)
   8. Create icon for project, change name to something nicer (rebranding)
   9. Make PropertyInspector resizable (fix: made it float over the paper, and changes size based on content)
   10. Where possible (all items selected have the same style), show currently selected style
   11. Possibility to add / select custom colors
   12. Class, also change divider stroke color
   13. Class, separate color for title and body
   14. Fix association labels
4. UX
   1. When creating a class, open the menu of the class
   2. Shortcuts lik Ctrl+S to save JSON, and shortcuts for tools
   3. Better operations and attributes handling (specify name, type, multiplicty, whether it has id or not etc...); the goal is to show different info with different styles (bold for type, italics for {id} etc...)
   4. If the rectangles of two classes overlap, move them in order to not overlap anymore
   5. Option to move an attribute from one class to another
   6. Filter empty attributes
   7. Ability to change attributes order
   8. Ability to select multiple objects
      • And change common properties of selected objects
   9. Use localStorage in order to remember diagram JSON
   10. Instead of moving when clicking with mouse, start selection (in selection mode)! In selection mode move only when mouse wheel is clicked (this second part is missing)
   11. Add README description, otherwise people don't know how to use it correclty
   12. Allow copy, paste + delete key (or backspace) shotcut to remove object
       • When pasting, paste on mouse position
   13. When pressing Esc, all stuff closes and deselects
       • For now it deselects
       • It must close menus too
   14. Store zoom to localStorage, load on start
   15. Always on hints under tool selection on usage (small, gray, with <code></code> too for some keys like Ctrl), maybe add possiblity disable hints
   16. Handle association and generalization moving from one port to another
   17. If a port is connect to an association, there aren't other links to that port; it's either multiple generalizations or one association
   18. Move selected items in tandem
   19. If shift pressed while selecting, select multiple compoments (otherwise deselect only clicked)
   20. Edit class name on double click
   21. Ctrl +, Ctrl - for zoom
   22. Fake class when dragging (not needed anymore, double click to create a class)
   23. Instructions when opening first time (use localStorage to remember to hide), + show help button (show help button could be enough, after github button)
   24. Fix double click on association (it both creates a vertex and opens the menu; it works well on labels, but not on edge)
   25. Store paper translation to localStorage, load on start
   26. Add shortcut "+" to add attributes in class!
   27. focus on newly created attribute when adding an attribute (/ operation)
   28. move to center of diagram instead of translate 0 0
   29. highlight currently edited attribute in diagram (maybe one could zoom in the diagram position of the thing)
   30. when exporting svg, remove the ports!
   31. please do the png export
5. BUGS
   1. When resizing graph disappears (fixed: I didn't have to call .render() after setting the new dimensions, it did that autmatically)
   2. Cancel button not working
   3. Update localStorage on deletion of elments too (or debug it at least)
   4. Association label resize width on content change
   5. Fix slow input when editing attributes and operations (i.e. save just after typing, not before)
   6. The smaller the zoom gets, the worse the panning becomes (it's all jittery)
   7. When moving multiple selected elements, it gets slow

TODO:

• reduce minimum zoom to 40
• dashed line
• use-case
• actor
• object
• link
• instanceOf
• 2 toolbar lines: one for objects-like things, one for link-like things... nah