feat(video): add new video files

gerdesque · Jun 13, 2020 · 83b6769 · 83b6769
1 parent 75a18a1
commit 83b6769
Show file tree

Hide file tree

Showing 13 changed files with 17 additions and 13 deletions.
diff --git a/apps/demol/src/app/app.json b/apps/demol/src/app/app.json
@@ -7,6 +7,7 @@
       "groups": [
         {
           "grouped": false,
+          "row": false,
           "content": [
             {
               "type": "text",
@@ -73,6 +74,8 @@
           ]
         },
         {
+          "grouped": false,
+          "row": false,
           "content": [
             {
               "value": "Anna lebt mit ihrer Familie im Ruhrgebiet. Sie ist gerade 12 Jahre alt geworden. Ihr Vater arbeitet unter Tage im Bergbau. Ihre Mutter kümmert sich um Anna, ihre 3 Geschwister sowie ihren alten Großvater. Der Lohn des Vaters reicht gerade aus, um sie alle zu versorgen.",
@@ -98,25 +101,25 @@
             {
               "type": "video",
               "layer": "fore",
-              "value": "Anna_Großvater",
+              "value": "3_Annas_Alltag",
               "title": "Annas Alltag"
             },
             {
               "type": "video",
               "layer": "fore",
-              "value": "Anna_Großvater",
+              "value": "4_Annas_Zuhause",
               "title": "Annas Lebensumfeld"
             },
             {
               "type": "video",
               "layer": "fore",
-              "value": "Anna_Großvater",
+              "value": "2_Anna_Familie",
               "title": "Annas Familie"
             },
             {
               "type": "video",
               "layer": "fore",
-              "value": "Anna_Großvater",
+              "value": "1_Anna_Großvater",
               "title": "Annas Großvater"
             },
             {
@@ -133,6 +136,7 @@
         },
         {
           "grouped": true,
+          "row": false,
           "content": [
             {
               "type": "text",
@@ -153,6 +157,7 @@
         },
         {
           "grouped": true,
+          "row": false,
           "content": [
             {
               "type": "text",

diff --git a/apps/demol/src/assets/movies/1_Anna_Großvater.mov b/apps/demol/src/assets/movies/1_Anna_Großvater.mov
diff --git a/apps/demol/src/assets/movies/1_Anna_Großvater.mp4 b/apps/demol/src/assets/movies/1_Anna_Großvater.mp4
diff --git a/apps/demol/src/assets/movies/2_Anna_Familie.mov b/apps/demol/src/assets/movies/2_Anna_Familie.mov
diff --git a/apps/demol/src/assets/movies/2_Anna_Familie.mp4 b/apps/demol/src/assets/movies/2_Anna_Familie.mp4
diff --git a/apps/demol/src/assets/movies/3_Annas_Alltag.mov b/apps/demol/src/assets/movies/3_Annas_Alltag.mov
diff --git a/apps/demol/src/assets/movies/3_Annas_Alltag.mp4 b/apps/demol/src/assets/movies/3_Annas_Alltag.mp4
diff --git a/apps/demol/src/assets/movies/4_Annas_Zuhause.mov b/apps/demol/src/assets/movies/4_Annas_Zuhause.mov
diff --git a/apps/demol/src/assets/movies/4_Annas_Zuhause.mp4 b/apps/demol/src/assets/movies/4_Annas_Zuhause.mp4
diff --git a/apps/demol/src/assets/movies/Anna_Großvater.mp4 b/apps/demol/src/assets/movies/Anna_Großvater.mp4
diff --git a/libs/data/src/lib/data.tsx b/libs/data/src/lib/data.tsx
@@ -19,14 +19,15 @@ export enum ContentType {
 }
 
 export interface Content {
-  type: ContentType
+  type: string
+  layer: string
   value: string
 }
 
 export interface Group {
-  content: Content[]
   grouped: boolean
   row: boolean
+  content: Content[]
 }
 
 export interface Chapter {

diff --git a/libs/ui/src/lib/chapter/chapter.tsx b/libs/ui/src/lib/chapter/chapter.tsx
@@ -35,7 +35,7 @@ export const ChapterComponent = (props: Chapter) => {
         {contentList.map((content) =>
           <>
             {content.type === ContentType.Text && <Text value={content.value} />}
-            {content.type === ContentType.Video && <Video value={content.value} />}
+            {content.type === ContentType.Video && <Video value={content.value} title={content.title} />}
             {content.type === ContentType.Image && <Image value={content.value} />}
             {content.type === ContentType.Decission && <Decission value={content.value} />}
             {content.type === ContentType.Misc && <Smokingpit value={content.value} />}
@@ -47,7 +47,7 @@ export const ChapterComponent = (props: Chapter) => {
       contentList.map((content, index) =>
         <div key={index} className={`parallax__layer parallax__layer--${content.layer}`}>
           {content.type === ContentType.Text && <Text value={content.value} />}
-          {content.type === ContentType.Video && <Video value={content.value} />}
+          {content.type === ContentType.Video && <Video value={content.value} title={content.title} />}
           {content.type === ContentType.Image && <Image value={content.value} />}
           {content.type === ContentType.Decission && <Decission value={content.value} />}
           {content.type === ContentType.Misc && <Smokingpit value={content.value} />}
@@ -56,10 +56,6 @@ export const ChapterComponent = (props: Chapter) => {
     return grouped ? chapterGroupContent : chapterContent
   }
 
-  const setAudioRef = element => {
-    this.audio = element;
-  };
-
   return (
     <div className='parallax'>
       <div className='parallax__group parallax__header'>

diff --git a/libs/ui/src/lib/video/video.tsx b/libs/ui/src/lib/video/video.tsx
@@ -5,7 +5,8 @@ import './video.scss';
 
 /* eslint-disable-next-line */
 export interface VideoProps {
-  value: string
+  value: string,
+  title: string
 }
 
 export const Video = (props: VideoProps) => {
@@ -16,6 +17,7 @@ export const Video = (props: VideoProps) => {
 
   return (
     <div className="video">
+      <p>{props.title}</p>
       <video>
         <source type='video/mp4' src={"./assets/movies/"+props.value+VIDEO_SUFFIX}></source>
         Your browser does not support the video tag.