merge

13 files changed, 729 insertions, 288 deletions

diff --git a/module/web/templates/default.tpl b/module/web/templates/default.tpl
deleted file mode 100644
index 13be260b6..000000000
--- a/module/web/templates/default.tpl
+++ /dev/null
@@ -1,230 +0,0 @@
-%header =  'pyLoad Webinterface'
-%js = ['mootools-1.2.3-core.js','mootools-1.2.3.1-more.js']
-
-%if page== "home": js.append('default/home.js')
-%end
-%if page== "loggedin": red=True
-%else: red=False
-%end
-%if page != "loggedin" and page != "login": js.append('default/status.js')
-%end
-
-%include header title=header, use_js=js, use_css=['default.css','window.css'], redirect=red
-
-%include window id="addlinks", width=400, caption="Add links", body="<textarea rows=10 style='width: 345px;' id='linkarea'></textarea>", button="Add"
-
-<a class="anchor" name="top" id="top"></a>
-
-<div id="head-panel">
-
-
-	<div id="head-search-and-login">
-
-%if page != "login":
-				<img src="static/default/head-login.png" alt="User:" style="vertical-align:middle; margin:2px" /><span style="padding-right: 2px;">{{user}}</span>
-					<ul id="user-actions">
-				<li><a href="/logout"  class="action logout" rel="nofollow">Logout</a></li>
-				<li></li>
-				<li></li>
-			</ul>
-%else:
-    <span style="padding-right: 2px;">Please Login!</span>
-	
-
-%end
-	</div>
-
-	<a href="/"><img id="head-logo" src="/static/default/pyload-logo-edited3.5-new-font-small.png" alt="pyLoad" /></a>
-
-	<div id="head-menu">
-		<ul>
-	<li class="
-        %if page == "home" or page == "login":
-        selected
-        %endif
-        "><a href="/" title=""><img src="static/default/head-menu-home.png" alt="" /> Home</a></li>
-        <li class=" 
-        %if page == "queue":
-        selected
-        %endif
-        "><a href="/queue" title=""><img src="static/default/head-menu-download.png" alt="" /> Queue</a></li>
-        <li class="
-        %if page == "downloads":
-        selected
-        %endif
-        "><a href="/downloads" title=""><img src="static/default/head-menu-development.png" alt="" /> Downloads</a></li>
-        <li class="right"><a href="/logs"  class="action index" accesskey="x" rel="nofollow"><img src="static/default/head-menu-index.png" alt="" />Logs</a></li>		</ul>
-	</div>
-
-	<div style="clear:both;"></div>
-</div>
-
-<ul id="page-actions">
-	<li><a href=""  class="action revisions" accesskey="o" rel="nofollow">Reload page</a></li>
-
-</ul>
-
-<div id="body-wrapper" class="dokuwiki">
-
-	<div id="content" lang="en" dir="ltr">
-
-
-<h1><a name="pyload_download_manager_for_1_click_hoster" id="pyload_download_manager_for_1_click_hoster">pyLoad — Webinterface</a>
-</h1>
-
-
-%if page != "loggedin" and page != "login":
-
-<div id="statusbar">
-  <div id="status" style="float: left;padding: 8px;">
-Status:
-</div>
-  <div id="speed" style="float: left;padding: 8px">
-Speed: 
-</div>
-
- <div id="queue" style="float: left;padding: 8px">
-Files in queue: 
-</div>
-
-<div style="padding-top:2px">
-
-<div style="background-image:url(static/default/Button-Play.png);width:32px;height:32px;float:left"></div>
-<div class= "statusbutton" style="background-image:url(static/default/Button-Play-grey.png); visibility: visible; opacity: 0.01"></div>
-<div style="background-image:url(static/default/Button-Pause.png);width:32px;height:32px;float:left"></div>
-<div class= "statusbutton" style="background-image:url(static/default/Button-Pause-grey.png); visibility: visible; opacity: 0.01"></div>
-<div style="background-image:url(static/default/Button-Add.png);width:32px;height:32px;float:left"></div>
-<div class= "statusbutton" style="background-image:url(static/default/Button-Add-grey.png); visibility: visible; opacity: 0.01"></div>
-
-
-</div>
-
-</div>
-
-%end
-
-
-<br>
-
-<div class="level1" style="clear:both">
-
-%if page == "login":
-
-</div>
-<div class="centeralign">
-<form action="" method="post" accept-charset="utf-8" id="login"><div class="no">
-<input type="hidden" name="do" value="login" /><fieldset ><legend>Login</legend>
-<label class="block" for="focus__this"><span>Username</span> <input type="text" id="focus__this" name="u" class="edit" /></label><br />
-<label class="block"><span>Password</span> <input type="password" name="p" class="edit" /></label><br />
-<input type="submit" value="Login" class="button" />
-</fieldset>
-</div></form>
-</div>
-<br>
-
-%elif page== "home":
-<h2>Downloads:</h2>
-
-<div id="dlcontainer">
-
-% for link in links:
-
-
-<div class="download" id="dl{{link['id']}}" style="color: #000">
-<p></p>
-
-<b>{{link['name']}}</b>
-<br>
-<script type="text/javascript">
-pbs[{{link['id']}}] = new dwProgressBar({
-        container: document.id('dl{{link['id']}}'),
-        startPercentage: {{link['percent']}},
-        speed: 1000,
-        id: {{link['id']}},
-        boxID: 'box',
-        percentageID: 'perc',
-        displayText: true,
-        displayID: 'boxtext'
-});
-
-dls.push({{link['id']}})
-
-</script>
-
-
-<div class="dlsize">
-{{int((link['size'] - link['kbleft']) / 1024)}}/{{int(link['size']) / 1024}} MB
-</div>
-
-
-<div class="dlspeed">
-{{int(link['speed'])}} kb/s
-</div>
-
-
-<div class="dltime">
-{{link['eta']}}
-</div>
-
-
-</div>
-
-
-<script type="text/javascript">
-$$("#dl{{link['id']}}")[0].hover(function(e){
-
-this.morph({'color': '#f00'});
-
-}, function(e){
-
-this.morph({'color': '#000'});
-
-});
-
-
-</script>
-
-
-%end
-
-</div>
-
-
-%elif page=="loggedin":
-
-
-<b>You were successfully logged in</b>
-
-%elif page=="queue":
-
-<ul>
-
-%for id in links['order']:
-
-<li>{{links[id].url}}</li>
-
-%end
-
-</ul>
-
-Currently in Development
-
-%elif page=="downloads":
-
-Currently in Development
-
-
-%end
-	<hr style="clear: both;" />
-
-<div id="foot">© 2008-2009 the pyLoad Team
-
-	<a href="#top" class="action top" accesskey="x"><span>Back to top</span></a><br />
-	<!--<div class="breadcrumbs"></div>-->
-
-
-</div>
-
-</div>
-
-%include footer use_js=[]
\ No newline at end of file
diff --git a/module/web/templates/default/add.html b/module/web/templates/default/add.html
new file mode 100644
index 000000000..525cb99bd
--- /dev/null
+++ b/module/web/templates/default/add.html
@@ -0,0 +1,12 @@
+{% extends 'default/base.html' %}

