chiark / gitweb /
Go through CSS and rationalize it. Some cosmetic improvements too.
[disorder] / templates / playing.html
CommitLineData
460b9539 1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
2<!--
3This file is part of DisOrder.
8f9616f1 4Copyright (C) 2004-2008 Richard Kettlewell
460b9539 5
6This program is free software; you can redistribute it and/or modify
7it under the terms of the GNU General Public License as published by
8the Free Software Foundation; either version 2 of the License, or
9(at your option) any later version.
10
11This program is distributed in the hope that it will be useful, but
12WITHOUT ANY WARRANTY; without even the implied warranty of
13MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
14General Public License for more details.
15
16You should have received a copy of the GNU General Public License
17along with this program; if not, write to the Free Software
18Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307
19USA
20-->
21<html>
22 <head>
23@include:stdhead@
24 <title>@if{@isplaying@}{@playing{@part:title@}@}{@label:playing.title@}@</title>
25 </head>
26 <body>
e12da4d9 27@include{topbar}@
3225872d 28 <h1>@label:playing.title@</h1>
460b9539 29
30 @#{extra control buttons for the management page}@
31 @if{@arg:mgmt@}{
328248ba 32 <div class=mgmt>
460b9539 33 <p class=mgmt>
34 @if{@paused@}{
35 <!-- paused -->
460b9539 36 <a class=button
da68af53 37 href="@url@?action=resume&#38;mgmt=true"
460b9539 38 title="@label:playing.resumeverbose@">@label:playing.pause@</a>
39 </a>
8f9616f1 40 <img width=16 height=16 class=imgbutton src="@image:enabled@">
460b9539 41 }{
42 <!-- not paused -->
460b9539 43 <a class=button
da68af53 44 href="@url@?action=pause&#38;mgmt=true"
460b9539 45 title="@label:playing.pauseverbose@">@label:playing.pause@</a>
46 </a>
8f9616f1 47 <img width=16 height=16 class=imgbutton src="@image:disabled@">
460b9539 48 }@
49 @if{@random-enabled@}{
50 <!-- random played enabled -->
460b9539 51 <a class=button
da68af53 52 href="@url@?action=random-disable&#38;mgmt=true"
460b9539 53 title="@label:playing.randomdisableverbose@">@label:playing.random@</a>
54 </a>
8f9616f1 55 <img width=16 height=16 class=imgbutton src="@image:enabled@">
460b9539 56 }{
57 <!-- random played disabled -->
460b9539 58 <a class=button
da68af53 59 href="@url@?action=random-enable&#38;mgmt=true"
460b9539 60 title="@label:playing.randomenableverbose@">@label:playing.random@</a>
61 </a>
8f9616f1 62 <img width=16 height=16 class=imgbutton src="@image:disabled@">
460b9539 63 }@
64 @if{@enabled@}{
65 <!-- playing enabled -->
460b9539 66 <a class=button
da68af53 67 href="@url@?action=disable&#38;mgmt=true"
bf9df44a 68 title="@label:playing.disableverbose@">@label:playing.playing@</a>
460b9539 69 </a>
8f9616f1 70 <img width=16 height=16 class=imgbutton src="@image:enabled@">
460b9539 71 }{
72 <!-- playing disabled -->
460b9539 73 <a class=button
da68af53 74 href="@url@?action=enable&#38;mgmt=true"
bf9df44a 75 title="@label:playing.enableverbose@">@label:playing.playing@</a>
460b9539 76 </a>
8f9616f1 77 <img width=16 height=16 class=imgbutton src="@image:disabled@">
460b9539 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@
9bf39c4b 83 @right{volume}{<a class=imgbutton
460b9539 84 href="@url@?action=volume&#38;delta=-@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
8f9616f1 85 <img class=button src="@image:down@"
460b9539 86 alt="@label:volume.reduce@" title="@label:volume.reduceverbose@">
8f9616f1 87 </a>}{<img class=button src="@image:nodown@">}@
460b9539 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@">
460b9539 90 <input name=back type=hidden value="@thisurl@?mgmt=true">
bf9df44a 91 @right{volume}{<button class=search name=submit type=submit>
460b9539 92 @label:volume.set@
bf9df44a 93 </button><input name=action type=hidden value=volume>}@
9bf39c4b 94 @right{volume}{<a class=imgbutton
460b9539 95 href="@url@?action=volume&#38;delta=@label:volume.resolution@&#38;back=@urlquote{@thisurl@?mgmt=true}@">
8f9616f1 96 <img class=button src="@image:up@"
460b9539 97 alt="@label:volume.increase@" title="@label:volume.increaseverbose@">
8f9616f1 98 </a>}{<img class=button src="@image:noup@">}@
460b9539 99 </form>
100 </span>
328248ba 101 </p>
102 </div>
460b9539 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>
3225872d 125 <td colspan=@if{@arg:mgmt@}{11}{7}@>@label:playing.now@</td>
460b9539 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>
a31780f6 131 <td class=artist>@right{play}{<a class=directory
460b9539 132 href="@url@?action=choose&amp;directory=@urlquote{@dirname{@dirname{@part:path@}@}@}@"
a31780f6 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
460b9539 138 href="@url@?action=choose&amp;directory=@urlquote{@dirname{@part:path@}@}@"
a31780f6 139 title="@label:playing.albumverbose@"
140 >@part{short}{album}@</a>}{<span class=directory
141 title="@part{album}@"
142 >@part{short}{album}@</span>}@</td>
61507e3c
RK
143 <td class=title><span
144 title="@part{title}@">@part{short}{title}@</span></td>
460b9539 145 <td class=length>@length@</td>
146 <td class=imgbutton>@if{@scratchable@}{<a class=imgbutton
da68af53 147 href="@url@?action=scratch&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
8f9616f1 148 class=button src="@image:scratch@"
460b9539 149 title="@label:playing.scratchverbose@"
150 alt="@label:playing.scratch@"></a>}{<img
8f9616f1 151 class=button src="@image:noscratch@"
460b9539 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>
3225872d 164 <td colspan=@if{@arg:mgmt@}{11}{7}@>@label:playing.next@</td>
460b9539 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>
a31780f6 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
61507e3c 174 title="@part{artist}@"
a31780f6 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
61507e3c 180 title="@part{album}@"
a31780f6 181 >@part{short}{album}@}@</td>
61507e3c
RK
182 <td class=title><span
183 title="@part{title}@">@part{short}{title}@</span></td>
460b9539 184 <td class=length>@length@</td>
185 <td class=imgbutton>@if{@removable@}{<a class=imgbutton
da68af53 186 href="@url@?action=remove&#38;id=@id@&#38;mgmt=@arg:mgmt@"><img
8f9616f1 187 class=button src="@image:scratch@"
460b9539 188 title="@label:playing.removeverbose@"
938d8157 189 alt="@label:playing.remove@"></a>}{<img
8f9616f1 190 class=button src="@image:noscratch@"
938d8157 191 title="@label:playing.removeverbose@"
192 alt="@label:playing.remove@">}@</td>
d7ce365e 193
460b9539 194 @if{@arg:mgmt@}{
d7ce365e 195 @if{@or{@isfirst@}
196 {@not{@movable@}@}@}{
197 <!-- cannot move up -->
198 <td class=imgbutton>
460b9539 199 <img
8f9616f1 200 class=button src="@image:noupall@"
460b9539 201 title="@label:playing.upallverbose@" alt="">
202 <td class=imgbutton>
203 <img
8f9616f1 204 class=button src="@image:noup@"
d7ce365e 205 title="@label:playing.upverbose@" alt="">
206 }{
207 <!-- can move up -->
208 <td class=imgbutton>
460b9539 209 <a class=imgbutton
da68af53 210 href="@url@?action=move&#38;id=@id@&#38;delta=2147483647&#38;mgmt=true"><img
8f9616f1 211 class=button src="@image:upall@"
460b9539 212 title="@label:playing.upallverbose@"
213 alt="@label:playing.upall@"></a>
214 <td class=imgbutton>
215 <a class=imgbutton
da68af53 216 href="@url@?action=move&#38;id=@id@&#38;delta=1&#38;mgmt=true"><img
8f9616f1 217 class=button src="@image:up@"
d7ce365e 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
8f9616f1 226 class=button src="@image:nodownall@"
d7ce365e 227 title="@label:playing.downallverbose@" alt="">
228 <td class=imgbutton>
460b9539 229 <img
8f9616f1 230 class=button src="@image:nodown@"
460b9539 231 title="@label:playing.downverbose@" alt="">
d7ce365e 232 }{
233 <!-- can move down -->
460b9539 234 <td class=imgbutton>
d7ce365e 235 <a class=imgbutton
da68af53 236 href="@url@?action=move&#38;id=@id@&#38;delta=-2147483647&#38;mgmt=true"><img
8f9616f1 237 class=button src="@image:downall@"
460b9539 238 title="@label:playing.downallverbose@"
d7ce365e 239 alt="@label:playing.downall@"></a>
240 <td class=imgbutton>
241 <a class=imgbutton
da68af53 242 href="@url@?action=move&#38;id=@id@&#38;delta=-1&#38;mgmt=true"><img
8f9616f1 243 class=button src="@image:down@"
d7ce365e 244 title="@label:playing.downverbose@" alt="@label:playing.down@"></a>
245 }@
246
460b9539 247 }@
248 </tr>
249 }@}@
250 </table>
251}@
252
e12da4d9 253@include{topbarend}@
460b9539 254 </body>
255</html>
256@@
257<!--
258Local variables:
259mode:sgml
260sgml-always-quote-attributes:nil
261sgml-indent-step:1
262sgml-indent-data:t
263End:
264-->