]> git.mdlowis.com Git - proto/atv.git/commitdiff
fleshed out browser and started reworking server
authorMichael D. Lowis <mike@mdlowis.com>
Fri, 1 Mar 2024 04:59:32 +0000 (23:59 -0500)
committerMichael D. Lowis <mike@mdlowis.com>
Fri, 1 Mar 2024 04:59:32 +0000 (23:59 -0500)
atv/assets/control.html
atv/assets/index.html
atv/bin/atv
atv/lib/atv/channel.rb

index 3ebdbfa825a7a185bff1f6577f99db76944cc9c3..c232fee24ea79f117096337cba5b8475a3cc2379 100644 (file)
@@ -56,8 +56,6 @@
         margin: 0.5em;
     }
 
-
-
     article {
         display: flex;
         flex-flow: column;
     .shrink {
         flex: 0 1 auto;
     }
+
+    #breadCrumbs {
+        margin-left: 1em;
+        margin-right: 1em;
+    }
+
+    #itemList {
+        margin-left: 1em;
+        margin-right: 1em;
+    }
+
+
   </style>
 </head>
 <body>
         </tbody></table>
     </section>
 
+    <section class="grow">
+        <div style="width: 100%; text-align: center"><h2>Queued Videos</h2></div>
+        <div id="queueList" style="width: 100%; text-align: center;">The queue is currently empty</div>
+    </section>
+
     <section>
         <div class="row">
             <input type="button" value="Play" onclick="javascript:UI.play_pause()" id="playBtn"/>
             <input type="button" value="Enqueue" onclick="javascript:UI.select_file()"/>
         </div>
     </section>
-
-    <section class="grow">
-        <div style="width: 100%; text-align: center"><h2>Queued Videos</h2></div>
-        <div id="queueList" style="width: 100%; text-align: center;">The queue is currently empty</div>
-    </section>
 </article>
 
 <article id="browseView" style="display: none">
     <section>
         <h1 style="text-align: center">Browse Media</h1>
         <hr/>
-        <div>Breadcrumbs</div>
+        <div>
+          <input type="button" value="Up" onclick="javascript:UI.browse_up()" id="playBtn"/>
+           <span id="currDir"></span>
+        </div>
         <hr/>
     </section>
 
 <script type="text/javascript" src="client.js"></script>
 
 <script>
-
 const UI = (()=>{
     const self = {};
 
@@ -181,6 +193,10 @@ const UI = (()=>{
         playBtn.value = (playing ? "Pause" : "Play");
     };
 
+    self.browse_up = ()=>{
+        path.pop();
+        refreshItems();
+    };
 
 
 
@@ -210,13 +226,10 @@ const UI = (()=>{
         refreshItems();
     };
 
-    const linkUp = ()=>{
-        path.slice(-1);
-        refreshItems();
-    };
-
     const refreshItems = ()=>{
         const dir = getLocalRoot();
+        currDir.innerText = (path[path.length - 1] || "Root");
+
         itemList.innerText = "";
         for (const item in dir) {
             const el = document.createElement("div");
index 691d8c7a8ab0d13d3c83bae052c2492c1dd24cbd..398af0808e7d8ce1c2c224b423e8d5934e04910f 100644 (file)
         bottom: 1em;
         color: white;
         font-family: sans-serif;
+        background-color: black;
     }
+
     .badge span {
         display: block;
         width: 100%;
         text-align: center;
     }
 
-
-    .leftBadge {
-        position: absolute;
-        bottom: 1em;
-        left: 1em;
-        color: white;
-        font-family: sans-serif;
-    }
-    .rightBadge {
+    .channelBadge {
         position: absolute;
-        bottom: 1em;
-        right: 1em;
+        top: 0em;
         color: white;
         font-family: sans-serif;
+        font-size: 3em;
+        background-color: black;
+        width: 100%;
+        text-align: center;
     }
   </style>
 </head>
@@ -58,6 +55,8 @@
     <span>APP</span>
 </div>
 
+<div id="ChannelTitle" class="channelBadge">Channel</div>
+
 <script>
 let current = {};
 
@@ -71,6 +70,14 @@ const secondsSinceMidnight = ()=>{
     return (now.getTime() - midnight.getTime()) / 1000;
 };
 
+const updateChannelTitle = ()=>{
+    if (current["chan"] != ChannelTitle.innerText) {
+        ChannelTitle.innerText = current["chan"];
+        ChannelTitle.style.display = 'block';
+        setTimeout(()=>{ ChannelTitle.style.display = 'none'; }, 5000);
+    }
+};
+
 const updatePlayer = ()=>{
     const curr_time = secondsSinceMidnight();
     if (!current["start_time"])
@@ -106,11 +113,12 @@ const connect = ()=>{
 
     ws.onmessage = (event)=>{
         const msg = JSON.parse(event.data);
-        if (msg["cmd"] == "play")
+        if (msg["cmd"] == "play" || msg["cmd"] == "chan_next" || msg["cmd"] == "chan_prev" || msg["cmd"] == "pause")
         {
             current = msg;
+            updateChannelTitle();
+            updatePlayer();
         }
-        updatePlayer();
     };
 
     ws.onclose = (event)=>{
index 26aa8a42a1924aff8b49977a7c72545392af24c4..ae1784dad5e8b43375d1ff0d996382e2818c56e4 100755 (executable)
@@ -16,6 +16,9 @@ Dir.glob("#{ASSET_DIR}/**/*.*").each do |path|
   FileUtils.cp(path, "#{ATV_ROOT}/#{file}")
 end
 
+pp JSON.parse(File.read("#{ATV_ROOT}/config.json"))
+exit 1
+
 # Then run the server
 db = ATV::Database.new(ATV_ROOT)
 channels = [
index 26b3ebd56139f2fc6a271e3b4824f4811420e1ff..2600fa832e3f5581c671ea5683bb9a290aff8b17 100644 (file)
@@ -40,6 +40,7 @@ module ATV
        next_index = ((@index+1) >= @items.length ? 0 : (@index+1))
        next_item = (@queue.length > 0 ? @queue.first : @items[next_index])
       {
+        "chan" => @name,
         "time" => @time,
         "curr" => @current,
         "next" => next_item
@@ -58,8 +59,6 @@ module ATV
         node[path.last] = item
       end
 
-      pp tree
-
       { "items" => tree }
     end