+

+{% block subtitle %}

+Add Links / Container

+{% endblock %}

+

+

+

+{% block content %}

+<textarea rows="5" style=" width: 100%;"></textarea>

+<input type="file" />

+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html
new file mode 100644
index 000000000..2a2490088
--- /dev/null
+++ b/module/web/templates/default/base.html
@@ -0,0 +1,213 @@
+<?xml version="1.0" ?>

+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

+<html xmlns="http://www.w3.org/1999/xhtml">

+<head>

+

+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

+<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/default.css">

+<!--<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/jquery-ui-1.7.2.custom.css">-->

+<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/window.css">

+<!--<script src="{{ MEDIA_URL }}js/jquery-1.3.2.min.js"></script>-->

+<script src="{{ MEDIA_URL }}js/sprintf.js"></script>

+<script src="{{ MEDIA_URL }}js/funktions.js"></script>

+<script src="{{ MEDIA_URL }}js/mootools-1.2.4-core.js"></script>

+<script src="{{ MEDIA_URL }}js/mootools-1.2.4.2-more.js"></script>

+

+<!--<script src="{{ MEDIA_URL }}js/jquery.progressbar.js"></script>-->

+<!--<script src="{{ MEDIA_URL }}js/jquery.form.js"></script>-->

+

+<title>{% block title %}pyLoad Webinterface{% endblock %}</title>

+

+<script type="text/javascript">

+var add_bg,add_box

