diff web/ascoltami/index.html @ 2439:06da5db2fafe

rewrite ascoltami to use the graph for more playback data
author drewp@bigasterisk.com
date Thu, 30 May 2024 01:08:07 -0700
parents 4556eebe5d73
children
line wrap: on
line diff
--- a/web/ascoltami/index.html	Wed May 29 17:28:25 2024 -0700
+++ b/web/ascoltami/index.html	Thu May 30 01:08:07 2024 -0700
@@ -3,81 +3,11 @@
   <head>
     <title>ascoltami on {{host}}</title>
     <link rel="stylesheet" href="../style.css" />
-    <style>
-      #cmd-go {
-        min-width: 5em;
-      }
-      .song-name {
-        padding-left: 0.4em;
-      }
-      .dimStalled #currentTime {
-        font-size: 20px;
-        background: green;
-        color: black;
-        padding: 3px;
-      }
-      .dimStalled {
-        font-size: 90%;
-      }
-      body {
-        margin: 0;
-        padding: 0;
-        overflow: hidden;
-        min-height: 100vh;
-      }
-      #page {
-        width: 100%;
-        height: 100vh; /* my phone was losing the bottom :( */
-        display: flex;
-        flex-direction: column;
-      }
-      #page > div,
-      #page > p {
-        flex: 0 1 auto;
-        margin: 0;
-      }
-      light9-ascoltami-ui {
-        flex: 1 1 auto;
-      }
-    </style>
-    <meta
-      name="viewport"
-      content="user-scalable=no, width=device-width, initial-scale=.7"
-    />
+    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=.7" />
     <script type="module" src="./Light9AscoltamiUi"></script>
   </head>
   <body>
-    <div id="page">
-      <h1>ascoltami on {{host}}</h1>
-      <div class="songs" style="display: none"></div>
-
-      <div class="dimStalled">
-        <table>
-          <tr>
-            <td colspan="3">
-              <strong>Song:</strong> <span id="currentSong"></span>
-            </td>
-          </tr>
-          <tr>
-            <td><strong>Time:</strong> <span id="currentTime"></span></td>
-            <td><strong>Left:</strong> <span id="leftTime"></span></td>
-            <td>
-              <strong>Until autostop:</strong>
-              <span id="leftAutoStopTime"></span>
-            </td>
-          </tr>
-          <tr>
-            <td colspan="3">
-               <span id="states"></span>
-            </td>
-          </tr>
-        </table>
-      </div>
-
-      <hr />
-      <light9-ascoltami-ui></light9-ascoltami-ui>
-      <p><a href="">reload</a></p>
-    </div>
-    <script type="module" src="./main.ts"></script>
+    <light9-ascoltami-ui></light9-ascoltami-ui>
+    <p><a href="">reload</a></p>
   </body>
 </html>