From a5f665f504dc544b4a03f2ee81da6c44555415e5 Mon Sep 17 00:00:00 2001
From: Walter Purcaro <vuolter@gmail.com>
Date: Tue, 17 Feb 2015 19:35:35 +0100
Subject: Update webui

---
 pyload/webui/themes/Next/tml/admin.html         | 100 +++++++++
 pyload/webui/themes/Next/tml/base.html          | 199 +++++++++++++++++
 pyload/webui/themes/Next/tml/captcha.html       |  40 ++++
 pyload/webui/themes/Next/tml/downloads.html     |  29 +++
 pyload/webui/themes/Next/tml/filemanager.html   |  80 +++++++
 pyload/webui/themes/Next/tml/folder.html        |  15 ++
 pyload/webui/themes/Next/tml/home.html          | 277 ++++++++++++++++++++++++
 pyload/webui/themes/Next/tml/info.html          |  81 +++++++
 pyload/webui/themes/Next/tml/login.html         |  36 +++
 pyload/webui/themes/Next/tml/logout.html        |   9 +
 pyload/webui/themes/Next/tml/logs.html          |  41 ++++
 pyload/webui/themes/Next/tml/pathchooser.html   |  76 +++++++
 pyload/webui/themes/Next/tml/queue.html         | 109 ++++++++++
 pyload/webui/themes/Next/tml/settings.html      | 217 +++++++++++++++++++
 pyload/webui/themes/Next/tml/settings_item.html |  50 +++++
 pyload/webui/themes/Next/tml/window.html        |  46 ++++
 16 files changed, 1405 insertions(+)
 create mode 100644 pyload/webui/themes/Next/tml/admin.html
 create mode 100644 pyload/webui/themes/Next/tml/base.html
 create mode 100644 pyload/webui/themes/Next/tml/captcha.html
 create mode 100644 pyload/webui/themes/Next/tml/downloads.html
 create mode 100644 pyload/webui/themes/Next/tml/filemanager.html
 create mode 100644 pyload/webui/themes/Next/tml/folder.html
 create mode 100644 pyload/webui/themes/Next/tml/home.html
 create mode 100644 pyload/webui/themes/Next/tml/info.html
 create mode 100644 pyload/webui/themes/Next/tml/login.html
 create mode 100644 pyload/webui/themes/Next/tml/logout.html
 create mode 100644 pyload/webui/themes/Next/tml/logs.html
 create mode 100644 pyload/webui/themes/Next/tml/pathchooser.html
 create mode 100644 pyload/webui/themes/Next/tml/queue.html
 create mode 100644 pyload/webui/themes/Next/tml/settings.html
 create mode 100644 pyload/webui/themes/Next/tml/settings_item.html
 create mode 100644 pyload/webui/themes/Next/tml/window.html

(limited to 'pyload/webui/themes/Next/tml')