+document.addEvent("domready", function(){

+

+	add_bg = new Fx.Tween($('add_bg'));

+	add_box = new Fx.Tween($('add_box'));

+	

+	$('add_form').onsubmit=function() {

+		$('add_form').target = 'upload_target'; //'upload_target' is the name of the iframe

+		out();

+	}

+

+	$('add_reset').addEvent('click', function(){

+		out();

+	});

+	

+	var jsonStatus = new Request.JSON({

+		url: "/json/status",

+		onSuccess: LoadJsonToContent,

+		secure: false,

+                async: true,

+		initialDelay: 0,

+		delay: 4000,

+		limit: 30000

+	})

+	

+	$('action_play').addEvent('click', function(){

+		new Request({method: 'get', url: '/json/unpause'}).send();	

+	});

+	

+	

+	$('action_cancel').addEvent('click', function(){

+		new Request({method: 'get', url: '/json/cancel'}).send();	

+	});

+	

+	

+	$('action_stop').addEvent('click', function(){

+		new Request({method: 'get', url: '/json/pause'}).send();	

+	});

+	

+	jsonStatus.startTimer();

+	

+});

+

+/*function UpdateLinks( SetInver, index )

+{

+	$("#aktiv_percent").text(parseInt($("#aktiv_percent").text)+1)

+	setTimeout( UpdateLinks( SetInver, index+1 ), SetInver[index]*1000);

+}*/

+

+function LoadJsonToContent(data)

+{

+	$("speed").set('text', Math.round(data.speed*100)/100);

+	$("aktiv").set('text', data.activ);

+	$("aktiv_from").set('text', data.queue);

+}

+function show(){

+	add_bg.set('opacity', 0);

+	$("add_bg").setStyle('display', 'block');

+	add_bg.start('opacity',0.8);

+	

+	add_box.set('opacity', 0)

+	$("add_box").setStyle('display', 'block');

+	add_box.start('opacity',1)

+}

+

+function out(){

+	add_bg.start('opacity',0).chain(function(){

+		$('add_bg').setStyle('display', 'none');

+	});

+	

+	add_box.start('opacity',0).chain(function(){

+		$('add_box').setStyle('display', 'none');

+	});

+}

+

+function AddBox()

+{

+	if ($("add_box").getStyle("display") == "hidden" || $("add_box").getStyle("display") == "none" || $("add_box").getStyle("opacity" == 0))

+	{

+		show();

+	}

+	else

+	{

+		out();

+	}

+}

+

+</script>

+

+{% block head %}

+{% endblock %}

+</head>

+

+<a class="anchor" name="top" id="top"></a>

+

+<div id="head-panel">

+

+<div id="head-search-and-login">

+

+{% if user.is_authenticated %}

+<img src="{{ MEDIA_URL }}img/head-login.png" alt="User:" style="vertical-align:middle; margin:2px" /><span style="padding-right: 2px;">{{user.username}}</span>

+	<ul id="user-actions">

+		<li><a href="/logout"  class="action logout" rel="nofollow">Logout</a></li>

+		{% if user.is_staff %}

+		<li><a href="/admin" class="action profile" rel="nofollow">Administrate</a></li>

+		{% endif %}

+		<li></li>

+		<li></li>

+	</ul>

+{% else %}

+    <span style="padding-right: 2px;">Please Login!</span>

+{% endif %}

+

+	</div>

+

+	<a href="/"><img id="head-logo" src="{{ MEDIA_URL }}img/pyload-logo-edited3.5-new-font-small.png" alt="pyLoad" /></a>

+

+	<div id="head-menu">

+		<ul>

+			

+		{% block menu %}

+		<li class="selected">

+		    <a href="/" title=""><img src="{{ MEDIA_URL }}img/head-menu-home.png" alt="" /> Home</a>

+		</li>

+		<li>

+		    <a href="/queue/" title=""><img src="{{ MEDIA_URL }}img/head-menu-download.png" alt="" /> Queue</a></li>

+		<li>

+		    <a href="/downloads/" title=""><img src="{{ MEDIA_URL }}img/head-menu-development.png" alt="" /> Downloads</a></li>

+		<li class="right">

+		    <a href="/logs/"  class="action index" accesskey="x" rel="nofollow"><img src="{{ MEDIA_URL }}img/head-menu-index.png" alt="" />Logs</a>

+		</li>

+		{% endblock %}

+		

+		</ul>

+	</div>

+

+	<div style="clear:both;"></div>

+</div>

+

+{% if perms.pyload.can_change_status %}

+<ul id="page-actions2">

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

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

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

+    <li id="action_add"><a href="javascript:AddBox();"  class="action stop" accesskey="o" rel="nofollow" >Add</a></li>

