It looks good. Thank you!

Types of changes

• [x] Bug fix (non-breaking change which fixes an issue)
• [ ] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist

• [x] My code follows the code style of this project.
• [x] My change requires a change to the documentation.
• [x] I have updated the documentation accordingly.
• [ ] I have added tests to cover my changes.
• [x] All new and existing tests passed.

Description

In testing I found that passing a Buffer with garbage data in to pureimage.decodeJPEGFromStream was causing an Uncaught Exception to be thrown:

29 Oct 15:05:13 - [red] Uncaught Exception:
29 Oct 15:05:13 - Error: SOI not found
    at constructor.parse (/Users/nol/code/node-red/node-red-nodes/utility/annotate-image/node_modules/jpeg-js/lib/decoder.js:628:15)
    at Object.decode (/Users/nol/code/node-red/node-red-nodes/utility/annotate-image/node_modules/jpeg-js/lib/decoder.js:1096:11)
    at Readable.data.on (/Users/nol/code/node-red/node-red-nodes/utility/annotate-image/node_modules/pureimage/src/pureimage.js:108:41)
    at Readable.emit (events.js:198:13)
    at endReadableNT (_stream_readable.js:1145:12)
    at process._tickCallback (internal/process/next_tick.js:63:19)

Having stepped through the code, I can see that when JPEG.decode throws the error there was nothing there to catch it.

This fix adds a try/catch around the call to decode and ensures the enclosing promise is properly rejected with the error.

On the question of tests, from a clean checkout of the master branch, I have one test failing that is unrelated to the change I've made.

  ● drawing gradients › is making a radial gradient

    expect(received).toBe(expected) // Object.is equality

    Expected value to be:
      16711935
    Received:
      8388863

I've never heard of JIMP. Could you put in a link explaining what it is?

keys "t" and "g" for levitating up and down. I hope my code is not too sloppy. You may pass it if you find it valuable.

Looks great. thanks!

I think a different merge fixed these issues.

thanks!

thank you

thanks!

context.lineTo() does not appear to work with rgba properly - the lines are always drawn with 100% opacity (aside from anti-aliasing). Also, the lines are a bit off on the corners - the top corner is expected, but the left, right and bottom corners should look like the expected output image (drawn using Canvas in Safari).

Expected Behaviour

https://codepen.io/anon/pen/xWbBrL

1. Lines drawn should be at 50% opacity (0.5 alpha)
2. Corners should be correct

Actual Behaviour

https://gist.github.com/rage8885/7ed14eb38c20f6e1678713296d745d3c

1. Lines drawn are always at 100% opacity
2. Corners are not drawn correctly

Hi:

I have a little express server where I create some chart.js charts using node-canvas implementation of the canvas API. The thing is, Cairo is a real pain and has a long-standing bug where custom fonts just break in Windows Azure machines... which is what I use.

I tried to switch to this library but with little success. ChartJs contructor takes the following parameters:

constructor(
        context: string | CanvasRenderingContext2D | HTMLCanvasElement | ArrayLike<CanvasRenderingContext2D | HTMLCanvasElement>,
        options: Chart.ChartConfiguration
    );

My try was to just pass the context that I can create via:

var img1 = PImage.make(100,50);
var ctx = img1.getContext('2d');
...
new ChartJS(ctx, options)

but this didn't work since this particular context does not implement CanvasRenderingContext2D.canvas property which is required for chartjs.

What I had done with node-canvas is this:

  const canvas1 = createCanvas(1000, 1000);
    const ctx = canvas1.getContext('2d');
...
 new ChartJS(ctx, options)

It works, since that library actually exposes a CanvasRenderingContext2D.canvas (here) class that implements HTMLCanvasElement methods.

Is there a way to work this out? Maybe it's as easy as just providing a HTMLCanvasElement implementation with already existing methods, and I wouldn't mind patching it myself if this library is kind of compatible already.

Thanks in advance😊😊

https://github.com/joshmarinacci/node-pureimage/blob/4860360ade650e5d6319b3da85061af916a39e09/src/text.js#L100 Seems like after the refactor, this line was left behind.

I just nuked the reference to caching, since it clearly doesn't work anyway.

I just fixed this. Could you test the latest version: 0.2.5

Expected Behaviour

1. ctx.fillStyle = '#999'; // should be a grey color

Actual Behaviour

1. ctx.fillStyle = '#999'; // is actually blue-ish

Steps To Reproduce