diff --git a/pyload/webui/themes/Next/tml/admin.html b/pyload/webui/themes/Next/tml/admin.html
new file mode 100644
index 000000000..5c71cbac5
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/admin.html
@@ -0,0 +1,100 @@
+{% extends '/tml/base.html' %}
+
+{% block head %}
+    <script type="text/javascript" src="/js/admin.js"></script>
+{% endblock %}
+
+
+{% block title %}{{ _("Administrate") }} - {{ super() }} {% endblock %}
+{% block subtitle %}{{ _("Administrate") }}{% endblock %}
+
+{% block content %}
+    <div class="btn-group">
+    <a href="#" id="quit-pyload" class="btn btn-default"><span class="glyphicon glyphicon-off"></span> {{_("Quit pyLoad")}}</a>
+    <a href="#" id="restart-pyload" class="btn btn-default"><span class="glyphicon glyphicon-repeat"></span> {{_("Restart pyLoad")}}</a>
+</div>
+    <br>
+    <br>
+
+    {{ _("To add user or change passwords use:") }} <b>python pyLoadCore.py -u</b><br>
+    {{ _("Important: Admin user have always all permissions!") }}
+<br>
+<br>
+    <form action="" method="POST" >
+        <table class="settable table" style="width:50%;">
+            <thead>
+            <th>
+                {{ _("Name") }}
+            </th>
+            <th>
+                {{ _("Change Password") }}
+            </th>
+            <th>
+                {{ _("Admin") }}
+            </th>
+            <th>
+                {{ _("Permissions") }}
+            </th>
+            </thead>
+
+            {% for name, data in users.iteritems() %}
+                <tr>
+                    <td>{{ name }}</td>
+                    <td><a class="change_password btn btn-default btn-xs" href="#" id="change_pw|{{name}}"><span class="glyphicon glyphicon-pencil"></span> {{ _("change") }}</a></td>
+                    <td><input name="{{ name }}|admin" type="checkbox" {% if data.perms.admin %} checked="True" {% endif %}></td>
+                    <td>
+                        <select multiple="multiple" size="{{ permlist|length }}" name="{{ name }}|perms">
+                            {% for perm in permlist %}
+                            {% if data.perms|getitem(perm) %}
+                                <option selected="selected">{{ perm }}</option>
+                            {% else %}
+                                <option>{{ perm }}</option>
+                            {% endif %}
+                            {% endfor %}
+                        </select>
+                    </td>
+                </tr>
+            {% endfor %}
+
+
+        </table>
+
+        <button class="btn btn-primary" type="submit">{{ _("Submit") }}</button>
+    </form>
+{% endblock %}
+{% block hidden %}
+    <div id="password_box" style="z-index: 2">
+        <form id="password_form" class="from-group" action="/json/change_password" method="POST" enctype="multipart/form-data">
+            <h3>{{ _("Change Password") }}</h3>
+            <p>{{ _("Enter your current and desired Password.") }}</p>
+
+<div class="form-group">
+    <label for="user_login">{{ _("User") }}</label>
+    <input class="form-control" id="user_login" name="user_login" type="text"/>
+    <p class="help-block">{{ _("Your username.") }}</p>
+  </div>
+  <div class="form-group">
+      <label for="login_current_password">{{ _("Current password") }}</label>
+      <input class="form-control" id="login_current_password" name="login_current_password" type="password"/>
+      <p class="help-block">{{ _("The password for this account.") }}</p>
+  </div>
+  <div class="form-group">
+        <label for="login_new_password">{{ _("New password") }}</label>
+        <input class="form-control" id="login_new_password" name="login_new_password" type="password"/>
+        <p class="help-block">{{ _("The new password.") }}</p>
+  </div>
+  <div class="form-group">
+        <label for="login_new_password2">{{ _("New password (repeat)") }}</label>
+        <input class="form-control" id="login_new_password2" name="login_new_password2" type="password" />
+        <p class="help-block">{{ _("Please repeat the new password.") }}</p>
+  </div>
+
+
+
+            <button class="btn btn-primary" id="login_password_button" type="submit" style="float: right">{{ _("Submit") }}</button>
+            <button class="btn btn-default" id="login_password_reset" style="margin-right: 5px; float: right" type="reset">{{ _("Reset") }}</button>
+            <div class="spacer"></div>
+        </form>
+
+    </div>
+{% endblock %}
diff --git a/pyload/webui/themes/Next/tml/base.html b/pyload/webui/themes/Next/tml/base.html
new file mode 100644
index 000000000..b8365361e
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/base.html
@@ -0,0 +1,199 @@
+<?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="/css/window.css"/>
+<link rel="stylesheet" type="text/css" href="/css/MooDialog.css"/>
+<link rel="stylesheet" href="/lib/Bootstrap/css/bootstrap.min.css">
+
+<script type="text/javascript" src="/lib/MooTools/MooTools-Core.js"></script>
+<script type="text/javascript" src="/lib/MooTools/MooTools-More.js"></script>
+<script type="text/javascript" src="/lib/MooTools/MooDialog/MooDialog.js"></script>
+<script type="text/javascript" src="/lib/MooTools/Purr/purr.js"></script>
+
+
+<script type="text/javascript" src="/js/base.js"></script>
+
+
+
+<title>{% block title %}pyLoad {{_("Webinterface")}}{% endblock %}</title>
+
+{% block head %}
+{% endblock %}
+</head>
+<body>
+<a class="anchor" name="top" id="top"></a>
+
+<div id="head-panel">
+
+
+    <div id="head-search-and-login">
+    {% block headpanel %}
+
+        {% if user.is_authenticated %}
+
+
+{% if update %}
+<span>
+<span style="font-weight: bold; margin: 0 2px 0 2px;">{{_("pyLoad Update available!")}}</span>
+</span>
+{% endif %}
+
+
+{% if plugins %}
+<span>
+<span style="font-weight: bold; margin: 0 2px 0 2px;">{{_("Plugins updated, please restart!")}}</span>
+</span>
+{% endif %}
+
+
+
+
+
+	</ul>
+{% else %}
+    <span style="padding-right: 2px;">{{_("Please Login!")}}</span>
+{% endif %}
+
+    {% endblock %}
+	</div>
+
+        <nav class="navbar navbar-default">
+          <div class="container-fluid">
+            <!-- Brand and toggle get grouped for better mobile display -->
+            <div class="navbar-header">
+              <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+                <span class="sr-only">Toggle navigation</span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+              </button>
+              <a class="navbar-brand" href="#"><img id="head-logo" src="/img/pyload-logo.png" alt="pyLoad" style="height:30px;"/></a>
+            </div>
+
+	<a href="/"></a>
+
+        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+              <ul class="nav navbar-nav">
+		
+        {% macro selected(name, right=False) -%}
+            {% if name in url -%}class="{% if right -%}right {% endif %}selected"{%- endif %}
+            {% if not name in url and right -%}class="right"{%- endif %}
+        {%- endmacro %}
+
+
+		{% block menu %}
+		<li>
+		    <a href="/" title=""><span class="glyphicon glyphicon-home"></span> {{_("Home")}}</a>
+		</li>
+		<li {{ selected('queue') }}>
+		    <a href="/queue/" title=""><span class="glyphicon glyphicon-tasks"></span> {{_("Queue")}}</a>
+		</li>
+		<li {{ selected('collector') }}>
+		    <a href="/collector/" title=""><span class="glyphicon glyphicon-magnet"></span>  {{_("Collector")}}</a>
+		</li>
+		<li {{ selected('downloads') }}>
+		    <a href="/downloads/" title=""> <span class="glyphicon glyphicon-download"></span> {{_("Downloads")}}</a>
+		</li>
+{#		<li {{ selected('filemanager') }}>#}
+{#		    <a href="/filemanager/" title=""><span class="glyphicon glyphicon-magnet"></span>  {{_("FileManager")}}</a>#}
+{#		</li>#}
+		<li {{ selected('logs', True) }}>
+		    <a href="/logs/"  class="action index" accesskey="x" rel="nofollow"><span class="glyphicon glyphicon-list"></span> {{_("Logs")}}</a>
+		</li>
+		<li {{ selected('settings', True) }}>
+		    <a href="/settings/"  class="action index" accesskey="x" rel="nofollow"><span class="glyphicon glyphicon-wrench"></span> {{_("Config")}}</a>
+		</li>
+		{% endblock %}
+
+
+                      </ul>
+                    <ul class="nav navbar-nav navbar-right">
+                      <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 %}
+                      <li><a href="/info"  class="action info" rel="nofollow"><span class="glyphicon glyphicon-info-sign"></span></a></li>
+
+                    </ul>
+                  </div><!-- /.navbar-collapse -->
+                </div><!-- /.container-fluid -->
+		
+	</div>
+</nav>
+	<div style="clear:both;"></div>
+</div>
+
+{% if perms.STATUS %}
+<div class="btn-group btn-group-sm" role="group" aria-label="..." style="margin-left:10px;">
+  <button id="action_play" class="btn btn-default" href="#"><span class="glyphicon glyphicon-play"></span>&nbsp;</button>
+  <button id="action_stop" type="button" class="btn btn-default"><span class="glyphicon glyphicon-stop"></span>&nbsp;</button>
+  <button id="action_cancel" type="button" class="btn btn-default"><span class="glyphicon glyphicon-remove"></span>&nbsp;</button>
+  <button id="action_add" type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span>&nbsp;</button>
+</div>
+
+
+{% endif %}
+<span id="cap_info" style="display: {% if captcha %}inline{%else%}none{% endif %}">
+<button id="action_add" type="button" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-barcode"></span><span> {{_("Captcha waiting")}}</span></button>
+</span>
+
+
+{% if perms.LIST %}
+
+<div class="btn-group btn-group-sm" role="group" aria-label="..." style="margin-right:10px; float:right;">
+  <button id="action_play" class="btn btn-default"><span >{{_("Download:")}}</span>&nbsp;<span  class="label label-{% if status.download %}success{% else %}danger{% endif %}">{% if status.download %}{{_("on")}}{% else %}{{_("off")}}{% endif %}</span></button>
+  <button id="action_stop" type="button" class="btn btn-default"><span>{{_("Reconnect:")}}</span>&nbsp;<span class="label label-{% if status.reconnect %}success{% else %}danger{% endif %}">{% if status.reconnect %}{{_("on")}}{% else %}{{_("off")}}{% endif %}</span></button>
+  <button id="action_cancel" type="button" class="btn btn-default"><span class="action backlink">{{_("Speed:")}} <b id="speed">{{ status.speed }}</b></span></button>
+  <button id="action_add" type="button" class="btn btn-default"><span class="action cog">{{_("Active:")}} <b id="aktiv" title="{{_("Active")}}">{{ status.active }}</b> / <b id="aktiv_from" title="{{_("Queued")}}">{{ status.queue }}</b> / <b id="aktiv_total" title="{{_("Total")}}">{{ status.total }}</b></span></button>
+</div>
+
+{% endif %}
+
+{% block pageactions %}
+{% endblock %}
+<br/>
+
+<div id="body-wrapper" class="dokuwiki">
+
+<div id="content" style="width: 98%; margin-left:10px; margin-rigth:10px;" lang="en" dir="ltr">
+
+<h3>{% block subtitle %}pyLoad - {{_("Webinterface")}}{% endblock %}</h3>
+
+{% block statusbar %}
+{% endblock %}
+{% for message in messages %}
+	<b><p>{{message}}</p></b>
+{% endfor %}
+
+<div id="load-indicator" style="opacity: 0; float: right; margin-top: -10px;">
+    <img src="/img/ajax-loader.gif" alt="" style="padding-right: 5px"/>
+    {{_("loading")}}
+</div>
+
+{% block content %}
+{% endblock content %}
+
+	<hr style="clear: both;" />
+
+<div id="foot" style="with: 98%; margin-left: 10px; margin-right:10px">&copy; 2008-2011 pyLoad Team
+<a href="#top" class="action top" accesskey="x"><span>{{_("Back to top")}}</span></a><br />
+<!--<div class="breadcrumbs"></div>-->
+
+</div>
+</div>
+</div>
+
+<div style="display: none;">
+    {% include "/tml/window.html" %}
+    {% include "/tml/captcha.html" %}
+    {% block hidden %}
+    {% endblock %}
+</div>
+<noscript><h1>Enable JavaScript to use the webinterface.</h1></noscript>
+</body>
+</html>
diff --git a/pyload/webui/themes/Next/tml/captcha.html b/pyload/webui/themes/Next/tml/captcha.html
new file mode 100644
index 000000000..5a5893b72
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/captcha.html
@@ -0,0 +1,40 @@
+<!-- Captcha box -->
+<div id="cap_box" >
+
+	<form id="cap_form" class="form-group" action="/json/set_captcha" method="POST" enctype="multipart/form-data" onsubmit="return false;">
+	
+		<h3>{{_("Captcha reading")}}</h3>
+		<p id="cap_title">{{_("Please read the text on the captcha.")}}</p>
+		
+		<div id="cap_textual">
+		
+			<input id="cap_id" name="cap_id" type="hidden" value="" />
+		
+                        <div class="form-group">
+			<label>{{_("Captcha")}}</label>
+			<span ></br>
+			    <img id="cap_textual_img" style="border: 1px solid #bbb; padding: 3px 3px 3px 3px;" src="">
+			</span>
+                </div>
+                <div class="form-group">
+			<label>{{_("Text")}}</label>
+			<input class="form-control" id="cap_result" name="cap_result" type="text" size="20" />
+                        <p class="small">{{_("Input the text on the captcha.")}}</p>		
+		</div>
+		
+		<div id="cap_positional" style="text-align: center">
+		    <img id="cap_positional_img" src="" style="margin: 10px; cursor:pointer">
+		</div>
+
+		<div id="button_bar" style="text-align: center">
+			<span>
+				<button class="btn btn-primary" id="cap_submit" type="submit" style="float: right; margin-left: 5px;">{{_("Submit")}}</button>
+				<button class="btn btn-default" id="cap_reset" type="reset" style="float: right">{{_("Close")}}</button>
+			</span>
+		</div>
+		
+		<div class="spacer"></div>
+	
+	</form>
+
+</div>
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/downloads.html b/pyload/webui/themes/Next/tml/downloads.html
new file mode 100644
index 000000000..295fbf670
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/downloads.html
@@ -0,0 +1,29 @@
+{% extends '/tml/base.html' %}
+
+{% block title %}Downloads - {{super()}} {% endblock %}
+
+{% block subtitle %}
+{{_("Downloads")}}
+{% endblock %}
+
+{% block content %}
+
+<ul style="list-style-type: none;">
+    {% for folder in files.folder %}
+    <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 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 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>
+
+{% endblock %}
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/filemanager.html b/pyload/webui/themes/Next/tml/filemanager.html
new file mode 100644
index 000000000..9d3aded8f
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/filemanager.html
@@ -0,0 +1,80 @@
+{% extends '/tml/base.html' %}
+
+{% block head %}
+
+<script type="text/javascript" src="/js/filemanager.js"></script>
+
+<script type="text/javascript">
+
+document.addEvent("domready", function(){
+    var fmUI = new FilemanagerUI("url",1);
+});
+</script>
+{% endblock %}
+
+{% block title %}Downloads - {{super()}} {% endblock %}
+
+
+{% block subtitle %}
+{{_("FileManager")}}
+{% endblock %}
+
+{% macro display_file(file) %}
+  <li class="file">
+    <input type="hidden" name="path" class="path" value="{{ file.path }}" />
+    <input type="hidden" name="name" class="name" value="{{ file.name }}" />
+    <span>
+      <b>{{ file.name }}</b>
+      <span class="buttons" style="opacity:0">
+	    <img title="{{_("Rename Directory")}}" class="rename" style="cursor: pointer" height="12px" src="/img/pencil.png" />
+	    &nbsp;&nbsp;
+	    <img title="{{_("Delete Directory")}}" class="delete" style="margin-left: -10px; cursor: pointer" width="12px" height="12px" src="/img/delete.png" />
+      </span>
+    </span>
+  </li>
+{%- endmacro %}
+
+{% macro display_folder(fld, open = false) -%}
+    <li class="folder">
+      <input type="hidden" name="path" class="path" value="{{ fld.path }}" />
+      <input type="hidden" name="name" class="name" value="{{ fld.name }}" />
+      <span>
+	<b>{{ fld.name }}</b>
+	<span class="buttons" style="opacity:0">
+	      <img title="{{_("Rename Directory")}}" class="rename" style="cursor: pointer" height="12px" src="/img/pencil.png" />
+	      &nbsp;&nbsp;
+	      <img title="{{_("Delete Directory")}}" class="delete" style="margin-left: -10px; cursor: pointer" width="12px" height="12px" src="/img/delete.png" />
+	      &nbsp;&nbsp;
+	      <img title="{{_("Add subdirectory")}}" class="mkdir" style="margin-left: -10px; cursor: pointer" width="12px" height="12px" src="/img/add_folder.png" />
+	</span>
+      </span>
+      {% if (fld.folders|length + fld.files|length) > 0 %}
+	{% if open %}
+	  <ul>
+	{% else %}
+	  <ul style="display:none">
+	{% endif %}
+	  {% for child in fld.folders %}
+	      {{ display_folder(child) }}
+	  {% endfor %}
+	  {% for child in fld.files %}
+	      {{ display_file(child) }}
+	  {% endfor %}
+	</ul>
+      {% else %}
+	<div style="display:none">{{ _("Folder is empty") }}</div>
+      {% endif %}
+    </li>
+{%- endmacro %}
+
+{% block content %}
+
+<div style="clear:both"><!-- --></div>
+
+<ul id="directories-list">
+{{ display_folder(root, true) }}
+</ul>
+
+{% include "/tml/rename_directory.html" %}
+
+{% endblock %}
diff --git a/pyload/webui/themes/Next/tml/folder.html b/pyload/webui/themes/Next/tml/folder.html
new file mode 100644
index 000000000..9a87ffddc
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/folder.html
@@ -0,0 +1,15 @@
+<li class="folder">
+  <input type="hidden" name="path" class="path" value="{{ path }}" />
+  <input type="hidden" name="name" class="name" value="{{ name }}" />
+  <span>
+    <b>{{ name }}</b>
+    <span class="buttons" style="opacity:0">
+	  <img title="{{_("Rename Directory")}}" class="rename" style="cursor: pointer" height="12px" src="/img/pencil.png" />
+	  &nbsp;&nbsp;
+	  <img title="{{_("Delete Directory")}}" class="delete" style="margin-left: -10px; cursor: pointer" width="12px" height="12px" src="/img/delete.png" />
+	  &nbsp;&nbsp;
+	  <img title="{{_("Add subdirectory")}}" class="mkdir" style="margin-left: -10px; cursor: pointer" width="12px" height="12px" src="/img/add_folder.png" />
+    </span>
+  </span>
+  <div style="display:none">{{ _("Folder is empty") }}</div>
+</li>
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/home.html b/pyload/webui/themes/Next/tml/home.html
new file mode 100644
index 000000000..57d442bd1
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/home.html
@@ -0,0 +1,277 @@
+{% extends '/tml/base.html' %}
+{% block head %}
+
+<script type="text/javascript">
+
+var em;
+var operafix = (navigator.userAgent.toLowerCase().search("opera") >= 0);
+
+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){
+            var entry = new LinkEntry(id);
+            entry.parse();
+            this.entries.push(entry)
+            }, this);
+    },
+    update: function(data){
+
+        try{
+        this.ids = this.entries.map(function(item){
+            return item.fid
+            });
+
+        this.ids.filter(function(id){
+            return !this.ids.contains(id)
+        },data).each(function(id){
+            var index = this.ids.indexOf(id);
+            this.entries[index].remove();
+            this.entries = this.entries.filter(function(item){return item.fid != this},id);
+            this.ids = this.ids.erase(id)
+            }, this);
+
+        data.links.each(function(link, i){
+            if (this.ids.contains(link.fid)){
+
+                var index = this.ids.indexOf(link.fid);
+                this.entries[index].update(link)
+
+            }else{
+                var entry = new LinkEntry(link.fid);
+                entry.insert(link);
+                this.entries.push(entry);
+                this.ids.push(link.fid);
+                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.fid = 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})),
+                bleft: $("link_{id}_bleft".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{
+
+
+
+            this.elements = {
+                tr: new Element('tr', {
+                'html': '',
+                'styles':{
+                    'opacity': 0,
+                }
+                }),
+                status: new Element('td', {
+                'html': '&nbsp;',
+                }),
+                statusspan: new Element('span', {
+                'html': item.statusmsg,
+                'class': 'label label-default',
+                        'styles':{
+
+                        }
+                }),
+                name: new Element('td', {
+                'html': item.name
+                }),
+                info: new Element('td', {
+                'html': item.info
+                }),
+                bleft: new Element('td', {
+                'html': humanFileSize(item.size)
+                }),
+                percent: new Element('span', {
+                'html': item.percent+ '% / '+ humanFileSize(item.size-item.bleft)
+                }),
+                remove: new Element('span',{
+                'html': '',
+                'class': 'glyphicon glyphicon-remove',
+                        'styles':{
+                            'margin-left': '3px',
+                        }
+                }),
+                pgbTr: new Element('tr', {
+                'html':'',
+                        'styles':{
+                            'border-top-color': '#fff',
+                        }
+                }),
+                progress: new Element('div', {
+                'html':'',
+                'class':'progress',
+                        'styles':{
+                            'margin-bottom': '0px',
+                        }
+                }),
+                pgb: new Element('div', {
+                'html':'',
+                'class':'progress-bar progress-bar-striped active',
+                'role':'progress',
+                'styles':{
+                    'width': item.percent+'%',
+                    'background-color': '#ddd'
+                }
+                })
+
+            };
+
+
+            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)
+            }
+        },
+        initEffects: function(){
+            if(!operafix)
+                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.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),80,70].hsbToRgb().rgbToHex()
+                    });
+                }
+                else
+                {
+                    this.elements.pgb.set(
+                        'styles', {
+                            'height': '4px',
+                            'width': item.percent+'%',
+                            '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));
+                this.fadeBar.start('opacity',0).chain(function(){this.elements.pgbTr.dispose();}.bind(this));
+
+        }
+    });
+
+
+</script>
+{% endblock %}
+
+{% block subtitle %}{{_("Active Downloads")}}{% endblock %}
+{% block content %}
+<table class="table" style="width:100%;">
+    <thead>
+  <tr class="header">
+    <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 }}_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="/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>
+</div>
+{% endblock %}
diff --git a/pyload/webui/themes/Next/tml/info.html b/pyload/webui/themes/Next/tml/info.html
new file mode 100644
index 000000000..053ec8210
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/info.html
@@ -0,0 +1,81 @@
+{% extends '/tml/base.html' %}
+
+{% block head %}
+    <script type="text/javascript">
+        window.addEvent("domready", function() {
+            var ul = new Element('ul#twitter_update_list');
+            var script1 = new Element('script[src=http://twitter.com/javascripts/blogger.js][type=text/javascript]');
+            var script2 = new Element('script[src=http://twitter.com/statuses/user_timeline/pyLoad.json?callback=twitterCallback2&count=6][type=text/javascript]');
+            $("twitter").adopt(ul, script1, script2);
+        });
+    </script>
+{% endblock %}
+
+{% block title %}{{ _("Information") }} - {{ super() }} {% endblock %}
+{% block subtitle %}{{ _("Information") }}{% endblock %}
+
+{% block content %}
+    <h3>{{ _("News") }}</h3>
+    <div id="twitter"></div>
+
+    <h3>{{ _("Support") }}</h3>
+
+    <ul>
+        <li style="font-weight:bold;">
+            <a href="http://pyload.org/wiki" target="_blank">Wiki</a>
+            &nbsp;&nbsp;|&nbsp;&nbsp;
+            <a href="http://forum.pyload.org/" target="_blank">Forum</a>
+            &nbsp;&nbsp;|&nbsp;&nbsp;
+            <a href="http://pyload.org/irc/" target="_blank">Chat</a>
+        </li>
+        <li style="font-weight:bold;"><a href="http://docs.pyload.org" target="_blank">Documentation</a></li>
+        <li style="font-weight:bold;"><a href="https://bitbucket.org/spoob/pyload/overview" target="_blank">Development</a></li>
+        <li style="font-weight:bold;"><a href="https://bitbucket.org/spoob/pyload/issues?status=new&status=open" target="_blank">Issue Tracker</a></li>
+
+    </ul>
+
+    <h3>{{ _("System") }}</h3>
+    <table class="system">
+         <tr>
+            <td><b>{{ _("Python:") }}</b></td>
+            <td>{{ python }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("OS:") }}</b></td>
+            <td>{{ os }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("pyLoad version:") }}</b></td>
+            <td>{{ version }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Installation Folder:") }}</b></td>
+            <td>{{ folder }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Config Folder:") }}</b></td>
+            <td>{{ config }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Download Folder:") }}</b></td>
+            <td>{{ download }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Free Space:") }}</b></td>
+            <td>{{ freespace }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Language:") }}</b></td>
+            <td>{{ language }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Webinterface Port:") }}</b></td>
+            <td>{{ webif }}</td>
+        </tr>
+        <tr>
+            <td><b>{{ _("Remote Interface Port:") }}</b></td>
+            <td>{{ remote }}</td>
+        </tr>
+    </table>
+
+{% endblock %}
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/login.html b/pyload/webui/themes/Next/tml/login.html
new file mode 100644
index 000000000..93d50d64d
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/login.html
@@ -0,0 +1,36 @@
+{% extends '/tml/base.html' %}
+
+{% block title %}{{_("Login")}} - {{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>
+            <span>{{_("Username")}}</span>
+            <input type="text" size="20" name="username" />
+        </label>
+        <br />
+        <label>
+            <span>{{_("Password")}}</span>
+            <input type="password" size="20" name="password" />
+        </label>
+        <br />
+        <input type="submit" value="Login" class="button" />
+        </fieldset>
+    </div>
+</form>
+
+{% if errors %}
+<p>{{_("Your username and password didn't match. Please try again.")}}</p>
+  {{ _("To reset your login data or add an user run:") }} <b> python pyLoadCore.py -u</b>
+{% endif %}
+
+</div>
+<br>
+
+{% endblock %}
diff --git a/pyload/webui/themes/Next/tml/logout.html b/pyload/webui/themes/Next/tml/logout.html
new file mode 100644
index 000000000..e711b2a42
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/logout.html
@@ -0,0 +1,9 @@
+{% extends '/tml/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/pyload/webui/themes/Next/tml/logs.html b/pyload/webui/themes/Next/tml/logs.html
new file mode 100644
index 000000000..ddbe12980
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/logs.html
@@ -0,0 +1,41 @@
+{% extends '/tml/base.html' %}
+
+{% block title %}{{_("Logs")}} - {{super()}} {% endblock %}
+{% block subtitle %}{{_("Logs")}}{% endblock %}
+{% block head %}
+<link rel="stylesheet" type="text/css" href="/css/log.css"/>
+{% endblock %}
+
+{% block content %}
+<div style="clear: both;"></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>
+        <input type="checkbox" name="reversed" onchange="this.form.submit();" {% if reversed %} checked="checked" {% endif %} />&nbsp;
+        <label for="perpage">Lines per page:</label>
+        <select name="perpage" onchange="this.form.submit();">
+            {% for value in  perpage_p %}
+                <option value="{{value.0}}"{% if value.0 == perpage %} selected="selected" {% endif %}>{{value.1}}</option>
+            {% endfor %}
+        </select>
+    </form>
+</div>
+<div class="logwarn">{{warning}}</div>
+<div style="clear: both;"></div>
+<div class="logdiv">
+    <table class="logtable" cellpadding="0" cellspacing="0">
+    {% for line in log %}
+        <tr><td class="logline">{{line.line}}</td><td>{{line.date}}</td><td class="loglevel">{{line.level}}</td><td>{{line.message}}</td></tr>
+    {% endfor %}
+    </table>
+</div>
+<div class="logform">
+<form id="logform2" action="" method="POST">
+    <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;">&nbsp; </div>
+{% endblock %}
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/pathchooser.html b/pyload/webui/themes/Next/tml/pathchooser.html
new file mode 100644
index 000000000..6dcc4314d
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/pathchooser.html
@@ -0,0 +1,76 @@
+<html>
+<head>
+	<script class="javascript">
+        function chosen()
+        {
+            opener.ifield.value = document.forms[0].p.value;
+            close();
+        }
+        function exit()
+        {
+            close();
+        }
+        function setInvalid() {
+            document.forms[0].send.disabled = 'disabled';
+            document.forms[0].p.style.color = '#FF0000';
+        }
+        function setValid() {
+            document.forms[0].send.disabled = '';
+            document.forms[0].p.style.color = '#000000';
+        }
+        function setFile(file)
+        {
+            document.forms[0].p.value = file;
+            setValid();
+
+        }
+	</script>
+	<link rel="stylesheet" type="text/css" href="/css/pathchooser.css"/>
+</head>
+<body{% if type == 'file' %}{% if not oldfile %} onload="setInvalid();"{% endif %}{% endif %}>
+<center>
+    <div id="paths">
+	<form method="get" action="?" onSubmit="chosen();" onReset="exit();">
+	    <input type="text" name="p" value="{{ oldfile|default(cwd) }}" size="60" onfocus="setValid();">
+	    <input type="submit" value="Ok" name="send">
+	</form>
+
+    {% if type == 'folder' %}
+	<span class="path_abs_rel">{{_("Path")}}: <a href="{{ "/pathchooser" + cwd|path_make_absolute|quotepath }}"{% if absolute %} style="text-decoration: underline;"{% endif %}>{{_("absolute")}}</a> | <a href="{{ "/pathchooser/" + cwd|path_make_relative|quotepath }}"{% if not absolute %} style="text-decoration: underline;"{% endif %}>{{_("relative")}}</a></span>
+    {% else %}
+	<span class="path_abs_rel">{{_("Path")}}: <a href="{{ "/filechooser/" + cwd|path_make_absolute|quotepath }}"{% if absolute %} style="text-decoration: underline;"{% endif %}>{{_("absolute")}}</a> | <a href="{{ "/filechooser/" + cwd|path_make_relative|quotepath }}"{% if not absolute %} style="text-decoration: underline;"{% endif %}>{{_("relative")}}</a></span>
+    {% endif %}
+    </div>
+    <table border="0" cellspacing="0" cellpadding="3">
+        <tr>
+            <th>{{_("name")}}</th>
+            <th>{{_("size")}}</th>
+            <th>{{_("type")}}</th>
+            <th>{{_("last modified")}}</th>
+        </tr>
+	{% if parentdir %}
+        <tr>
+            <td colspan="4">
+                <a href="{% if type == 'folder' %}{{ "/pathchooser/" + parentdir|quotepath }}{% else %}{{ "/filechooser/" + parentdir|quotepath }}{% endif %}"><span class="parentdir">{{_("parent directory")}}</span></a>
+            </td>
+        </tr>
+	{% endif %}
+{% for file in files %}
+        <tr>
+            {% if type == 'folder' %}
+                <td class="name">{% if file.type == 'dir' %}<a href="{{ "/pathchooser/" + file.fullpath|quotepath }}" title="{{ file.fullpath }}"><span class="path_directory">{{ file.name|truncate(25) }}</span></a>{% else %}<span class="path_file" title="{{ file.fullpath }}">{{ file.name|truncate(25) }}{% endif %}</span></td>
+            {% else %}
+                <td class="name">{% if file.type == 'dir' %}<a href="{{ "/filechooser/" + file.fullpath|quotepath }}" title="{{ file.fullpath }}"><span class="file_directory">{{ file.name|truncate(25) }}</span></a>{% else %}<a href="#" onclick="setFile('{{ file.fullpath }}');" title="{{ file.fullpath }}"><span class="file_file">{{ file.name|truncate(25) }}{% endif %}</span></a></td>
+            {% endif %}
+            <td class="size">{{ file.size|float|filesizeformat }}</td>
+            <td class="type">{% if file.type == 'dir' %}directory{% else %}{{ file.ext|default("file") }}{% endif %}</td>
+            <td class="mtime">{{ file.modified|date("d.m.Y - H:i:s") }}</td>
+        <tr>
+<!--        <tr>
+            <td colspan="4">{{_("no content")}}</td>
+        </tr> -->
+{% endfor %}
+    </table>
+    </center>
+</body>
+</html>
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/queue.html b/pyload/webui/themes/Next/tml/queue.html
new file mode 100644
index 000000000..41feb2739
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/queue.html
@@ -0,0 +1,109 @@
+{% extends '/tml/base.html' %}
+{% block head %}
+
+<script type="text/javascript" src="/js/package.js"></script>
+
+<script type="text/javascript">
+
+document.addEvent("domready", function(){
+    var pUI = new PackageUI("url", {{ target }});
+});
+</script>
+{% endblock %}
+
+{% if target %}
+    {% set name = _("Queue") %}
+{% else %}
+    {% set name = _("Collector") %}
+{% endif %}
+
+{% block pageactions %}
+<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}}" >
+    <div class="order" style="display: none;">{{ package.order }}</div>
+
+    <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>
+        &nbsp;&nbsp;
+        <span class="buttons" style="opacity:0">
+        <span class="glyphicon glyphicon-trash" title="{{_("Delete Package")}}" style="cursor: pointer" width="12px" height="12px" src="/img/delete.png" /></span>
+        &nbsp;&nbsp;
+        <span class="glyphicon glyphicon-repeat" title="{{_("Restart Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/img/arrow_refresh.png" /></span>
+        &nbsp;&nbsp;
+         <span class="glyphicon glyphicon-pencil" title="{{_("Edit Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/img/pencil.png" /></span>
+        &nbsp;&nbsp;
+         <span class="glyphicon glyphicon-transfer package_drag" title="{{_("Move Package")}}" style="margin-left: -10px; cursor: pointer" height="12px" src="/img/package_go.png" /></span>
+        </span>
+    </div>
+    {% set progress = (package.linksdone * 100) / package.linkstotal %}
+
+    <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>
+        </div>
+    <div style="clear: both; margin-bottom: -10px"></div>
+
+    <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>
+</div>
+    </li>
+{% endfor %}
+</ul>
+{% endautoescape %}
+{% endblock %}
+
+{% block hidden %}
+<div id="pack_box" style="z-index: 2">
+    <form id="pack_form" class="from-group" action="/json/edit_package" method="POST" enctype="multipart/form-data">
+    <h3>{{_("Edit Package")}}</h3>
+    <p>{{_("Edit the package detais below.")}}</p>
+
+    <input name="pack_id" id="pack_id" type="hidden" value=""/>
+
+    <div class="form-group">
+        <label for="pack_name">{{_("Name")}}</label>
+        <input class="form-control" id="pack_name" name="pack_name" type="text" />
+        <p class="help-block">{{_("The name of the package.")}}</p>
+    </div>
+    <div class="form-group">
+        <label for="pack_folder">{{_("Folder")}}</label>
+        <input class="form-control" id="pack_folder" name="pack_folder" type="text" />
+        <p class="help-block">{{_("Name of subfolder for these downloads.")}}</p>
+    </div>
+    <div class="form-group">
+        <label for="pack_pws">{{_("Password")}}</label>
+        <textarea class="form-control" style=" width: 100%;" rows="3" name="pack_pws" id="pack_pws"></textarea>
+        <p class="help-block">{{_("List of passwords used for unrar.")}}</p>
+    </div>
+    <button class="btn btn-primary" style="float: right; margin-left: 5px;" type="submit">{{_("Submit")}}</button>
+    <button  class="btn btn-default" id="pack_reset" style="float: right;" type="reset" >{{_("Reset")}}</button>
+
+
+    <div class="spacer"></div>
+
+    </form>
+
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/settings.html b/pyload/webui/themes/Next/tml/settings.html
new file mode 100644
index 000000000..6d097f49d
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/settings.html
@@ -0,0 +1,217 @@
+{% extends '/tml/base.html' %}
+
+{% block title %}{{ _("Config") }} - {{ super() }} {% endblock %}
+{% block subtitle %}{{ _("Config") }}{% endblock %}
+
+{% block head %}
+    <script type="text/javascript" src="/lib/MooTools/TinyTab/tinytab.js"></script>
+    <script type="text/javascript" src="/lib/MooTools/MooDropMenu/MooDropMenu.js"></script>
+    <script type="text/javascript" src="/js/settings.js"></script>
+
+{% endblock %}
+
+{% block content %}
+
+    <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;">
+
+    </div>
+
+        <span id="tabs-body">
+            <!-- General -->
+            <span id="general" class="active tabContent">
+                <ul class="nav tabs" style="width: 20%; float:left;">
+                    <li class>
+                        <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 style="list-style-type: none;" id="general|{{ entry }}">{{ name }}</li>
+                                </nobr>
+                                <br>
+                            {% endfor %}
+                        </ul>
+                          </div>
+                        </div>
+                    </li>
+                </ul>
+
+                <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>&nbsp;&nbsp; {{ _("Choose a section from the menu") }}</h3>
+                    <br>
+                    </span>
+
+                  <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" style="width: 20%; float:left; hight:300px;">
+                    <li class>
+                            <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 style="list-style-type: none;" id="plugin|{{ entry }}">{{ name }}</li>
+                                </nobr>
+                                <br>
+                            {% endfor %}
+                        </ul>
+                        <div>
+                        </div>
+                    </li>
+                </ul>
+
+
+                 <form style="float: left; width:40%; margin-left: 10px;" id="plugin_form" action="" method="POST" autocomplete="off">
+
+                     <span id="plugin_form_content" style:"position: static;">
+                    <br>
+                    <h3>&nbsp;&nbsp; {{ _("Choose a section from the menu") }}</h3>
+                    <br>
+                         </span>
+                     <input class="btn btn-primary" style="float:right; margin-right: 10px;" id="plugin|submit" class="styled_button" type="submit" value="{{_("Submit")}}"/>
+                </form>
+
+            </span>
+
+            <!-- Accounts -->
+            <span id="accounts" class="tabContent">
+            <form id="account_form" action="/json/update_accounts" method="POST">
+
+                        <table class="settable wide table">
+
+                        <thead>
+                        <tr>
+                            <th>{{ _("Plugin") }}</th>
+                            <th>{{ _("Name") }}</th>
+                            <th>{{ _("Password") }}</th>
+                            <th>{{ _("Status") }}</th>
+                            <th>{{ _("Premium") }}</th>
+                            <th>{{ _("Valid until") }}</th>
+                            <th>{{ _("Traffic left") }}</th>
+                            <th>{{ _("Time") }}</th>
+                            <th>{{ _("Max Parallel") }}</th>
+                            <th>{{ _("Delete?") }}</th>
+                        </tr>
+                        </thead>
+
+
+                            {% for account in conf.accs %}
+                                {% set plugin = account.type %}
+                                       <tr>
+                                            <td>
+                                                <span style="padding:5px">{{ plugin }}</span>
+                                            </td>
+
+                                           <td><label for="{{plugin}}|password;{{account.login}}"
+                                                      style="color:#424242;">{{ account.login }}</label></td>
+                                           <td>
+                                               <input id="{{plugin}}|password;{{account.login}}"
+                                                      name="{{plugin}}|password;{{account.login}}"
+                                                      type="password" value="{{account.password}}" size="12"/>
+                                           </td>
+                                           <td>
+                                               {% if account.valid %}
+                                                   <span style="font-weight: bold; color: #006400;">
+                                                   {{ _("valid") }}
+                                               {% else %}
+                                                   <span style="font-weight: bold; color: #8b0000;">
+                                                   {{ _("not valid") }}
+                                               {% endif %}
+                                               </span>
+                                           </td>
+                                          <td>
+                                               {% if account.premium %}
+                                                   <span style="font-weight: bold; color: #006400;">
+                                                   {{ _("yes") }}
+                                               {% else %}
+                                                   <span style="font-weight: bold; color: #8b0000;">
+                                                   {{ _("no") }}
+                                               {% endif %}
+                                               </span>
+                                           </td>
+                                           <td>
+                                   <span style="font-weight: bold;">
+                                   {{ account.validuntil }}
+                                   </span>
+                                           </td>
+                                           <td>
+                                   <span style="font-weight: bold;">
+                                   {{ account.trafficleft }}
+                                   </span>
+                                           </td>
+                                           <td>
+                                               <input id="{{plugin}}|time;{{account.login}}"
+                                                      name="{{plugin}}|time;{{account.login}}" type="text"
+                                                      size="7" value="{{account.time}}"/>
+                                           </td>
+                                           <td>
+                                               <input id="{{plugin}}|limitdl;{{account.login}}"
+                                                      name="{{plugin}}|limitdl;{{account.login}}" type="text"
+                                                      size="2" value="{{account.limitdl}}"/>
+                                           </td>
+                                           <td>
+                                               <input id="{{plugin}}|delete;{{account.login}}"
+                                                      name="{{plugin}}|delete;{{account.login}}" type="checkbox"
+                                                      value="True"/>
+                                           </td>
+                                       </tr>
+                                {% endfor %}
+                            </table>
+            <button id="account_add" style="margin-left: 5px;" type="submit" class="btn btn-default">&nbsp;<span class="glyphicon glyphicon-plus"></button>
+
+            <button id="account_submit" type="submit" class="btn btn-primary" >{{_("Submit")}}</button>
+
+            </form>
+            </span>
+        </span>
+{% endblock %}
+{% block hidden %}
+<div id="account_box" style="z-index: 2">
+<form id="add_account_form" action="/json/add_account" method="POST" enctype="multipart/form-data">
+<h3>{{_("Add Account")}}</h3>
+<p>{{_("Enter your account data to use premium features.")}}</p>
+
+<div class="form-group">
+<label for="account_login">{{_("Login")}}</label>
+<input class="form-control" id="account_login" name="account_login" type="text" />
+<p >{{_("Your username.")}}</p>
+</div>
+<div class="form-group">
+<label for="account_password">{{_("Password")}}</label>
+<input class="form-control" id="account_password" name="account_password" type="password" size="20" />
+<p >{{_("The password for this account.")}}</p>
+</div>
+<div class="form-group">
+<label for="account_type">{{_("Type")}}</label>
+<p>{{_("Choose the hoster for your account.")}}</p>
+</div>
+<div class="form-group">
+    <select name=account_type id="account_type">
+        {% for type in types|sort %}
+            <option value="{{ type }}">{{ type }}</option>
+        {% endfor %}
+    </select>
+</div>
+<button class="btn btn-primary" style="float: right; margin-left: 5px;" id="account_add_button" type="submit">{{_("Add")}}</button>
+<button class="btn btn-default" style="float: right;" id="account_reset" style="margin-left: 0" type="reset">{{_("Reset")}}</button>
+<div class="spacer"></div>
+
+</form>
+
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/pyload/webui/themes/Next/tml/settings_item.html b/pyload/webui/themes/Next/tml/settings_item.html
new file mode 100644
index 000000000..048ff897b
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/settings_item.html
@@ -0,0 +1,50 @@
+<table class="settable table">
+
+    {% if section.outline %}
+    <tr><th colspan="2">{{ section.outline }}</th></tr>
+    {% endif %}
+    {% for okey, option in section.iteritems() %}
+        {% if okey not in ("desc","outline") %}
+            <tr>
+                <td><label for="{{skey}}|{{okey}}"
+                           style="color:#424242;">{{ option.desc }}:</label></td>
+                <td>
+                    {% if option.type == "bool" %}
+                        <select id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}">
+                            <option {% if option.value %} selected="selected"
+                                                          {% endif %}value="True">{{ _("on") }}</option>
+                            <option {% if not option.value %} selected="selected"
+                                                              {% endif %}value="False">{{ _("off") }}</option>
+                        </select>
+                        {% elif ";" in option.type %}
+                        <select id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}">
+                            {% for entry in option.list %}
+                                <option {% if option.value == entry %}
+                                        selected="selected" {% endif %}>{{ entry }}</option>
+                            {% endfor %}
+                        </select>
+                        {% elif option.type == "folder" %}
+                        <input style="float: right; margin-bottom: 5px;" class="form-control" name="{{skey}}|{{okey}}" type="text"
+                               id="{{skey}}|{{okey}}" value="{{option.value}}"/>
+                        <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 style="float: right;  margin-bottom: 5px;" class="form-control" name="{{skey}}|{{okey}}" type="text"
+                               id="{{skey}}|{{okey}}" value="{{option.value}}"/>
+                        <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 style="float: right;" class="form-control" id="{{skey}}|{{okey}}" name="{{skey}}|{{okey}}"
+                               type="password" value="{{option.value}}"/>
+                    {% else %}
+                        <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/pyload/webui/themes/Next/tml/window.html b/pyload/webui/themes/Next/tml/window.html
new file mode 100644
index 000000000..290d40be6
--- /dev/null
+++ b/pyload/webui/themes/Next/tml/window.html
@@ -0,0 +1,46 @@
+<iframe id="upload_target" name="upload_target" src="" style="display: none; width:0;height:0"></iframe>
+
+<div id="add_box" class="from-group">
+<form id="add_form" action="/json/add_package" method="POST" enctype="multipart/form-data">
+<h3>{{_("Add Package")}}</h3>
+<p>{{_("Paste your links or upload a container.")}}</p>
+<div class="form-group">
+    <label for="add_name">{{_("Name")}}</label>
+    <input id="add_name" class="form-control" name="add_name" type="text" />
+    <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 class="form-control" 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">
+    <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>
+
+
+
+</div>
\ No newline at end of file
-- 
cgit v1.2.3