+</ul>

+{% endif %}

+

+{% if perms.pyload.can_see_dl %}

+<ul id="page-actions">

+	<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.activ }}</b> / <b id="aktiv_from">{{ status.queue }}</b></a></li>

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

+</ul><br />

+{% endif %}

+

+<div id="body-wrapper" class="dokuwiki">

+

+<div id="content" lang="en" dir="ltr">

+

+<h1>{% block subtitle %}pyLoad - Webinterface{% endblock %}</h1>

+

+{% block statusbar %}

+{% endblock %}

+

+

+<br>

+

+<div class="level1" style="clear:both">

+</div>

+

+{% for message in messages %}

+	<b><p>{{message}}</p></b>

+{% endfor %}

+

+{% block content %}

+{% endblock content %}

+

+	<hr style="clear: both;" />

+

+<div id="foot">© 2008-2010 the pyLoad Team

+

+	<a href="#top" class="action top" accesskey="x"><span>Back to top</span></a><br />

+	<!--<div class="breadcrumbs"></div>-->

+

+

+</div>

+</div>

+

+{% include "default/window.html" %}

+<body>

diff --git a/module/web/templates/default/downloads.html b/module/web/templates/default/downloads.html
new file mode 100644
index 000000000..3f07bec47
--- /dev/null
+++ b/module/web/templates/default/downloads.html
@@ -0,0 +1,44 @@
+{% extends 'default/base.html' %}
+
+{% block title %}Downloads - {{block.super}} {% endblock %}
+
+{% block menu %}
+<li>
+    <a href="{% url home %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-home.png" alt="" /> Home</a>
+</li>
+<li>
+    <a href="{% url queue %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-download.png" alt="" /> Queue</a></li>
+<li class="selected">
+    <a href="{% url downloads %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-development.png" alt="" /> Downloads</a></li>
+<li class="right">
+    <a href="{% url logs %}"  class="action index" accesskey="x" rel="nofollow"><img src="{{ MEDIA_URL }}img/head-menu-index.png" alt="" />Logs</a>
+</li>
+{% endblock %}
+
+{% block subtitle %}
+Downloads
+{% endblock %}
+
+{% block content %}
+
+It's recommend not to download Files bigger than ~10MB from here.
+
+<ul>
+    {% for folder in files.folder %}
+    <li>
+        {{ folder.name }}
+        <ul>
+        {% for file in folder.files %}
+        <li><a href='{% url download 'get/' %}{{ folder.name }}/{{ file }}'>{{ file }}</a></li>
+        {% endfor %}
+        </ul>
+    </li>
+    {% endfor %}
+    
+    {% for file in files.files %}
+    <li> <a href={% url download 'get/' %}{{ file }}>{{ file }}</a></li>
+    {% endfor %}
+
+</ul>
+
+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/home.html b/module/web/templates/default/home.html
new file mode 100644
index 000000000..ab2135800
--- /dev/null
+++ b/module/web/templates/default/home.html
@@ -0,0 +1,233 @@
+{% extends 'default/base.html' %}

+

+{% block head %}

+

+<script type="text/javascript">

+

+/*function UpdateLinks( SetInver, index )

+{

+	$("#aktiv_percent").text(parseInt($("#aktiv_percent").text)+1)

+	setTimeout( UpdateLinks( SetInver, index+1 ), SetInver[index]*1000);

+}*/

+var em;

+

+document.addEvent("domready", function(){

+	em = new EntryManager();

+});

+

