diff options
| -rw-r--r-- | module/web/media/default/css/MooDialog.css | 2 | ||||
| -rw-r--r-- | module/web/media/default/css/pathchooser.css | 2 | ||||
| -rw-r--r-- | module/web/media/js/MooDropMenu_static.js | 13 | ||||
| -rw-r--r-- | module/web/media/js/package_ui.js | 52 | ||||
| -rw-r--r-- | module/web/media/js/settings.js | 2 | ||||
| -rw-r--r-- | module/web/media/js/tinytab_static.js | 2 | ||||
| -rw-r--r-- | module/web/templates/default/base.html | 17 | ||||
| -rw-r--r-- | module/web/templates/default/downloads.html | 10 | ||||
| -rw-r--r-- | module/web/templates/default/home.html | 110 | ||||
| -rw-r--r-- | module/web/templates/default/logs.html | 6 | ||||
| -rw-r--r-- | module/web/templates/default/queue.html | 45 | ||||
| -rw-r--r-- | module/web/templates/default/settings.html | 50 | ||||
| -rw-r--r-- | module/web/templates/default/settings_item.html | 16 | ||||
| -rw-r--r-- | module/web/templates/default/window.html | 76 |
14 files changed, 222 insertions, 181 deletions
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 = "<span style='cursor: move' class='child_status sorthandle'><img src='/media/default/img/{icon}' style='width: 12px; height:12px;'/></span>\n".substitute({"icon": link.icon}); - html += "<span style='font-size: 15px'>{name}</span><br /><div class='child_secrow'>".substitute({"name": link.name}); - html += "<span class='child_status'>{statusmsg}</span>{error} ".substitute({"statusmsg": link.statusmsg, "error":link.error}); - html += "<span class='child_status'>{format_size}</span>".substitute({"format_size": link.format_size}); - html += "<span class='child_status'>{plugin}</span> ".substitute({"plugin": link.plugin}); - html += "<img title='{{_("Delete Link")}}' style='cursor: pointer;' width='10px' height='10px' src='/media/default/img/delete.png' /> "; - html += "<img title='{{_("Restart Link")}}' style='cursor: pointer;margin-left: -4px' width='10px' height='10px' src='/media/default/img/arrow_refresh.png' /></div>"; + var html = "<span style='' class='child_status sorthandle'><span style='margin-right: 2px;' class='{icon}'></span></span>\n".substitute({"icon": link.icon}); + html += "<span style='font-size: 18px; text-weight:bold'>{name}</span><br /><div class='child_secrow' style='margin-left: 21px; margin-bottom: 7px;'>".substitute({"name": link.name}); + html += "<span class='child_status' style='font-size: 12px; color:#555'>{statusmsg}</span>{error} ".substitute({"statusmsg": link.statusmsg, "error":link.error}); + html += "<span class='child_status' style='font-size: 12px; color:#555'>{format_size}</span>".substitute({"format_size": link.format_size}); + html += "<span class='child_status' style='font-size: 12px; color:#555'> {plugin}</span> ".substitute({"plugin": link.plugin}); + html += "<span class='glyphicon glyphicon-trash' title='{{_("Delete Link")}}' style='cursor: pointer; font-size: 12px; color:#333;' ></span> "; + html += "<span class='glyphicon glyphicon-repeat' title='{{_("Restart Link")}}' style='cursor: pointer; font-size: 12px; color:#333;' ></span></div>"; 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<b;e++){c=d[e];c.addEvent("click",this.menuClick.bind(this))}$("general|submit").addEvent("click",this.configSubmit.bind(this));$("plugin|submit").addEvent("click",this.configSubmit.bind(this));$("account_add").addEvent("click",function(f){root.accountDialog.open();return f.stop()});$("account_reset").addEvent("click",function(f){return root.accountDialog.close()});$("account_add_button").addEvent("click",this.addAccount.bind(this));$("account_submit").addEvent("click",this.submitAccounts.bind(this))}a.prototype.menuClick=function(h){var c,b,g,f,d;d=h.target.get("id").split("|"),c=d[0],g=d[1];b=h.target.get("text");f=c==="general"?this.general:this.plugin;f.dissolve();return new Request({method:"get",url:"/json/load_config/"+c+"/"+g,onSuccess:__bind(function(e){f.set("html",e);f.reveal();return this.name.set("text",b)},this)}).send()};a.prototype.configSubmit=function(d){var c,b;c=d.target.get("id").split("|")[0];b=$(""+c+"_form");b.set("send",{method:"post",url:"/json/save_config/"+c,onSuccess:function(){return root.notify.alert('{{ _("Settings saved.")}}',{className:"success"})},onFailure:function(){return root.notify.alert('{{ _("Error occured.")}}',{className:"error"})}});b.send();return d.stop()};a.prototype.addAccount=function(c){var b;b=$("add_account_form");b.set("send",{method:"post",onSuccess:function(){return window.location.reload()},onFailure:function(){return root.notify.alert('{{_("Error occured.")}}',{className:"error"})}});b.send();return c.stop()};a.prototype.submitAccounts=function(c){var b;b=$("account_form");b.set("send",{method:"post",onSuccess:function(){return window.location.reload()},onFailure:function(){return root.notify.alert('{{ _("Error occured.") }}',{className:"error"})}});b.send();return c.stop()};return a})(); +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"),$$("#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("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<b;e++){c=d[e];c.addEvent("click",this.menuClick.bind(this))}$("general|submit").addEvent("click",this.configSubmit.bind(this));$("plugin|submit").addEvent("click",this.configSubmit.bind(this));$("account_add").addEvent("click",function(f){root.accountDialog.open();return f.stop()});$("account_reset").addEvent("click",function(f){return root.accountDialog.close()});$("account_add_button").addEvent("click",this.addAccount.bind(this));$("account_submit").addEvent("click",this.submitAccounts.bind(this))}a.prototype.menuClick=function(h){var c,b,g,f,d;d=h.target.get("id").split("|"),c=d[0],g=d[1];b=h.target.get("text");f=c==="general"?this.general:this.plugin;f.dissolve();return new Request({method:"get",url:"/json/load_config/"+c+"/"+g,onSuccess:__bind(function(e){f.set("html",e);f.reveal();return this.name.set("text",b)},this)}).send()};a.prototype.configSubmit=function(d){var c,b;c=d.target.get("id").split("|")[0];b=$(""+c+"_form");b.set("send",{method:"post",url:"/json/save_config/"+c,onSuccess:function(){return root.notify.alert('{{ _("Settings saved.")}}',{className:"success"})},onFailure:function(){return root.notify.alert('{{ _("Error occured.")}}',{className:"error"})}});b.send();return d.stop()};a.prototype.addAccount=function(c){var b;b=$("add_account_form");b.set("send",{method:"post",onSuccess:function(){return window.location.reload()},onFailure:function(){return root.notify.alert('{{_("Error occured.")}}',{className:"error"})}});b.send();return c.stop()};a.prototype.submitAccounts=function(c){var b;b=$("account_form");b.set("send",{method:"post",onSuccess:function(){return window.location.reload()},onFailure:function(){return root.notify.alert('{{ _("Error occured.") }}',{className:"error"})}});b.send();return c.stop()};return a})(); {% endautoescape %}
\ No newline at end of file diff --git a/module/web/media/js/tinytab_static.js b/module/web/media/js/tinytab_static.js index 6c38292f5..bde2bfa2b 100644 --- a/module/web/media/js/tinytab_static.js +++ b/module/web/media/js/tinytab_static.js @@ -26,7 +26,7 @@ provides: TinyTab this.headers.push(""); } if(!opt) opt = {}; - this.css = opt.selectedClass || 'selected'; + this.css = opt.selectedClass || 'active'; this.select(this.tabs[0]); tabs.each(function(el){ el.addEvent('click',function(e){ diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html index e42f75c3a..5933e108f 100644 --- a/module/web/templates/default/base.html +++ b/module/web/templates/default/base.html @@ -113,7 +113,7 @@ </ul> <ul class="nav navbar-nav navbar-right"> - <li> <span class="glyphicon glyphicon-user"></span>{{user.name}}</li> + <li><a href="/info" class="action info" rel="nofollow"><span class="glyphicon glyphicon-user"></span> {{user.name}}</a></li> {% if user.is_admin %} <li><a href="/admin" class="action profile" rel="nofollow"><span class="glyphicon glyphicon-cog"></span></a></li> {% endif %} @@ -160,20 +160,12 @@ <div id="body-wrapper" class="dokuwiki"> -<div id="content" lang="en" dir="ltr"> +<div id="content" style="width: 98%; margin-left:10px; margin-rigth:10px;" lang="en" dir="ltr"> -<h1>{% block subtitle %}pyLoad - {{_("Webinterface")}}{% endblock %}</h1> +<h3>{% block subtitle %}pyLoad - {{_("Webinterface")}}{% endblock %}</h3> {% block statusbar %} {% endblock %} - - -<br/> - -<div class="level1" style="clear:both"> -</div> -<noscript><h1>Enable JavaScript to use the webinterface.</h1></noscript> - {% for message in messages %} <b><p>{{message}}</p></b> {% endfor %} @@ -188,7 +180,7 @@ <hr style="clear: both;" /> -<div id="foot">© 2008-2011 pyLoad Team +<div id="foot" style="with: 98%; margin-left: 10px; margin-right:10px">© 2008-2011 pyLoad Team <a href="#top" class="action top" accesskey="x"><span>{{_("Back to top")}}</span></a><br /> <!--<div class="breadcrumbs"></div>--> @@ -202,5 +194,6 @@ {% block hidden %} {% endblock %} </div> +<noscript><h1>Enable JavaScript to use the webinterface.</h1></noscript> </body> </html> diff --git a/module/web/templates/default/downloads.html b/module/web/templates/default/downloads.html index 450b8a102..d19fe969a 100644 --- a/module/web/templates/default/downloads.html +++ b/module/web/templates/default/downloads.html @@ -8,20 +8,20 @@ {% block content %} -<ul> +<ul style="list-style-type: none;"> {% for folder in files.folder %} - <li> - {{ folder.name }} + <li style="list-style-type: none;"> + <span style="margin-right: 5px" class="glyphicon glyphicon-folder-close"></span>{{ folder.name }} <ul> {% for file in folder.files %} - <li><a href='get/{{ folder.path|escape }}/{{ file|escape }}'>{{file}}</a></li> + <li style="list-style-type: none;"><span style="margin-right: 5px" class="glyphicon glyphicon-file"></span><a href='get/{{ folder.path|escape }}/{{ file|escape }}'>{{file}}</a></li> {% endfor %} </ul> </li> {% endfor %} {% for file in files.files %} - <li> <a href='get/{{ file|escape }}'>{{ file }}</a></li> + <li style="list-style-type: none;"> <span style="margin-right: 5px" class="glyphicon glyphicon-file"></span><a href='get/{{ file|escape }}'>{{ file }}</a></li> {% endfor %} </ul> diff --git a/module/web/templates/default/home.html b/module/web/templates/default/home.html index 7359e326c..89074dd26 100644 --- a/module/web/templates/default/home.html +++ b/module/web/templates/default/home.html @@ -77,6 +77,7 @@ var EntryManager = new Class({ } }, this) + }catch(e){ //alert(e) } @@ -105,20 +106,29 @@ var LinkEntry = new Class({ }, insert: function(item){ try{ + + this.elements = { tr: new Element('tr', { 'html': '', 'styles':{ - 'opacity': 0 + 'opacity': 0, } }), + status: new Element('td', { + 'html': ' ', + }), + statusspan: new Element('span', { + 'html': item.statusmsg, + 'class': 'label label-default', + 'styles':{ + + } + }), name: new Element('td', { 'html': item.name }), - status: new Element('td', { - 'html': item.statusmsg - }), info: new Element('td', { 'html': item.info }), @@ -139,20 +149,35 @@ var LinkEntry = new Class({ } }), pgbTr: new Element('tr', { - 'html':'' + 'html':'', + 'styles':{ + 'border-top-color': '#fff', + } + }), + progress: new Element('div', { + 'html':'', + 'class':'progress', + 'styles':{ + 'margin-bottom': '0px', + } }), pgb: new Element('div', { - 'html': ' ', + 'html':'', + 'class':'progress-bar progress-bar-striped active', + 'role':'progress', 'styles':{ - 'height': '4px', 'width': item.percent+'%', 'background-color': '#ddd' } }) + }; - this.elements.tr.adopt(this.elements.name,this.elements.status,this.elements.info,this.elements.bleft,new Element('td').adopt(this.elements.percent,this.elements.remove)); - this.elements.pgbTr.adopt(new Element('td',{'colspan':5}).adopt(this.elements.pgb)); + + this.elements.status.adopt(this.elements.statusspan); + this.elements.progress.adopt(this.elements.pgb); + this.elements.tr.adopt(this.elements.status,this.elements.name,this.elements.info,this.elements.bleft,new Element('td').adopt(this.elements.percent,this.elements.remove)); + this.elements.pgbTr.adopt(new Element('td',{'colspan':5}).adopt(this.elements.progress)); this.initEffects(); }catch(e){ alert(e) @@ -171,15 +196,27 @@ var LinkEntry = new Class({ }, update: function(item){ this.elements.name.set('text', item.name); - this.elements.status.set('text', item.statusmsg); + this.elements.statusspan.set('text', item.statusmsg); this.elements.info.set('text', item.info); this.elements.bleft.set('text', item.format_size); this.elements.percent.set('text', item.percent+ '% / '+ humanFileSize(item.size-item.bleft)); + if (item.statusmsg == "waiting") { + this.elements.statusspan.set('class', 'label label-warning') + } else if (item.statusmsg == "starting") { + this.elements.statusspan.set('class', 'label label-info') + } else if (item.statusmsg == "downloading") { + this.elements.statusspan.set('class', 'label label-success') + } else if (item.stausmsg == "extracting") { + this.elements.statusspan.set('class', 'label label-primary') + } else { + this.elements.statusspan.set('class', 'label label-default') + } if(!operafix) { + this.bar.start({ 'width': item.percent, - 'background-color': [Math.round(120/100*item.percent),100,100].hsbToRgb().rgbToHex() + 'background-color': [Math.round(120/100*item.percent),80,70].hsbToRgb().rgbToHex() }); } else @@ -188,9 +225,10 @@ var LinkEntry = new Class({ 'styles', { 'height': '4px', 'width': item.percent+'%', - 'background-color': [Math.round(120/100*item.percent),100,100].hsbToRgb().rgbToHex(), + 'background-color': [Math.round(50/200*item.percent),0,200].hsbToRgb().rgbToHex(), }); } + }, remove: function(){ this.fade.start('opacity',0).chain(function(){this.elements.tr.dispose();}.bind(this)); @@ -198,57 +236,32 @@ var LinkEntry = new Class({ } }); + + </script> - -{% endblock %} - -{% block subtitle %} -{{_("Active Downloads")}} -{% endblock %} - -{% block menu %} -<li class="selected"> - <a href="/" title=""><img src="/media/default/img/head-menu-home.png" alt="" /> {{_("Home")}}</a> -</li> -<li> - <a href="/queue/" title=""><img src="/media/default/img/head-menu-queue.png" alt="" /> {{_("Queue")}}</a> -</li> -<li> - <a href="/collector/" title=""><img src="/media/default/img/head-menu-collector.png" alt="" /> {{_("Collector")}}</a> -</li> -<li> - <a href="/downloads/" title=""><img src="/media/default/img/head-menu-development.png" alt="" /> {{_("Downloads")}}</a> -</li> -{#<li>#} -{# <a href="/filemanager/" title=""><img src="/media/default/img/head-menu-download.png" alt="" /> {{_("FileManager")}}</a>#} -{#</li>#} -<li class="right"> - <a href="/logs/" class="action index" accesskey="x" rel="nofollow"><img src="/media/default/img/head-menu-index.png" alt="" />{{_("Logs")}}</a> -</li> -<li class="right"> - <a href="/settings/" class="action index" accesskey="x" rel="nofollow"><img src="/media/default/img/head-menu-config.png" alt="" />{{_("Config")}}</a> -</li> {% endblock %} +{% block subtitle %}{{_("Active Downloads")}}{% endblock %} {% block content %} -<table width="100%" class="queue"> +<table class="table" style="width:100%;"> <thead> <tr class="header"> - <th>{{_("Name")}}</th> <th>{{_("Status")}}</th> + <th>{{_("Name")}}</th> <th>{{_("Information")}}</th> <th>{{_("Size")}}</th> <th>{{_("Progress")}}</th> </tr> </thead> +</br> <tbody id="LinksAktiv"> {% for link in content %} <tr id="link_{{ link.id }}"> - <td id="link_{{ link.id }}_name">{{ link.name }}</td> - <td id="link_{{ link.id }}_status">{{ link.status }}</td> - <td id="link_{{ link.id }}_info">{{ link.info }}</td> - <td id="link_{{ link.id }}_bleft">{{ link.format_size }}</td> + <td id="link_{{ link.id }}_status"><span class="label label-{% if link.status == 'downloading' %}success{% endif %}{% if link.status == 'extracting' %}primary{% endif %}{% if link.status == 'starting' %}warning{% else %}default{% endif %}">{{ link.status }}</span></td> + <td id="link_{{ link.id }}_name">{{ link.name }}</td> + <td id="link_{{ link.id }}_info">{{ link.info }}</td> + <td id="link_{{ link.id }}_bleft">{{ link.format_size }}</td> <td> <span id="link_{{ link.id }}_percent">{{ link.percent }}% /{{ link.bleft }}</span> <img id="link_{{ link.id }}_remove" style="vertical-align: middle; margin-right: -20px; margin-left: 5px; margin-top: -2px; cursor:pointer;" src="media/default/img/control_cancel.png"/> @@ -263,4 +276,5 @@ var LinkEntry = new Class({ </tbody> </table> -{% endblock %}
\ No newline at end of file +</div> +{% endblock %} diff --git a/module/web/templates/default/logs.html b/module/web/templates/default/logs.html index d6288df0e..f5444d94e 100644 --- a/module/web/templates/default/logs.html +++ b/module/web/templates/default/logs.html @@ -9,7 +9,7 @@ {% block content %} <div style="clear: both;"></div> -<div class="logpaginator"><a href="{{ "/logs/1" }}"><< {{_("Start")}}</a> <a href="{{ "/logs/" + iprev|string }}">< {{_("prev")}}</a> <a href="{{ "/logs/" + inext|string }}">{{_("next")}} ></a> <a href="/logs/">{{_("End")}} >></a></div> +<div class="logpaginator"><a href="{{ "/logs/1" }}"><span class="glyphicon glyphicon-fast-backward"></span></a> <a href="{{ "/logs/" + iprev|string }}"><span class="glyphicon glyphicon-step-backward"></span></a> <a href="{{ "/logs/" + inext|string }}"><span class="glyphicon glyphicon-step-forward"></span></a> <a href="/logs/"><span class="glyphicon glyphicon-fast-forward"></span></a></div> <div class="logperpage"> <form id="logform1" action="" method="POST"> <label for="reversed">Reversed:</label> @@ -33,8 +33,8 @@ </div> <div class="logform"> <form id="logform2" action="" method="POST"> - <label for="from">Jump to time:</label><input type="text" name="from" size="15" value="{{from}}"/> - <input type="submit" value="ok" /> + <label for="from">Jump to time:</label><input style="float:left; width:80%;" class="form-control" type="text" name="from" size="15" value="{{from}}"/> + <input style="float:left; width:19%; margin-left: 1%;" class="btn btn-primary" type="submit" value="ok" /> </form> </div> <div style="clear: both; height: 10px;"> </div> diff --git a/module/web/templates/default/queue.html b/module/web/templates/default/queue.html index 046abbe49..a77086a9e 100644 --- a/module/web/templates/default/queue.html +++ b/module/web/templates/default/queue.html @@ -17,52 +17,53 @@ document.addEvent("domready", function(){ {% set name = _("Collector") %} {% endif %} -{% block title %}{{name}} - {{super()}} {% endblock %} -{% block subtitle %}{{name}}{% endblock %} - {% block pageactions %} -<ul id="page-actions-more"> - <li id="del_finished"><a style="padding: 0; font-weight: bold;" href="#">{{_("Delete Finished")}}</a></li> - <li id="restart_failed"><a style="padding: 0; font-weight: bold;" href="#">{{_("Restart Failed")}}</a></li> -</ul> +<div class="btn-group btn-group-sm" role="group" aria-label="..." style="margin-left:10px;"> + <button id="del_finished" class="btn btn-default"><span>{{_("Delete Finished")}}</span></button> + <button id="restart_failed" class="btn btn-default"><span>{{_("Restart Failed")}}</span></button> +</div> {% endblock %} +{% block title %}{{name}} - {{super()}} {% endblock %} +{% block subtitle %}{{name}}{% endblock %} + {% block content %} {% autoescape true %} <ul id="package-list" style="list-style: none; padding-left: 0; margin-top: -10px;"> {% for package in content %} <li> -<div id="package_{{package.pid}}" class="package"> +<div id="package_{{package.pid}}" > <div class="order" style="display: none;">{{ package.order }}</div> - <div class="packagename" style="cursor: pointer"> - <img class="package_drag" src="/media/default/img/folder.png" style="cursor: move; margin-bottom: -2px"> - <span class="name">{{package.name}}</span> + <div class="packagename" style="float:left; width: 50%; cursor: pointer"> + <span class="glyphicon glyphicon-folder-close"></span> + <span class="name" style="font-size: 16px; font-weight: bold;">{{package.name }}</span> <span class="buttons" style="opacity:0"> - <img title="{{_("Delete Package")}}" style="cursor: pointer" width="12px" height="12px" src="/media/default/img/delete.png" /> + <span class="glyphicon glyphicon-trash" title="{{_("Delete Package")}}" style="cursor: pointer" width="12px" height="12px" src="/media/default/img/delete.png" /></span> - <img title="{{_("Restart Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/arrow_refresh.png" /> + <span class="glyphicon glyphicon-repeat" title="{{_("Restart Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/arrow_refresh.png" /></span> - <img title="{{_("Edit Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/pencil.png" /> + <span class="glyphicon glyphicon-pencil" title="{{_("Edit Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/pencil.png" /></span> - <img title="{{_("Move Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/package_go.png" /> + <span class="glyphicon glyphicon-transfer" title="{{_("Move Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/media/default/img/package_go.png" /></span> </span> </div> {% set progress = (package.linksdone * 100) / package.linkstotal %} - <div id="progress" style="border-radius: 4px; border: 1px solid #AAAAAA; width: 50%; height: 1em"> - <div style="width: {{ progress }}%; height: 100%; background-color: #add8e6;"></div> - <label style="font-size: 0.8em; font-weight: bold; padding-left: 5px; position: relative; top: -17px"> + <div id="progress" class="progress" style="float:left; width: 50%; margin-top: -5px;"> + <div class="progress-bar" role="progressbar" style="width: {{ progress }}%; height: 100%;"> + <label> + {{ package.linksdone }} / {{ package.linkstotal }}</label> + </div> + <label style="padding-right: 5px ;float: right;"> {{ package.sizedone|formatsize }} / {{ package.sizetotal|formatsize }}</label> - <label style="font-size: 0.8em; font-weight: bold; padding-right: 5px ;float: right; position: relative; top: -17px"> - {{ package.linksdone }} / {{ package.linkstotal }}</label> </div> <div style="clear: both; margin-bottom: -10px"></div> - <div id="children_{{package.pid}}" style="display: none;" class="children"> - <span class="child_secrow">{{_("Folder:")}} <span class="folder">{{package.folder}}</span> | {{_("Password:")}} <span class="password">{{package.password}}</span></span> + <div id="children_{{package.pid}}" style="display: none; margin-bottom: 15px;" class="children"> + <span class="child_secrow" style="margin-bottom: 30px; margin-top: 5px;">{{_("Folder:")}} <span class="folder">{{package.folder}}</span> | {{_("Password:")}} <span class="password">{{package.password}}</span></span> <ul id="sort_children_{{package.pid}}" style="list-style: none; padding-left: 0"> </ul> </div> diff --git a/module/web/templates/default/settings.html b/module/web/templates/default/settings.html index a4443025a..cd9b835da 100644 --- a/module/web/templates/default/settings.html +++ b/module/web/templates/default/settings.html @@ -12,10 +12,10 @@ {% block content %} - <ul id="toptabs" class="tabs"> - <li><a class="selected" href="#">{{ _("General") }}</a></li> - <li><a href="#">{{ _("Plugins") }}</a></li> - <li><a href="#">{{ _("Accounts") }}</a></li> + <ul id="toptabs" class="nav nav-tabs"> + <li role="presentation" class"active"><a href="#">{{ _("General") }}</a></li> + <li role="presentation"><a href="#">{{ _("Plugins") }}</a></li> + <li role="presentation"><a href="#">{{ _("Accounts") }}</a></li> </ul> <div id="tabsback" style="height: 20px; padding-left: 150px; color: white; font-weight: bold;"> @@ -25,56 +25,65 @@ <span id="tabs-body"> <!-- General --> <span id="general" class="active tabContent"> - <ul class="nav tabs"> + <ul class="nav tabs" style="width: 20%; float:left;"> <li class> - <a>Menu</a> - <ul id="general-menu"> + <div class="panel panel-default" > + <div class="panel-body" style="overlow-y: scroll; "> + + + <ul id="general-menu" style=" float: left;"> {% for entry,name in conf.general %} <nobr> - <li id="general|{{ entry }}">{{ name }}</li> + <li style="list-style-type: none;" id="general|{{ entry }}">{{ name }}</li> </nobr> <br> {% endfor %} </ul> + </div> + </div> </li> </ul> - <form id="general_form" action="" method="POST" autocomplete="off"> + <form style="float: left; width:40%; margin-left: 20%; diplay:block; position: fixed; overflow: auto;" id="general_form" action="" method="POST" autocomplete="off"> <span id="general_form_content"> <br> <h3> {{ _("Choose a section from the menu") }}</h3> <br> </span> - <input id="general|submit" class="styled_button" type="submit" value="{{_("Submit")}}"/> + <input class="btn btn-primary" style="float:right; margin-right: 10px;" id="general|submit" type="submit" value="{{_("Submit")}}"/> </form> </span> <!-- Plugins --> <span id="plugins" class="tabContent"> - <ul class="nav tabs"> + <ul class="nav tabs" style="width: 20%; float:left; hight:300px;"> <li class> - <a>Menu</a> - <ul id="plugin-menu"> + <div class="panel panel-default" style="overflow-y: scroll; "> + <div class="panel-body" > + + <ul id="plugin-menu" style=" float: left;"> {% for entry,name in conf.plugin %} <nobr> - <li id="plugin|{{ entry }}">{{ name }}</li> + <li style="list-style-type: none;" id="plugin|{{ entry }}">{{ name }}</li> </nobr> <br> {% endfor %} </ul> + <div> + </div> </li> </ul> - <form id="plugin_form" action="" method="POST" autocomplete="off"> + <form style="float: left; width:40%; margin-left: 10px;" id="plugin_form" action="" method="POST" autocomplete="off"> - <span id="plugin_form_content"> + <span id="plugin_form_content" style:"position: static;"> <br> <h3> {{ _("Choose a section from the menu") }}</h3> <br> </span> - <input id="plugin|submit" class="styled_button" type="submit" value="{{_("Submit")}}"/> + <input class="btn btn-primary" style="float:right; margin-right: 10px;" id="plugin|submit" class="styled_button" type="submit" value="{{_("Submit")}}"/> </form> </span> @@ -83,7 +92,7 @@ <span id="accounts" class="tabContent"> <form id="account_form" action="/json/update_accounts" method="POST"> - <table class="settable wide"> + <table class="settable wide table"> <thead> <tr> @@ -163,9 +172,10 @@ </tr> {% endfor %} </table> + <button id="account_add" style="margin-left: 5px;" type="submit" class="btn btn-default"> <span class="glyphicon glyphicon-plus"></button> - <button id="account_submit" type="submit" class="styled_button">{{_("Submit")}}</button> - <button id="account_add" style="margin-left: 0" type="submit" class="styled_button">{{_("Add")}}</button> + <button id="account_submit" type="submit" class="btn btn-primary" >{{_("Submit")}}</button> + </form> </span> </span> diff --git a/module/web/templates/default/settings_item.html b/module/web/templates/default/settings_item.html index 813383343..b760aaa02 100644 --- a/module/web/templates/default/settings_item.html +++ b/module/web/templates/default/settings_item.html @@ -1,4 +1,5 @@ -<table class="settable"> +<table class="settable table"> + {% if section.outline %} <tr><th colspan="2">{{ section.outline }}</th></tr> {% endif %} @@ -23,26 +24,27 @@ {% endfor %} </select> {% elif option.type == "folder" %} - <input name="{{skey}}|{{okey}}" type="text" + <input style="float: right; margin-bottom: 5px;" class="form-control" name="{{skey}}|{{okey}}" type="text" id="{{skey}}|{{okey}}" value="{{option.value}}"/> - <input name="browsebutton" type="button" + <input style="float: right;" class="form-control btn btn-primary" name="browsebutton" type="button" onclick="ifield = document.getElementById('{{skey}}|{{okey}}'); pathchooser = window.open('{% if option.value %}{{ "/pathchooser/" + option.value|quotepath }}{% else %}{{ pathroot }}{% endif %}', 'pathchooser', 'scrollbars=yes,toolbar=no,menubar=no,statusbar=no,width=650,height=300'); pathchooser.ifield = ifield; window.ifield = ifield;" value="{{_("Browse")}}"/> {% elif option.type == "file" %} - <input name="{{skey}}|{{okey}}" type="text" + <input style="float: right; margin-bottom: 5px;" class="form-control" name="{{skey}}|{{okey}}" type="text" id="{{skey}}|{{okey}}" value="{{option.value}}"/> - <input name="browsebutton" type="button" + <input style="float: right;" class="form-control btn btn-primary" name="browsebutton" type="button" onclick="ifield = document.getElementById('{{skey}}|{{okey}}'); filechooser = window.open('{% if option.value %}{{ "/filechooser/" + option.value|quotepath }}{% else %}{{ fileroot }}{% endif %}', 'filechooser', 'scrollbars=yes,toolbar=no,menubar=no,statusbar=no,width=650,height=300'); filechooser.ifield = ifield; window.ifield = ifield;" value="{{_("Browse")}}"/> {% elif option.type == "password" %} - <input id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}" + <input style="float: right;" class="form-control" id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}" type="password" value="{{option.value}}"/> {% else %} - <input id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}" + <input style="float: right;" class="form-control" id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}" type="text" value="{{option.value}}"/> {% endif %} </td> </tr> {% endif %} {% endfor %} + </table>
\ No newline at end of file diff --git a/module/web/templates/default/window.html b/module/web/templates/default/window.html index a11323fe0..ff8a307bc 100644 --- a/module/web/templates/default/window.html +++ b/module/web/templates/default/window.html @@ -1,46 +1,46 @@ <iframe id="upload_target" name="upload_target" src="" style="display: none; width:0;height:0"></iframe> -<div id="add_box" class="window_box"> +<div id="add_box" class="from-group"> <form id="add_form" action="/json/add_package" method="POST" enctype="multipart/form-data"> -<h1>{{_("Add Package")}}</h1> +<h3>{{_("Add Package")}}</h3> <p>{{_("Paste your links or upload a container.")}}</p> -<label for="add_name">{{_("Name")}} -<span class="small">{{_("The name of the new package.")}}</span> -</label> -<input id="add_name" name="add_name" type="text" size="20" /> - -<label for="add_links">{{_("Links")}} -<span class="small">{{_("Paste your links here or any text and press the filter button.")}}</span> -<span class="small"> {{ _("Filter urls") }} -<img alt="URIParsing" Title="Parse Uri" src="/media/default/img/parseUri.png" style="cursor:pointer; vertical-align: text-bottom;" onclick="parseUri()"/> -</span> - -</label> -<textarea rows="5" name="add_links" id="add_links"></textarea> - -<label for="add_password">{{_("Password")}} - <span class="small">{{_("Password for RAR-Archive")}}</span> -</label> -<input id="add_password" name="add_password" type="text" size="20"> - -<label>{{_("File")}} -<span class="small">{{_("Upload a container.")}}</span> -</label> -<input type="file" name="add_file" id="add_file"/> - -<label for="add_dest">{{_("Destination")}} -</label> -<span class="cont"> - {{_("Queue")}} - <input type="radio" name="add_dest" id="add_dest" value="1" checked="checked"/> - {{_("Collector")}} - <input type="radio" name="add_dest" id="add_dest2" value="0"/> -</span> +<div class="form-group"> + <label for="add_name">{{_("Name")}}</label> + <input id="add_name" class="form-control" name="add_name" type="text" size="20" /> + <p class="help-block">{{_("The name of the new package.")}}</p> + </div> + <div class="form-group"> + <label for="add_links">{{_("Links")}}</label> + </div> + <div> + <textarea rows="5" style="width: 100%" name="add_links" id="add_links"></textarea> +</div> +<div class="form-group"> + <p class="help-block">{{_("The name of the new package.")}} {{ _("Filter urls") }} <span class=" glyphicon glyphicon-filter" onclick="parseUri()"></span></p> + </div> + <div class="form-group"> + <label for="add_password">{{_("Password")}}</label> + <input id="add_password" class="form-control" name="add_password" type="text" size="20"> + <p class="help-block">{{_("Password for RAR-Archive")}}</p> + </div> + <div class="form-group"> + <label>{{_("File")}}</label> + <input type="file" name="add_file" id="add_file"/> + <p class="help-block">{{_("Upload a container.")}}</p> + </div> + <div class="form-group"> + <label for="add_dest">{{_("Destination")}}</label> + <span class="cont"> + {{_("Queue")}} + <input type="radio" name="add_dest" id="add_dest" value="1" checked="checked"/> + {{_("Collector")}} + <input type="radio" name="add_dest" id="add_dest2" value="0"/> + </span> + </div> + <button type="submit" class="btn btn-primary" style="float: right; margin-right: 5px;">{{_("Add Package")}}</button> + <button id="add_reset" class="btn btn-default" style="float: right; margin-right: 5px;" type="reset">{{_("Reset")}}</button> +</form> -<button type="submit">{{_("Add Package")}}</button> -<button id="add_reset" style="margin-left:0;" type="reset">{{_("Reset")}}</button> -<div class="spacer"></div> -</form> </div>
\ No newline at end of file |