Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix generateOutput called multiple times #1564

Draft
wants to merge 25 commits into
base: main
Choose a base branch
from

Conversation

rishabhshuklax
Copy link
Member

@rishabhshuklax rishabhshuklax commented Jan 22, 2020

Concerns this
Fixes #1575 Fixes #1515 Fixes #1457 Fixes #1532 (this)

Note: This PR is a work-in-progress

This PR fixes generateOutput called multiple times when extramanipulation is used.

Make sure these boxes are checked before your pull request (PR) is ready to be reviewed and merged. Thanks!

  • tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR -- or run tests locally with npm run test-all
  • code is in uniquely-named feature branch and has no merge conflicts
  • PR is descriptively titled
  • ask @publiclab/is-reviewers for help, in a comment below
  • Insert-step functionality is working correct as expected.

We're happy to help you get this ready -- don't be afraid to ask for help, and don't be discouraged if your tests fail at first!

If tests do fail, click on the red X to learn why by reading the logs.

Please be sure you've reviewed our contribution guidelines at https://publiclab.org/contributing-to-public-lab-software
Please make sure to get at least two reviews before asking for merging the PR as that would make the PR more reliable on our part
Thanks!

@rishabhshuklax
Copy link
Member Author

This PR is work in progress, At the moment Resize, Crop & Constrained Crop module doesn't work correctly unless used with a setTimeout to generateOutput, This PR solves problem of QR not generating after merging #1532 and allows text-overlay module to work correctly in Node #1518 (finally!!!!)

I appreciate all the help I can get because I am stuck now :(

@jywarren @harshkhandeparkar @publiclab/is-reviewers

@rishabhshuklax
Copy link
Member Author

I removed all the instances of setTimeout and added changePixel method to the modules, this makes them work without a problem, but I don't know why this is happening, for some reason code is async and when changePixel is added it runs after extramanipulation(which it shouldn't) and generates output, so if generate output is even removed from extramanipulation it would work fine, This type of behaviour shouldn't be in our code, this should work fine even when changePixel is not added!! And why is extraManipulation even called before changePixel?

