From 026652ebe3cc191eb9e0323b8ed47557f28e8a51 Mon Sep 17 00:00:00 2001
From: bartosz rzepa <bartosz.rzepa@swmansion.com>
Date: Tue, 17 Sep 2024 09:48:39 +0200
Subject: [PATCH] styling done

---
 generate/src/bin/generate_sample_videos.rs | 76 +++++++++++++++++++---
 1 file changed, 66 insertions(+), 10 deletions(-)

diff --git a/generate/src/bin/generate_sample_videos.rs b/generate/src/bin/generate_sample_videos.rs
index 5286e121c..d3b8d5816 100644
--- a/generate/src/bin/generate_sample_videos.rs
+++ b/generate/src/bin/generate_sample_videos.rs
@@ -10,6 +10,13 @@ use compositor_render::{event_handler::subscribe, Resolution};
 use generate::compositor_instance::CompositorInstance;
 use serde_json::json;
 
+struct SceneStyle {
+    timer_font_size: u32,
+    timer_bottom: u32,
+    timer_right: u32,
+    title_font_size: u32,
+}
+
 fn main() {
     let _ = fs::remove_dir_all(workingdir());
     fs::create_dir_all(workingdir()).unwrap();
@@ -21,6 +28,12 @@ fn main() {
             height: 1080,
         },
         "1920x1080",
+        SceneStyle {
+            timer_font_size: 90,
+            timer_bottom: 100,
+            timer_right: 100,
+            title_font_size: 250,
+        },
     );
 
     generate_video_series(
@@ -30,6 +43,12 @@ fn main() {
             height: 1920,
         },
         "1080x1920",
+        SceneStyle {
+            timer_font_size: 90,
+            timer_bottom: 100,
+            timer_right: 100,
+            title_font_size: 250,
+        },
     );
 
     generate_video_series(
@@ -39,6 +58,12 @@ fn main() {
             height: 480,
         },
         "854x480",
+        SceneStyle {
+            timer_font_size: 45,
+            timer_bottom: 50,
+            timer_right: 50,
+            title_font_size: 125,
+        },
     );
 
     generate_video_series(
@@ -48,6 +73,12 @@ fn main() {
             height: 854,
         },
         "480x854",
+        SceneStyle {
+            timer_font_size: 45,
+            timer_bottom: 50,
+            timer_right: 50,
+            title_font_size: 125,
+        },
     );
 
     generate_video_series(
@@ -57,6 +88,12 @@ fn main() {
             height: 1080,
         },
         "1440x1080",
+        SceneStyle {
+            timer_font_size: 90,
+            timer_bottom: 100,
+            timer_right: 100,
+            title_font_size: 250,
+        },
     );
 
     generate_video_series(
@@ -66,10 +103,21 @@ fn main() {
             height: 1440,
         },
         "1080x1440",
+        SceneStyle {
+            timer_font_size: 90,
+            timer_bottom: 100,
+            timer_right: 100,
+            title_font_size: 250,
+        },
     );
 }
 
-fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix: &str) {
+fn generate_video_series(
+    duration: Duration,
+    resolution: Resolution,
+    name_suffix: &str,
+    scene_style: SceneStyle,
+) {
     // HSV 240°, 50%, 65% (dark blue)
     generate_video(
         workingdir().join(format!("input_1_{}.mp4", name_suffix)),
@@ -77,6 +125,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#5353a6ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
     // HSV 120°, 50%, 65% (green)
@@ -86,6 +135,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#53a653ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
     // HSV 0°, 50%, 65% (red)
@@ -95,6 +145,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#a65353ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
     // HSV 60°, 50%, 65% (yellow)
@@ -104,6 +155,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#a6a653ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
     // HSV 180°, 50%, 65% (light blue)
@@ -113,6 +165,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#53a6a6ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
     // HSV 300°, 50%, 65% (purple)
@@ -122,6 +175,7 @@ fn generate_video_series(duration: Duration, resolution: Resolution, name_suffix
         "#a653a6ff",
         duration,
         &resolution,
+        &scene_style,
     )
     .unwrap();
 }
@@ -138,6 +192,7 @@ fn generate_video(
     rgba_color: &str,
     duration: Duration,
     resolution: &Resolution,
+    scene_style: &SceneStyle,
 ) -> Result<()> {
     let instance = CompositorInstance::start();
 
@@ -158,7 +213,7 @@ fn generate_video(
                         "crf": "32"
                     }
                 },
-                "initial": scene(text, rgba_color, resolution, Duration::ZERO)
+                "initial": scene(text, rgba_color, resolution, Duration::ZERO, scene_style)
             },
         }),
     )?;
@@ -176,7 +231,7 @@ fn generate_video(
         instance.send_request(
             "output/output_1/update",
             json!({
-                "video": scene(text, rgba_color, resolution, pts),
+                "video": scene(text, rgba_color, resolution, pts, scene_style),
                 "schedule_time_ms": pts.as_millis(),
             }),
         )?;
@@ -205,6 +260,7 @@ fn scene(
     rgba_color: &str,
     resolution: &Resolution,
     pts: Duration,
+    style: &SceneStyle,
 ) -> serde_json::Value {
     json!({
         "root": {
@@ -216,7 +272,7 @@ fn scene(
                 {
                     "type": "text",
                     "text": text,
-                    "font_size": resolution.width / 8,
+                    "font_size": style.title_font_size,
                     "width": resolution.width,
                     "align": "center",
                     "font_family": "Comic Sans MS",
@@ -224,16 +280,16 @@ fn scene(
                 { "type": "view" },
                 {
                   "type": "view",
-                  "bottom": resolution.height / 6,
-                  "right": resolution.width / 8,
-                  "width":  resolution.width / 6,
-                  "height": resolution.height / 6,
+                  "bottom": style.timer_bottom,
+                  "right": style.timer_right,
+                  "width": resolution.width / 2,
+                  "height": style.timer_font_size,
                   "children": [
                      {
                             "type": "text",
                             "text": format!("{:.2}s", pts.as_millis() as f32 / 1000.0),
-                            "font_size": resolution.width / 16,
-                            "width": resolution.width / 6,
+                            "font_size": style.timer_font_size,
+                            "width": resolution.width / 2,
                             "align": "right",
                             "font_family": "Comic Sans MS",
                      },