Multiple Newznab settings page style

This commit is contained in:
Ruud
2011-09-06 11:57:51 +02:00
parent 630e79ccb6
commit 577c87ff2b
5 changed files with 99 additions and 20 deletions
@@ -9,7 +9,7 @@ config = [{
{
'tab': 'providers',
'name': 'newznab',
'description': 'Enable multiple NewzNab providers',
'description': 'Enable multiple NewzNab providers such as <a href="http://nzb.su" target="_blank">NZB.su</a>',
'options': [
{
'name': 'enabled',
@@ -22,7 +22,7 @@ config = [{
{
'name': 'host',
'default': 'http://nzb.su',
'description': 'The hostname of your newznab provider, like http://nzb.su'
'description': 'The hostname of your newznab provider'
},
{
'name': 'api_key',
@@ -31,28 +31,51 @@ var MultipleNewznab = new Class({
});
self.inputs[name].getParent().hide()
self.inputs[name].addEvent('change', self.addEmpty.bind(self))
});
self.values.each(function(item, nr){
self.createItem(item.use, item.host, item.api_key);
});
new Element('a.nice_button', {
'text': 'Add new NewzNab provider',
'events': {
'click': function(e){
(e).stop();
self.createItem(1, '', '');
}
}
}).inject(self.fieldset.getElement('h2'), 'after');
new Element('div.head').adopt(
new Element('abbr.host', {
'text': 'Host',
'title': self.inputs['host'].getNext().get('text')
}),
new Element('abbr.api_key', {
'text': 'Api Key',
'title': self.inputs['api_key'].getNext().get('text')
})
).inject(self.fieldset.getElement('h2'), 'after');
self.addEmpty();
})
},
add_empty_timeout: 0,
addEmpty: function(){
var self = this;
if(self.add_empty_timeout) clearTimeout(self.add_empty_timeout);
var has_empty = false;
self.items.each(function(ctrl_holder){
if(ctrl_holder.getElement('.host').get('value') == '' && ctrl_holder.getElement('.api_key').get('value') == ''){
has_empty = true;
}
ctrl_holder[has_empty ? 'addClass' : 'removeClass']('is_empty');
});
if(has_empty) return;
self.add_empty_timeout = setTimeout(function(){
self.createItem(false);
}, 10);
},
createItem: function(use, host, api){
var self = this;
@@ -83,12 +106,12 @@ var MultipleNewznab = new Class({
}
}),
new Element('a.icon.delete', {
'text': 'delete',
'events': {
'click': self.deleteItem.bind(self)
}
})
).inject(self.fieldset);
item[!host ? 'addClass' : 'removeClass']('is_empty');
new Form.Check(checkbox, {
'onChange': checkbox.fireEvent.bind(checkbox, 'change')
@@ -105,6 +128,7 @@ var MultipleNewznab = new Class({
self.items.each(function(item, nr){
self.input_types.each(function(type){
var input = item.getElement('input.'+type);
if(input.getParent('.ctrlHolder').hasClass('is_empty')) return;
if(!temp[type]) temp[type] = [];
temp[type][nr] = input.get('type') == 'checkbox' ? +input.get('checked') : input.get('value').trim();
@@ -125,7 +149,7 @@ var MultipleNewznab = new Class({
(e).stop();
var item = e.target.getParent();
self.items.erase(item);
item.destroy();
@@ -9,6 +9,7 @@ config = [{
{
'tab': 'providers',
'name': 'nzbs',
'description': 'Id and Key can be found <a href="http://nzbs.org/index.php?action=rss" target="_blank">on your nzbs.org RSS page</a>.',
'options': [
{
'name': 'enabled',
@@ -17,12 +18,12 @@ config = [{
{
'name': 'id',
'label': 'Id',
'description': 'Can be found <a href="http://nzbs.org/index.php?action=rss" target="_blank">here</a>, the number after "&amp;i="',
'description': 'The number after "&amp;i="',
},
{
'name': 'api_key',
'label': 'Api Key',
'description': 'Can be found <a href="http://nzbs.org/index.php?action=rss" target="_blank">here</a>, the string after "&amp;h="'
'description': 'The string after "&amp;h="'
},
],
},
+14 -2
View File
@@ -1,4 +1,7 @@
/* @override http://localhost:5000/static/style/main.css */
/* @override
http://localhost:5000/static/style/main.css
http://192.168.1.20:5000/static/style/main.css
*/
html {
color: #fff;
@@ -35,15 +38,24 @@ input, textarea {
font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}
input:-moz-placeholder, textarea:-moz-placeholder {
color: rgba(255, 255, 255, 0.6);
}
::-webkit-input-placeholder, ::-webkit-textarea-placeholder {
color: rgba(255, 255, 255, 0.6);
}
a img {
border:none;
}
a {
text-decoration:none;
color: #fff;
color: #ebfcbc;
outline: 0;
cursor: pointer;
font-weight: bold;
}
a:hover { color: #f3f3f3; }
+43 -1
View File
@@ -38,6 +38,7 @@
.page.settings .tabs a {
display: block;
padding: 11px 15px;
color: #fff;
}
.page.settings .tabs .active a {
background: #4e5969;
@@ -92,6 +93,7 @@
position: relative;
margin-bottom: -25px;
border: none;
width: 20px;
}
.page.settings .ctrlHolder {
@@ -106,6 +108,7 @@
.page.settings .ctrlHolder:last-child { border: none; }
.page.settings .ctrlHolder:hover { background-color: rgba(255,255,255,0.05); }
.page.settings .ctrlHolder.focused { background-color: rgba(255,255,255,0.2); }
.page.settings .ctrlHolder.focused:first-child, .page.settings .ctrlHolder:first-child{ background-color: transparent; }
.page.settings .ctrlHolder .formHint {
float: right;
@@ -287,4 +290,43 @@
.page.settings .directory_list .actions:last-child > .save {
background: #9dc156;
}
}
.page.settings .section_newznab {
}
.page.settings .section_newznab .head {
margin: 0 0 0 60px;
}
.page.settings .section_newznab .head abbr {
display: inline-block;
font-weight: bold;
border-bottom: 1px dotted #fff;
line-height: 140%;
cursor: help;
}
.page.settings .section_newznab .head abbr.host {
margin-right: 197px;
}
.page.settings .section_newznab .ctrlHolder {
padding-top: 2px;
padding-bottom: 3px;
}
.page.settings .section_newznab .ctrlHolder > * {
margin: 0 10px 0 0;
}
.page.settings .section_newznab .ctrlHolder .delete {
display: inline-block;
width: 22px;
height: 22px;
vertical-align: middle;
background-position: left center;
}
.page.settings .section_newznab .ctrlHolder.is_empty .delete, .page.settings .section_newznab .ctrlHolder.is_empty .use {
visibility: hidden;
}