diff --git a/data/css/style.css b/data/css/style.css index a3524c0e..b2d5be9b 100755 --- a/data/css/style.css +++ b/data/css/style.css @@ -179,6 +179,8 @@ h2 { font-size: 13px; color: #FFF; text-decoration: none;} h3 { font-size: 12px; color: #FFF; text-decoration: none;} h4 { font-size: 10px; color: #FFF; text-decoration: none;} +p { margin-top: 8px; margin-bottom: 8px; } + p.indented { margin-top: 20px; margin-bottom: 20px; font-size: 12px; } p.center { text-align: center; font-size: 18px; } .smalltext2 { font-size: 12px; margin-left: 45px; } @@ -529,7 +531,38 @@ text-shadow: 1px 1px 0px rgb(87,160,0); } .table_wrapper { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 100%; background-color: #313131; position: relative; min-height: 50px; clear: both; _height: 302px; zoom: 1; } -/*All inputs in the main content +/*All inputs in the main content */ + +.checkbox, +.radio { + width: 19px; + height: 25px; + padding: 0 5px 0 0; + background: url(../images/checkbox.png) no-repeat; + display: block; + clear: left; + float: left; +} + +.radio +{ + background: url(../images/radio.png) no-repeat; +} + +.select{ + position: absolute; + width: 158px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ + height: 21px; + padding: 0 24px 0 8px; + color: #000; + font-weight: bold; + text-shadow: 1px 1px 0px rgb(170,170,170); + font-size: 12px/21px; + line-height: 19px; + background: url(../images/select.png) no-repeat; + overflow: hidden; + background-color: #272727; +} /*Tooltip*/ .tooltip @@ -586,8 +619,8 @@ text-shadow: 1px 1px 0px rgb(87,160,0); background-image: -ms-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); } -form input[type="radio"], -form input[type='submit'] +.submit, +input[type="submit"] { border: 1px solid #000; border-radius: 3px; @@ -595,12 +628,14 @@ form input[type='submit'] font-weight: bold; padding: 3px 6px 3px 6px; background-image: linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); -background-image: -o-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); -background-image: -moz-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); -background-image: -webkit-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); -background-image: -ms-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); -text-shadow: 1px 1px 0px rgb(180,180,180); + background-image: -o-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); + background-image: -moz-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); + background-image: -webkit-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); + background-image: -ms-linear-gradient(bottom, rgb(117,117,117) 0%, rgb(156,156,156) 100%); + text-shadow: 1px 1px 0px rgb(180,180,180); } +.text-pass, +.text-field, input[type="password"], input[type="text"] { diff --git a/data/images/checkbox.png b/data/images/checkbox.png new file mode 100644 index 00000000..53e596bf Binary files /dev/null and b/data/images/checkbox.png differ diff --git a/data/images/radio.png b/data/images/radio.png new file mode 100644 index 00000000..92ea75d9 Binary files /dev/null and b/data/images/radio.png differ diff --git a/data/images/select.png b/data/images/select.png new file mode 100644 index 00000000..b6adfef7 Binary files /dev/null and b/data/images/select.png differ diff --git a/data/interfaces/default/base.html b/data/interfaces/default/base.html index a8dfda8f..7851fb39 100755 --- a/data/interfaces/default/base.html +++ b/data/interfaces/default/base.html @@ -31,7 +31,9 @@ - + + + @@ -85,7 +87,7 @@ - +
diff --git a/data/interfaces/default/config.html b/data/interfaces/default/config.html index 8f84b0d2..c9dd37e5 100644 --- a/data/interfaces/default/config.html +++ b/data/interfaces/default/config.html @@ -40,14 +40,19 @@ -

HTTP Password:

- +

+

HTTP Password:

+ +

-

Launch Browser on Startup:

+

+ Launch Browser on Startup: + +

@@ -102,7 +107,10 @@ -

Use Black Hole:

+

+ Use Black Hole: + +

@@ -115,7 +123,9 @@ -

Usenet Retention:

+

Usenet Retention: + +

@@ -146,8 +156,12 @@

Music Download Directory:

-
Full path to the directory where your torrent client downloads your music - i.e. /Users/name/Downloads/music
+
+ + Full path to the directory where your torrent client downloads your music + i.e. /Users/name/Downloads/music + +
@@ -164,7 +178,9 @@ -

NZBMatrix:

+

NZBMatrix: + +

@@ -180,7 +196,9 @@ -

Newznab:

+

Newznab: + +

@@ -197,7 +215,9 @@ -

NZBs.org:

+

NZBs.org: + +

@@ -217,7 +237,9 @@ -

Newzbin:

+

Newzbin: + +

@@ -241,17 +263,25 @@ -

Isohunt:


+

Isohunt: + +

+
-

Mininova:


+

Mininova: + +

+
-

Kick Ass Torrents:

+

Kick Ass Torrents: + +

@@ -261,24 +291,60 @@ - @@ -286,8 +352,11 @@
+

Album Quality:


-

Highest Quality excluding Lossless

-

Highest Quality including Lossless

-

Lossless Only

-

Preferred Bitrate: - kbps

- Auto-Detect Preferred Bitrate +

+ + Highest Quality excluding Lossless +

+

+ + Highest Quality including Lossless +

+

+ + Lossless Only +

+

+ + Preferred Bitrate: + kbps +

+

+ + Auto-Detect Preferred Bitrate +

Post-Processing:

-

Move downloads to Destination Folder

-

Rename files

-

Correct metadata

-

Delete leftover files (.m3u, .nfo, .sfv, .nzb, etc.)

-

Add album art as 'folder.jpg' to album folder

-

Embed album art in each file

-

Embed lyrics

+

+ + Move downloads to Destination Folder +

+

+ + Rename files +

+

+ + Correct metadata +

+

+ + Delete leftover files (.m3u, .nfo, .sfv, .nzb, etc.) +

+

+ + Add album art as 'folder.jpg' to album folder +

+

+ + Embed album art in each file +

+

+ + Embed lyrics +


-

Path to Destination folder:

-
+

+ Path to Destination folder: +

+ +
i.e. /Users/name/Music/iTunes or /Volumes/share/music @@ -304,20 +373,39 @@

Renaming Options:


-

Folder Format:

-
Use: artist, album, year, releasetype and first (first letter in artist name) - E.g.: first/artist/album [year] = G/Girl Talk/All Day [2010]
+

+ Folder Format: +

+ +
+ + Use: artist, album, year, releasetype and first (first letter in artist name) + E.g.: first/artist/album [year] = G/Girl Talk/All Day [2010] + +


-

File Format:

-
Use: tracknumber, title, artist, album and year
+

+ File Format: +

+ +
+ + Use: tracknumber, title, artist, album and year + +

Miscellaneous:


-

Automatically Include Extras When Adding an Artist

+

+ + Automatically Include Extras When Adding an Artist +

(EPs, Compilations, Live Albums, Remix Albums and Singles)


-

Interface: +

%for interface in config['interface_list']: <% if interface == headphones.INTERFACE: @@ -329,34 +417,46 @@ %endfor

-

Log Directory:

+

Log Directory:

+
-

Re-Encoding Options:

-
Note: this option requires the lame or ffmpeg encoder
-
-

Re-encode downloads during postprocessing

-
-
-

Only re-encode lossless files (.flac)

+
+ + Note: this option requires the lame or ffmpeg encoder + +
+

Re-Encoding Options:

+
- <% - if config['encoder'] == 'lame': - lameselect = 'selected="selected"' - ffmpegselect = '' - else: - lameselect = '' - ffmpegselect = 'selected="selected"' - %> -

Encoder: +

+ + Re-encode downloads during postprocessing +

+
+
+

+ + Only re-encode lossless files (.flac) +

+
+ <% + if config['encoder'] == 'lame': + lameselect = 'selected="selected"' + ffmpegselect = '' + else: + lameselect = '' + ffmpegselect = 'selected="selected"' + %> +

Encoder: - Format: + %for x in ['mp3', 'ogg', 'm4a']: <% if config['encoderoutputformat'] == x: outputselect = 'selected' @@ -364,25 +464,30 @@ outputselect = '' %> - %endfor -

-
+ %endfor + +

+
-

Audio Properties:

-
-

VBR/CBR: +

+ Audio Properties: +

+
+

+ VBR/CBR: + - Quality: %for x in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]: <% if config['encoderquality'] == x: @@ -395,7 +500,7 @@