+var EntryManager = new Class({

+    initialize: function(){

+        this.json = new Request.JSON({

+		url: "json/links",

+                secure: false,

+                async: true,

+		onSuccess: this.update.bind(this),

+		initialDelay: 0,

+		delay: 2500,

+		limit: 30000

+	});

+	

+        this.ids = [{% for link in content %}

+        {% if forloop.last %}

+            {{ link.id }}

+        {% else %}

+         {{ link.id }},

+        {% endif %}

+        {% endfor %}];

+        

+        this.entries = [];

+        this.container = $('LinksAktiv');

+        

+        this.parseFromContent();

+            

+        this.json.startTimer();

+    },

+    parseFromContent: function(){

+        this.ids.each(function(id,index){

+            entry = new LinkEntry(id)

+            entry.parse()

+            this.entries.push(entry)

+            }, this);

+    },

+    update: function(data){

+        

+        try{

+        this.ids = this.entries.map(function(item){

+            return item.id

+            });

+        

+        this.ids.filter(function(id){

+            return !this.ids.contains(id)

+        },data).each(function(id){

+            index = this.ids.indexOf(id);

+            this.entries[index].remove();

+            this.entries = this.entries.filter(function(item){return item.id != this},id);

+            this.ids = this.ids.erase(id)

+            }, this);

+        

+        data.links.each(function(link, i){

+            if (this.ids.contains(link.id)){

+                

+                index = this.ids.indexOf(link.id)

+                this.entries[index].update(link)

+            

+            }else{

+                entry = new LinkEntry(link.id);

+                entry.insert(link);

+                this.entries.push(entry);

+                this.ids.push(link.id);

+                this.container.adopt(entry.elements.tr,entry.elements.pgbTr);

+                entry.fade.start('opacity', 1);

+                entry.fadeBar.start('opacity', 1);

+                

+            }

+            }, this)

+        }catch(e){alert(e)}

+    }

+})

+

+

+var LinkEntry = new Class({

+        initialize: function(id){

+            this.id = id

+        },

+        parse: function(){

+            this.elements = {

+                tr: $("link_{id}".substitute({id: this.id})),

+                name: $("link_{id}_name".substitute({id: this.id})),

+                status: $("link_{id}_status".substitute({id: this.id})),

+                info: $("link_{id}_info".substitute({id: this.id})),

+                kbleft: $("link_{id}_kbleft".substitute({id: this.id})),

+                percent: $("link_{id}_percent".substitute({id: this.id})),

+                remove: $("link_{id}_remove".substitute({id: this.id})),

+                pgbTr: $("link_{id}_pgb_tr".substitute({id: this.id})),

+                pgb: $("link_{id}_pgb".substitute({id: this.id}))

+            }

+            this.initEffects();

+        },

+        insert: function(item){

+            try{

+            info = SecToRightTime(item.eta) +' @ '+ Math.round(item.speed*100)/100+' kb/s' ;

+            

+            this.elements = {

+                tr: new Element('tr', {

+                'html': '',

+                'styles':{

+                    'opacity': 0

+                }

+                }),

+                name: new Element('td', {

+                'html': item.name

+                }),

+                status: new Element('td', {

+                'html': item.status

+                }),

+                info: new Element('td', {

+                'html': info

+                }),

+                kbleft: new Element('td', {

+                'html': HumanFileSize(item.size)

+                }),

+                percent: new Element('font', {

+                'html': item.percent+ '% / '+ HumanFileSize(item.size-item.kbleft)

+                }),

+                remove: new Element('img',{

+                'html': '',

+                'src': 'media/default/img/control_cancel.png',

+                'styles':{

+                    'vertical-align': 'middle',

+                    'margin-right': '-20px',

+                    'margin-left': '5px',

+                    'margin-top': '-2px',

+                    'cursor': 'pointer'

+                }

+                }),

+                pgbTr: new Element('tr', {

+                'html':''

+                }),

+                pgb: new Element('div', {

+                'html': '&nbsp;',

+                'styles':{

+                    'height': '4px',

+                    'width': item.percent+'%',

+                    'background-color': '#ddd',

+                }

+                })

+            }

+            

+            this.elements.tr.adopt(this.elements.name,this.elements.status,this.elements.info,this.elements.kbleft,new Element('td').adopt(this.elements.percent,this.elements.remove));

+            this.elements.pgbTr.adopt(new Element('td',{'colspan':5}).adopt(this.elements.pgb));

+            this.initEffects();

+            }catch(e){

+                alert(e)

+            }

+        },

+        initEffects: function(){

+            this.bar = new Fx.Morph(this.elements.pgb, {unit: '%', duration: 5000, link: 'link', fps:30});

+            this.fade = new Fx.Tween(this.elements.tr);

+            this.fadeBar = new Fx.Tween(this.elements.pgbTr);

+            

+            this.elements.remove.addEvent('click', function(){

+                new Request({method: 'get', url: '/json/abort_link/'+this.id}).send();

+            }.bind(this));

+            

+        },

+        update: function(item){

+                this.elements.name.set('text', item.name);

+                this.elements.status.set('text', item.status);

+                this.elements.info.set('text', SecToRightTime(item.eta)+' @ '+Math.round(item.speed*100)/100+' kb/s');

+                this.elements.kbleft.set('text', HumanFileSize(item.size));

+                this.elements.percent.set('text', item.percent+ '% / '+ HumanFileSize(item.size-item.kbleft));

+                this.bar.start({

+                    'width': item.percent,

+                    'background-color': [Math.round(120/100*item.percent),100,100].hsbToRgb().rgbToHex()

+                });

+        },

+        remove: function(){

+                this.fade.start('opacity',0).chain(function(){this.elements.tr.dispose();}.bind(this));

+                this.fadeBar.start('opacity',0).chain(function(){this.elements.pgbTr.dispose();}.bind(this));

+

+        }

+    });

