snap-and-clarifai

1. When watching video or YouTube, tab the app and it will take video snapshot from the video frame .
2. hit "Predict" and the image will parse to the Claifai API. And return celebrity names.
3. Backend javascript do the part of snapshot, where popup.js do the image parsing, analysis and return result.
4. (fixed) I am still working on the 'onclick' event in popup.js 100:103, the links wont render accordingly. For now the remedy is catDiv.innerHTML from popup.js 86 where I insert a tag 'target = blank' to the src.
5. (fixed) Working on chrome:// address error, background error when open tab in chrome://url
6. (done) Add drawbox function and some css improvement, working on mouse hover/enter event (to draw specific individual box).
7. Trying to add a (YouTube) button to invoke the popup page.(open the extension(screenshot) through the button. ) This one was a little tricky since Google is not allow open extension through content script.
8. The UI has changed a bit... after clicking the result from popup, the playing video will be minimized and (Youtube) search result will be shown on the same tab. So user can searching and watching at the same time. \

Reference:
Clarifai cloud engine
clarifai-javascript-starter
Yulon
The loading css
The button css

p.s: I should clari'fai' I hava not tested on any chrome/mac/linux os yet. my enviroment is windows 10, and I am using jquery 3.3.1.

How to use

1. Git clone or fork the project.
2. Unzip the folder.
3. Please visit Clarifai to register and apply for a API key.
4. Open the unzipped download folder, went to popup.js 8:9 and replace it with your own key.
5. Download Chrome Browser
6. Type 'chrome://extensions/' in the new chrome browser.
7. Enable Developer Mode (in the upper right).
8. Load unpacked --> then open the git project folder.