width: 100%;
}
-#playctl form fieldset {
+form.playctl fieldset {
display: block;
position: relative;
width: 100%;
border: none;
text-align: center;
}
-#playctl form fieldset.playback { height: 12em; }
-#playctl form fieldset.playback button {
+form.playctl fieldset.playback { height: 12em; }
+form.playctl fieldset.playback button {
position: absolute;
height: 6em;
padding-top: 1em;
background-color: #EEE;
border: 1px solid #333;
}
-#playctl form fieldset.playback button[value="-60"] {top: 6em; left: 0; width: 20%;}
-#playctl form fieldset.playback button[value="-10"] {top: 6em; left: 20%; width: 30%;}
-#playctl form fieldset.playback button[value="stop"] {top: 0; left: 0; width: 40%;}
-#playctl form fieldset.playback button[value="pause"] {top: 0; right: 0; width: 60%;}
-#playctl form fieldset.playback button[value="+10"] {top: 6em; right: 20%; width: 30%;}
-#playctl form fieldset.playback button[value="+60"] {top: 6em; right: 0; width: 20%;}
-
-#playctl form fieldset.volume { height: 7em; }
-#playctl form fieldset.volume button[name="amp"] {position: absolute; width: 50%; height: 4em; top: 0;}
-#playctl form fieldset.volume button[value="off"] {left:0;}
-#playctl form fieldset.volume button[value="on"] {right:0;}
-#playctl form fieldset.volume button[name="vol"] {position: relative; display: inline-block; top: 5em; width: 4%;}
-#playctl form fieldset.volume button[name="vol"].selected { background-color: #FA6;}
-#playctl form fieldset.volume button[name="vol"][value="100"],
-#playctl form fieldset.volume button[name="vol"][value="0"] { width: 4%;}
+form.playctl fieldset.playback button[value="-60"] {top: 6em; left: 0; width: 20%;}
+form.playctl fieldset.playback button[value="-10"] {top: 6em; left: 20%; width: 30%;}
+form.playctl fieldset.playback button[value="stop"] {top: 0; left: 0; width: 40%;}
+form.playctl fieldset.playback button[value="pause"] {top: 0; right: 0; width: 60%;}
+form.playctl fieldset.playback button[value="+10"] {top: 6em; right: 20%; width: 30%;}
+form.playctl fieldset.playback button[value="+60"] {top: 6em; right: 0; width: 20%;}
+
+form.playctl fieldset.volume { height: 3em; }
+form#advctl.playctl fieldset.volume { height: 4em; }
+form.playctl fieldset.volume button[name="amp"] {position: absolute; width: 50%; height: 4em; top: 0;}
+form.playctl fieldset.volume button[value="off"] {left:0;}
+form.playctl fieldset.volume button[value="on"] {right:0;}
+form.playctl fieldset.volume button[name="vol"] {position: relative; display: inline-block; width: 4%;}
+form.playctl fieldset.volume button[name="vol"].selected { background-color: #FA6;}
+form.playctl fieldset.volume button[name="vol"][value="100"],
+form.playctl fieldset.volume button[name="vol"][value="0"] { width: 4%;}
+form.playctl fieldset.pasink button { width: 100%; height: 3em;}
span.progress {
display: block;
<h1>$info</h1>
<a href="$video">Download</a>
- <form action="?action=playctl" method="post">
- <fieldset class="playback">
- <button type="submit" name="seek" value="-60"><<<</button>
- <button type="submit" name="seek" value="-10"><<</button>
- <button type="submit" name="ctl" value="stop">■</button>
- <button type="submit" name="ctl" value="pause">|| / ▶</button>
- <button type="submit" name="seek" value="+10">>></button>
- <button type="submit" name="seek" value="+60">>>></button>
- </fieldset>
- <fieldset class="volume">
- <button type="submit" name="amp" value="off">Amp Off</button>
- <button type="submit" name="amp" value="on">Amp On</button>
- $(for n in $(seq 0 5 100); do
- printf '<button class="%s" type="submit" name="vol" value="%s"> </button>' "$([ "$volume" = "$n" ] && printf selected)" "$n"
- done)
- </fieldset>
+ <form action="?action=playctl" method="post" class="playctl">
+ <fieldset class="playback">
+ <button type="submit" name="seek" value="-60"><<<</button>
+ <button type="submit" name="seek" value="-10"><<</button>
+ <button type="submit" name="ctl" value="stop">■</button>
+ <button type="submit" name="ctl" value="pause">|| / ▶</button>
+ <button type="submit" name="seek" value="+10">>></button>
+ <button type="submit" name="seek" value="+60">>>></button>
+ </fieldset>
+ <fieldset class="volume">
+ $(for n in $(seq 0 5 100); do
+ printf '<button class="%s" type="submit" name="vol" value="%s"> </button>' "$([ "$volume" = "$n" ] && printf selected)" "$n"
+ done)
+ </fieldset>
</form>
<span class="info length">$(printf "%d:%02d min" $(($length / 60)) $(($length % 60)) )</span>
$(printf %s\\n "$tags" |sed -r 's:\|*([^|]+)\|*:<span class="info tag">\1</span> :g')
${description:+<span class="info description">$(printf %s "$description" |_wiki)</span>}
+</div>
- <form class="panel" id="tagger" action="?action=meta&${page_this}" method="post" accept-charset="UTF-8">
- <input type="hidden" name="length" value="$length">
- <input type="hidden" name="width" value="$width">
- <input type="hidden" name="height" value="$height">
-
- $(
- for cat in $(list_categories); do
- printf '<p class="newtag"><label class="category">%s:</label><select name="tag" size="12" multiple>' "${cat}"
- catt="${cat}:"
- [ "$catt" = "none:" ] && catt=''
-
- printf %s "$taglist_set" |egrep '^'"$catt"'[^:]+$' |while read line; do
- printf '<option %s value="%s">%s</option>' \
- "$(egrep -q "(^|.*\|)$line(\|.*|$)" "$meta" && printf selected)" \
- "$line" "${line#*:}"
- done
- printf '</select></p>'
- done
- )
+<form class="panel playctl" id="advctl" action="?action=playctl" method="post">
+ <fieldset class="volume">
+ <button type="submit" name="amp" value="off">Amp Off</button>
+ <button type="submit" name="amp" value="on">Amp On</button>
+ </fieldset>
+ <fieldset class="pasink">
+ $(pa_sinks |while read no name; do
+ printf '<button type="submit" name="pasink" value="%s">%s</button>' "$no" "$name"
+ done)
+ </fieldset>
+ <a class="panel toggle" href="#foot">Hide</a>
+</form>
- <p class="newtag additional">
- <label class="additional">Additional Tags (one per line):</label>
- <textarea name="tags" rows="4"></textarea>
- </p>
- <p class="newtag description">
- <label class="description">Description:</label>
- <textarea name="description" rows="4">$description</textarea>
- </p>
- <input type="submit" value="Edit!">
- <input type="submit" name="trash" value="Delete Video">
+<form class="panel" id="tagger" action="?action=meta&${page_this}" method="post" accept-charset="UTF-8">
+ <input type="hidden" name="length" value="$length">
+ <input type="hidden" name="width" value="$width">
+ <input type="hidden" name="height" value="$height">
- <a class="panel toggle" href="#foot">Hide</a>
+ $(
+ for cat in $(list_categories); do
+ printf '<p class="newtag"><label class="category">%s:</label><select name="tag" size="12" multiple>' "${cat}"
+ catt="${cat}:"
+ [ "$catt" = "none:" ] && catt=''
+
+ printf %s "$taglist_set" |egrep '^'"$catt"'[^:]+$' |while read line; do
+ printf '<option %s value="%s">%s</option>' \
+ "$(egrep -q "(^|.*\|)$line(\|.*|$)" "$meta" && printf selected)" \
+ "$line" "${line#*:}"
+ done
+ printf '</select></p>'
+ done
+ )
- </form>
-</div>
+ <p class="newtag additional">
+ <label class="additional">Additional Tags (one per line):</label>
+ <textarea name="tags" rows="4"></textarea>
+ </p>
+ <p class="newtag description">
+ <label class="description">Description:</label>
+ <textarea name="description" rows="4">$description</textarea>
+ </p>
+ <input type="submit" value="Edit!">
+ <input type="submit" name="trash" value="Delete Video">
+
+ <a class="panel toggle" href="#foot">Hide</a>
+</form>
<div class="panel footer" id="foot">
<a class="panel toggle" href="#tagger">Edit Tags</a>
+ <a class="panel toggle" href="#advctl">More</a>
</div>
+
<span class="progress">
EOF