From a27133d26b974dbc3bbf023639a49de455d8b563 Mon Sep 17 00:00:00 2001
From: "riho.takagi" <rihohearts@gmail.com>
Date: Mon, 1 Apr 2024 17:33:12 -0400
Subject: [PATCH 1/3] Add video library button on main page

---
 .../VideoLibraryComponent.svelte              |  8 ---
 src/routes/__layout.svelte                    | 68 ++++++++++++++-----
 2 files changed, 50 insertions(+), 26 deletions(-)

diff --git a/src/lib/components/world-layers/videoLibraries/VideoLibraryComponent.svelte b/src/lib/components/world-layers/videoLibraries/VideoLibraryComponent.svelte
index fc6bfc1..8e08cda 100644
--- a/src/lib/components/world-layers/videoLibraries/VideoLibraryComponent.svelte
+++ b/src/lib/components/world-layers/videoLibraries/VideoLibraryComponent.svelte
@@ -22,12 +22,10 @@ function scrollLeft() {
 function scrollRight() {
   carousel.scrollBy({ left: 300, behavior: 'smooth' });
 }
-  console.log("lib!!",lib.activeVideos)
 
   $: if (lib) {
     videosByDate = {};
     lib.activeVideos.forEach(video => {
-      console.log("video.startDate",video.startDate)
       if(video.startDate !== undefined){
         const date = video.startDate?.split('T')[0];
       
@@ -45,17 +43,12 @@ function scrollRight() {
   }
 
   function selectDate(date) {
-    console.log("selectDate",date)
-    console.log("videosByDate[date]",videosByDate[date])
     selectedDate = date;
     selectedVideos = videosByDate[date];
-    console.log("ted",selectedVideos)
   }
 
 
 </script>
-
-
     <div class="video-item" class:is-mobile={$isPhone}>
       <span class="title-button">
       <span class="title" >{lib.title}</span></span>
@@ -75,7 +68,6 @@ function scrollRight() {
       <div class="video-carousel" bind:this={carousel}>
             {#each selectedVideos as video}
           <div class="video">
-
              <div class="youtube-container">
                <iframe
                  src={"https://www.youtube.com/embed/" +
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index a490988..b2949cb 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -24,6 +24,7 @@
     playSound,
     activeArticle,
     trayOpen,
+    activeVideoLibrary,
   } from "$lib/modules/ui.js"
   import { currentRoom } from "$lib/modules/movement.js"
   // *** VARIABLES
@@ -37,6 +38,8 @@
     }
   }
 
+
+
 </script>
 <svelte:window on:keydown={e => {
       if (e.key === "Escape") {
@@ -77,28 +80,37 @@
 <!-- OPTIONS -->
 {#if !$trayOpen && !$activeArticle}
   <div class="options">
-    <div
-      class="option sound"
-      on:click={() => {
-        playSound.set(!$playSound)
-      }}
-    >
-      {#if $playSound}
-        <SoundOn />
-      {:else}
-        <SoundOff />
-      {/if}
+    <div class="top_options">
+      <div
+        class="option sound"
+        on:click={() => {
+          playSound.set(!$playSound)
+        }}
+      >
+        {#if $playSound}
+          <SoundOn />
+        {:else}
+          <SoundOff />
+        {/if}
+      </div>
+      <div
+        class="option labels"
+        class:on={$showLabels}
+        on:click={() => {
+          showLabels.set(!$showLabels)
+        }}
+      >
+        <span>abc</span>
+      </div>
     </div>
     <div
-      class="option labels"
-      class:on={$showLabels}
-      on:click={() => {
-        showLabels.set(!$showLabels)
-      }}
+      class="video_library_button"
+      on:click={activeVideoLibrary.set(!$activeVideoLibrary)}
     >
-      <span>abc</span>
+      <span>Video Library</span>
     </div>
   </div>
+
 {/if}
 
 <style lang="scss">
@@ -150,12 +162,32 @@
     @include screen-size("small") {
       display: none;
     }
+    
+    .top_options {
+      display: flex;
+    }
+
+    .video_library_button {
+      margin-left: 5px;
+      font-size: $font-size-extra-small;
+      background: $e-ink-medium;
+      padding: 5px;
+      user-select: none;
+      cursor: pointer;
+      border: 1px solid $e-ink-dark;
+      width: 200px;
+      height: 30px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-top: 10px;
+      width: 100%;
+    }
 
     .option {
       margin-left: 5px;
       font-size: $font-size-extra-small;
       background: $e-ink-medium;
-      float: right;
       padding: 5px;
       user-select: none;
       cursor: pointer;

From cc953c52b14d2264cea6d84aaf1e06d7ef393383 Mon Sep 17 00:00:00 2001
From: "riho.takagi" <rihohearts@gmail.com>
Date: Wed, 3 Apr 2024 11:00:30 -0400
Subject: [PATCH 2/3] update css

---
 src/routes/__layout.svelte | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index b2949cb..8e53a43 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -169,12 +169,15 @@
 
     .video_library_button {
       margin-left: 5px;
-      font-size: $font-size-extra-small;
+      font-size: $font-size-small;
       background: $e-ink-medium;
-      padding: 5px;
+      color: $e-ink-light;
+      padding: 10px;
       user-select: none;
       cursor: pointer;
-      border: 1px solid $e-ink-dark;
+      background-color: $e-ink-dark;
+      border-radius: 10px;
+      border: 1px solid $e-ink-light;
       width: 200px;
       height: 30px;
       display: flex;

From bc58f62aa463a9136f0e5c017995503485785791 Mon Sep 17 00:00:00 2001
From: "riho.takagi" <rihohearts@gmail.com>
Date: Mon, 22 Apr 2024 12:59:20 -0400
Subject: [PATCH 3/3] Update feed widget top position

---
 src/lib/components/world-layers/feed/Feed.svelte | 2 +-
 src/routes/__layout.svelte                       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/world-layers/feed/Feed.svelte b/src/lib/components/world-layers/feed/Feed.svelte
index 869f79b..de30c84 100644
--- a/src/lib/components/world-layers/feed/Feed.svelte
+++ b/src/lib/components/world-layers/feed/Feed.svelte
@@ -69,7 +69,7 @@ button {
     position: fixed;
     cursor: pointer;
     background: $e-ink-medium;
-    top: 80px;
+    top: 120px;
     right: 20px;
     width: 160px;
     display: flex;
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 8e53a43..a204572 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -107,7 +107,7 @@
       class="video_library_button"
       on:click={activeVideoLibrary.set(!$activeVideoLibrary)}
     >
-      <span>Video Library</span>
+      <span>Video Library    →</span>
     </div>
   </div>