chiark - git - mdw - disorder/blob - templates/playing.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
   2 <!--
   3 This file is part of DisOrder.
   4 Copyright (C) 2004-2008 Richard Kettlewell
   5
   6 This program is free software; you can redistribute it and/or modify
   7 it under the terms of the GNU General Public License as published by
   8 the Free Software Foundation; either version 2 of the License, or
   9 (at your option) any later version.
  10
  11 This program is distributed in the hope that it will be useful, but
  12 WITHOUT ANY WARRANTY; without even the implied warranty of
  13 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
  14 General Public License for more details.
  15
  16 You should have received a copy of the GNU General Public License
  17 along with this program; if not, write to the Free Software
  18 Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307
  19 USA
  20 -->
  21 <html>
  22  <head>
  23 @include:stdhead@
  24   <title>@if{@isplaying@}{@playing{@part:title@}@}{@label:playing.title@}@</title>
  25  </head>
  26  <body>
  27 @include{topbar}@
  28    <h1 class=title>@label:playing.title@</h1>
  29
  30    @#{extra control buttons for the management page}@
  31    @if{@arg:mgmt@}{
  32    <div class=mgmt>
  33    <p class=mgmt>
  34     @if{@paused@}{
  35     <!-- paused -->
  36     <span class=button>
  37     <a class=button
  38     href="@url@?action=resume&#38;nonce=@nonce@&#38;mgmt=true"
  39      title="@label:playing.resumeverbose@">@label:playing.pause@</a>
  40     </a>
  41     </span>
  42     <img width=16 height=16 class=imgbutton src="@image:enabled@">
  43     }{
  44     <!-- not paused -->
  45     <span class=button>
  46     <a class=button
  47     href="@url@?action=pause&#38;nonce=@nonce@&#38;mgmt=true"
  48      title="@label:playing.pauseverbose@">@label:playing.pause@</a>
  49     </a>
  50     </span>
  51     <img width=16 height=16 class=imgbutton src="@image:disabled@">
  52     }@
  53     @if{@random-enabled@}{
  54     <!-- random played enabled -->
  55     <span class=button>
  56     <a class=button
  57     href="@url@?action=random-disable&#38;nonce=@nonce@&#38;mgmt=true"
  58      title="@label:playing.randomdisableverbose@">@label:playing.random@</a>
  59     </a>
  60     </span>
  61     <img width=16 height=16 class=imgbutton src="@image:enabled@">
  62     }{
  63     <!-- random played disabled -->
  64     <span class=button>
  65     <a class=button
  66     href="@url@?action=random-enable&#38;nonce=@nonce@&#38;mgmt=true"
  67      title="@label:playing.randomenableverbose@">@label:playing.random@</a>
  68     </a>
  69     </span>
  70     <img width=16 height=16 class=imgbutton src="@image:disabled@">
  71     }@
  72     @if{@enabled@}{
  73     <!-- playing enabled -->
  74     <span class=button>
  75     <a class=button
  76     href="@url@?action=disable&#38;nonce=@nonce@&#38;mgmt=true"
  77      title="@label:playing.disableverbose@">@label:playing.playing@</a>
  78     </a>
  79     </span>
  80     <img width=16 height=16 class=imgbutton src="@image:enabled@">
  81     }{
  82     <!-- playing disabled -->
  83     <span class=button>
  84     <a class=button
  85     href="@url@?action=enable&#38;nonce=@nonce@&#38;mgmt=true"
  86      title="@label:playing.enableverbose@">@label:playing.playing@</a>
  87     </a>
  88     </span>
  89     <img width=16 height=16 class=imgbutton src="@image:disabled@">
  90     }@
  91     <form class=volume action="@url@" method=POST
  92      enctype="multipart/form-data" accept-charset=utf-8>
  93     <span class=volume>
  94      @label:playing.volume@
  95      @right{volume}{<a class=imgbutton
  96       href="@url@?action=volume&#38;delta=-@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
  97       <img class=button src="@image:down@"
  98        alt="@label:volume.reduce@" title="@label:volume.reduceverbose@">
  99      </a>}{<img class=button src="@image:nodown@">}@
 100      @label:volume.left@ <input size=3 name=left type=text value="@volume:left@">
 101      @label:volume.right@ <input size=3 name=right type=text value="@volume:right@">
 102      <input name=nonce type=hidden value="@nonce@">
 103      <input name=back type=hidden value="@thisurl@?mgmt=true">
 104      @right{volume}{<button class=search name=submit type=submit>
 105       @label:volume.set@
 106      </button><input name=action type=hidden value=volume>}@
 107      @right{volume}{<a class=imgbutton
 108       href="@url@?action=volume&#38;delta=@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
 109       <img class=button src="@image:up@"
 110        alt="@label:volume.increase@" title="@label:volume.increaseverbose@">
 111      </a>}{<img class=button src="@image:noup@">}@
 112     </form>
 113     </span>
 114     </p>
 115     </div>
 116    }@
 117
 118 @#{only display the table if there is something to put in it}@
 119 @if{@or{@isplaying@}{@isqueue@}@}{
 120    <table class=playing>
 121      <tr class=headings>
 122       <th class=when>@label:heading.when@</th>
 123       <th class=who>@label:heading.who@</th>
 124       <th class=artist>@label:heading.artist@</th>
 125       <th class=album>@label:heading.album@</th>
 126       <th class=title>@label:heading.title@</th>
 127       <th class=length>@label:heading.length@</th>
 128       <th class=button>&nbsp;</th>
 129       @if{@arg:mgmt@}{
 130       <th class=imgbutton>&nbsp;</th>
 131       <th class=imgbutton>&nbsp;</th>
 132       <th class=imgbutton>&nbsp;</th>
 133       <th class=imgbutton>&nbsp;</th>
 134       }@
 135      </tr>
 136      @if{@isplaying@}{
 137      <tr class=nowplaying>
 138       <td colspan=@if{@arg:mgmt@}{11}{7}@ class=nowplaying>@label:playing.now@</td>
 139      </tr>
 140      @playing{
 141      <tr class=playing>
 142       <td class=when>@when@</td>
 143       <td class=who>@if{@eq{@who@}{}@}{@if{@eq{@state@}{random}@}{@label:playing.randomtrack@}{&nbsp;}@}{@who@}@</td>
 144       <td class=artist>@right{play}{<a class=directory
 145        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@dirname{@part:path@}@}@}@"
 146        title="@label:playing.artistverbose@"
 147        >@part{short}{artist}@</a>}{<span class=directory
 148        title="@part{artist}@"
 149        >@part{short}{artist}@</span>}@</td>
 150       <td class=album>@right{play}{<a class=directory
 151        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@part:path@}@}@"
 152        title="@label:playing.albumverbose@"
 153        >@part{short}{album}@</a>}{<span class=directory
 154        title="@part{album}@"
 155        >@part{short}{album}@</span>}@</td>
 156       <td class=title><span
 157        title="@part{title}@">@part{short}{title}@</span></td>
 158       <td class=length>@length@</td>
 159       <td class=imgbutton>@if{@scratchable@}{<a class=imgbutton
 160        href="@url@?action=scratch&#38;nonce=@nonce@&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
 161        class=button src="@image:scratch@"
 162        title="@label:playing.scratchverbose@"
 163        alt="@label:playing.scratch@"></a>}{<img
 164        class=button src="@image:noscratch@"
 165        title="@label:playing.scratchverbose@"
 166        alt="@label:playing.scratch@">}@</td>
 167       @if{@arg:mgmt@}{
 168       <td class=imgbutton>&nbsp;</td>
 169       <td class=imgbutton>&nbsp;</td>
 170       <td class=imgbutton>&nbsp;</td>
 171       <td class=imgbutton>&nbsp;</td>
 172       }@
 173      </tr>
 174      }@}@
 175      @if{@isqueue@}{
 176      <tr class=next>
 177       <td colspan=@if{@arg:mgmt@}{11}{7}@ class=next>@label:playing.next@</td>
 178      </tr>
 179      @queue{
 180      <tr class=@parity@>
 181       <td class=when>@when@</td>
 182       <td class=who>@if{@eq{@who@}{}@}{@if{@eq{@state@}{random}@}{@label:queue.randomtrack@}{&nbsp;}@}{@who@}@</td>
 183       <td class=artist>@right{play}{<a class=directory
 184        title="@part{artist}@"
 185        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@dirname{@part:path@}@}@}@"
 186        >@part{short}{artist}@</a>}{<span class=directory
 187        title="@part{artist}@"
 188        >@part{short}{artist}@</span>}@</td>
 189       <td class=album>@right{play}{<a class=directory
 190        title="@part{album}@"
 191        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@part:path@}@}@"
 192        >@part{short}{album}@</a>}{<span class=directory
 193        title="@part{album}@"
 194        >@part{short}{album}@}@</td>
 195       <td class=title><span
 196        title="@part{title}@">@part{short}{title}@</span></td>
 197       <td class=length>@length@</td>
 198       <td class=imgbutton>@if{@removable@}{<a class=imgbutton
 199        href="@url@?action=remove&#38;nonce=@nonce@&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
 200        class=button src="@image:scratch@"
 201        title="@label:playing.removeverbose@"
 202        alt="@label:playing.remove@"></a>}{<img
 203        class=button src="@image:noscratch@"
 204        title="@label:playing.removeverbose@"
 205        alt="@label:playing.remove@">}@</td>
 206
 207       @if{@arg:mgmt@}{
 208       @if{@or{@isfirst@}
 209              {@not{@movable@}@}@}{
 210      <!-- cannot move up -->
 211      <td class=imgbutton>
 212       <img
 213        class=button src="@image:noupall@"
 214        title="@label:playing.upallverbose@" alt="">
 215      <td class=imgbutton>
 216       <img
 217        class=button src="@image:noup@"
 218        title="@label:playing.upverbose@" alt="">
 219          }{
 220      <!-- can move up -->
 221      <td class=imgbutton>
 222       <a class=imgbutton
 223         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=2147483647&#38;mgmt=true"><img
 224        class=button src="@image:upall@"
 225        title="@label:playing.upallverbose@"
 226        alt="@label:playing.upall@"></a>
 227      <td class=imgbutton>
 228      <a class=imgbutton
 229         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=1&#38;mgmt=true"><img
 230        class=button src="@image:up@"
 231        title="@label:playing.upverbose@" alt="@label:playing.up@"></a>
 232          }@
 233
 234       @if{@or{@islast@}
 235              {@not{@movable@}@}@}{
 236      <!-- cannot move down -->
 237      <td class=imgbutton>
 238       <img
 239        class=button src="@image:nodownall@"
 240        title="@label:playing.downallverbose@" alt="">
 241      <td class=imgbutton>
 242       <img
 243        class=button src="@image:nodown@"
 244        title="@label:playing.downverbose@" alt="">
 245          }{
 246      <!-- can move down -->
 247      <td class=imgbutton>
 248       <a class=imgbutton
 249         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=-2147483647&#38;mgmt=true"><img
 250        class=button src="@image:downall@"
 251        title="@label:playing.downallverbose@"
 252        alt="@label:playing.downall@"></a>
 253      <td class=imgbutton>
 254      <a class=imgbutton
 255         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=-1&#38;mgmt=true"><img
 256        class=button src="@image:down@"
 257        title="@label:playing.downverbose@" alt="@label:playing.down@"></a>
 258          }@
 259
 260       }@
 261      </tr>
 262      }@}@
 263    </table>
 264 }@
 265
 266 @include{topbarend}@
 267  </body>
 268 </html>
 269 @@
 270 <!--
 271 Local variables:
 272 mode:sgml
 273 sgml-always-quote-attributes:nil
 274 sgml-indent-step:1
 275 sgml-indent-data:t
 276 End:
 277 -->