From 75f5a4ad8eef8476d13fc121a6d35daec58f08e3 Mon Sep 17 00:00:00 2001 From: mariusbaumann Date: Fri, 2 Jan 2015 14:52:50 +0100 Subject: Redesign with bootstrap css --- module/web/templates/default/base.html | 104 ++++++++++++++++++++------------- 1 file changed, 65 insertions(+), 39 deletions(-) (limited to 'module') diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html index 147c08a37..e42f75c3a 100644 --- a/module/web/templates/default/base.html +++ b/module/web/templates/default/base.html @@ -5,9 +5,10 @@ - + + @@ -17,6 +18,8 @@ + + {% block title %}pyLoad {{_("Webinterface")}}{% endblock %} {% block head %} @@ -47,18 +50,9 @@ {% endif %} - -Captcha: -{{_("Captcha waiting")}} - - User:{{user.name}} - {% else %} @@ -68,11 +62,24 @@ {% endblock %} - - -
-
- +
{% if perms.STATUS %} - +
+ + + + +
+ + {% endif %} + + + + {% if perms.LIST %} - + +
+ + + + +
+ {% endif %} {% block pageactions %} -- cgit v1.2.3 From 69200db3473588f6df334836c6f249f489575888 Mon Sep 17 00:00:00 2001 From: mariusbaumann Date: Sat, 3 Jan 2015 07:12:50 +0100 Subject: Completely new Design v1 Some bugs heve to be fexed next days --- module/web/media/default/css/MooDialog.css | 2 +- module/web/media/default/css/pathchooser.css | 2 +- module/web/media/js/MooDropMenu_static.js | 13 +-- module/web/media/js/package_ui.js | 52 +++++++---- module/web/media/js/settings.js | 2 +- module/web/media/js/tinytab_static.js | 2 +- module/web/templates/default/base.html | 17 ++-- module/web/templates/default/downloads.html | 10 +-- module/web/templates/default/home.html | 110 +++++++++++++----------- module/web/templates/default/logs.html | 6 +- module/web/templates/default/queue.html | 45 +++++----- module/web/templates/default/settings.html | 50 ++++++----- module/web/templates/default/settings_item.html | 16 ++-- module/web/templates/default/window.html | 76 ++++++++-------- 14 files changed, 222 insertions(+), 181 deletions(-) (limited to 'module') diff --git a/module/web/media/default/css/MooDialog.css b/module/web/media/default/css/MooDialog.css index 48c9166ad..4564a2a34 100644 --- a/module/web/media/default/css/MooDialog.css +++ b/module/web/media/default/css/MooDialog.css @@ -12,7 +12,7 @@ left: 50%; z-index: 50000; - background: #eef5f8; + background: #fff; color: black; border-radius: 7px; -moz-border-radius: 7px; diff --git a/module/web/media/default/css/pathchooser.css b/module/web/media/default/css/pathchooser.css index 894cc335e..bfd84b19b 100644 --- a/module/web/media/default/css/pathchooser.css +++ b/module/web/media/default/css/pathchooser.css @@ -11,7 +11,7 @@ th { } table, tr, td { - background-color: #F0F0F0; + background-color: #fff; } a, a:visited { diff --git a/module/web/media/js/MooDropMenu_static.js b/module/web/media/js/MooDropMenu_static.js index b9cd8cc10..621031599 100644 --- a/module/web/media/js/MooDropMenu_static.js +++ b/module/web/media/js/MooDropMenu_static.js @@ -23,13 +23,13 @@ var MooDropMenu = new Class({ options: { onOpen: function(el){ - el.removeClass('close').addClass('open'); + el.removeClass('open').addClass('open'); }, onClose: function(el){ - el.removeClass('open').addClass('close'); + el.removeClass('open').addClass('open'); }, onInitialize: function(el){ - el.removeClass('open').addClass('close'); + el.removeClass('open').addClass('open'); }, mouseoutDelay: 200, mouseoverDelay: 0, @@ -44,9 +44,10 @@ var MooDropMenu = new Class({ var menu = this.menu = document.id(menu); menu.getElements(options.itemSelector + ' > ' + options.listSelector).each(function(el){ + this.fireEvent('initialize', el); - + var parent = el.getParent(options.itemSelector), timer; @@ -62,11 +63,11 @@ var MooDropMenu = new Class({ }.bind(this), 'mouseleave': function(){ - parent.store('DropDownOpen', false); + parent.store('DropDownOpen', true); clearTimeout(timer); timer = (function(){ - if (!parent.retrieve('DropDownOpen')) this.fireEvent('close', el); + if (!parent.retrieve('DropDownOpen')) this.fireEvent('open', el); }).delay(options.mouseoutDelay, this); }.bind(this) diff --git a/module/web/media/js/package_ui.js b/module/web/media/js/package_ui.js index 3ea965649..87694e909 100644 --- a/module/web/media/js/package_ui.js +++ b/module/web/media/js/package_ui.js @@ -49,7 +49,7 @@ var PackageUI = new Class({ clone: true, revert: true, opacity: 0.4, - handle: ".package_drag", + handle: "#package_drag", onComplete: this.saveSort.bind(this) }); @@ -162,16 +162,16 @@ var Package = new Class({ }, parseElement: function() { - var imgs = this.ele.getElements('img'); + var imgs = this.ele.getElements('span'); this.name = this.ele.getElements('.name')[0]; this.folder = this.ele.getElements('.folder')[0]; this.password = this.ele.getElements('.password')[0]; - imgs[1].addEvent('click', this.deletePackage.bind(this)); - imgs[2].addEvent('click', this.restartPackage.bind(this)); - imgs[3].addEvent('click', this.editPackage.bind(this)); - imgs[4].addEvent('click', this.movePackage.bind(this)); + imgs[3].addEvent('click', this.deletePackage.bind(this)); + imgs[4].addEvent('click', this.restartPackage.bind(this)); + imgs[5].addEvent('click', this.editPackage.bind(this)); + imgs[6].addEvent('click', this.movePackage.bind(this)); this.ele.getElement('.packagename').addEvent('click', this.toggle.bind(this)); @@ -197,14 +197,34 @@ var Package = new Class({ "margin-left": 0 } }); + + if (link.icon == 'arrow_right.png'){ + link.icon = 'glyphicon glyphicon-arrow-right'; + } + if (link.icon == 'status_downloading.png'){ + link.icon = 'glyphicon glyphicon-cloud-download'; + } + if (link.icon == 'status_failed.png'){ + link.icon = 'glyphicon glyphicon-exclamation-sign'; + } + if (link.icon == 'status_finished.png'){ + link.icon = 'glyphicon glyphicon-ok'; + } + if (link.statusmsg == 'queued'){ + link.icon = 'glyphicon glyphicon-time'; + } + if (link.icon == 'status_offline.png'){ + link.icon = 'glyphicon glyphicon-ban-circle'; + } + - var html = "\n".substitute({"icon": link.icon}); - html += "{name}
".substitute({"name": link.name}); - html += "{statusmsg}{error} ".substitute({"statusmsg": link.statusmsg, "error":link.error}); - html += "{format_size}".substitute({"format_size": link.format_size}); - html += "{plugin}  ".substitute({"plugin": link.plugin}); - html += "  "; - html += "
"; + var html = "\n".substitute({"icon": link.icon}); + html += "{name}
".substitute({"name": link.name}); + html += "{statusmsg}{error} ".substitute({"statusmsg": link.statusmsg, "error":link.error}); + html += "{format_size}".substitute({"format_size": link.format_size}); + html += " {plugin}  ".substitute({"plugin": link.plugin}); + html += "  "; + html += "
"; var div = new Element("div", { "id": "file_" + link.id, @@ -235,8 +255,8 @@ var Package = new Class({ registerLinkEvents: function() { this.ele.getElements('.child').each(function(child) { var lid = child.get('id').match(/[0-9]+/); - var imgs = child.getElements('.child_secrow img'); - imgs[0].addEvent('click', function(e) { + var imgs = child.getElements('.child_secrow span'); + imgs[3].addEvent('click', function(e) { new Request({ method: 'get', url: '/api/deleteFiles/[' + this + "]", @@ -247,7 +267,7 @@ var Package = new Class({ }).send(); }.bind(lid)); - imgs[1].addEvent('click', function(e) { + imgs[4].addEvent('click', function(e) { new Request({ method: 'get', url: '/api/restartFile/' + this, diff --git a/module/web/media/js/settings.js b/module/web/media/js/settings.js index 9191fac72..be694d365 100644 --- a/module/web/media/js/settings.js +++ b/module/web/media/js/settings.js @@ -1,3 +1,3 @@ {% autoescape true %} -var SettingsUI,root;var __bind=function(a,b){return function(){return a.apply(b,arguments)}};root=this;window.addEvent("domready",function(){root.accountDialog=new MooDialog({destroyOnHide:false});root.accountDialog.setContent($("account_box"));new TinyTab($$("#toptabs li a"),$$("#tabs-body > span"));$$("ul.nav").each(function(a){return new MooDropMenu(a,{onOpen:function(b){return b.fade("in")},onClose:function(b){return b.fade("out")},onInitialize:function(b){return b.fade("hide").set("tween",{duration:500})}})});return new SettingsUI()});SettingsUI=(function(){function a(){var c,e,b,d;this.menu=$$("#general-menu li");this.menu.append($$("#plugin-menu li"));this.name=$("tabsback");this.general=$("general_form_content");this.plugin=$("plugin_form_content");d=this.menu;for(e=0,b=d.length;e span"));$$("ul.nav").each(function(a){return new MooDropMenu(a,{onOpen:function(b){return b.fade("in")},onClose:function(b){return b.fade("out")},onInitialize:function(b){return b.fade("show").set("tween",{duration:500})}})});return new SettingsUI()});SettingsUI=(function(){function a(){var c,e,b,d;this.menu=$$("#general-menu li");this.menu.append($$("#plugin-menu li"));this.name=$("tabsback");this.general=$("general_form_content");this.plugin=$("plugin_form_content");d=this.menu;for(e=0,b=d.length;e