Opencv.js via npm for blob-detection

[aashna27]

Fixes #172

This pr is a continuation pr of #1120, please refer there for all the major discussions on how the work evolved and the other module related information.

This pr adds opencv.js to Image sequencer via NPM and currently uses it for a new blob detection module. Opencv.js addition would enable the use of power image processing within IS. The npm adds opencv.js version 3.3

• tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR -- or run tests locally with npm test
• 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

[codecov]

Codecov Report

Merging #1185 into main will decrease coverage by 0.13%.
The diff coverage is 33.33%.

@@            Coverage Diff             @@
##             main    #1185      +/-   ##
==========================================
- Coverage   55.45%   55.31%   -0.14%     
==========================================
  Files         114      116       +2     
  Lines        2366     2381      +15     
  Branches      364      364              
==========================================
+ Hits         1312     1317       +5     
- Misses       1054     1064      +10

Impacted Files	Coverage Δ
src/Modules.js	100% <ø> (ø)	⬆️
src/modules/BlobAnalysis/index.js	100% <100%> (ø)
src/modules/BlobAnalysis/Module.js	28.57% <28.57%> (ø)

[jywarren]

Ok! Does this include all the work from the previous PR? Thanks a lot!!!

…

On Fri, Jul 26, 2019, 4:01 PM codecov[bot] ***@***.***> wrote: Codecov <https://codecov.io/gh/publiclab/image-sequencer/pull/1185?src=pr&el=h1> Report Merging #1185 <https://codecov.io/gh/publiclab/image-sequencer/pull/1185?src=pr&el=desc> into main <https://codecov.io/gh/publiclab/image-sequencer/commit/4dfdccada969477bb41e34731a57ba175595d753?src=pr&el=desc> will *decrease* coverage by 0.13%. The diff coverage is 33.33%. [image: Impacted file tree graph] <https://codecov.io/gh/publiclab/image-sequencer/pull/1185?src=pr&el=tree> @@ Coverage Diff @@ ## main #1185 +/- ## ========================================== - Coverage 55.45% 55.31% -0.14% ========================================== Files 114 116 +2 Lines 2366 2381 +15 Branches 364 364 ========================================== + Hits 1312 1317 +5 - Misses 1054 1064 +10 Impacted Files <https://codecov.io/gh/publiclab/image-sequencer/pull/1185?src=pr&el=tree> Coverage Δ src/Modules.js <https://codecov.io/gh/publiclab/image-sequencer/pull/1185/diff?src=pr&el=tree#diff-c3JjL01vZHVsZXMuanM=> 100% <ø> (ø) ⬆️ src/modules/BlobAnalysis/index.js <https://codecov.io/gh/publiclab/image-sequencer/pull/1185/diff?src=pr&el=tree#diff-c3JjL21vZHVsZXMvQmxvYkFuYWx5c2lzL2luZGV4Lmpz> 100% <100%> (ø) src/modules/BlobAnalysis/Module.js <https://codecov.io/gh/publiclab/image-sequencer/pull/1185/diff?src=pr&el=tree#diff-c3JjL21vZHVsZXMvQmxvYkFuYWx5c2lzL01vZHVsZS5qcw==> 28.57% <28.57%> (ø) — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#1185?email_source=notifications&email_token=AAAF6J7P6YUKAQF7FRYMERDQBNJWPA5CNFSM4IHGYDM2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD25SI7Q#issuecomment-515581054>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J2OFK7GG4SXHN2QO4TQBNJWPANCNFSM4IHGYDMQ> .

[aashna27]

Yes i have checked and the blob analysis folder is simply copied, so all the work including documentation does exist here.

[jywarren]

Awesome. Have you been able to set this up in your own gh-pages branch to offer a demo? @harshkhandeparkar has done this and perhaps could help?

…

On Fri, Jul 26, 2019, 4:03 PM aashna27 ***@***.***> wrote: Yes i have checked and the blob analysis folder is simply copied so all the work including documentation does exist here. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#1185?email_source=notifications&email_token=AAAF6J43JGTJP2RTGN4GAD3QBNKAPA5CNFSM4IHGYDM2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD25SO6I#issuecomment-515581817>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J4IQ3JHPYH2EKWYC6TQBNKAPANCNFSM4IHGYDMQ> .

[aashna27]

Thanks to @harshkhandeparkar I have setup the gh-pages and you can see the blob-analysis working there
https://aashna27.github.io/image-sequencer/examples/
Note: use google chrome

[jywarren]

I'm seeing some assorted bugs, that may or may not be related to your code:

