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