+</script>

+

+{% endblock %}

+

+{% block subtitle %}

+Active Downloads

+{% endblock %}

+

+{% block content %}

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

+    <thead>

+  <tr class="header">

+    <th>Name</th>

+    <th>Status</th>

+    <th>Infos</th>

+    <th>Size</th>

+    <th>Progress</th>

+  </tr>

+    </thead>

+  <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 }}_kbleft">{{ link.size }}</td>

+    <td>

+        <font id="link_{{ link.id }}_percent">{{ link.percent }}% /{{ link.kbleft }}</font>

+        <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"/>

+    </td>

+  </tr>

+  <tr id="link_{{ link.id }}_pgb_tr">

+    <td colspan="5">

+        <div id="link_{{ link.id }}_pgb" class="progressBar" style="background-color: green; height:4px; width: {{ link.percent }}%;">&nbsp;</div>

+    </td>

+  </tr>

+  {% endfor %}

+  

+  <tbody>

+</table>

+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/login.html b/module/web/templates/default/login.html
new file mode 100644
index 000000000..851802c4f
--- /dev/null
+++ b/module/web/templates/default/login.html
@@ -0,0 +1,35 @@
+{% extends 'default/base.html' %}
+
+{% block title %}Login - {{block.super}} {% endblock %}
+
+{% block content %}
+
+<div class="centeralign">
+<form action="" method="post" accept-charset="utf-8" id="login">
+    <div class="no">
+        <input type="hidden" name="do" value="login" />
+        <fieldset>
+        <legend>Login</legend>
+        <label class="block" for="focus__this">
+            <span>Username</span>
+            {{ form.username }}
+        </label>
+        <br />
+        <label class="block">
+            <span>Password</span>
+            {{ form.password }}
+        </label>
+        <br />
+        <input type="submit" value="Login" class="button" />
+        </fieldset>
+    </div>
+</form>
+
+{% if form.errors %}
+<p>Your username and password didn't match. Please try again.</p>
+{% endif %}
+
+</div>
+<br>
+    
+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/logout.html b/module/web/templates/default/logout.html
new file mode 100644
index 000000000..4d00bf6d5
--- /dev/null
+++ b/module/web/templates/default/logout.html
@@ -0,0 +1,9 @@
+{% extends 'default/base.html' %}
+
+{% block head %}
+<meta http-equiv="refresh" content="3; url=/">
+{% endblock %}
+
+{% block content %}
+<p><b>You were successfully logged out.</b></p>    
+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/logs.html b/module/web/templates/default/logs.html
new file mode 100644
index 000000000..f9b0504d9
--- /dev/null
+++ b/module/web/templates/default/logs.html
@@ -0,0 +1,25 @@
+{% extends 'default/base.html' %}
+
+{% block title %}Logs - {{block.super}} {% endblock %}
+
+{% block menu %}
+<li>
+    <a href="{% url home %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-home.png" alt="" /> Home</a>
+</li>
+<li>
+    <a href="{% url queue %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-download.png" alt="" /> Queue</a></li>
+<li>
+    <a href="{% url downloads %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-development.png" alt="" /> Downloads</a></li>
+<li class="right" class="selected">
+    <a href="{% url logs %}"  class="action index" accesskey="x" rel="nofollow"><img src="{{ MEDIA_URL }}img/head-menu-index.png" alt="" />Logs</a>
+</li>
+{% endblock %}
+
+{% block content %}
+<ul>
+{% for line in log %}
+    <li>{{line.line}}: {{line.content}}</li>
+{% endfor %}
+</ul>
+<a href="{% url logs %}"><< Start</a>  <a href="{% url logs prev %}">< prev</a>  <a href="{% url logs next %}">next ></a>
+{% endblock %}
\ No newline at end of file
diff --git a/module/web/templates/default/queue.html b/module/web/templates/default/queue.html
new file mode 100644
index 000000000..aa21390a0
--- /dev/null
+++ b/module/web/templates/default/queue.html
@@ -0,0 +1,125 @@
+{% extends 'default/base.html' %}