-

Bitrate: %for x in [64, 128, 192, 256, 320]: <% if config["bitrate"] == x: @@ -415,7 +520,7 @@ freq44100 = '' freq48000 = 'selected="selected"' %> - Sampling:

@@ -431,18 +536,33 @@
-

Prowl Notification:


-

Enable Prowl Notifications


+

+ Prowl Notification: +

+

+ + Enable Prowl Notifications +

-

API key:



-

Notify on snatch?


-

Priority (-2,-1,0,1 or 2):

+

+ API key: +

+

+

+ + Notify on snatch? +

+
+

+ Priority (-2,-1,0,1 or 2): +

+
-

Muscbrainz Mirror:

%for mirror in config['mirror_list']: <% if mirror == headphones.MIRROR: @@ -454,14 +574,16 @@ else: mirrortext = '' %> - + %endfor

-


- (Web Interface changes require a restart to take effect) +

+ +
+ (Web Interface changes require a restart to take effect)

diff --git a/data/interfaces/default/manage.html b/data/interfaces/default/manage.html index 9956d5ee..098c530a 100644 --- a/data/interfaces/default/manage.html +++ b/data/interfaces/default/manage.html @@ -19,6 +19,10 @@

Scan Music Library


Where do you keep your music?

+

+
+ %if headphones.MUSIC_DIR: +
You can put in any directory, and it will scan for audio files in that folder @@ -26,17 +30,19 @@ For example: '/Users/name/Music'
-

