diff --git a/modulearn/TODO.md b/modulearn/TODO.md index ed31012..80bad91 100644 --- a/modulearn/TODO.md +++ b/modulearn/TODO.md @@ -1,6 +1,14 @@ -- [ ] fix bug where the "current Module" no longer updates after you've navigated outside the bounds - of the modules' timestamps - - [ ] or (easier) require the modules' timestamps to cover the entirety of the recording +- [x] unmute the player on each module change? +- [ ] bug: when you go backwards on the YouTube timeline, it doesn't update the selected module + (forwards is fine) + - [ ] related bug: when you go 5/30 seconds back to an earlier module, it doesn't switch to highlighting + that module (forwards is fine) +- [ ] ` for pause/unpause +- [ ] `m` for mute/unmute +- [ ] possible to "hide" iframes that have already been loaded and "show" them on selection? + - [ ] if so, can you load all the iframes in the background on first page load? +- [ ] remove unused code now that we're totally modular +- [ ] show the module name in a header - [ ] load data from JSON or an API - [ ] validate the data: overlaps? gaps? - [ ] support segments from multiple videos @@ -14,11 +22,16 @@ - [ ] make it work decently for mobile! - [Plyr.js](https://github.com/sampotts/plyr#api) might help with this - [Svelte Wrapper](https://github.com/benwoodward/svelte-plyr#readme) +- [ ] add a diagonally oriented aqua triangle at the upper right, as the logo +- [ ] support modules from the same UID in a different order + - [x] either don't allow going before the first module, or fix it so that the first module isn't highlighted when watching the pre-module content (first solution is easier) - [x] add "flat" drop shadow to progress bar and modules -- [ ] add a diagonally oriented aqua triangle at the upper right, as the logo -- [ ] bug: when the newly seleted module is from a different YouTube UID, it doesn't autoplay and it - doesn't advance -- [ ] bug: when you go backwards on the YouTube timeline, it doesn't update the selected module - (forwards is fine) -- [ ] show the module name in a header +- [x] fix bug where the "current Module" no longer updates after you've navigated outside the bounds + of the modules' timestamps + - [x] or (easier) require the modules' timestamps to cover the entirety of the recording +- [x] most of these should be fixed by changing it so a new iframe with start/end is rendered on + every module change + - [x] bug: when the newly seleted module is from a different YouTube UID, it doesn't autoplay and it + doesn't advance + diff --git a/modulearn/src/App.svelte b/modulearn/src/App.svelte index f3c2c2d..f5ed915 100644 --- a/modulearn/src/App.svelte +++ b/modulearn/src/App.svelte @@ -5,7 +5,7 @@ import YouTube from './YouTube.svelte' import { position, currentModule, uid } from './stores' import { getModule } from './utils' - import { modules } from './data' + import modules from './data' let video; let interval; let timeout; @@ -14,6 +14,8 @@ const pos = video.position() if (pos == null) return const newModule = getModule(pos, $currentModule) + + if (video.muted()) video.unMute() position.update(() => pos) if ((newModule && !$currentModule) || (newModule && $currentModule && newModule.id !== $currentModule.id)) { @@ -108,8 +110,8 @@
- {#key $uid} - + {#key $currentModule} + {/key} diff --git a/modulearn/src/data.js b/modulearn/src/data.js index 1589244..5f4842a 100644 --- a/modulearn/src/data.js +++ b/modulearn/src/data.js @@ -101,4 +101,4 @@ const airflow_modules = enrichObjects( kedro_modules.length, ) -export const modules = kedro_modules.concat(airflow_modules) +export default kedro_modules.concat(airflow_modules) diff --git a/modulearn/src/stores.js b/modulearn/src/stores.js index 3518e4a..57c58f9 100644 --- a/modulearn/src/stores.js +++ b/modulearn/src/stores.js @@ -1,5 +1,6 @@ import { writable, derived } from 'svelte/store' +import modules from './data' -export const currentModule = writable(null) +export const currentModule = writable(modules[0]) export const position = writable(0) export const uid = derived(currentModule, $currentModule => $currentModule && $currentModule.uid) diff --git a/modulearn/src/utils.js b/modulearn/src/utils.js index 8181324..f58a474 100644 --- a/modulearn/src/utils.js +++ b/modulearn/src/utils.js @@ -1,4 +1,4 @@ -import { modules } from './data' +import modules from './data' import { uid } from './stores' import { get } from 'svelte/store';