1 <!-- Written by Mike Frysinger <vapier@gmail.com>. Released into the public domain. Suck it. -->
6 <title>Media Player Client
</title>
7 <script src='js/tcp-client.js'
></script>
8 <script src='js/mpc.js'
></script>
9 <script src='main.js'
></script>
14 border-collapse: collapse;
29 border: black solid
1px;
32 font-family: sans-serif;
33 background-color: #d0d0d0;
35 table.tabs td.selected {
36 background-color: white;
40 border-left: black solid
1px;
44 /* Get the tabs to float at the bottom */
53 padding-bottom:
1.3em;
68 <div class='main' id='main.controls'
>
70 <tr style='whitespace:collapse'
>
72 <input type='button' id='previous' value='
⇦' accesskey='a'
><input type='button' id='play' value='
▷' accesskey='s'
><input type='button' id='pause' value='
◫' accesskey='d'
><input type='button' id='stop' value='
◻' accesskey='f'
><input type='button' id='next' value='
⇨' accesskey='g'
>
75 <input type='button' id='repeat' value='
∞'
><input type='button' id='random' value='
®'
><input type='button' id='single' value='
§'
><input type='button' id='consume' value='
©'
>
80 <input type='range' id='setvol' min='
0' max='
100' value='
0'
>
83 <input type='range' id='seekcur' min='
0' max='
100' value='
0'
>
90 <td id='currtime'
></td>
95 <div class='main' id='main.options' style='display: none'
>
99 <td><input type='text' id='host'
></td>
104 <input type='number' id='port' style='width:
60px'
>
106 <input type='button' id='connect' value='connect'
>
110 <td>Refresh (sec):
</td>
112 <input type='number' id='refresh' style='width:
40px'
>
114 Sync Settings:
<input type='checkbox' id='sync' checked
>
120 <div class='main' id='main.metadata' style='display: none'
>
121 <span id='metadata.artist'
></span> -
122 <span id='metadata.album'
></span> -
123 <span id='metadata.title'
></span><br>
124 <span id='metadata.date'
></span><br><br>
125 <span id='metadata.file'
></span>
128 <div class='main' id='main.playlist' style='display: none'
>
129 <table id='playlist'
></table>
137 <td id='tab.controls' class='selected'
>Controls
</td>
138 <td id='tab.metadata'
>Metadata
</td>
139 <td id='tab.playlist'
>Playlist
</td>
140 <td id='tab.options'
>Options
</td>