* better decimal rounding in NumberInput
* - created function to reuse
- used math instead of string manipulation
* updated comment to be correct
* updated comment
* updated comment
Many large changes, including:
- TypeScript enums are now string unions throughout
- Strong type-checking throughout the TS and Vue codebase
- Vue component props now all specify `as PropType<...>`
- Usage of annotated return types on all functions
- Sorting of JS import statements
- Explicit usage of Vue bind attribute function call arguments (`@click="foo"` is now `@click=(e) => foo(e)`)
- Much improved code quality related to the color picker
- Consistent camelCase Vue bind and v-model attributes
- Consistent Vue HTML attribute strings with single quotes
- Bug fix and clarity improvement with incorrect hint class parameters
- Empty Vue component objects like `props: {}` and `components: {}` removed
* Hook up user input hints to display in the frontend status bar
Closes#171
* MVP hint system based on tool FSM
* Fix hints for Fill and Eyedropper tools
* Add icons for keyboard shortcuts
* Fix hints for Pen Tool
* Cleanup
* wasm: do the async initialization only once
This allows the rest of the app to access wasm synchronously.
This allows removing of a global.
* provide the wasm via vue provide/inject.
There's still code directly accessing the wasm. That will be changed later.
* MenuBarInput: use injected wasm instead of the global instance
* Let the App handle event listeners
* move stateful modules into state/
* state/fullscreen: create per instance
* App: load the initial document list on mount.
This got lost a few commits ago. Now it's back.
* state/dialog: create per instance
* util/input: remove dependency on global dialog instance
* state/documents: create per instance
* reponse-handler: move into EditorWasm
* comingSoon: move into dialog
* wasm: allow instantiating multiple editors
* input handlers: do not look at canvases outside the mounted App
* input: listen on the container instead of the window when possible
* - removed proxy from wasm-loader
- integrated with js-dispatcher
- state functions to classes
- integrated some upstream changes
* fix errors caused by merge
* Getting closer:
- added global state to track all instances
- fix fullscreen close trigger
- wasm-loader is statefull
- panic across instanes
* - fix outline while using editor
- removed circular import rule
- added editorInstance to js message constructor
* - changed input handler to a class
- still need a better way of handeling it in App.vue
* - fixed single instance of inputManager to weakmap
* - fix no-explicit-any in a few places
- removed global state from input.ts
* simplified two long lines
* removed global state
* removed $data from App
* add mut self to functions in api.rs
* Update Workspace.vue
remove outdated import
* fixed missing import
* Changes throughout code review; note this causes some bugs to be fixed in a later commit
* PR review round 1
* - fix coming soon bugs
- changed folder structure
* moved declaration to .d.ts
* - changed from classes to functions
- moved decs back to app.vue
* removed need to export js function to rust
* changed folder structure
* fixed indentation breaking multiline strings
* Fix eslint rule to whitelist @/../
* Simplify strip-indents implementation
* replace type assertions with better annotations or proper runtime checks
* Small tweaks and code rearranging improvements after second code review pass
* maybe fix mouse events
* Add back preventDefault for mouse scroll
* code review round 2
* Comment improvements
* -removed runtime checks
- fixed layers not showing
* - extened proxy to cover classes
- stopped multiple panics from logging
- Stop wasm-bindgen from mut ref counting our struct
* cleaned up messageConstructors exports
* Fix input and fullscreen regressions
Co-authored-by: Max Fisher <maxmfishernj@gmail.com>
Co-authored-by: mfish33 <32677537+mfish33@users.noreply.github.com>
Co-authored-by: Keavon Chambers <keavon@keavon.com>
* ability to mark an open document as unsaved
* unsaved detection now being triggered based on layer tree height
* Changed responses to use classes instead of interfaces
* - rust implementation of unsaved markers
- upgraded eslint
* updated eslint in package.json
* - Renamed GetOpenDocumentsList -> UpdateOpenDocumentsList
- is not -> was not
* changed hash to current identifier to better reflect its meaning
* resolve some merge conflicts
* removed console.log statement leftover from debuging
* - changed Response to jsMessage
- split files
- Array<> -> []
* -remove path from UpdateLayer
* - remove unused if statements
* - comment for reflect-metadata
- registerJsMessageHandler -> subscribeJsMessage
- readonly message properties
- fixed binding filename and comment
- toRgb -> toRgba
* - newOpacity -> transformer
- added comments
* MessageMaker -> messageMaker
Major CSS improvements to layout at small screen sizes. By adding min-width: 0 and min-height: 0 on the nested display: flex structure, widgets no longer coerce the whole layout into large-scale resizing. Scrollbars are now used to allow correct overflowing of the tab bar (fixes#177), Document Panel options bar, and tool shelf. Improvements to responsive resizing are also included for viewing the UI correctly on mobile now. Additional small fixes to styling of widget colors and corner roundness. The ruler has been darkened one shade to improve text contrast and aesthetics.
* Upgrade TypeScript, ESLint, and other dependencies
This also cleans up various other files where newer ESLint rules complained
* Set CI and CD to use Node.js version 16
* Small tweak
* Fix CD version printing
* Add nvm version for Cloudflare Pages
* Implement undo and redo
* Create more save points and hook up menu entry
* Fix operation ordering
* Remove debug statement
* Fix folder changed order
* Don't store overlays in the history chain
* Keep selection
* Add a stroke width option to the Line Tool
* Fix title case for line options
* Add px unit to line stroke width
* Add stroke width to pen tool
* Rename stroke width to weight
* Change number input width to min-width
* Remove the word "stroke" from "stroke weight"
* Add support for saving a document
This is similar to the "export" functionality, except that
we store all metadata needed to open the file again.
Currently we store the internal representation of the layer
which is probably pretty fragile.
Example document:
```json
{
"nodes": {},
"root": {
"blend_mode": "Normal",
"cache": "...",
"cache_dirty": false,
"data": {
"Folder": {
"layer_ids": [
3902938778642561358
],
"layers": [
{
"blend_mode": "Normal",
"cache": "...",
"cache_dirty": false,
"data": {
"Shape": {
"path": [
{
"MoveTo": {
"x": 0.0,
"y": 0.0
}
},
{
"LineTo": {
"x": 1.0,
"y": 0.0
}
},
{
"LineTo": {
"x": 1.0,
"y": 1.0
}
},
{
"LineTo": {
"x": 0.0,
"y": 1.0
}
},
"ClosePath"
],
"render_index": 1,
"solid": true,
"style": {
"fill": {
"color": {
"alpha": 1.0,
"blue": 0.0,
"green": 0.0,
"red": 0.0
}
},
"stroke": null
}
}
},
"name": null,
"opacity": 1.0,
"thumbnail_cache": "...",
"transform": {
"matrix2": [
223.0,
0.0,
-0.0,
348.0
],
"translation": [
-188.0,
-334.0
]
},
"visible": true
}
],
"next_assignment_id": 3902938778642561359
}
},
"name": null,
"opacity": 1.0,
"thumbnail_cache": "...",
"transform": {
"matrix2": [
1.0,
0.0,
0.0,
1.0
],
"translation": [
479.0,
563.0
]
},
"visible": true
},
"version": 0
}
```
* Add support for opening a saved document
User can select a file using the browser's file input selector.
We parse it as JSON and load it into the internal representation.
Concerns:
- The file format is fragile
- Loading data directly into internal data structures usually creates
security vulnerabilities
- Error handling: The user is not informed of errors
* Serialize Document and skip "cache" fields in Layer
Instead of serializing the root layer, we serialize the
Document struct directly. Additionally, we mark the
"cache" fields in layer as "skip" fields so they
don't get serialized.
* Opened files use the filename as the tab title
* Split "new document" and "open document" handling
Open document needs name and content to be provided so having a
different interface is cleaner. Also did some refactoring to reuse code.
* Show error to user when a file fails to open
* Clean up code: better variable naming and structure
* Use document name for saved and exported files
We pass through the document name in the export and save
messages. Additionally, we check if the appropriate file
suffixes (.graphite and .svg) need to be added before
passing it to the frontend.
* Refactor document name generation
* Don't assign a default of 1 to Documents that start with something
other than DEFAULT_DOCUMENT_NAME
* Improve runtime complexity by using binary instead of linear search
* Update Layer panel upon document selection
* Add File>Open/Ctrl+O; File>Save (As)/Ctrl+(Shift)+S; browse filters extension; split out download()/upload() into files.ts; change unsaved close dialog text
Co-authored-by: Dennis Kobert <dennis@kobert.dev>
Co-authored-by: Keavon Chambers <keavon@keavon.com>