diff options
Diffstat (limited to 'module/web')
| -rw-r--r-- | module/web/media/default/js/home.js | 409 | ||||
| -rw-r--r-- | module/web/media/default/js/jquery.progressbar.js | 8 | ||||
| -rw-r--r-- | module/web/templates/default/base.html | 35 | ||||
| -rw-r--r-- | module/web/templates/default/home.html | 4 | ||||
| -rw-r--r-- | module/web/templates/default/window.html | 37 |
5 files changed, 252 insertions, 241 deletions
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;"> </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 |