Browse Source

Making the videos work and get some error reporting out of webtorrent temporarily.

master
Zed A. Shaw 6 months ago
parent
commit
bb90f13b85
  1. 10
      __tests__/fixtures/db/modules/first_steps/exercises/01-intro.md
  2. 6
      public/js/webtorrent.js
  3. 6
      public/js/webtorrent.min.js
  4. 2
      src/components/Video.svelte
  5. 5
      src/routes/modules/[slug]/[exercise].svelte
  6. 18
      src/routes/modules/[slug]/index.html

10
__tests__/fixtures/db/modules/first_steps/exercises/01-intro.md

@ -4,7 +4,15 @@
"module": "/modules/first_steps",
"id": 0,
"completed": false,
"summary": "This will first introduce some basic terminology for HTML."
"summary": "This will first introduce some basic terminology for HTML.",
"video": {
"src": "/images/sample.mp4",
"preload": "none",
"torrent": {
"torrent_url": "FAKE",
"target": "3452345234523452342345"
}
}
}

6
public/js/webtorrent.js

File diff suppressed because one or more lines are too long

6
public/js/webtorrent.min.js

File diff suppressed because one or more lines are too long

2
src/components/Video.svelte

@ -1,5 +1,5 @@
<svelte:head>
<script src="/js/webtorrent.min.js">
<script src="/js/webtorrent.js">
</script>
</svelte:head>

5
src/routes/modules/[slug]/[exercise].svelte

@ -82,6 +82,7 @@
exercise.content = await load_exercise_content(module_slug, exercise_slug);
}
console.log("exercise data: ", exercise);
return {module, exercise};
} else {
return undefined; // need to do something else here
@ -232,7 +233,7 @@
{#if exercise.metadata.video }
<div class="columns">
<div class="column" id="video">
{#if exercise.state === 'active' || exercise.state === 'done'}
{#if exercise.state === 'active' || exercise.state === 'done' || $session.development }
<Video media={exercise.metadata.video} />
{:else}
<div class="toast toast-warning">
@ -242,6 +243,8 @@
{/if}
</div>
</div>
{:else}
<div class="toast toast-warning">This exercise does not currently have a video.</div>
{/if}
<Comments link_id="questions" title="Questions and Answers"/>

18
src/routes/modules/[slug]/index.html

@ -44,8 +44,6 @@
#content {
padding-top: 1rem;
padding-bottom: 1rem;
--disabled-background: #ddd;
--disabled-color: #666;
}
module module-header {
@ -98,12 +96,6 @@ exercise:hover {
cursor: pointer;
}
exercise.pending:hover * {
color: #999 !important;
cursor: not-allowed;
}
exercise heading div h3 {
margin-top: 0.5em;
color: $primary-color-dark;
@ -136,7 +128,9 @@ exercise footer {
<info>
<titles>
<h1>{ module.title }</h1>
<h4>{ module.subtitle }</h4>
{#if module.subtitle }
<h4>{ module.subtitle }</h4>
{/if}
</titles>
<description>
@ -150,10 +144,10 @@ exercise footer {
<module-exercises>
{#each module.exercises as exercise}
<exercise class:pending={ exercise.state == "pending" }>
<exercise>
<heading>
<a href="/modules/{ module.slug }/{ exercise.metadata.slug }/">
<IconImage pattern={module.pattern} background={exercise.state == "pending" ? "var(--disabled-background)" : "" }>
<IconImage pattern={module.pattern}>
<h3>{ exercise.metadata.title }</h3>
</IconImage>
</a>
@ -165,7 +159,7 @@ exercise footer {
<footer>
<date>{ exercise.metadata.date }</date>
<status><Icon name="{ exercise.state == 'pending' ? 'lock' : 'unlock' }" /></status>
<status><Icon name="{ exercise.state == 'pending' ? 'book' : 'book-open' }" /></status>
</footer>
</exercise>
{/each}

Loading…
Cancel
Save