+

+{% block head %}

+<script type="text/javascript">

+

+document.addEvent("domready", function(){

+    $$('.package').each(function(item){

+        id = item.get('id').match(/[0-9]+/)

+        

+        imgs = item.getElements('img');

+        imgs[0].addEvent('click', function(e){

+            new Request({

+                method: 'get',

+                url: '/json/remove_package/'+this,

+                onSuccess: function(){

+                    $('package_'+this).nix()

+                    }.bind(this)

+                }).send();

+            e.stop();

+        }.bind(id));

+        

+        imgs[1].addEvent('click', function(e){

+            new Request({

+                method: 'get',

+                url: '/json/restart_package/'+this,

+                onSuccess: function(){

+                    $('package_'+this).nix()

+                    }.bind(this)

+                }).send();

+            e.stop();

+        }.bind(id));

+        

+        

+        item.getElement('.packagename').addEvent('click', function(){

+            

+            child = item.getElement('.children')

+            if (child.getStyle('display') == "block"){

+                child.dissolve();

+            }else{

+                child.reveal();

+            }

+        }.bind(item));

+        

+        

+        item.getElements('.child').each(function(child){

+            id = child.get('id').match(/[0-9]+/)

+            imgs = child.getElements('.child_secrow img')

+                    imgs[0].addEvent('click', function(e){

+            new Request({

+                method: 'get',

+                url: '/json/remove_link/'+this,

+                onSuccess: function(){

+                    $('file_'+this).nix()

+                    }.bind(this)

+                }).send();

+        }.bind(id));

+        

+        imgs[1].addEvent('click', function(e){

+                        new Request({

+                method: 'get',

+                url: '/json/restart_link/'+this,

+                onSuccess: function(){

+                    $('file_'+this).nix()

+                    }.bind(this)

+                }).send();

+        }.bind(id));

+        });

+        

+    })

+});

+</script>

+{% endblock %}

+

+{% block title %}Queue - {{block.super}} {% endblock %}

+

+{% block menu %}

+<li> <a href="{% url home %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-home.png" alt="" /> Home</a> </li>

+<li class="selected"> <a href="{% url queue %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-download.png" alt="" /> Queue</a></li>

+<li> <a href="{% url downloads %}" title=""><img src="{{ MEDIA_URL }}img/head-menu-development.png" alt="" /> Downloads</a></li>

+<li class="right"> <a href="{% url logs %}"  class="action index" accesskey="x" rel="nofollow"><img src="{{ MEDIA_URL }}img/head-menu-index.png" alt="" />Logs</a> </li>

+{% endblock %}

+

+{% block content %}

+{% for package in content %}

+<div id="package_{{package.id}}" class="package">

+    <div class="packagename" style="cursor: pointer;">

+        {{ package.package_name }}

+        &nbsp;&nbsp;

+        <img width="12px" height="12px" src="{{ MEDIA_URL }}img/delete.png" />

+        &nbsp;&nbsp;

+        <img style="margin-left: -10px" height="12px" src="{{ MEDIA_URL }}img/arrow_refresh.png" />

+    </div>

+    <div id="children_{{package.id}}" style="display: none;" class="children">

+    {% for child in package.children %}

+    <div class="child" id="file_{{child.id}}">

+        <span class="child_status">

+            <img src="/media/default/img/status_{{child.status_type}}.png" style="width: 12px; height:12px;"/>

+        </span>

+        <span style="font-size: 15px">{{ child.filename }}</span><br />

+    <div class="child_secrow">

+        <span class="child_status">{{ child.status_type }}</span>{{child.status_error}}&nbsp;

+        <span class="child_status">{{ child.size }} KB</span>

+        <span class="child_status">{{ child.plugin }}</span>

+        <span class="child_status">Folder: {{child.folder}}</span>

+        &nbsp;&nbsp;

+        <img style="cursor: pointer;" width="10px" height="10px" src="{{ MEDIA_URL }}img/delete.png" />

+        &nbsp;&nbsp;

+        <img style="cursor: pointer;margin-left: -4px" width="10px" height="10px" src="{{ MEDIA_URL }}img/arrow_refresh.png" />

+    </div>

+    </div>

+    {% endfor %}

+    </div>

+</div>

+{% endfor %}

+<!--table >

+  <tr>

