diff --git a/.gitignore b/.gitignore index 31926f4..05d7926 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,11 @@ +.idea + *.css # See https://help.github.com/ignore-files/ for more about ignoring files. +keys.js +.idea + # dependencies /node_modules @@ -20,3 +25,7 @@ npm-debug.log* yarn-debug.log* yarn-error.log* +.idea/workspace.xml +.idea/misc.xml +.idea/workspace.xml +.idea/youtube-react.iml diff --git a/README.md b/README.md index 3e769a9..dae94cf 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,63 @@ +# task assignment guide +- pick a task & use ~~strikeout~~ to assign it to yourself +- when complete, document it well! +- (if code) create new branch named after task + - ask someone to code-review + - merge into main branch +- move item from todo to current version + +# todos +- background + - find youtube views distribution or how many vids have 1 million views in total +- frontend + - ~~improve the UI - use template from figma to make it similar~~ + - refactor code to adhere to react best practices + - ~~next/prev occurence, next/prev object keyboard shortcut~~ +- backend + - ~~find out how to use colab as backend / server, and tie GET endpoints to code cell execution~~ + - ~~fix colab inference code~~ + - ~~[use python 3.8](https://stackoverflow.com/questions/60775160/install-python-3-8-kernel-in-google-colaboratory)~~ +- ML + - ~~get range training data: a bunch of youtube videos with chapters and or highlights~~ + - ~~check if uoft labeling suite is avail, and how to use it for polygon labeling~~ + - ~~novel object labeling pipeline~~ +- literature review + - topic modeling (subititles) & visual topic modeling + - ~~pic to caption models~~ + - text summarization + +# versions +## 0.0.1 (current) + +## 0.0.0 +- front: display highlights as colored div using dummy data +- back: download vid, extract frames, save annotation + +# [API interface](https://console.developers.google.com/apis/credentials?pli=1&project=cansumcam) +or [create your own credentials](https://console.developers.google.com/apis/credentials) +![location](./readme/API_interface.png) + +# yarn scripts +- yarn start + - dev server hosting react client @localhost:3000 +- yarn server + - dev server hosting flask server @localhost:5000 + +# REST calls +- localhost:5000 for dev + - prod TBD +- POST a video link to be analyzed + - http://localhost:5000/bookmarks/?videoID=foo + - get back a list of occurrence ranges for all objects +![occurence range for all objects](./readme/all_occurence_ranges.png) + - http://localhost:5000/bookmarks/?videoID=foo&object_name=bar + - specify an object +![occurrence range for named object](./readme/obj_occurence_range.png) + +# videos +App > Watch > WatchContent > VideoInfoBox + + # 1 About This repository is the source code for the epic length [Build Youtube in React](https://productioncoder.com/build-youtube-in-react-part-1/) tutorial series provided by [productioncoder.com](https://productioncoder.com). diff --git a/_config.yml b/_config.yml new file mode 100644 index 0000000..c741881 --- /dev/null +++ b/_config.yml @@ -0,0 +1 @@ +theme: jekyll-theme-slate \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 4b842de..d1ede67 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2550,6 +2550,14 @@ "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.10.1.tgz", "integrity": "sha512-zg7Hz2k5lI8kb7U32998pRRFin7zJlkfezGJjUc2heaD4Pw2wObakCDVzkKztTm/Ln7eiVvYsjqak0Ed4LkMDA==" }, + "axios": { + "version": "0.21.1", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", + "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", + "requires": { + "follow-redirects": "^1.10.0" + } + }, "axobject-query": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", @@ -4500,6 +4508,11 @@ "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz", "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=" }, + "deepmerge": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", + "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==" + }, "default-gateway": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz", @@ -8949,6 +8962,11 @@ "strip-bom": "^2.0.0" } }, + "load-script": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz", + "integrity": "sha1-BJGTngvuVkPuSUp+PaPSuscMbKQ=" + }, "loader-fs-cache": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/loader-fs-cache/-/loader-fs-cache-1.0.3.tgz", @@ -9185,6 +9203,11 @@ "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=" }, + "memoize-one": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.1.1.tgz", + "integrity": "sha512-HKeeBpWvqiVJD57ZUAsJNm71eHTykffzcLZVYWiVfQeI1rJtuEaS7hQiEpWfVVk18donPwJEcFKIkCmPJNOhHA==" + }, "memory-fs": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz", @@ -11966,6 +11989,11 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.7.tgz", "integrity": "sha512-TAv1KJFh3RhqxNvhzxj6LeT5NWklP6rDr2a0jaTfsZ5wSZWHOGeqQyejUp3xxLfPt2UpyJEcVQB/zyPcmonNFA==" }, + "react-fast-compare": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz", + "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" + }, "react-is": { "version": "16.9.0", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.9.0.tgz", @@ -11980,6 +12008,18 @@ "tlds": "^1.199.0" } }, + "react-player": { + "version": "2.7.2", + "resolved": "https://registry.npmjs.org/react-player/-/react-player-2.7.2.tgz", + "integrity": "sha512-4MqikwtVAxjDlgYp5Kgnz6Uptj/VpYE4VKvg2hOXlgz4zxorsxjBUE8Y3GUY6vpolEMPjpYIxSr1CP4TNrD1WA==", + "requires": { + "deepmerge": "^4.0.0", + "load-script": "^1.0.0", + "memoize-one": "^5.1.1", + "prop-types": "^15.7.2", + "react-fast-compare": "^3.0.1" + } + }, "react-popper": { "version": "1.3.7", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.7.tgz", @@ -12138,6 +12178,16 @@ "react-is": "^16.6.3" } }, + "react-youtube": { + "version": "7.13.1", + "resolved": "https://registry.npmjs.org/react-youtube/-/react-youtube-7.13.1.tgz", + "integrity": "sha512-b++TLHmHDpd0ZBS1wcbYabbuchU+W4jtx5A2MUQX0BINNKKsaIQX29sn/aLvZ9v5luwAoceia3VGtyz9blaB9w==", + "requires": { + "fast-deep-equal": "3.1.3", + "prop-types": "15.7.2", + "youtube-player": "5.5.2" + } + }, "read-pkg": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz", @@ -13114,6 +13164,11 @@ } } }, + "sister": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/sister/-/sister-3.0.2.tgz", + "integrity": "sha512-p19rtTs+NksBRKW9qn0UhZ8/TUI9BPw9lmtHny+Y3TinWlOa9jWh9xB0AtPSdmOy49NJJJSSe0Ey4C7h0TrcYA==" + }, "sisteransi": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz", @@ -15677,6 +15732,31 @@ "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==" } } + }, + "youtube-player": { + "version": "5.5.2", + "resolved": "https://registry.npmjs.org/youtube-player/-/youtube-player-5.5.2.tgz", + "integrity": "sha512-ZGtsemSpXnDky2AUYWgxjaopgB+shFHgXVpiJFeNB5nWEugpW1KWYDaHKuLqh2b67r24GtP6HoSW5swvf0fFIQ==", + "requires": { + "debug": "^2.6.6", + "load-script": "^1.0.0", + "sister": "^3.0.0" + }, + "dependencies": { + "debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "requires": { + "ms": "2.0.0" + } + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" + } + } } } } diff --git a/package.json b/package.json index e908ac3..80cee7c 100644 --- a/package.json +++ b/package.json @@ -3,16 +3,19 @@ "version": "0.1.0", "private": true, "dependencies": { + "axios": "^0.21.1", "javascript-time-ago": "^2.0.13", "node-sass": "^4.14.1", "react": "^16.13.1", "react-dom": "^16.13.1", "react-linkify": "^1.0.0-alpha", + "react-player": "^2.7.2", "react-redux": "^7.2.1", "react-router-dom": "^5.2.0", "react-scripts": "3.4.3", "react-test-renderer": "^16.13.1", "react-waypoint": "^9.0.3", + "react-youtube": "^7.13.1", "redux": "^4.0.5", "redux-saga": "^1.1.3", "reselect": "^4.0.0", @@ -20,6 +23,8 @@ "semantic-ui-react": "^1.2.0" }, "scripts": { + "server": "python ./server/app.py", + "server3": "python3 ./server/app.py", "dev": "source .env.local && npm start", "start": "react-scripts start", "build": "react-scripts build", diff --git a/public/favicon.ico b/public/favicon.ico index 0c75155..75765da 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html index 871ab41..b5eab19 100644 --- a/public/index.html +++ b/public/index.html @@ -19,7 +19,7 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - MyTube + CANSUMCAM