-

- - %if headphones.MUSIC_DIR: - %else: - + +
+ + You can put in any directory, and it will scan for audio files in that folder + (including all subdirectories)
+ For example: '/Users/name/Music' + +
%endif

- Automatically add new artists + Automatically add new artists

diff --git a/data/js/custom-form-elements.js b/data/js/custom-form-elements.js new file mode 100644 index 00000000..aa349e3f --- /dev/null +++ b/data/js/custom-form-elements.js @@ -0,0 +1,144 @@ +/* + +CUSTOM FORM ELEMENTS + +Created by Ryan Fait +www.ryanfait.com + +The only things you may need to change in this file are the following +variables: checkboxHeight, radioHeight and selectWidth (lines 24, 25, 26) + +The numbers you set for checkboxHeight and radioHeight should be one quarter +of the total height of the image want to use for checkboxes and radio +buttons. Both images should contain the four stages of both inputs stacked +on top of each other in this order: unchecked, unchecked-clicked, checked, +checked-clicked. + +You may need to adjust your images a bit if there is a slight vertical +movement during the different stages of the button activation. + +The value of selectWidth should be the width of your select list image. + +Visit http://ryanfait.com/ for more information. + +*/ + +var checkboxHeight = "25"; +var radioHeight = "25"; +var selectWidth = "190"; + + +/* No need to change anything after this */ + + +document.write(''); + +var Custom = { + init: function() { + var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active; + for(a = 0; a < inputs.length; a++) { + if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") { + span[a] = document.createElement("span"); + span[a].className = inputs[a].type; + + if(inputs[a].checked == true) { + if(inputs[a].type == "checkbox") { + position = "0 -" + (checkboxHeight*2) + "px"; + span[a].style.backgroundPosition = position; + } else { + position = "0 -" + (radioHeight*2) + "px"; + span[a].style.backgroundPosition = position; + } + } + inputs[a].parentNode.insertBefore(span[a], inputs[a]); + inputs[a].onchange = Custom.clear; + if(!inputs[a].getAttribute("disabled")) { + span[a].onmousedown = Custom.pushed; + span[a].onmouseup = Custom.check; + } else { + span[a].className = span[a].className += " disabled"; + } + } + } + inputs = document.getElementsByTagName("select"); + for(a = 0; a < inputs.length; a++) { + if(inputs[a].className == "styled") { + option = inputs[a].getElementsByTagName("option"); + active = option[0].childNodes[0].nodeValue; + textnode = document.createTextNode(active); + for(b = 0; b < option.length; b++) { + if(option[b].selected == true) { + textnode = document.createTextNode(option[b].childNodes[0].nodeValue); + } + } + span[a] = document.createElement("span"); + span[a].className = "select"; + span[a].id = "select" + inputs[a].name; + span[a].appendChild(textnode); + inputs[a].parentNode.insertBefore(span[a], inputs[a]); + if(!inputs[a].getAttribute("disabled")) { + inputs[a].onchange = Custom.choose; + } else { + inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled"; + } + } + } + document.onmouseup = Custom.clear; + }, + pushed: function() { + element = this.nextSibling; + if(element.checked == true && element.type == "checkbox") { + this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px"; + } else if(element.checked == true && element.type == "radio") { + this.style.backgroundPosition = "0 -" + radioHeight*3 + "px"; + } else if(element.checked != true && element.type == "checkbox") { + this.style.backgroundPosition = "0 -" + checkboxHeight + "px"; + } else { + this.style.backgroundPosition = "0 -" + radioHeight + "px"; + } + }, + check: function() { + element = this.nextSibling; + if(element.checked == true && element.type == "checkbox") { + this.style.backgroundPosition = "0 0"; + element.checked = false; + } else { + if(element.type == "checkbox") { + this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; + } else { + this.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; + group = this.nextSibling.name; + inputs = document.getElementsByTagName("input"); + for(a = 0; a < inputs.length; a++) { + if(inputs[a].name == group && inputs[a] != this.nextSibling) { + inputs[a].previousSibling.style.backgroundPosition = "0 0"; + } + } + } + element.checked = true; + } + }, + clear: function() { + inputs = document.getElementsByTagName("input"); + for(var b = 0; b < inputs.length; b++) { + if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") { + inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; + } else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") { + inputs[b].previousSibling.style.backgroundPosition = "0 0"; + } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") { + inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; + } else if(inputs[b].type == "radio" && inputs[b].className == "styled") { + inputs[b].previousSibling.style.backgroundPosition = "0 0"; + } + } + }, + choose: function() { + option = this.getElementsByTagName("option"); + for(d = 0; d < option.length; d++) { + if(option[d].selected == true) { + document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue; + } + } + } +} +window.onload = Custom.init; \ No newline at end of file