chiark / gitweb /
Improve button appearance (slightly) in IE7
[disorder] / templates / playing.tmpl
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 @discard{
22
23   @# On/off button for pause etc
24   @#  @class should be the class: pause, random, playing
25   @#  @action should be the action to switch to the opposite state
26   @#  @state should be the current state
27   @define {onoff} {class action state}
28           {<a class=button
29               href="@url?action=@action@back"
30               title="@label{playing.@q{@action}verbose}">
31              @label{playing.@class}
32            </a>
33            <img width=@width height=@height class=imgbutton
34                 src="@image{@state}">}
35
36   @# Volume up/down buttons
37   @#  @dir is the direction: up or down
38   @#  @sign is the sign: + or -
39   @define {vbutton}{dir sign}
40           {@right{volume}
41                  {<a class=imgbutton
42                      href="@url?action=volume&#38;delta=@sign@label{volume.resolution}@back">
43                     <img class=button src="@image{@dir}"
44                          width=@width height=@height
45                          alt="@label{volume.@dir}"
46                          title="@label{volume.@q{@dir}verbose}">
47                   </a>}
48                  {<img class=button width=@width height=@height
49                        src="@image{no@dir}">}}
50
51   @# Expand to @yes for the Manage page and @no for the playing page
52   @define {ifmanage} {yes no}
53             {@if {@eq {@arg{action}}{manage}}
54                  {@yes}
55                  {@no}}
56
57   @# Expand to &back=manage or to nothing
58   @define {back} {}
59           {@ifmanage{&amp;back=manage}{}}
60 }@#
61 <html>
62  <head>
63 @quiethead
64   <title>@if{@isplaying}
65             {@playing{@part{@id}{title}}}
66             {@label{playing.title}}</title>
67  </head>
68  <body>
69 @stdmenu{@ifmanage{manage}{playing}}
70    <h1>@label{playing.title}</h1>
71
72 @# Extra control buttons for the management page
73    @ifmanage{
74    <div class=mgmt>
75      <p class=mgmt>
76        @if{@paused}
77           {@onoff{pause}{resume}{enabled}}
78           {@onoff{pause}{pause}{disabled}}
79        @if{@random-enabled}
80           {@onoff{random}{randomdisable}{enabled}}
81           {@onoff{random}{randomenable}{disabled}}
82        @if{@enabled}
83           {@onoff{playing}{disable}{enabled}}
84           {@onoff{playing}{enable}{disabled}}
85        <form class=volume method=POST
86              action="@url"
87              enctype="multipart/form-data" accept-charset=utf-8>
88          <span class=volume>
89            @label{playing.volume}
90            @vbutton{up}{+}
91            @label{volume.left}
92            <input size=3 name=left type=text value="@volume{left}">
93            @label{volume.right}
94            <input size=3 name=right type=text value="@volume{right}">
95            <input name=back type=hidden value="@quote{@thisurl}">
96            @right{volume}{
97              <button class=volume name=submit type=submit>
98                 @label{volume.set}
99              </button>
100              <input name=action type=hidden value=volume>
101            }
102            @vbutton{down}{-}
103          </span>
104        </form>
105       </p>
106     </div>
107    }{}
108
109 @# Only display the table if there is something to put in it
110 @if{@or{@isplaying}{@isqueue}}{
111    <table class=playing>
112      <tr class=headings>
113       <th class=when>@label{heading.when}</th>
114       <th class=who>@label{heading.who}</th>
115       <th class=artist>@label{heading.artist}</th>
116       <th class=album>@label{heading.album}</th>
117       <th class=title>@label{heading.title}</th>
118       <th class=length>@label{heading.length}</th>
119       <th class=button>&nbsp;</th>
120       @ifmanage{
121         <th class=imgbutton>&nbsp;</th>
122         <th class=imgbutton>&nbsp;</th>
123         <th class=imgbutton>&nbsp;</th>
124         <th class=imgbutton>&nbsp;</th>
125       }{}
126      </tr>
127      @if{@isplaying}{
128        <tr class=nowplaying>
129         <td colspan=@ifmanage{11}{7}>@label{playing.now}</td>
130        </tr>
131      }
132      @playing{
133        <tr class=playing>
134         <td class=when>@mwhen{playing}{@id}</td>
135         <td class=who>@mwho{playing}{@id}</td>
136         <td class=artist>@martist{playing}{@track}</td>
137         <td class=album>@malbum{playing}{@track}</td>
138         <td class=title>@mtitle{playing}{@track}</td>
139         <td class=length>@length{@id}</td>
140         <td class=imgbutton>@mremove{playing}{@id}</td>
141         @ifmanage{
142           <td class=imgbutton>&nbsp;</td>
143           <td class=imgbutton>&nbsp;</td>
144           <td class=imgbutton>&nbsp;</td>
145           <td class=imgbutton>&nbsp;</td>
146         }{}
147        </tr>
148      }
149      @if{@isqueue}{
150       <tr class=next>
151        <td colspan=@ifmanage{11}{7}>@label{playing.next}</td>
152       </tr>
153      }
154      @queue{
155       <tr class=@parity>
156        <td class=when>@mwhen{queue}{@id}</td>
157        <td class=who>@mwho{queue}{@id}</td>
158        <td class=artist>@martist{queue}{@track}</td>
159        <td class=album>@malbum{queue}{@track}</td>
160        <td class=title>@mtitle{queue}{@track}</td>
161        <td class=length>@length{@id}</td>
162        <td class=imgbutton>@mremove{queue}{@id}</td>
163        @ifmanage{
164          <td class=imgbutton>@mmove{@id}{upall}{2147483647}</td>
165          <td class=imgbutton>@mmove{@id}{up}{1}</td>
166          <td class=imgbutton>@mmove{@id}{down}{-1}</td>
167          <td class=imgbutton>@mmove{@id}{downall}{-2147483647}</td>
168        }{}
169       </tr>
170     }
171    </table>
172 }
173
174 @credits
175  </body>
176 </html>
177 @discard{
178 Local variables:
179 mode:sgml
180 sgml-always-quote-attributes:nil
181 sgml-indent-step:1
182 sgml-indent-data:t
183 indent-tabs-mode:nil
184 End:
185 }@#