• moving the Contrast slider doesn't enable the "Apply" button, so I can't modify that
• the slider for Brightness only showed up the second time I loaded the page; when I initially added it it was just a text input
• the Contrast pane did not show a "spinning" image while recalculating (after I dropped in a new image to the sequencer); it just showed the previous image until complete, then everything returned to normal (it showed the new image after completion)

Finally, I put this image in, and added more brightness and contrast (final sequence https://aashna27.github.io/image-sequencer/examples/#steps=brightness{},brightness{},contrast{contrast:20},blob-analysis{} due to issues with the brightness module)

Starting image:

Got this out:

So, i think it works! If you can try to confirm if these bugs are independent (like, do they happen in the main branch) then we can just merge this and open a new issue with these (if you wouldn't mind opening that too, that'd be helpful!)

Thanks, @aashna27 for getting this set up. This is looking great.

[jywarren]

And, in follow-up, are there ways to adjust the blob detection sensitivity? Is it based on color, size, are there other parameters we could add? This would also be a really great follow-up issue.

🎉 Very exciting!

[aashna27]

I'm seeing some assorted bugs, that may or may not be related to your code:

* [ ]  moving the Contrast slider doesn't enable the "Apply" button, so I can't modify that

* [ ]  the slider for Brightness only showed up the second time I loaded the page; when I initially added it it was just a text input

* [ ]  the Contrast pane did not show a "spinning" image while recalculating (after I dropped in a new image to the sequencer); it just showed the previous image until complete, then everything returned to normal (it showed the new image after completion)

Finally, I put this image in, and added more brightness and contrast (final sequence https://aashna27.github.io/image-sequencer/examples/#steps=brightness{},brightness{},contrast{contrast:20},blob-analysis{} due to issues with the brightness module)

Starting image:

Got this out:

So, i think it works! If you can try to confirm if these bugs are independent (like, do they happen in the main branch) then we can just merge this and open a new issue with these (if you wouldn't mind opening that too, that'd be helpful!)

Thanks, @aashna27 for getting this set up. This is looking great.

Sorry but I could not reproduce those bugs, and I just added the blob analysis so they are not related to the pr.

[aashna27]

And, in follow-up, are there ways to adjust the blob detection sensitivity? Is it based on color, size, are there other parameters we could add? This would also be a really great follow-up issue.

tada Very exciting!

Yeah it can be done in the way that right now it is doing everything itself but we can take inputs from the user for the different functions that are being used but we can let them provide inputs for all the functions as it would only need to confusion so the task would be to figure out what functions to ask arguements for.

[jywarren]

Awesome. This is great! Can you please open the follow-up PRs for the unrelated bugs and the parameters discussion? @MargaretAN9 may have input on what parameters to expose for tuning the blob detection!

[harshkhandeparkar]

@jywarren I have to push this to beta. Were any new frontend/backend libraries(which are included in the html) added?

…

On Fri, 2 Aug, 2019, 7:26 PM Jeffrey Warren, ***@***.***> wrote: Merged #1185 <#1185> into main. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#1185?email_source=notifications&email_token=AIJI5HZF7WDKPGOAUE7PRBDQCQ4HNA5CNFSM4IHGYDM2YY3PNVWWK3TUL52HS4DFWZEXG43VMVCXMZLOORHG65DJMZUWGYLUNFXW5KTDN5WW2ZLOORPWSZGOS3EODFI#event-2529747349>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AIJI5HYSCP4CVFN54GRK65TQCQ4HNANCNFSM4IHGYDMQ> .

[aashna27]

Awesome. This is great! Can you please open the follow-up PRs for the unrelated bugs and the parameters discussion? @MargaretAN9 may have input on what parameters to expose for tuning the blob detection!

Yeah i ll see wasn't able to reproduce this problem.

[jywarren]

Thanks! If you can just copy in the text from my checklist for now I'll follow-up with a gif!

…

On Fri, Aug 2, 2019, 5:38 PM aashna27 ***@***.***> wrote: Awesome. This is great! Can you please open the follow-up PRs for the unrelated bugs and the parameters discussion? @MargaretAN9 <https://github.com/MargaretAN9> may have input on what parameters to expose for tuning the blob detection! Yeah i ll see wasn't able to reproduce this problem. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#1185?email_source=notifications&email_token=AAAF6J7XMF563W6ZWSI2MTDQCRBE7A5CNFSM4IHGYDM2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3N5XPA#issuecomment-517725116>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAF6J33E2PSUEW3D5YWRODQCRBE7ANCNFSM4IHGYDMQ> .

[jywarren]

@harshkhandeparkar maybe that's a question for @aashna27 ?