]> git.mdlowis.com Git - proto/atv.git/commitdiff
projects / proto / atv.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: a505eb6)
control page i snow functional. Need to add a queue manager/viewer widget and call...
authorMike Lowis <mike.lowis@gentex.com>
Tue, 16 Jan 2024 17:59:16 +0000 (12:59 -0500)
committerMike Lowis <mike.lowis@gentex.com>
Tue, 16 Jan 2024 17:59:16 +0000 (12:59 -0500)
atv/assets/client.js patch | blob | history
atv/assets/control.html patch | blob | history
atv/assets/index.html patch | blob | history
atv/lib/atv/channel.rb patch | blob | history
atv/lib/atv/player.rb patch | blob | history
atv/lib/atv/server.rb patch | blob | history

diff --git a/atv/assets/client.js b/atv/assets/client.js
index ce9bc18442419e39001f91917cca1928806a9697..66ebb7b14ef6c0c43bd8eea4801aca5713058490 100644 (file)
--- a/atv/assets/client.js
+++ b/atv/assets/client.js
@@ -3,12 +3,14 @@ const Client = ((self = {})=>{
 
     self.connect = (onmsg)=>{
         self.onmessage = onmsg;
+        self.state = { playing: false };
 
         ws = new WebSocket(
             "ws://" + window.location.host + ":3000");
 
         ws.onmessage = (event)=>{
-            self.onmessage(JSON.parse(event.data));
+            self.state = JSON.parse(event.data);
+            self.onmessage(self.state);
         };
 
         ws.onclose = ()=>{
@@ -17,7 +19,7 @@ const Client = ((self = {})=>{
     };
 
     const send = (cmd, data = {})=>{
-        const blob = { cmd: cmd, data: data};
+        const blob = Object.assign({ cmd: cmd}, data);
         console.log(blob);
         ws.send(JSON.stringify(blob));
     };
@@ -26,8 +28,15 @@ const Client = ((self = {})=>{
         send("skip");
     };
 
-    self.play = (data)=>{
-        send("play");
+    self.play_pause = (data)=>{
+        if (self.state["playing"])
+        {
+            send("pause");
+        }
+        else
+        {
+            send("play");
+        }
     };
 
     self.pause = (data)=>{
diff --git a/atv/assets/control.html b/atv/assets/control.html
index 4a8f6ef745f766c4de589e43912f68f8b074aceb..c4a2f5d68764cd8dea39cae75f83beabb8d99de8 100644 (file)
--- a/atv/assets/control.html
+++ b/atv/assets/control.html
@@ -10,24 +10,66 @@
       width: 100%;
       height: 100%;
       max-height: 100%;
-      background-color: #000;
+      background-color: #eaeaea;
       overflow: hidden;
     }
+
+    .table {
+        display: block;
+    }
+
+    .row {
+        display: flex;
+        flex: 1 0 auto;
+        border-bottom: 1px solid black;
+    }
+
+    .label {
+        flex-shrink: 1;
+        padding: 1em;
+        width: 8em;
+        border-right: 1px solid black;
+    }
+
+    .item {
+        flex-grow: 1;
+        border-left: 0;
+        padding: 1em;
+    }
+
+    .row input {
+        flex-grow: 1;
+        height: 4em;
+    }
   </style>
 </head>
 <body>
 
+<div class="row">
+  <div class="label"><strong>Now Playing</strong></div>
+  <div class="item" id="currVid">Some File</div>
+</div>
+<div class="row">
+  <div class="label"><strong>Playing Next</strong></div>
+  <div class="item" id="nextVid">Some Other File</div>
+</div>
+<hr/>
 
-<input type="button" value="Skip" onclick="javscript:Client.skip()"/>
-<input type="button" value="Play" onclick="javscript:Client.play()"/>
-<input type="button" value="Pause" onclick="javscript:Client.pause()"/>
-<input type="button" value="Chan +" onclick="javscript:Client.chan_next()"/>
-<input type="button" value="Chan -" onclick="javscript:Client.chan_prev()"/>
-
+<div class="row">
+  <input type="button" value="Play" onclick="javscript:Client.play_pause()" id="playBtn"/>
+  <input type="button" value="Skip" onclick="javscript:Client.skip()"/>
+  <input type="button" value="Chan +" onclick="javscript:Client.chan_next()"/>
+  <input type="button" value="Chan -" onclick="javscript:Client.chan_prev()"/>
+</div>
 <script type="text/javascript" src="client.js"></script>
 <script>
 (()=>{
-    Client.connect(()=>{});
+    Client.connect((data)=>{
+        console.log(data);
+        currVid.innerText = data["curr"]["path"]
+        nextVid.innerText = data["next"]["path"]
+        playBtn.value = (data["playing"] ? "Pause" : "Play");
+    });
 })();
 </script>
 </body>
diff --git a/atv/assets/index.html b/atv/assets/index.html
index cbd7f9087d806fe9425412723d3f2c12284bdc0d..460dff1ea5d89527963c795f345ab0451a19d923 100644 (file)
--- a/atv/assets/index.html
+++ b/atv/assets/index.html
@@ -45,13 +45,14 @@ const updatePlayer = ()=>{
     if (elapsed >= 0 && elapsed < duration)
     {
         Video.src = current["curr"]["path"] + "#t=" + Math.floor(elapsed);
-    }
-};
-
-const Cmd = {
-    play: (data)=>{
-        current = data;
-        updatePlayer();
+        if (current["playing"])
+        {
+            Video.play();
+        }
+        else
+        {
+            Video.pause();
+        }
     }
 };
 
@@ -61,7 +62,8 @@ const connect = ()=>{
 
     ws.onmessage = (event)=>{
         const msg = JSON.parse(event.data);
-        Cmd[msg.cmd](msg);
+        current = msg;
+        updatePlayer();
     };
 
     ws.onclose = (event)=>{
diff --git a/atv/lib/atv/channel.rb b/atv/lib/atv/channel.rb
index b9027ed5d62a0fca868be273451b5cc5475b1636..1f007813fd708a748b375267ff02477ce7fb1718 100644 (file)
--- a/atv/lib/atv/channel.rb
+++ b/atv/lib/atv/channel.rb
@@ -8,7 +8,6 @@ module ATV
       @items = selectors.map do |sel|
         files.select {|f| f["path"].start_with? sel }
       end.flatten.shuffle
-#      @time = @items[@index]["duration"] - 10
     end
 
     def update(playing)
@@ -30,7 +29,6 @@ module ATV
         @index = 0
       end
       @time = 0
-#      @time = @items[@index]["duration"] - 10
     end
 
     def state()
diff --git a/atv/lib/atv/player.rb b/atv/lib/atv/player.rb
index d1de7f00ca55103989a3b735d7b7d23d88b93f43..feb937a5faab006466dc48b97c74f82d91d3eac0 100644 (file)
--- a/atv/lib/atv/player.rb
+++ b/atv/lib/atv/player.rb
@@ -12,7 +12,6 @@ module ATV
       @channels.each do |c|
         updated ||= c.update(@playing)
       end
-#      puts updated
       updated
     end
 
@@ -25,7 +24,7 @@ module ATV
     end
 
     def skip()
-      @channels[@channel].next
+      @channels[@channel].next_vid
     end
 
     def chan_next()
@@ -43,7 +42,9 @@ module ATV
     end
 
     def state()
-      @channels[@channel].state
+      @channels[@channel].state.merge({
+          "playing" => @playing
+      })
     end
   end
 end
diff --git a/atv/lib/atv/server.rb b/atv/lib/atv/server.rb
index 6bbc2a504c3ed4111c1a78af40e8fa0830cab221..86f672056aa790cf312f3b1414f24df3dc112ac1 100644 (file)
--- a/atv/lib/atv/server.rb
+++ b/atv/lib/atv/server.rb
@@ -14,13 +14,17 @@ module ATV
       Iodine.listen(service: :http, handler: APP)
       Iodine.run_every(1000) do
         if player.update
-          publish(@@player.state.merge({"cmd" => "play"}))
+          broadcast("play", @@player.state)
         end
       end
       Iodine.threads = 1
       Iodine.start
     end
 
+    def broadcast(cmd, data)
+      publish(data.merge({"cmd" => cmd}))
+    end
+
     def publish(obj)
       puts JSON.dump(obj)
       Iodine.publish(:atv, JSON.dump(obj))
@@ -43,27 +47,29 @@ module ATV
 
     def on_message(client, cmd)
       cmd = JSON.parse(cmd)
+      pp cmd
       send("on_#{cmd["cmd"]}".to_sym, client, cmd)
+      broadcast(cmd["cmd"], @@player.state)
     end
 
     def on_skip(client, data)
-      puts "skip"
+      @@player.skip
     end
 
     def on_play(client, data)
-      puts "play"
+      @@player.play
     end
 
     def on_pause(client, data)
-      puts "pause"
+      @@player.pause
     end
 
     def on_chan_next(client, data)
-      puts "chan_next"
+      @@player.chan_next
     end
 
     def on_chan_prev(client, data)
-      puts "chan_prev"
+      @@player.chan_prev
     end
 
 #    def send(client, data)
Unnamed repository; edit this file 'description' to name the repository.