Webinterface - AddBox

6 files changed, 253 insertions, 242 deletions

diff --git a/module/config/core_default.xml b/module/config/core_default.xml
index 366197a61..32ca6599c 100644
--- a/module/config/core_default.xml
+++ b/module/config/core_default.xml
@@ -30,7 +30,7 @@
     <general name="General">
         <language type="str" input="en;de;fr" name="Language">de</language>
         <download_folder type="str" name="Download Folder">Downloads</download_folder>
-        <max_downloads type="int" name="Max Parallel Downloads">3</max_downloads>
+        <max_downloads type="int" name="Max Parallel Downloads">1</max_downloads>
         <link_file type="str" name="File For Links">links.txt</link_file>
         <failed_file type="str" name="File For Failed Links">failed_links.txt</failed_file>
         <debug_mode type="bool" name="Debug Mode">False</debug_mode>
diff --git a/module/web/media/default/js/home.js b/module/web/media/default/js/home.js
index 025dcfcc7..61a1f60d0 100644
--- a/module/web/media/default/js/home.js
+++ b/module/web/media/default/js/home.js
@@ -1,205 +1,204 @@
-var dwProgressBar = new Class({
-
-    //implements
-    Implements: [Options],
-
-    //options
-    options: {
-        container: $$('body')[0],
-        boxID: '',
-        percentageID: '',
-        displayID: '',
-        startPercentage: 0,
-        displayText: false,
-        speed: 10
-    },
-
-    //initialization
-    initialize: function(options) {
-        //set options
-        this.setOptions(options);
-        //create elements
-        this.createElements();
-    },
-
-    //creates the box and percentage elements
-    createElements: function() {
-        var box = new Element('div', {
-            id: this.options.boxID + this.options.id,
-            'class': this.options.boxID
-        });
-        var perc = new Element('div', {
-            id: this.options.percentageID + this.options.id,
-            'style': 'width:0px;',
-            'class': this.options.percentageID
-        });
-        perc.inject(box);
-        box.inject(this.options.container);
-        if (this.options.displayText) {
-            var text = new Element('div', {
-                id: this.options.displayID + this.options.id,
-                'class': this.options.displayID
-            });
-            text.inject(this.options.container);
-        }
-        this.set(this.options.startPercentage);
-    },
-
-    //calculates width in pixels from percentage
-    calculate: function(percentage) {
-        return (document.id(this.options.boxID + this.options.id).getStyle('width').replace('px', '') * (percentage / 100)).toInt();
-    },
-
-    //animates the change in percentage
-    animate: function(to) {
-        document.id(this.options.percentageID + this.options.id).set('morph', {
-            duration: this.options.speed,
-            link: 'cancel'
-        }).morph({
-            width: this.calculate(to.toInt())
-        });
-        if (this.options.displayText) {
-            document.id(this.options.displayID + this.options.id).set('text', to.toInt() + '%');
-        }
-    },
-
-    //sets the percentage from its current state to desired percentage
-    set: function(to) {
-        this.animate(to);
-    }
-
-});
-
-req = new Request.JSON({
-    onSuccess: renderTable,
-    method: 'get',
-    url: '/json/links',
-    initialDelay: 0,
-    delay: 1000,
-    limit: 20000
-});
-
-var dls = []
-var pbs = []
-
-function renderTable(data) {
-
-    data.downloads.each(function(dl) {
-
-        if (dls.contains(dl.id)) {
-
-            var div = $('dl' + dl.id)
-
-            pbs[dl.id].set(dl.percent)
-
-            div.getChildren("b")[0].textContent = dl.name
-
-            if (dl.status == "downloading") {
-
-                size = Math.round((dl.size - dl.kbleft) / 1024) + "/" + Math.round(dl.size / 1024) + " MB";
-                speed = Math.round(dl.speed) + " kb/s";
-                eta = dl.eta;
-
-            } else if (dl.status == "waiting") {
-
-                size = "waiting " + dl.wait;
-                speed = "";
-                eta = "";
-
-            }
-            div.getChildren(".dlsize")[0].textContent = size;
-            div.getChildren(".dlspeed")[0].textContent = speed;
-            div.getChildren(".dltime")[0].textContent = eta;
-
-        } else {
-
-            dls.push(dl.id)
-
-            container = $("dlcontainer")
-
-            dldiv = new Element('div', {
-                'id': 'dl' + dl.id,
-                'class': 'download',
-                'styles': {
-                    'display': 'None'
-                }
-            })
-
-            new Element('p').inject(dldiv)
-
-            new Element('b', {
-                'html': dl.name
-            }).inject(dldiv)
-
-            new Element('br').inject(dldiv)
-
-            dldiv.inject(container)
-
-            pbs[dl.id] = new dwProgressBar({
-                container: $(dldiv),
-                startPercentage: 0,
-                speed: 1000,
-                id: dl.id,
-                boxID: 'box',
-                percentageID: 'perc',
-                displayText: true,
-                displayID: 'boxtext'
-            });
-
-            new Element('div', {
-                'class': 'dlsize',
-                'html': Math.round((dl.size - dl.kbleft) / 1024) + "/" + Math.round(dl.size / 1024) + " MB"
-            }).inject(dldiv)
-
-            new Element('div', {
-                'class': 'dlspeed',
-                'html': Math.round(dl.speed) + " kb/s"
-            }).inject(dldiv)
-
-            new Element('div', {
-                'class': 'dltime',
-                'html': dl.eta
-            }).inject(dldiv)
-
-            //dldiv.dissolve({duration : 0})
-            dldiv.reveal()
-
-        }
-    })
-
-    dls.each(function(id, index) {
-
-        if (data.ids.contains(id)) {
-
-} else {
-
-            //$("dl"+id).reveal()
-            dls.erase(id);
-            $('dl' + id).nix()
-
-        }
-
-    })
-
-}
-
-window.addEvent('domready',
-function() {
-
-    /*
-//create the progress bar for example 1
-pb = new dwProgressBar({
-        container: $$('.level1 p')[0],
-        startPercentage: 25,
-        speed: 1000,
-        id: 1,
-        boxID: 'box',
-        percentageID: 'perc',
-        displayText: true,
-        displayID: 'boxtext'
-});
-*/
-
-    req.startTimer();
-
-});
\ No newline at end of file
+var dwProgressBar = new Class({

+

+    //implements

+    Implements: [Options],

+

+    //options

+    options: {

+        container: $$('body')[0],

+        boxID: '',

+        percentageID: '',

+        displayID: '',

+        startPercentage: 0,

+        displayText: false,

+        speed: 10

+    },

+

+    //initialization

+    initialize: function(options) {

+        //set options

+        this.setOptions(options);

+        //create elements

+        this.createElements();

+    },

+

+    //creates the box and percentage elements

+    createElements: function() {

+        var box = new Element('div', {

+            id: this.options.boxID + this.options.id,

+            'class': this.options.boxID

+        });

+        var perc = new Element('div', {

+            id: this.options.percentageID + this.options.id,

+            'style': 'width:0px;',

+            'class': this.options.percentageID

+        });

+        perc.inject(box);

+        box.inject(this.options.container);

+        if (this.options.displayText) {

+            var text = new Element('div', {

+                id: this.options.displayID + this.options.id,

+                'class': this.options.displayID

+            });

+            text.inject(this.options.container);

+        }

+        this.set(this.options.startPercentage);

+    },

+

+    //calculates width in pixels from percentage

+    calculate: function(percentage) {

+        return (document.id(this.options.boxID + this.options.id).getStyle('width').replace('px', '') * (percentage / 100)).toInt();

+    },

+

+    //animates the change in percentage

+    animate: function(to) {

+        document.id(this.options.percentageID + this.options.id).set('morph', {

+            duration: this.options.speed,

+            link: 'cancel'

+        }).morph({

+            width: this.calculate(to.toInt())

+        });

+        if (this.options.displayText) {

+            document.id(this.options.displayID + this.options.id).set('text', to.toInt() + '%');

+        }

+    },

+

+    //sets the percentage from its current state to desired percentage

+    set: function(to) {

+        this.animate(to);

+    }

+

+});