+    <td colspan="3"><h1>!Paketname!</h1></td>

+  </tr>

+  <tr>

+    <td><h2>test.png</h2></td>

+    <td>loading</td>

+    <td><a href="/"><img id="button" src="/img/button-delete.gif" alt="delete" /></a><a href="/"><img id="button" src="/img/button-unpause.gif" alt="unpause" /></a></td>

+  </tr>

+</table-->

+{% endblock %} 
\ No newline at end of file
diff --git a/module/web/templates/default/window.html b/module/web/templates/default/window.html
new file mode 100644
index 000000000..7e5c249e6
--- /dev/null
+++ b/module/web/templates/default/window.html
@@ -0,0 +1,33 @@
+<iframe id="upload_target" name="upload_target" src="" style="display: none; width:0;height:0"></iframe>

+<div id="add_bg" style="filter:alpha(opacity:80);KHTMLOpacity:0.80;MozOpacity:0.80;opacity:0.80; background:#000; width:100%; height: 100%; position:absolute; top:0px; left:0px; display:none;">&nbsp;</div>

+<!--<div id="add_box" style="left:50%; top:200px; margin-left: -450px; width: 900px; position: absolute; background: #FFF; padding: 10px 10px 10px 10px; display:none;">-->

+  

+  <!--<div style="width: 900px; text-align: right;"><b onclick="AddBox();">[Close]</b></div>-->

+<div id="add_box" class="myform">

+<form id="add_form" action="/json/add_package" method="POST" enctype="multipart/form-data">

+<h1>Add Package</h1>

+<p>Paste your links or upload a container.</p>

+<label>Name

+<span class="small">The name of the new package.</span>

+</label>

+<input name="add_name" type="text" size="20" />

+

+<label>Links

+<span class="small">Paste your links here</span>

+</label>

+<textarea rows="5" name="add_links" id="add_links"></textarea>

+

+<label>File

+<span class="small">Upload a container.</span>

+</label>

+<input type="file" name="add_file" id="add_file"/>

+

+<button type="submit">Add Package</button>

+<button id="add_reset" style="margin-left:0px;" type="reset">Reset</button>

+<div class="spacer"></div>

+

+</form>

+

+</div>

+

+</div>

diff --git a/module/web/templates/footer.tpl b/module/web/templates/footer.tpl
deleted file mode 100644
index a59b414bf..000000000
--- a/module/web/templates/footer.tpl
+++ /dev/null
@@ -1,6 +0,0 @@
-%for item in use_js:
-<script type="text/javascript" src="static/{{item}}"></script>
-%end
-
-</body>
-</html>
diff --git a/module/web/templates/header.tpl b/module/web/templates/header.tpl
deleted file mode 100644
index 22c252e3c..000000000
--- a/module/web/templates/header.tpl
+++ /dev/null
@@ -1,24 +0,0 @@
-<?xml version="1.0" ?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-
-%for item in use_js:
-<script type="text/javascript" src="static/{{item}}"></script>
-%end
-
-%for item in use_css:
-<link rel="stylesheet" type="text/css" href="static/{{item}}">
-%end
-
-<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
-
-%if redirect:
-<meta http-equiv="refresh" content="3; url=/">
-%end
-
-<title>{{title}}</title>
-
-</head>
-<body>
diff --git a/module/web/templates/window.tpl b/module/web/templates/window.tpl
deleted file mode 100644
index f756c4352..000000000
--- a/module/web/templates/window.tpl
+++ /dev/null
@@ -1,28 +0,0 @@
-<div id="{{id}}" class="StickyWinInstance SWclearfix" style="overflow: visible;visibility: visible;display: none; position: absolute; z-index: 10000; opacity: 1; left: 0px; top: 0px;">
-<div class="DefaultStickyWin" style="width: {{width}}px;">
-
-<div class="top">
-<div class="top_ul"></div>
-<div class="top_ur"><h1 class="caption dragHandle">{{caption}}</h1>
-</div></div>
-
-<div class="middle">
-<div class="body">{{body}}
-</div></div>
-
-<div class="closeBody">
-<div class="closeButtons">
-<a class="closeSticky button" id="bt{{button}}">{{button}}</a><a class="closeSticky button">Close</a>
-</div>
-</div>
-
-<div class="bottom">
-<div class="bottom_ll">
-</div>
-
-<div class="bottom_lr"></div>
-</div>
-<div class="closeButton closeSticky"></div>
-
-</div>
-</div>
\ No newline at end of file