1. See example snippet, or set ctx.fillStyle to any 3-digit hex value

Any Relevant Code Snippets

#!/usr/bin/env node
'use strict';

const PImage = require('pureimage');
const fs = require('fs');

const canvas = PImage.make(50,50);
const ctx = canvas.getContext('2d');

ctx.fillStyle = '#999';
// ctx.fillStyle = '#999999';
ctx.fillRect(0,0,50,50);

PImage.encodePNGToStream(
    ctx.bitmap,
    fs.createWriteStream('./example.png')
).then(() => console.log('xdg-open ./example.png'));

Platform

OS: Linux Fedora 32 Node Version: v12 NPM Version: N/A PureImage Version: 0.2.4

Any Additional Info

Already fixed it. Wasn't sure if you want a PR for it or if you want to implement the fix yourself. Let me know. Side note, would you want all the defined CSS colors to be in named_colors? I can add them and I have an interest in them being included.

https://github.com/adedomin/node-pureimage/commit/699cf606f6ba002413fedd3446682358ae319de0#

Is it expected behavior that text rendering is not super sharp? I've tried creating an image in multiple sizes, with multiple font sizes, and with multiple .ttf files from Google Fonts, and the text always appears to be pixelated.

Here is my code:

    var fnt = PImage.registerFont('RammettoOne-Regular.ttf', 'RammettoOne');
    fnt.load(function () {
        var img = PImage.make(1500, 1500);
        var ctx = img.getContext('2d');
        ctx.fillStyle = 'rgba(0,0,255, 1.0)';
        ctx.fillRect(0, 0, 1000, 1000);
        ctx.fillStyle = '#ffffff';
        ctx.font = "50pt 'RammettoOne'";
        ctx.fillText("My Trunkshow", 50, 200);

        PImage.encodePNGToStream(img, fs.createWriteStream('out.png')).then(() => {
            response.sendFile('out.png', { root: __dirname });
        }).catch((e) => {
            response.send('Error');
        });
    });

Can I look at straightening the tests out? I've already started to put something together locally - but (with your approval) I'll continue and start putting a branch (and ultimately) a PR together? :)

post to threejs reddit, voxeldev reddit, threejs#voxels slack, and twitter.

I haven't yet, but I was just laid off so I should have more time in the coming weeks. I'll add it to my list.

Nice work

add a discussions topic on these issues and link the form to it.

We need to have another meeting on how to deploy the plugins.

An extra React re-render on load and random events firing that nobody was subscribing to.

WIP because I still want to clean things up a bit and it's too stupid to merge this without testing carefully every flow.

Goals of this refactoring:

• Prevent sign-in control flow from constantly jumping back and forth between 2-3 big god files, which makes it impossible to follow (ui-root.js, hub.js, and to a lesser extent scene-entry-manager.js.)
• Eliminate the unnecessary use of React state and props as an temporary message bus between parts of the sign-in flow.
• Incidentally fix ~most~ some of the random sign-in bugs by removing all the parts of the process where the bugs were (i.e. corrupting said state and props.)

Note that I intend to completely rework the pinning stuff in a future PR, so this is a relatively temporary state for the pin/unpin code to be in.

This was a pretty heavy dependency (a few dozen minified kilobytes) so it's unreasonable to take it and then barely use any of its features.

(It was actually even bigger than it looked, because it also secretly depended on Webpack polyfilling the Node.js url standard library module.)

next step is to figure out the deployment process. @robertlong please link the relevant issue.

using everything discussed in last week's meeting. Create Figma doc.

thank you!

Adds all named CSS Colors Change lookups to NAMED_COLORS to use Object#hasOwnProperty instead of in operator.

<!-- What types of changes does your code introduce? Put an x in all the boxes that apply -->

• [ ] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist

<!-- Go over all the following points, and put an x in all the boxes that apply. If you're unsure about any of these, don't hesitate to ask. We're here to help! -->

• [x] My code follows the code style of this project.
• [ ] My change requires a change to the documentation.
• [ ] I have updated the documentation accordingly.
• [ ] I have added tests to cover my changes.
• [ ] All new and existing tests passed.

Description

<!-- Describe your changes here as well and any potential areas of interest you may wish to draw attention to -->

It's helpful to be able to use named colors as I had to change all my palettes from named ones to hex due the lacking defintions. The in operator can return true for inherited properties from Object. With the change, lookups to styles named 'constructor' and others, will now fail.

