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, 2005 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    <p class=mgmt>
  33     @if{@paused@}{
  34     <!-- paused -->
  35     <span class=button>
  36     <a class=button
  37     href="@url@?action=resume&#38;nonce=@nonce@&#38;mgmt=true"
  38      title="@label:playing.resumeverbose@">@label:playing.pause@</a>
  39     </a>
  40     </span>
  41     <img width=16 height=16 class=imgbutton src="@label:images.tick@">
  42     }{
  43     <!-- not paused -->
  44     <span class=button>
  45     <a class=button
  46     href="@url@?action=pause&#38;nonce=@nonce@&#38;mgmt=true"
  47      title="@label:playing.pauseverbose@">@label:playing.pause@</a>
  48     </a>
  49     </span>
  50     <img width=16 height=16 class=imgbutton src="@label:images.cross@">
  51     }@
  52     @if{@random-enabled@}{
  53     <!-- random played enabled -->
  54     <span class=button>
  55     <a class=button
  56     href="@url@?action=random-disable&#38;nonce=@nonce@&#38;mgmt=true"
  57      title="@label:playing.randomdisableverbose@">@label:playing.random@</a>
  58     </a>
  59     </span>
  60     <img width=16 height=16 class=imgbutton src="@label:images.tick@">
  61     }{
  62     <!-- random played disabled -->
  63     <span class=button>
  64     <a class=button
  65     href="@url@?action=random-enable&#38;nonce=@nonce@&#38;mgmt=true"
  66      title="@label:playing.randomenableverbose@">@label:playing.random@</a>
  67     </a>
  68     </span>
  69     <img width=16 height=16 class=imgbutton src="@label:images.cross@">
  70     }@
  71     @if{@enabled@}{
  72     <!-- playing enabled -->
  73     <span class=button>
  74     <a class=button
  75     href="@url@?action=disable&#38;nonce=@nonce@&#38;mgmt=true"
  76      title="@label:playing.disableverbose@">@label:playing.playing@</a>
  77     </a>
  78     </span>
  79     <img width=16 height=16 class=imgbutton src="@label:images.tick@">
  80     }{
  81     <!-- playing disabled -->
  82     <span class=button>
  83     <a class=button
  84     href="@url@?action=enable&#38;nonce=@nonce@&#38;mgmt=true"
  85      title="@label:playing.enableverbose@">@label:playing.playing@</a>
  86     </a>
  87     </span>
  88     <img width=16 height=16 class=imgbutton src="@label:images.cross@">
  89     }@
  90     <form class=volume action="@url@" method=POST
  91      enctype="multipart/form-data" accept-charset=utf-8>
  92     <span class=volume>
  93      @label:playing.volume@
  94      @right{volume}{<a class=imgbutton
  95       href="@url@?action=volume&#38;delta=-@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
  96       <img class=button src="@label:images.down@"
  97        alt="@label:volume.reduce@" title="@label:volume.reduceverbose@">
  98      </a>}{<img class=button src="@label:images.nodown@">}@
  99      @label:volume.left@ <input size=3 name=left type=text value="@volume:left@">
 100      @label:volume.right@ <input size=3 name=right type=text value="@volume:right@">
 101      <input name=nonce type=hidden value="@nonce@">
 102      <input name=back type=hidden value="@thisurl@?mgmt=true">
 103      @right{volume}{<button class=search name=action type=submit value=volume>
 104       @label:volume.set@
 105      </button>}@
 106      @right{volume}{<a class=imgbutton
 107       href="@url@?action=volume&#38;delta=@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
 108       <img class=button src="@label:images.up@"
 109        alt="@label:volume.increase@" title="@label:volume.increaseverbose@">
 110      </a>}{<img class=button src="@label:images.noup@">}@
 111     </form>
 112     </span>
 113    }@
 114
 115 @#{only display the table if there is something to put in it}@
 116 @if{@or{@isplaying@}{@isqueue@}@}{
 117    <table class=playing>
 118      <tr class=headings>
 119       <th class=when>@label:heading.when@</th>
 120       <th class=who>@label:heading.who@</th>
 121       <th class=artist>@label:heading.artist@</th>
 122       <th class=album>@label:heading.album@</th>
 123       <th class=title>@label:heading.title@</th>
 124       <th class=length>@label:heading.length@</th>
 125       <th class=button>&nbsp;</th>
 126       @if{@arg:mgmt@}{
 127       <th class=imgbutton>&nbsp;</th>
 128       <th class=imgbutton>&nbsp;</th>
 129       <th class=imgbutton>&nbsp;</th>
 130       <th class=imgbutton>&nbsp;</th>
 131       }@
 132      </tr>
 133      @if{@isplaying@}{
 134      <tr class=nowplaying>
 135       <td colspan=@if{@arg:mgmt@}{11}{7}@ class=nowplaying>@label:playing.now@</td>
 136      </tr>
 137      @playing{
 138      <tr class=playing>
 139       <td class=when>@when@</td>
 140       <td class=who>@if{@eq{@who@}{}@}{@if{@eq{@state@}{random}@}{@label:playing.randomtrack@}{&nbsp;}@}{@who@}@</td>
 141       <td class=artist>@right{play}{<a class=directory
 142        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@dirname{@part:path@}@}@}@"
 143        title="@label:playing.artistverbose@"
 144        >@part{short}{artist}@</a>}{<span class=directory
 145        title="@part{artist}@"
 146        >@part{short}{artist}@</span>}@</td>
 147       <td class=album>@right{play}{<a class=directory
 148        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@part:path@}@}@"
 149        title="@label:playing.albumverbose@"
 150        >@part{short}{album}@</a>}{<span class=directory
 151        title="@part{album}@"
 152        >@part{short}{album}@</span>}@</td>
 153       <td class=title><span
 154        title="@part{title}@">@part{short}{title}@</span></td>
 155       <td class=length>@length@</td>
 156       <td class=imgbutton>@if{@scratchable@}{<a class=imgbutton
 157        href="@url@?action=scratch&#38;nonce=@nonce@&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
 158        class=button src="@label:images.scratch@"
 159        title="@label:playing.scratchverbose@"
 160        alt="@label:playing.scratch@"></a>}{<img
 161        class=button src="@label:images.noscratch@"
 162        title="@label:playing.scratchverbose@"
 163        alt="@label:playing.scratch@">}@</td>
 164       @if{@arg:mgmt@}{
 165       <td class=imgbutton>&nbsp;</td>
 166       <td class=imgbutton>&nbsp;</td>
 167       <td class=imgbutton>&nbsp;</td>
 168       <td class=imgbutton>&nbsp;</td>
 169       }@
 170      </tr>
 171      }@}@
 172      @if{@isqueue@}{
 173      <tr class=next>
 174       <td colspan=@if{@arg:mgmt@}{11}{7}@ class=next>@label:playing.next@</td>
 175      </tr>
 176      @queue{
 177      <tr class=@parity@>
 178       <td class=when>@when@</td>
 179       <td class=who>@if{@eq{@who@}{}@}{@if{@eq{@state@}{random}@}{@label:queue.randomtrack@}{&nbsp;}@}{@who@}@</td>
 180       <td class=artist>@right{play}{<a class=directory
 181        title="@part{artist}@"
 182        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@dirname{@part:path@}@}@}@"
 183        >@part{short}{artist}@</a>}{<span class=directory
 184        title="@part{artist}@"
 185        >@part{short}{artist}@</span>}@</td>
 186       <td class=album>@right{play}{<a class=directory
 187        title="@part{album}@"
 188        href="@url@?action=choose&amp;directory=@urlquote{@dirname{@part:path@}@}@"
 189        >@part{short}{album}@</a>}{<span class=directory
 190        title="@part{album}@"
 191        >@part{short}{album}@}@</td>
 192       <td class=title><span
 193        title="@part{title}@">@part{short}{title}@</span></td>
 194       <td class=length>@length@</td>
 195       <td class=imgbutton>@if{@removable@}{<a class=imgbutton
 196        href="@url@?action=remove&#38;nonce=@nonce@&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
 197        class=button src="@label:images.scratch@"
 198        title="@label:playing.removeverbose@"
 199        alt="@label:playing.remove@"></a>}{<img
 200        class=button src="@label:images.noscratch@"
 201        title="@label:playing.removeverbose@"
 202        alt="@label:playing.remove@">}@</td>
 203
 204       @if{@arg:mgmt@}{
 205       @if{@or{@isfirst@}
 206              {@not{@movable@}@}@}{
 207      <!-- cannot move up -->
 208      <td class=imgbutton>
 209       <img
 210        class=button src="@label:images.noupall@"
 211        title="@label:playing.upallverbose@" alt="">
 212      <td class=imgbutton>
 213       <img
 214        class=button src="@label:images.noup@"
 215        title="@label:playing.upverbose@" alt="">
 216          }{
 217      <!-- can move up -->
 218      <td class=imgbutton>
 219       <a class=imgbutton
 220         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=2147483647&#38;mgmt=true"><img
 221        class=button src="@label:images.upall@"
 222        title="@label:playing.upallverbose@"
 223        alt="@label:playing.upall@"></a>
 224      <td class=imgbutton>
 225      <a class=imgbutton
 226         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=1&#38;mgmt=true"><img
 227        class=button src="@label:images.up@"
 228        title="@label:playing.upverbose@" alt="@label:playing.up@"></a>
 229          }@
 230
 231       @if{@or{@islast@}
 232              {@not{@movable@}@}@}{
 233      <!-- cannot move down -->
 234      <td class=imgbutton>
 235       <img
 236        class=button src="@label:images.nodownall@"
 237        title="@label:playing.downallverbose@" alt="">
 238      <td class=imgbutton>
 239       <img
 240        class=button src="@label:images.nodown@"
 241        title="@label:playing.downverbose@" alt="">
 242          }{
 243      <!-- can move down -->
 244      <td class=imgbutton>
 245       <a class=imgbutton
 246         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=-2147483647&#38;mgmt=true"><img
 247        class=button src="@label:images.downall@"
 248        title="@label:playing.downallverbose@"
 249        alt="@label:playing.downall@"></a>
 250      <td class=imgbutton>
 251      <a class=imgbutton
 252         href="@url@?action=move&#38;nonce=@nonce@&#38;id=@id@&#38;delta=-1&#38;mgmt=true"><img
 253        class=button src="@label:images.down@"
 254        title="@label:playing.downverbose@" alt="@label:playing.down@"></a>
 255          }@
 256
 257       }@
 258      </tr>
 259      }@}@
 260    </table>
 261 }@
 262
 263 @include{topbarend}@
 264  </body>
 265 </html>
 266 @@
 267 <!--
 268 Local variables:
 269 mode:sgml
 270 sgml-always-quote-attributes:nil
 271 sgml-indent-step:1
 272 sgml-indent-data:t
 273 End:
 274 -->