fetch('../../../dist/manipulation.wasm').then(response =>
response.arrayBuffer()
).then(bytes =>
WebAssembly.instantiate(bytes, imports)
).then(results => {
results.instance.exports.manipulatePixel(framePix.shape[0], framePix.shape[1], inBrowser, test);
wasmSuccess = true;
resolvedFrames++;
generateOutput();
}).catch(err => {

This piece of code seems to be the most likely culprit, so i set useWasm option on histogram to false and this was the output

Screenshot from 2020-01-23 17-36-11

😕
The reason to this seems to be this:

perPixelManipulation();
wasmSuccess = false;
resolvedFrames++;
generateOutput();

I think we should add a more if block here like this:

if(!options.extraManipulation)
            generateOutput();

This works fine!!

Screenshot from 2020-01-23 17-48-26

@harshkhandeparkar you were working on #1515? have you found the solution to this??
We need to take care of that async code to fix this problem!

@rishabhshuklax
Copy link
Member Author

rishabhshuklax commented Jan 23, 2020

Ok, so i changed pixelManipulation such that generateOutput will be called only once and extraManipulation will be called only after changePixel.
But, as of now resize and crop modules are not working expectedly, I'm trying to figure out why.

@rishabhshuklax
Copy link
Member Author

rishabhshuklax commented Jan 23, 2020

At the moment these modules are not working

  • canvas-resize (this is also not working on beta site)
  • colorbar(will be fixed when crop module is fixed)
  • constrained-crop(will be fixed when crop module is fixed)
  • crop
  • resize
  • rotate

@rishabhshuklax
Copy link
Member Author

Canvas Resize is now fixed 🎉 and I've also added an option to change the background color of the new canvas 😄

Screenshot from 2020-01-24 03-06-02

@rishabhshuklax
Copy link
Member Author

Crop Module is also fixed 🎉

Screenshot from 2020-01-24 06-34-10

So, since crop is fixed hence colorbar is also fixed there is minor change to be made in constrained crop and it will be fixed too 😄

@rishabhshuklax
Copy link
Member Author

AddQr test was failing because it's benchmark was wrong, probably changed in #1550, I've updated it, It should pass now!

@rishabhshuklax
Copy link
Member Author

All modules are working fine now 🎉

@codecov
Copy link

codecov bot commented Jan 26, 2020

Codecov Report

Merging #1564 (10322c3) into main (853e719) will decrease coverage by 0.21%.
The diff coverage is 62.84%.

Impacted file tree graph

@@            Coverage Diff             @@
##             main    #1564      +/-   ##
==========================================
- Coverage   66.67%   66.46%   -0.22%     
==========================================
  Files         130      132       +2     
  Lines        2686     2821     +135     
  Branches      433      440       +7     
==========================================
+ Hits         1791     1875      +84     
- Misses        895      946      +51     
Impacted Files Coverage Δ
src/Modules.js 100.00% <ø> (ø)
src/modules/Crop/Crop.js 100.00% <ø> (ø)
src/modules/WebglDistort/Module.js 2.29% <0.00%> (ø)
src/modules/ColorHalftone/Module.js 3.63% <3.63%> (ø)
src/modules/BlobAnalysis/Module.js 25.00% <25.00%> (-5.77%) ⬇️
src/modules/_nomodule/PixelManipulation.js 42.74% <53.84%> (+2.06%) ⬆️
src/modules/Average/Module.js 100.00% <100.00%> (ø)
src/modules/Blur/Module.js 100.00% <100.00%> (ø)
src/modules/CanvasResize/Module.js 100.00% <100.00%> (+12.50%) ⬆️
src/modules/ColorHalftone/index.js 100.00% <100.00%> (ø)
... and 25 more

@rishabhshuklax
Copy link
Member Author

@publiclab/is-reviewers @jywarren @harshkhandeparkar please review this!!

@rishabhshuklax
Copy link
Member Author

@jywarren could you please take a look at this!

@jywarren
Copy link
Member

jywarren commented Nov 3, 2020

Gosh @blurry-x-face a ton of your PRs are finally getting merged! Your work is dominating the upcoming release: https://github.com/publiclab/image-sequencer/projects/4

Copy link
Member

@harshkhandeparkar harshkhandeparkar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A few questions :)

@@ -1,6 +1,8 @@
const ndarray = require('ndarray');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ndarray is imported here

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are you saying it shouldn't be necessary? Just checking, let's make a code suggestion perhaps?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah i see it's required again below. I'll remove that one.

function extraManipulation(pixels) {

function extraManipulation(pixels, setRenderState, generateOutput, frames, f) {
setRenderState(false);
let newPixels = require('ndarray')(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Imported twice

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
let newPixels = require('ndarray')(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);
let newPixels = ndarray(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);

/*
* Changes the Canvas Size
*/
const getPixels = require('get-pixels');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This new import is added but doesnt look like it is used anywhere.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const getPixels = require('get-pixels');

@@ -15,7 +15,12 @@ module.exports = function ConstrainedCrop(options, UI) {
widthRatio = Number(aspectRatio[0]),
heightRatio = Number(aspectRatio[1]);

function extraManipulation(pixels) {
function changePixel(r, g, b, a) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this necessary? Wouldn't it add a redundant step?

if (!(renderableFrames < numFrames) && !(resolvedFrames < numFrames)) {

// if(rend){
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is this comment for?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// if(rend){

Copy link
Member

@jywarren jywarren left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just the one clarification question for @blurry-x-face from @harshkhandeparkar -- and the other suggestions we should be able to accept and merge!

@@ -1,6 +1,8 @@
const ndarray = require('ndarray');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are you saying it shouldn't be necessary? Just checking, let's make a code suggestion perhaps?

/*
* Changes the Canvas Size
*/
const getPixels = require('get-pixels');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const getPixels = require('get-pixels');

@@ -1,6 +1,8 @@
const ndarray = require('ndarray');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah i see it's required again below. I'll remove that one.

function extraManipulation(pixels) {

function extraManipulation(pixels, setRenderState, generateOutput, frames, f) {
setRenderState(false);
let newPixels = require('ndarray')(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
let newPixels = require('ndarray')(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);
let newPixels = ndarray(new Uint8Array(4 * options.width * options.height).fill(0), [options.width, options.height, 4]);

if (!(renderableFrames < numFrames) && !(resolvedFrames < numFrames)) {

// if(rend){
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// if(rend){

@jywarren
Copy link
Member

Hi @harshkhandeparkar hope you're well, did you have a chance to look at my suggestions? If you agree we could go ahead and accept them...

@harshkhandeparkar
Copy link
Member

I am fine, ty! How are you?

I did go through the suggestions but I was waiting for Rishabh. Do you think we should just commit those and merge or wait for him?

@rishabhshuklax
Copy link
Member Author

Hi @jywarren @harshkhandeparkar I was a bit busy with university, I'll fix the PR ASAP, ty :)

@rishabhshuklax rishabhshuklax requested review from a team as code owners November 18, 2020 05:36
@rishabhshuklax
Copy link
Member Author

@harshkhandeparkar tests for edge detect are failing for some reason do you have any idea?

@harshkhandeparkar
Copy link
Member

Can you upload the expected and generated outputs?

@rishabhshuklax
Copy link
Member Author

@harshkhandeparkar

What I am getting:
1
What is expected:
2

Should I just update the benchmark?

@harshkhandeparkar
Copy link
Member

New output has slightly thicker edges at some places. Maybe some defaults changed or some options are wrong?

@rishabhshuklax
Copy link
Member Author

rishabhshuklax commented Nov 18, 2020

edge-detect

Blur option was wrong, updated output, still this is different from expected output

@harshkhandeparkar
Copy link
Member

It is still not the same as before. But it doesn't really matter. Should we change the benchmark image?

@rishabhshuklax
Copy link
Member Author

Yea I think we should, except edge detect all other benchmarks seems to paas, what do you think @jywarren ?

@jywarren
Copy link
Member

jywarren commented Nov 18, 2020 via email

@harshkhandeparkar harshkhandeparkar marked this pull request as draft July 27, 2021 21:34
@jywarren
Copy link
Member

If we update the edge detection expected output, we should be good here!

@jywarren jywarren added the almost-complete PRs that are almost done but little more work. label Jan 25, 2022
@jywarren jywarren removed this from In Progress in v3.7.0 Jan 25, 2022
@jywarren jywarren added this to In progress in v3.7.x via automation Jan 25, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
almost-complete PRs that are almost done but little more work. high-priority needs-rebase
Projects
v3.7.x
In progress
4 participants