<!-- PR Template copied(and modified) from: https://github.com/h5bp/html5-boilerplate/blob/master/.github/PULL_REQUEST_TEMPLATE.md -->

Types of changes

<!-- What types of changes does your code introduce? Put an x in all the boxes that apply -->

• [ ] Bug fix (non-breaking change which fixes an issue)
• [ ] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist

<!-- Go over all the following points, and put an x in all the boxes that apply. If you're unsure about any of these, don't hesitate to ask. We're here to help! -->

• [x] My code follows the code style of this project.
• [ ] My change requires a change to the documentation.
• [ ] I have updated the documentation accordingly.
• [ ] I have added tests to cover my changes.
• [ ] All new and existing tests passed.

Description

<!-- Describe your changes here as well and any potential areas of interest you may wish to draw attention to -->

Minor stylistic change that I forgot to make before #108.

<!-- PR Template copied(and modified) from: https://github.com/h5bp/html5-boilerplate/blob/master/.github/PULL_REQUEST_TEMPLATE.md -->

Bumps elliptic from 6.5.2 to 6.5.3. <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/indutny/elliptic/commit/8647803dc3d90506aa03021737f7b061ba959ae1"><code>8647803</code></a> 6.5.3</li> <li><a href="https://github.com/indutny/elliptic/commit/856fe4d99fe7b6200556e6400b3bf585b1721bec"><code>856fe4d</code></a> signature: prevent malleability and overflows</li> <li>See full diff in <a href="https://github.com/indutny/elliptic/compare/v6.5.2...v6.5.3">compare view</a></li> </ul> </details> <br />

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

<details> <summary>Dependabot commands and options</summary> <br />

You can trigger Dependabot actions by commenting on this PR:

• @dependabot rebase will rebase this PR
• @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
• @dependabot merge will merge this PR after your CI passes on it
• @dependabot squash and merge will squash and merge this PR after your CI passes on it
• @dependabot cancel merge will cancel a previously requested merge and block automerging
• @dependabot reopen will reopen this PR if it is closed
• @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
• @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
• @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
• @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
• @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
• @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

</details>

merged.

Types of changes

<!-- What types of changes does your code introduce? Put an x in all the boxes that apply -->

• [x] Bug fix (non-breaking change which fixes an issue)
• [x] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist

<!-- Go over all the following points, and put an x in all the boxes that apply. If you're unsure about any of these, don't hesitate to ask. We're here to help! -->

• [x] My code follows the code style of this project.
• [ ] My change requires a change to the documentation.
• [ ] I have updated the documentation accordingly.
• [ ] I have added tests to cover my changes.
• [ ] All new and existing tests passed.

Description

<!-- Describe your changes here as well and any potential areas of interest you may wish to draw attention to -->

This PR adds support for colors formatted as #rgb, #rgba, and #rrggbbaa. https://www.w3.org/TR/css-color-4/#hex-notation

<!-- PR Template copied(and modified) from: https://github.com/h5bp/html5-boilerplate/blob/master/.github/PULL_REQUEST_TEMPLATE.md -->

I would love a PR. Thanks!

How will this mode be triggered?

Why do you think the cloudflare worker fixes the issue? Does Youtube recognize it's a CDN and serve up the video differently?

This would be a good thing to implement as an extension.

really it's 'invite', not 'share'. Move it to either the hamburger menu or part of the top toolbar. Rename it to 'invite'.

Combine the hamburger menu, hud, share menu, object menu, and person menu into a top of the screen toolbar. Move favorites and help buttons into the hamburger menu

consider doing this as an experimental prefs

exciting!

