A small JS library for beautiful drawing and handwriting on the HTML Canvas.
MIT License
Bot releases are hidden (Show)
This release fixes #99 as reported by @nichoth, who also kindly provided the fix 🙏
Published by jakubfiala 6 months ago
Almost managed to release this one on the correct date!
This version makes one important change for applications where the canvas is not taking up the whole screen. If the pointer leaves the canvas (Atrament handles the pointerout event), Atrament will now end the stroke, instead of pretending it continues. This helps avoid unexpected stroke paths when returning to the canvas.
Another fix I made was that Atrament now "forgets" the previous mouse position even if the pointerup
event fires when the pointer is outside of the element. This prevents unexpected stroke paths when beginning a new stroke.
Published by jakubfiala 7 months ago
This version should fix #98 - it changes how the dirty
flag behaves, as it's now toggled in the draw()
method. This means it will also be true if drawing programmatically, not just when using a pointer (mouse/touch/stylus).
Another change is that the clear()
method now clears the canvas regardless of whether Atrament has drawn on it. I believe this will lead to more predictable behaviour. The method has also been refactored to take into account the canvas transform.
Published by jakubfiala 7 months ago
This release changes the license to MIT. I was a silly 22-year-old when I initially released Atrament, licensing it under Phil Sturgeon's DBAD License because I found it funny. I did not anticipate that, years later, Atrament would have 1.4k stars and be used by over 100 projects just publicly listed on GitHub, and potentially many more.
While I still like the DBAD License and find it funny, I don't think it's the best idea for a serious OSS project's license to include that sort of language. I don't particularly want Atrament's users to buy me pints, even though I do like beer a lot. It would also exclude all the other wonderful people who contributed to the library over the years.
I chose the MIT License because:
While I think license changes should normally result in a major version upgrade (some people even suggest publishing a new package), I find this to be a negligible change for even the most legally restrictive organisations, and could not justify a major bump, so I'm simply doing this as a patch. I'd be happy to address any concerns raised via GitHub issues.
Published by jakubfiala 7 months ago
This version brings the biggest overhaul of Atrament since its first release in 2016. Much of the library has been completely rewritten, the look & feel of the drawing has changed significantly and many optimisations have been made.
Atrament
class is now a default exportmode
setter now only accepts symbols exported from the library (e.g. MODE_DRAW
). If anything else is passed, an error is thrown.segments
, instead of points
. Each segment then contains a point
. This should clarify the data model and help avoid repetitive code such as stroke.points.forEach((point) => point.point)
.pointdrawn
event has been renamed to segmentdrawn
toImage()
method has been removed - please use canvas.toDataURL()
to achieve the same effectisDirty()
method has been replaced by the dirty
getter, making it more consistent with the rest of the APIAtrament
class now uses private fields and methods. A number of undocumented fields+methods are now not accessible from the outside.adaptiveStroke
is enabled (default), Atrament now responds to the pointer's pressure by changing the stroke thickness. This is useful when using pressure-sensitive input methods such as the Apple Pencil.weight
setting in pixels, leading to a more consistent drawing feel especially when drawing finer details.atrament:
Published by jakubfiala almost 2 years ago
This release adds a pointdrawn
event when recording strokes (#77) and changes the library API so the Atrament
class is a named export. This made it easier for us to upgrade to webpack 5.
Published by jakubfiala about 3 years ago
And after a long time, a major release! This time @panglesd has added timing information to the strokerecorded
event (see #75). This means points
is now an array of "record" objects which contain the point
and time
, which represents the relative timestamp in milliseconds from the beginning of the stroke.
Additionally, a number of dependabot security updates have been merged.
Published by jakubfiala almost 4 years ago
This update fixes an undesired behaviour where stroke events were recorded when clicking outside of the canvas, and strokes were drawn even if the mouse has been pressed outside of the canvas, too. Thanks @future-cyborg for diagnosing and fixing this!
Published by jakubfiala almost 4 years ago
This update adds the option to set the mode
to disabled
#60 #61. In this mode, no modifications are made to the canvas, but drawing is still tracked and the expected stroke events still fire. Thanks @uriberto for both suggesting and implementing this feature!
Published by jakubfiala over 4 years ago
This release removes mentions of the opacity
option, which was removed in v1.0.0. I believe the option wasn't very useful, because the way Atrament draws the strokes is via many composite curves, which may overlap. When using the globalAlpha
setting, this means the resulting stroke doesn't have uniform opacity, but is rather composed of a number of semi-transparent layers.
Thanks @alireza23 for pointing out the broken opacity
slider in the demo (#52)
Published by jakubfiala almost 5 years ago
This version brings API improvements and bug fixes mainly relating to the launch of v1.0.0. I decided to break semver rules here because 1.0.0 is only a few days old.
begin/endDrawing
are now called begin/endStroke
and they record cursor position and combined with draw
can be used to reconstruct strokes. See the Programmatic Drawing section of the README for a code example.opacity
option as it caused issues with programmatic drawing, and wasn't really working in an intuitive way anyway, since each Atrament stroke consists of many potentially overlapping curve segments.Published by jakubfiala almost 5 years ago
First major version bump of Atrament is here!
This version brings breaking changes to the API and new features, such as:
atrament
factory function, and replacing it with the new Atrament(...
constructorstrokestart
/strokeend
fillstart
/fillend
strokerecorded
smoothing
parameter a number, which means developers can fine tune their desired smoothing intensityPublished by jakubfiala about 5 years ago
This update fixes #33 - so when clicking/tapping only once, a dot is drawn even if mousemove
doesn't happen to fire.
Thanks @dethe for their brilliant fix 🙏
Published by jakubfiala almost 6 years ago
This version brings bug fixes (issues #36 and #30)
thanks to @bencergazda for pull requests 🙏
Published by jakubfiala over 6 years ago
This version introduces a fix to a Chrome bug where decimal values were rounded upwards, causing shifts in array indices when performing the flood fill algorithm.
Bug discovered and fixed by @rubenanton90 – thanks a lot!
Published by jakubfiala over 7 years ago
This release introduces a flag to turn off adaptive stroke width, and fixes a couple of issues:
eslint
integration to enforce a coding stylePublished by jakubfiala almost 8 years ago
This release fixes issues when the canvas position is obtained with respect to nested content rather than the root element. thanks @rubenstolk 🎉
Published by jakubfiala about 8 years ago
This release adds changes by @rubenstolk which fix issues with touch offset on iOS – #12 #13
Published by jakubfiala over 8 years ago
fill
mode – added by @ptkach in #4 #6
Published by jakubfiala over 8 years ago
This release adds basic touch support, as well as the ability to create the Atrament object from a DOM Node
.