MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-04-01 10:13:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

Added a tiny animation when removing/adding multiple elements.

Browse Source
This commit is contained in:
Anders Betnér 2006-05-24 21:47:32 +00:00
parent 5d222cfc91
commit d30bafbd50
1 changed files with 24 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
admin-root/config.js
View File

@ -1,11 +1,8 @@
Event.observe(window,'load',init); Event.observe(window,'load',init);
//###TODO //###TODO
// * Fix cancel for multiple, create a span holding all multiple elements
// * Disable/enable save/cancel, Add key and onchange listeners keep a note on changed items // * Disable/enable save/cancel, Add key and onchange listeners keep a note on changed items
// * create the path/file browser // * create the path/file browser
// * Inform user if server restart needed, ask Ron which options // * better errormessage for non writable config
// * Show required options in UI check with Ron if conf.c is correct
// * better errormessage for not writable config
// * make tabs? // * make tabs?
// * add warning if leaving page without saving // * add warning if leaving page without saving
@ -126,7 +123,7 @@ var Config = {
var body = document.createElement('div'); var body = document.createElement('div');
body.className = 'navibox'; body.className = 'navibox';
if ('Server' == section) { if ('Server' == section) {
body.appendChild(Builder.node('span',{id:'config_path'},'Config File')); body.appendChild(Builder.node('span',{id:'config_path'},'Config File Location'));
body.appendChild(document.createTextNode(Config.configPath)); body.appendChild(document.createTextNode(Config.configPath));
body.appendChild(Builder.node('br')); body.appendChild(Builder.node('br'));
body.appendChild(Builder.node('div',{style: 'clear: both;'})); body.appendChild(Builder.node('div',{style: 'clear: both;'}));
@ -164,7 +161,6 @@ var Config = {
_buildItem: function(section,itemId) { _buildItem: function(section,itemId) {
var frag = document.createDocumentFragment(); var frag = document.createDocumentFragment();
var href; var href;
var span;
var item = ConfigXML.getOption(section,itemId); var item = ConfigXML.getOption(section,itemId);
var postId = item.config_section + ':' + itemId; var postId = item.config_section + ':' + itemId;
var noBrowse = false; var noBrowse = false;
@ -177,8 +173,8 @@ var Config = {
} }
var parentSpan = Builder.node('span'); var parentSpan = Builder.node('span');
values.each(function (val,i) { values.each(function (val,i) {
var span = document.createElement('span'); var div = document.createElement('div');
span.appendChild(BuildElement.input(postId+i,postId, div.appendChild(BuildElement.input(postId+i,postId,
item.name, item.name,
val || item.default_value || '', val || item.default_value || '',
item.size || 20, item.size || 20,
@ -187,14 +183,14 @@ var Config = {
if (item.browse) { if (item.browse) {
href = Builder.node('a',{href: 'javascript://'},'Browse'); href = Builder.node('a',{href: 'javascript://'},'Browse');
Event.observe(href,'click',Config._browse); Event.observe(href,'click',Config._browse);
span.appendChild(href); div.appendChild(href);
} }
span.appendChild(document.createTextNode('\u00a0\u00a0')); div.appendChild(document.createTextNode('\u00a0\u00a0'));
href = Builder.node('a',{href: 'javascript://'},'Remove'); href = Builder.node('a',{href: 'javascript://'},'Remove');
Event.observe(href,'click',Config._removeItemEvent); Event.observe(href,'click',Config._removeItemEvent);
span.appendChild(href); div.appendChild(href);
span.appendChild(Builder.node('br')); div.appendChild(Builder.node('br'));
parentSpan.appendChild(span); parentSpan.appendChild(div);
}); });
// This is used by cancelForm to find out how // This is used by cancelForm to find out how
// many options a multiple group has // many options a multiple group has
@ -230,11 +226,11 @@ var Config = {
return frag; return frag;
}, },
_addItemEvent: function (e) { _addItemEvent: function (e) {
var span = Event.element(e).previousSibling.lastChild; var div = Event.element(e).previousSibling.lastChild;
Config._addItem(span); Config._addItem(div);
}, },
_addItem: function(span) { _addItem: function(div) {
var newSpan = span.cloneNode(true); var newSpan = div.cloneNode(true);
var id = newSpan.getElementsByTagName('input')[0].id; var id = newSpan.getElementsByTagName('input')[0].id;
var num = parseInt(id.match(/\d+$/)); var num = parseInt(id.match(/\d+$/));
num++; num++;
@ -243,6 +239,7 @@ var Config = {
newSpan.getElementsByTagName('label')[0].setAttribute('for',id); newSpan.getElementsByTagName('label')[0].setAttribute('for',id);
newSpan.getElementsByTagName('input')[0].id = id; newSpan.getElementsByTagName('input')[0].id = id;
newSpan.getElementsByTagName('input')[0].value = ''; newSpan.getElementsByTagName('input')[0].value = '';
newSpan.style.display = 'none';
var hrefs = newSpan.getElementsByTagName('a'); var hrefs = newSpan.getElementsByTagName('a');
if ('Netscape' == navigator.appName) { if ('Netscape' == navigator.appName) {
// Firefox et al doesn't copy registered events on an element deep clone // Firefox et al doesn't copy registered events on an element deep clone
@ -254,20 +251,21 @@ var Config = {
Event.observe(hrefs[1],'click',Config._removeItemEvent); Event.observe(hrefs[1],'click',Config._removeItemEvent);
} }
} }
span.parentNode.insertBefore(newSpan,span.nextSibling); div.parentNode.insertBefore(newSpan,div.nextSibling);
Effect.BlindDown(newSpan,{duration: 0.2});
}, },
_removeItemEvent: function (e) { _removeItemEvent: function (e) {
var span = Event.element(e); var div = Event.element(e);
while (span.nodeName.toLowerCase() != 'span') { while (div.nodeName.toLowerCase() != 'div') {
span = span.parentNode; div = div.parentNode;
} }
Config._removeItem(span); Config._removeItem(div);
}, },
_removeItem: function(span) { _removeItem: function(div) {
if (span.parentNode.childNodes.length > 1) { if (div.parentNode.childNodes.length > 1) {
Element.remove(span); Effect.BlindUp(div,{duration: 0.2, afterFinish: function (){Element.remove(div);}});
} else { } else {
span.getElementsByTagName('input')[0].value=''; div.getElementsByTagName('input')[0].value='';
} }
}, },
_browse: function(e) { _browse: function(e) {