+/*

+req = new Request.JSON({

+    onSuccess: renderTable,

+    method: 'get',

+    url: '/json/links',

+    initialDelay: 0,

+    delay: 1000,

+    limit: 20000

+});

+*/

+var dls = []

+var pbs = []

+

+function renderTable(data) {

+

+    data.downloads.each(function(dl) {

+

+        if (dls.contains(dl.id)) {

+

+            var div = $('dl' + dl.id)

+

+            pbs[dl.id].set(dl.percent)

+

+            div.getChildren("b")[0].textContent = dl.name

+

+            if (dl.status == "downloading") {

+

+                size = Math.round((dl.size - dl.kbleft) / 1024) + "/" + Math.round(dl.size / 1024) + " MB";

+                speed = Math.round(dl.speed) + " kb/s";

+                eta = dl.eta;

+

+            } else if (dl.status == "waiting") {

+

+                size = "waiting " + dl.wait;

+                speed = "";

+                eta = "";

+

+            }

+            div.getChildren(".dlsize")[0].textContent = size;

+            div.getChildren(".dlspeed")[0].textContent = speed;

+            div.getChildren(".dltime")[0].textContent = eta;

+

+        } else {

+

+            dls.push(dl.id)

+

+            container = $("dlcontainer")

+

+            dldiv = new Element('div', {

+                'id': 'dl' + dl.id,

+                'class': 'download',

+                'styles': {

+                    'display': 'None'

+                }

+            })

+

+            new Element('p').inject(dldiv)

+

+            new Element('b', {

+                'html': dl.name

+            }).inject(dldiv)

+

+            new Element('br').inject(dldiv)

+

+            dldiv.inject(container)

+

+            pbs[dl.id] = new dwProgressBar({

+                container: $(dldiv),

+                startPercentage: 0,

+                speed: 1000,

+                id: dl.id,

+                boxID: 'box',

+                percentageID: 'perc',

+                displayText: true,

+                displayID: 'boxtext'

+            });

+

+            new Element('div', {

+                'class': 'dlsize',

+                'html': Math.round((dl.size - dl.kbleft) / 1024) + "/" + Math.round(dl.size / 1024) + " MB"

+            }).inject(dldiv)

+

+            new Element('div', {

+                'class': 'dlspeed',

+                'html': Math.round(dl.speed) + " kb/s"

+            }).inject(dldiv)

+

+            new Element('div', {

+                'class': 'dltime',

+                'html': dl.eta

+            }).inject(dldiv)

+

+            //dldiv.dissolve({duration : 0})

+            dldiv.reveal()

+

+        }

+    })

+

+    dls.each(function(id, index) {

+

+        if (data.ids.contains(id)) {

+

+} else {

+

+            //$("dl"+id).reveal()

+            dls.erase(id);

+            $('dl' + id).nix()

+

+        }

+

+    })

+

+}