Bumps lodash from 4.17.15 to 4.17.19. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/lodash/lodash/releases">lodash's releases</a>.</em></p> <blockquote> <h2>4.17.16</h2> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/lodash/lodash/commit/d7fbc52ee0466a6d248f047b5d5c3e6d1e099056"><code>d7fbc52</code></a> Bump to v4.17.19</li> <li><a href="https://github.com/lodash/lodash/commit/2e1c0f22f425e9c013815b2cd7c2ebd51f49a8d6"><code>2e1c0f2</code></a> Add npm-package</li> <li><a href="https://github.com/lodash/lodash/commit/1b6c282299f4e0271f932b466c67f0f822aa308e"><code>1b6c282</code></a> Bump to v4.17.18</li> <li><a href="https://github.com/lodash/lodash/commit/a370ac81408de2da77a82b3c4b61a01a3b9c2fac"><code>a370ac8</code></a> Bump to v4.17.17</li> <li><a href="https://github.com/lodash/lodash/commit/1144918f3578a84fcc4986da9b806e63a6175cbb"><code>1144918</code></a> Rebuild lodash and docs</li> <li><a href="https://github.com/lodash/lodash/commit/3a3b0fd339c2109563f7e8167dc95265ed82ef3e"><code>3a3b0fd</code></a> Bump to v4.17.16</li> <li><a href="https://github.com/lodash/lodash/commit/c84fe82760fb2d3e03a63379b297a1cc1a2fce12"><code>c84fe82</code></a> fix(zipObjectDeep): prototype pollution (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4759">#4759</a>)</li> <li><a href="https://github.com/lodash/lodash/commit/e7b28ea6cb17b4ca021e7c9d66218c8c89782f32"><code>e7b28ea</code></a> Sanitize sourceURL so it cannot affect evaled code (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4518">#4518</a>)</li> <li><a href="https://github.com/lodash/lodash/commit/0cec225778d4ac26c2bac95031ecc92a94f08bbb"><code>0cec225</code></a> Fix lodash.isEqual for circular references (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4320">#4320</a>) (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4515">#4515</a>)</li> <li><a href="https://github.com/lodash/lodash/commit/94c3a8133cb4fcdb50db72b4fd14dd884b195cd5"><code>94c3a81</code></a> Document matches* shorthands for over* methods (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4510">#4510</a>) (<a href="https://github-redirect.dependabot.com/lodash/lodash/issues/4514">#4514</a>)</li> <li>Additional commits viewable in <a href="https://github.com/lodash/lodash/compare/4.17.15...4.17.19">compare view</a></li> </ul> </details> <details> <summary>Maintainer changes</summary> <p>This version was pushed to npm by <a href="https://www.npmjs.com/~mathias">mathias</a>, a new releaser for lodash since your current version.</p> </details> <br />

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

<details> <summary>Dependabot commands and options</summary> <br />

You can trigger Dependabot actions by commenting on this PR:

• @dependabot rebase will rebase this PR
• @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
• @dependabot merge will merge this PR after your CI passes on it
• @dependabot squash and merge will squash and merge this PR after your CI passes on it
• @dependabot cancel merge will cancel a previously requested merge and block automerging
• @dependabot reopen will reopen this PR if it is closed
• @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
• @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
• @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
• @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
• @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
• @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
• @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

</details>

it looks like all of this was done.

Hi all,

A while back I was looking for a canvas/drawing library that doesn't depend on any native code and that could run in both node & browser (webworker). I came across this project but noticed that was severely lacking in (advanced) drawing functionality. Quite normal given the absolutely monumental task of implementing such a thing.

Anyway, in the meantime I discovered Skia (which is actually the library used by browsers to implement their canvas operations), and ported it to wasm. Including a basic set of working bindings.

Purely as a suggestion, perhaps it would be interesting to implement the canvas operations of this project using the skia wasm port as it would most likely yield far better performance, as well as having near all drawing operations already available to you, while still being 100% js compatible/no native code.

we will never delegate to skia or another native drawing api.

fixed. thanks for catching that.

The version of jpeg-js referenced in this package is subject to a moderate level security vulnerability (https://nvd.nist.gov/vuln/detail/CVE-2020-8175).

The package should be updated to require version 0.4.0 of jpeg-js or higher.

I found this because of a Dependabot warning in github for a project I maintain that uses pureimage.

Expected Behaviour

1. fillStyle = 'transparent' will set it to 0 and not throw

Actual Behaviour

1. transparent style throws "unknown style format: transparent"

Steps To Reproduce

1. ctx.fillStyle = 'transparent';

Any Relevant Code Snippets

N/A, see Additional Info

Platform

OS: Linux (Fedora 32) Node Version: v12.16.3 PureImage Version: 0.2.1

Any Additional Info

https://github.com/joshmarinacci/node-pureimage/blob/e67821f94422497dfca049dcee2a8aac8e820164/src/context.js#L1155

https://github.com/joshmarinacci/node-pureimage/blob/e67821f94422497dfca049dcee2a8aac8e820164/src/named_colors.js#L11

I believe the problem is "transparent" maps to 0 which is why the branch in context is always false for a set property of transparent.

fixed now.

arg. You're right. I'll add a test and fix it.