Changed web UI to a spiffier Firefly one.

This closes ticket #135 #52 and 3) of ticket #143
Temporary removed experimental section (playlist.html and
the daap java player)
This commit is contained in:
Anders Betnér 2006-06-14 20:27:16 +00:00
parent 97328767d8
commit 74f95473cb
10 changed files with 151 additions and 119 deletions

View File

@ -5,7 +5,7 @@ SUBDIRS=lib-js
adminrootdir = ${pkgdatadir}/admin-root
adminroot_DATA = ftr.html linkOpaque.gif status.html aspl-license.txt \
gpl-license.txt linkTransparent.gif config-update.html hdr.html \
mt-daapd.css ff_logo_182.gif config.html index.html required.gif \
mt-daapd.css ff_logo_sm.gif config.html index.html required.gif \
gpl-license.html aspl-license.html thanks.html feedback.html \
playlist.html playlist.js smart.html smart.js DAAPApplet-0.1.jar \
smartpopup.html applet.html mt-daapd.js CREDITS status.js \
@ -13,7 +13,7 @@ adminroot_DATA = ftr.html linkOpaque.gif status.html aspl-license.txt \
EXTRA_DIST = ftr.html linkOpaque.gif status.html aspl-license.txt \
gpl-license.txt linkTransparent.gif config-update.html hdr.html \
mt-daapd.css ff_logo_182.gif config.html index.html required.gif \
mt-daapd.css ff_logo_sm.gif config.html index.html required.gif \
gpl-license.html aspl-license.html thanks.html feedback.html \
playlist.html playlist.js smart.html smart.js DAAPApplet-0.1.jar \
smartpopup.html applet.html mt-daapd.js CREDITS status.js \

View File

@ -36,17 +36,9 @@ select {
background-color: yellow;
}
</style>
<h1>Configuration</h1>
<p class="description">
<!-- Note that the following fields will only be editable if the
configuration file itself is writable by the mt-daapd server. If you
make changes to these settings, they will not be reflected in the
running server. The server must be restarted for these values to
take effect.-->
This is still in beta, but it seems to work. Go ahead and give it a spin.</p>
<h1>Configuration</span></h1><span id="toggle_basic_advanced"></span>
<div id="config_not_writable_warning" style="display: none;">Your config file is not writable, you can not change anything using this webpage</div>
<div id="toggle_basic_advanced"></div>
<form id="theform" method="get" action="#">
</form>
<div id="buttons"></div>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.1 KiB

BIN
admin-root/ff_logo_sm.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1,3 +1,3 @@
</td></tr></table>
</body></html>
</div> <!-- end of id="content" -->
</body>
</html>

View File

@ -22,40 +22,48 @@
</head>
<body @ispage smart.html:onload="init()":@>
<table class="main" border="0" width="100%" summary="Main navigation"><tr>
<td class="navi">
<div id="firefly_head">
<a href="http://www.fireflymediaserver.org/" title="link to project home">
<img src="ff_logo_182.gif" width="182" height="47" alt="mt-daap logo"/>
<img src="ff_logo_sm.gif" width="136" height="36" alt="firefly logo"/>
</a>
<div class="ministatus">Version @VERSION@</div>
<div class="naviheader">Welcome, @user@</div>
<div class="navibox">
<div class="navilink"><a class="@ispage index.html:naviselected:navi@" href="index.html">home</a></div>
<div class="navilink"><a class="@ispage config.html:naviselected:navi@" href="config.html">config</a></div>
<div class="navilink"><a class="@ispage status.html:naviselected:navi@" href="status.html">status</a></div>
<div class="navilink"><a class="@ispage smart.html:naviselected:navi@" href="smart.html">smart</a></div>
<!-- <div class="navilink"><a class="@ispage feedback.html:naviselected:navi@" href="feedback.html">feedback</a></div> -->
<div class="navilink"><a class="@ispage thanks.html:naviselected:navi@" href="thanks.html">thanks</a></div>
<!-- <div class="ministatus">Version @VERSION@</div>-->
</div>
<div id="tagline">
The best open-source media server for the <a href="http://www.rokulabs.com">Roku SoundBridge</a> and iTunes
</div>
<div id="navigation">
<ul>
<li><a @ispage index.html:class="naviselected":@ href="index.html">home</a></li>
<li><a @ispage config.html:class="naviselected":@ href="config.html">configuration</a></li>
<li><a @ispage status.html:class="naviselected":@ href="status.html">server status</a></li>
<li><a @ispage smart.html:class="naviselected":@ href="smart.html">smart playlists</a></li>
<!-- <li><a @ispage feedback.html:class="naviselected":@ href="feedback.html">feedback</a></li> -->
<li><a class="@ispage thanks.html:naviselected:navi@" href="thanks.html">thanks</a></li>
<li></li>
</ul>
<div class="links">
<a class="@ispage gpl-license.html:naviselected:navi@" href="gpl-license.html">GPL license</a><br />
<a class="@ispage aspl-license.html:naviselected:navi@" href="aspl-license.html">ASPL license</a><br />
</div>
<div class="links">
<b>Links</b><br />
<a href="http://www.fireflymediaserver.org/">firefly homepage</a><br />
<a href="http://svn.sourceforge.net/viewcvs.cgi/mt-daapd/">firefly source code</a><br />
</div>
</div>
<!--
<div class="naviheader">Experimental</div>
<div class="navibox">
<div class="navilink"><a class="@ispage playlist.html:naviselected:navi@" href="playlist.html">playlist</a></div>
<div class="navilink"><a class="@ispage playlist.html:naviselected:navi@" href="playlist.html">playlists</a></div>
<div class="navilink"><a class="@ispage applet.html:naviselected:navi@" href="applet.html">applet</a></div>
</div>
-->
<div class="naviheader">Links</div>
<div class="navibox">
<div class="navilink"><a class="navi"
href="http://www.fireflymediaserver.org/">firefly home</a></div>
<div class="navilink"><a class="navi" href="http://svn.sourceforge.net/viewcvs.cgi/mt-daapd/">source code</a></div>
<div class="navilink"><a class="@ispage gpl-license.html:naviselected:navi@" href="gpl-license.html">GPL license</a></div>
<div class="navilink"><a class="@ispage aspl-license.html:naviselected:navi@" href="aspl-license.html">ASPL license</a></div>
</div>
<!-- <div id="session_count" class="ministatus">@session-count@ Connected Users</div>-->
<div id="session_count" class="ministatus">@session-count@ Connected Users</div>
</td><td class="main">
<div id="content">