+

+window.addEvent('domready',

+function() {

+

+    /*

+//create the progress bar for example 1

+pb = new dwProgressBar({

+        container: $$('.level1 p')[0],

+        startPercentage: 25,

+        speed: 1000,

+        id: 1,

+        boxID: 'box',

+        percentageID: 'perc',

+        displayText: true,

+        displayID: 'boxtext'

+});

+*/

+});

+

+

diff --git a/module/web/media/default/js/jquery.progressbar.js b/module/web/media/default/js/jquery.progressbar.js
index 7ddf4a558..e240109b4 100644
--- a/module/web/media/default/js/jquery.progressbar.js
+++ b/module/web/media/default/js/jquery.progressbar.js
@@ -26,11 +26,11 @@ USAGE:
 				width			: 1000,											// Width of the progressbar - don't forget to adjust your image too!!!												// Image to use in the progressbar. Can be a single image too: 'images/progressbg_green.gif'

 				height			: 12,											// Height of the progressbar - don't forget to adjust your image too!!!

 				callback		: null,											// Calls back with the config object that has the current percentage, target percentage, current image, etc

-				boxImage		: '/media/img/progressbar.gif',						// boxImage : image around the progress bar

+				boxImage		: '/media/default/img/progressbar.gif',						// boxImage : image around the progress bar

 				barImage		: {

-									0:	'/media/img/progressbg_red.gif',

-									30: '/media/img/progressbg_orange.gif',

-									70: '/media/img/progressbg_green.gif'

+									0:	'/media/default/img/progressbg_red.gif',

+									30: '/media/default/img/progressbg_orange.gif',

+									70: '/media/default/img/progressbg_green.gif'

 								},

 				

 				

diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html
index ecaec98f2..cd0b85903 100644
--- a/module/web/templates/default/base.html
+++ b/module/web/templates/default/base.html
@@ -17,6 +17,7 @@
 

 <script type="text/javascript">

 $(document).ready(function(){

+	$.getJSON('/json/status', LoadJsonToContent );

 	$.getJSON('/json/links', LinksToContent );

 });

 

@@ -38,7 +39,38 @@ function LoadJsonToContent(data)
 	setTimeout(function()

    {

     $.getJSON('/json/status', LoadJsonToContent );

-   }, 2000);

+   }, 4000);

+	req.startTimer();

+	

+}

+

+function AddBox()

+{

+	if (!$("#add_box").is(":hidden"))

+	{

+		$("#add_box").fadeOut(800);

+		$("#add_bg").fadeOut(800);

+	}

+	else

+	{

+		$("#add_box").fadeIn(800);

+		$("#add_bg").fadeIn(800);

+	}

+}

+

+function AddSubmit()

+{

+	$("#add_form").submit();

+	/*

+	$.post("/json/add_package", { links: $("#add_links").text() } );

+	return false;

+	if( $("#add_cf").val() != "" )

+	{

+		//$("#add_form").submit();

+	}

+	*/

+	AddBox();

+	

 }

 </script>

 

@@ -97,6 +129,7 @@ function LoadJsonToContent(data)
 	<li id="action_play"><a href="/json/unpause"  class="action play" accesskey="o" rel="nofollow">Play</a></li>

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

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

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

 </ul>

 {% endif %}

 

diff --git a/module/web/templates/default/home.html b/module/web/templates/default/home.html
index 12fa55539..49633f94a 100644
--- a/module/web/templates/default/home.html
+++ b/module/web/templates/default/home.html
@@ -3,10 +3,6 @@
 {% block head %}

 

 <script type="text/javascript">

-$(document).ready(function(){

-	$.getJSON('/json/links', LinksToContent );

-});

-

 

 /*function UpdateLinks( SetInver, index )

 {

diff --git a/module/web/templates/default/window.html b/module/web/templates/default/window.html
index 602622719..ec4ca496a 100644
--- a/module/web/templates/default/window.html
+++ b/module/web/templates/default/window.html
@@ -1,28 +1,11 @@
-<div id="add_window" 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: 100px;">

-

-<div class="top">

-<div class="top_ul"></div>

-<div class="top_ur"><h1 class="caption dragHandle">Title</h1>

-</div></div>

-

-<div class="middle">

-<div class="body">Body here

-</div></div>

-

-<div class="closeBody">

-<div class="closeButtons">

-<a class="closeSticky button" id="button_id">Button</a><a class="closeSticky button">Close</a>

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

+  <h1>Add</h1>

+  <form id="add_form" action="" method="post" onsubmit="return AddSubmit();">

+    <textarea rows="5" style="width: 890px;" name="add_links" id="add_links"></textarea>

+    <br />

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

+    <input type="submit" value="Add Links" />

+  </form>

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