version ready to publish.

frontend/initial-data.ts

@@ -46,7 +46,9 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block2",
                   duration: 40,
-                  video: "/media/block0.mp4",
+                  video: "/media/block1-1.mp4",
+                  description:
+                    "4 lateral high knee steps, drop squat, a jump and a butt kick",
                   exercises: [
                     {
                       id: "exercise0",
@@ -111,7 +113,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block3",
                   duration: 30,
-                  video: "/media/block1.webm",
+                  video: "/media/block1-2.mp4",
+                  description: "Drop squat, a jump and a butt kick.",
                   exercises: [
                     {
                       id: "exercise1",
@@ -160,6 +163,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block4",
                   duration: 20,
+                  video: "/media/block1-3.mp4",
+                  description: "Drop squat and a jump.",
                   exercises: [
                     {
                       id: "exercise1",
@@ -209,6 +214,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block6",
                   duration: 40,
+                  video: "/media/block2-1.mp4",
+                  description: "Pushup, frog jump and a jump.",
                   exercises: [
                     {
                       id: "exercise1",
@@ -268,6 +275,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block7",
                   duration: 30,
+                  video: "/media/block2-2.mp4",
+                  description: "Pushup and a jump",
                   exercises: [
                     {
                       id: "exercise1",
@@ -314,6 +323,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block8",
                   duration: 20,
+                  video: "/media/burpee.mp4",
+                  description: "Just a burpee.",
                   exercises: [
                     {
                       id: "exercise1",
@@ -377,6 +388,8 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block11",
                   duration: 25,
+                  video: "/media/block3-1.mp4",
+                  description: "",
                   exercises: [
                     {
                       id: "exercise6",
@@ -409,6 +422,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block12",
                   duration: 25,
+                  video: "/media/block3-2.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -441,6 +455,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block13",
                   duration: 10,
+                  video: "/media/burpee.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -476,6 +491,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block15",
                   duration: 25,
+                  video: "/media/block4-1.mp4",
                   exercises: [
                     {
                       id: "exercise6",
@@ -508,6 +524,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block16",
                   duration: 25,
+                  video: "/media/block4-2.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -527,6 +544,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block17",
                   duration: 10,
+                  video: "/media/burpee.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -562,6 +580,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block19",
                   duration: 25,
+                  video: "/media/block5-1.mp4",
                   exercises: [
                     {
                       id: "exercise6",
@@ -594,6 +613,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block20",
                   duration: 25,
+                  video: "/media/fastfeet.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -613,6 +633,7 @@ const data: { trainings: ITraining[]; polls: any } = {
                 {
                   id: "block1",
                   duration: 10,
+                  video: "/media/burpee.mp4",
                   exercises: [
                     {
                       id: "exercise1",
@@ -649,6 +670,7 @@ const data: { trainings: ITraining[]; polls: any } = {
             {
               id: "block0",
               duration: 90,
+              video: "/media/block6-1.mp4",
               exercises: [
                 {
                   id: "exercise6",
@@ -710,6 +732,7 @@ const data: { trainings: ITraining[]; polls: any } = {
               id: "block0",
               duration: 60,
               rest: 25,
+              video: "/media/block7-1.mp4",
               exercises: [
                 {
                   id: "exercise6",
@@ -744,6 +767,7 @@ const data: { trainings: ITraining[]; polls: any } = {
               id: "block0",
               duration: 60,
               rest: 25,
+              video: "/media/block8-1.mp4",
               exercises: [
                 {
                   id: "exercise6",
@@ -791,6 +815,7 @@ const data: { trainings: ITraining[]; polls: any } = {
             {
               id: "block0",
               duration: 90,
+              video: "/media/block9-1.mp4",
               exercises: [
                 {
                   id: "exercise6",

frontend/src/timer/components/Timer.tsx

@@ -42,6 +42,7 @@ const Timer = ({ training }: { training: ITraining }) => {
     //console.log("effect 1");
     rosie.current.play("ttt");
     const exerciseList = getExerciseList(training.blocks);
+    console.log(exerciseList);
     const totalTime = getTrainingTime(exerciseList);
     setState({ ...state, exerciseList, totalTime });
   }, [training]);

frontend/src/timer/components/VideoPlayer.tsx

@@ -13,7 +13,7 @@ const VideoPlayer = ({
 
   useEffect(() => {
     const tmp = videojs(videoPlayerRef.current, {
-      width: 320,
+      width: 512,
       loop: true,
       controls: true
     });
@@ -34,7 +34,7 @@ const VideoPlayer = ({
 
   return (
     <div data-vjs-player>
-      <video ref={videoPlayerRef as any} className="video-js" />
+      <video ref={videoPlayerRef as any} className="video-js vjs-16-9" />
     </div>
   );
 };

frontend/src/timer/utils.ts

@@ -44,29 +44,34 @@ export function getExerciseList(
   return blocks
     .map(block => {
       if (block.blocks) {
-        const subBlocks = getExerciseList(
-          block.blocks,
-          offset,
-          toplevelBlock || block.title
-        );
-        const lastItem = subBlocks[subBlocks.length - 1];
-        offset = lastItem.offset + lastItem.duration;
-        if (block.rest) {
-          if (lastItem.exercise === "Rest") {
-            lastItem.duration += block.rest;
-            offset += block.rest;
-          } else {
-            subBlocks.push({
-              exercise: "Rest",
-              toplevelBlock: toplevelBlock || block.title,
-              duration: block.rest,
-              offset
-            });
-            offset += block.rest;
+        const blockArray = [];
+        for (let i = 0; i < (block.repetitions || 1); i++) {
+          const subBlocks = getExerciseList(
+            block.blocks,
+            offset,
+            toplevelBlock || block.title
+          );
+          const lastItem = subBlocks[subBlocks.length - 1];
+          offset = lastItem.offset + lastItem.duration;
+          if (block.rest) {
+            if (lastItem.exercise === "Rest") {
+              lastItem.duration += block.rest;
+              offset += block.rest;
+            } else {
+              subBlocks.push({
+                exercise: "Rest",
+                toplevelBlock: toplevelBlock || block.title,
+                duration: block.rest,
+                offset
+              });
+              offset += block.rest;
+            }
           }
+          blockArray.push(subBlocks);
         }
-        return subBlocks;
+        return blockArray.flat();
       } else if (block.exercises) {
+        const blockArray = [];
         const newItem = {
           exercise: block.exercises
             .map(exercise =>
@@ -77,11 +82,15 @@ export function getExerciseList(
             .join(" - "),
           duration: calculateDuration(block),
           video: block.video,
+          description: block.description,
           toplevelBlock: toplevelBlock || block.title,
           offset
         };
-        offset += calculateDuration(block);
-        return newItem;
+        for (let i = 0; i < (block.repetitions || 1); i++) {
+          blockArray.push({ ...newItem, offset });
+          offset += newItem.duration;
+        }
+        return blockArray.flat();
       }
     })
     .flat();

frontend/src/training/types.ts

@@ -21,6 +21,7 @@ export interface IBlock {
   sequence?: number;
   title?: string;
   comment?: string;
+  description?: string;
   duration?: number;
   repetitions?: number;
   rest?: number;