View File

@ -1,13 +1,13 @@
@include hdr.html@
<div style="width: 50em;">
<h1>Welcome</h1>
<p class="description">
<p>
This is the administrative web interface for the Firefly Media Server,
version @version@.
</p>
<h3>About</h3>
<p class="description">
<p>
Firefly is an open-source media server for the Roku SoundBridge and
Apple iTunes. It runs on POSIX platforms as well as Win32. It supports
server-side transcoding and other advanced features. While every effort
@ -22,7 +22,7 @@ licensing of this software.
</p>
<h3>Legal Info</h3>
<p class="description">
<p>
Portions of this program are Copyright &copy;
1999-2001 Apple Computer, Inc. All Rights Reserved. See the link
labeled <a href="aspl-license.html">ASPL License</a> for more information.
@ -40,5 +40,5 @@ TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE
PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
REPAIR OR CORRECTION.
</p>
</div>
@include ftr.html@

View File

@ -1,9 +1,11 @@
/* General */
body
{ background: #DEE7EC;
{ background: #ffffff;
font: 0.7em Verdana, Helvetica, Arial, sans-serif;
color: #3C5C6B;
color: #000000;
margin: 0;
padding: 0;
}
img
@ -14,24 +16,10 @@ table.main
{ border: 0px;
}
div.ministatus
/*div.ministatus
{ text-align: center;
margin: 1em 0em 1em 0em;
}
td.navi
{ vertical-align: top;
text-align: left;
border: 0px;
width: 182px;
}
td.main
{ vertical-align: top;
text-align: left;
padding: 0em 0em 0em 2em;
border: 0px;
}
}*/
a
{ color: blue;
@ -44,47 +32,32 @@ a:hover
}
/* Navigation */
div.naviheader
{ background: #8CACBB;
color: #DEE7EC;
div.naviheader {
background-color: #A3C1E8;
padding: 0.5em 0em 0.5em 1em;
margin: 1em 0em 0em 0em;
font-weight: bold;
border-color: #A3C1E8;
border-style: solid;
border-width: 1px 1px 0 1px;
}
div.navibox
{ border: 1px solid #8CACBB;
padding: 0.5em 0em 0.5em 0em;
{ padding: 0.5em 0em 0.5em 0em;
margin: 0em 0em 1em 0em;
border-color: #A3C1E8;
border-style: solid;
border-width: 0 1px 1px 1px;
background-color: #f0f0f0;
}
div.navilink
{ padding: 0.1em 0.1em 0.1em 1.1em;
}
div.navilink:hover
{ background: #FFFFFF;
}
a.navi,a.navi:visited,a.naviselected
{ text-decoration: none;
color: #3C5C6B;
}
a.naviselected
{ font-weight: bold;
}
/* Main */
h1,h2,h3
{ border-bottom: 1px solid #8CACBB;
{ border-bottom: 1px solid #A3C1E8;
}
p.description
{
}
p.license
{ text-align: justify;
@ -102,13 +75,13 @@ pre
}
.playlistfield
{ border: 0px solid black;
padding: 4px 0px 4px 0.5em;
{ border: 1px solid grey;
/* padding: 4px 0px 4px 0.5em;*/
width: 300px;
}
textarea.text
{ border: 0px solid black;
{ border: 1px solid grey;
padding: 4px 0px 4px 0.5em;
}
@ -149,7 +122,7 @@ td.submit
}
table
{ border: 1px solid #8CACBB;
{ border: 1px solid #A3C1E8;
border-spacing: 0px;
border-collapse: collapse;
}
@ -157,8 +130,8 @@ table
th
{ font-weight: bold;
text-align: right;
background: #8CACBB;
color: #DEE7EC;
background: #A3C1E8;
color: #000000;
}
td
@ -171,7 +144,69 @@ td.text
{ text-align: left;
}
li
{ padding-bottom: 0.5em;
#navigation {
float: left;/*74A8F5*/
background-color: #A3C1E8;
padding-top: 3em;
height: 500px;
}
#navigation ul {
padding: 0;
margin: 0;
}
#navigation li {
padding: 0;
margin: 0;
list-style-type: none;
}
#navigation li a {
font-size: 120%;
display: block;
width: 12em;
text-decoration:none;
color: #000000;
padding: 2px 0.5em 2px 0.5em;
border-color: #ffffff;
border-width: 1px 0 1px 0;
border-style: solid;
}
#navigation li a:hover {
background-color: #F2BB73;
color: #000000;
/* border: 1px solid #F47D24;*/
}
#navigation li a.naviselected {
background-color: #ffffff;
}
.links {
padding-top: 1em;
padding-left: .5em;
}
#content {
float: left;
margin-left: 3em;
}
#tagline {
padding: 0.25em 0 0.25em 0.5em;
border-color: #F47D24;
border-style: solid;
border-width: 1px 0 1px 0;
background-color: #F2BB73
}
#firefly_head {
background-color: #f0f0f0;
padding-top: 4px;
padding-left: .5em;
}
#pl_editor label {
float: left;
width: 7em;
font: icon;
padding-top: .3em;
padding-left: 1em;
}
/ * Config.html */
#toggle_basic_advanced {
font: icon !important;
margin-left: 30em;
}

