webinterface - activ download - design 60%

4 files changed, 40 insertions, 16 deletions

diff --git a/module/web/media/css/default.css b/module/web/media/css/default.css
index fbfc34d22..a0e82238e 100644
--- a/module/web/media/css/default.css
+++ b/module/web/media/css/default.css
@@ -1008,6 +1008,12 @@ a.play {
 a.play:hover {

 	background:transparent url(/media/img/control_play_blue.png) 0px 1px no-repeat;

 }

+a.cancel {

+	background:transparent url(/media/img/control_cancel.png) 0px 1px no-repeat;

+}

+a.cancel:hover {

+	background:transparent url(/media/img/control_cancel_blue.png) 0px 1px no-repeat;

+}

 a.pause {

 	background:transparent url(/media/img/control_pause.png) 0px 1px no-repeat;

 }

@@ -1458,3 +1464,21 @@ div.codearea pre span.Preprc {
 	float:left;

 	padding-right: 8px;

 }

+.queue {

+	

+	border: none;

+}

+.queue tr td {

+	border: none;

+}

+.header, .header th {

+	text-align: left;

+	font-weight: normal;

+	background-color:#ececec;

+	-moz-border-radius:5px;

+}

+.progress_bar {

+	background: #0C0;

+	height: 5px;

+	

+}

diff --git a/module/web/pyload.db b/module/web/pyload.db
index 57d9bc73c..097ea4d3a 100644
--- a/module/web/pyload.db
+++ b/module/web/pyload.db
diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html
index 73846b0d6..4036180bf 100644
--- a/module/web/templates/default/base.html
+++ b/module/web/templates/default/base.html
@@ -156,7 +156,7 @@ function LoadJsonToContent(data)
 	JSONDATA = data;

 	$("#speed").text(Math.round(data.speed*100)/100);

 	$("#aktiv").text(data.queue);

-	$("#aktiv_from").text(data.total);

+	$("#queue").text(data.total);

 	

 	/*if( data.pause == false )

 	{

@@ -178,9 +178,10 @@ function LinksToContent(data)
 	$("#LinksAktiv").text('');

 	$.each(data, function(i,item)

 	{

-		$("#LinksAktiv").append('<tr id="link_'+item.id+'"><td>'+item.name+'</td><td>'+item.status+'</td><td>'+Math.round(item.speed*100)/100+'@'+SecToRightTime(item.eta)+'</td><td>'+HumanFileSize(item.size)+'</td><td><font id="aktiv_percent">'+item.percent+'</font>% / '+HumanFileSize(item.size-item.kbleft)+'</td></tr>');

+		$("#LinksAktiv").append('<tr id="link_'+item.id+'"><td>'+item.name+'</td><td>'+item.status+'</td><td>'+SecToRightTime(item.eta)+' @ '+Math.round(item.speed*100)/100+' kb/s</td><td>'+HumanFileSize(item.size)+'</td><td><font id="aktiv_percent">'+item.percent+'</font>% / '+HumanFileSize(item.size-item.kbleft)+'</td></tr>');

 		//SetInver[i] = (item.size / 100 ) / item.speed ;

 		//window.setInterval( $("#aktiv_percent").text(parseInt($("#aktiv_percent").text)+1), ((item.size / 100 ) / item.speed)*100);

+		$("#LinksAktiv").append('<tr><td colspan="5"><div class="progress_bar" style="width: '+(100/item.size)*(item.size-item.kbleft)+'%;">&nbsp;</div></td></tr>');

 	});

 	//UpdateLinks(SetInver, 0);

 	setTimeout(function()

@@ -264,15 +265,15 @@ $(document).ready(function(){
 {% if perms.pyload.can_change_status %}

 <ul id="page-actions2">

 	<li id="action_play"><a href="/json/unpause"  class="action play" accesskey="o" rel="nofollow">Play</a></li>

-    <li id="action_stop"><a href=""  class="action stop" accesskey="o" rel="nofollow">Stop</a></li>

-    <li id="action_stop"><a href="/json/pause"  class="action stop" accesskey="o" rel="nofollow" name="Stop after ending last one" alt="Stop after ending last one">SAELO</a></li>

+    <li id="action_stop"><a href=""  class="action cancel" accesskey="o" rel="nofollow">Cancel</a></li>

+    <li id="action_stop"><a href="/json/pause"  class="action stop" accesskey="o" rel="nofollow">Stop</a></li>

 </ul>

 {% endif %}

 

 {% if perms.pyload.can_see_dl %}

 <ul id="page-actions">

-	<li><a href=""  class="action backlink" accesskey="o" rel="nofollow">Speed: <b id="speed">{{ status.speed }}</b> kb/s</a></li>

-    <li><a href=""  class="action cog" accesskey="o" rel="nofollow">Active: <b id="aktiv">{{ status.queue }}</b> / <b id="aktiv_from">{{ status.total }}</b></a></li>

+	<li><a class="action backlink">Speed: <b id="speed">{{ status.speed }}</b> kb/s</a></li>

+    <li><a class="action cog">Active: <b id="aktiv">{{ status.queue }}</b> / <b id="aktiv_from">{{ status.total }}</b></a></li>

     <li><a href=""  class="action revisions" accesskey="o" rel="nofollow">Reload page</a></li>

 </ul><br />

 {% endif %}

diff --git a/module/web/templates/default/home.html b/module/web/templates/default/home.html
index ac9c5d25c..8124902db 100644
--- a/module/web/templates/default/home.html
+++ b/module/web/templates/default/home.html
@@ -7,16 +7,15 @@ Active Downloads
 

 

 {% block content %}

-<table>

-<tbody id="LinksAktiv">

-  <tr>

-    <td></td>

-    <td></td>

-    <td></td>

-    <td></td>

-    <td></td>

+<table width="100%" class="queue">

+  <tr class="header">

+    <th>Name</th>

+    <th>Status</th>

+    <th>Infos</th>

+    <th>Size</th>

+    <th>Progress</th>

   </tr>

-<tbody>

+  <tbody id="LinksAktiv">

+  <tbody>

 </table>

-

 {% endblock %}
\ No newline at end of file