View File

@ -10,28 +10,25 @@
<div id="pl_data">
</div>
<div id="pl_editor" style="display:none">
<h2>Please specify new playlist</h2>
<div id="pl_editor" style="display: none;">
<div class="naviheader">
New playlist
</div>
<div class="navibox">
<form name="pl_form" action="">
<div>
<input type="hidden" name="playlist_id"/>
<table width="400">
<tr>
<th>New playlist</th>
<th>
<label for="playlist_name">Name</label>
<input id="playlist_name" class="playlistfield" type="text" name="playlist_name" />
<br />
<label for="playlist_spec">Playlist criteria</label>
<textarea id="playlist_spec" class="playlistfield" rows="5" name="playlist_spec"></textarea>
<br />
<input type="button" onclick="javascript:pl_update();" name="submit_button" value="Submit"/>
<input type="button" onclick="javascript:pl_cancel();" value="Cancel"/>
<input type="button" onclick="javascript:popUp('smartpopup.html');" value="Wizard"/>
</th>
<tr>
<td>Name</td>
<td><input class="playlistfield" type="text" name="playlist_name"/></td>
</tr>
<tr>
<td>Playlist criteria</td>
<td><textarea class="playlistfield" rows="5" name="playlist_spec"></textarea></td>
</tr>
</table>
</div>
</form>
</div>

View File

@ -157,7 +157,7 @@ Section "MainSection" SEC01
File "${ADMIN_ROOT}\required.gif"
File "${ADMIN_ROOT}\playlist.js"
File "${ADMIN_ROOT}\playlist.html"
File "${ADMIN_ROOT}\ff_logo_182.gif"
File "${ADMIN_ROOT}\ff_logo_sm.gif"
File "${ADMIN_ROOT}\mt-daapd.js"
File "${ADMIN_ROOT}\mt-daapd.css"
File "${ADMIN_ROOT}\linkTransparent.gif"
@ -483,7 +483,7 @@ Section Uninstall
Delete "$INSTDIR\admin-root\linkTransparent.gif"
Delete "$INSTDIR\admin-root\mt-daapd.css"
Delete "$INSTDIR\admin-root\mt-daapd.js"
Delete "$INSTDIR\admin-root\ff_logo_182.gif"
Delete "$INSTDIR\admin-root\ff_logo_sm.gif"
Delete "$INSTDIR\admin-root\playlist.html"
Delete "$INSTDIR\admin-root\playlist.js"
Delete "$INSTDIR\admin-root\required.gif"