summaryrefslogtreecommitdiffstats
path: root/pyload/web
diff options
context:
space:
mode:
Diffstat (limited to 'pyload/web')
-rw-r--r--pyload/web/app/scripts/utils/apitypes.js2
-rw-r--r--pyload/web/app/scripts/views/headerView.js31
-rw-r--r--pyload/web/app/scripts/views/progressView.js23
-rw-r--r--pyload/web/app/styles/default/dashboard.less8
-rw-r--r--pyload/web/app/styles/default/style.less5
-rw-r--r--pyload/web/app/templates/default/header/progress.html12
-rw-r--r--pyload/web/app/templates/default/header/progressStatus.html8
-rw-r--r--pyload/web/app/templates/default/header/progressSub.html6
-rw-r--r--pyload/web/app/templates/default/header/progressSup.html10
-rw-r--r--pyload/web/app/templates/default/header/progressbar.html27
10 files changed, 82 insertions, 50 deletions
diff --git a/pyload/web/app/scripts/utils/apitypes.js b/pyload/web/app/scripts/utils/apitypes.js
index d3b984923..342f61f68 100644
--- a/pyload/web/app/scripts/utils/apitypes.js
+++ b/pyload/web/app/scripts/utils/apitypes.js
@@ -6,7 +6,7 @@ define([], function() {
DownloadState: {'Failed': 3, 'All': 0, 'Unmanaged': 4, 'Finished': 1, 'Unfinished': 2},
DownloadStatus: {'Downloading': 10, 'NA': 0, 'Processing': 14, 'Waiting': 9, 'Decrypting': 13, 'Paused': 4, 'Failed': 7, 'Finished': 5, 'Skipped': 6, 'Unknown': 16, 'Aborted': 12, 'Online': 2, 'TempOffline': 11, 'Offline': 1, 'Custom': 15, 'Starting': 8, 'Queued': 3},
FileStatus: {'Remote': 2, 'Ok': 0, 'Missing': 1},
- InputType: {'Multiple': 11, 'Int': 2, 'NA': 0, 'Time': 7, 'List': 12, 'Bool': 8, 'File': 3, 'Text': 1, 'Table': 13, 'Folder': 4, 'Password': 6, 'Click': 9, 'Select': 10, 'Textbox': 5},
+ InputType: {'PluginList': 13, 'Multiple': 11, 'Int': 2, 'NA': 0, 'Time': 7, 'List': 12, 'Bool': 8, 'File': 3, 'Text': 1, 'Table': 14, 'Folder': 4, 'Password': 6, 'Click': 9, 'Select': 10, 'Textbox': 5},
Interaction: {'Captcha': 2, 'All': 0, 'Query': 4, 'Notification': 1},
MediaType: {'All': 0, 'Audio': 2, 'Image': 4, 'Other': 1, 'Video': 8, 'Document': 16, 'Archive': 32},
PackageStatus: {'Paused': 1, 'Remote': 3, 'Folder': 2, 'Ok': 0},
diff --git a/pyload/web/app/scripts/views/headerView.js b/pyload/web/app/scripts/views/headerView.js
index afafcf564..2c83fb381 100644
--- a/pyload/web/app/scripts/views/headerView.js
+++ b/pyload/web/app/scripts/views/headerView.js
@@ -1,8 +1,8 @@
define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'collections/ProgressList',
'views/progressView', 'views/notificationView', 'helpers/formatSize', 'hbs!tpl/header/layout',
- 'hbs!tpl/header/status', 'hbs!tpl/header/progressbar' , 'flot'],
- function($, _, Backbone, App, ServerStatus, ProgressList, ProgressView, NotificationView, formatSize,
- template, templateStatus, templateHeader) {
+ 'hbs!tpl/header/status', 'hbs!tpl/header/progressbar', 'hbs!tpl/header/progressSup', 'hbs!tpl/header/progressSub' , 'flot'],
+ function(
+ $, _, Backbone, App, ServerStatus, ProgressList, ProgressView, NotificationView, formatSize, template, templateStatus, templateProgress, templateSup, templateSub) {
'use strict';
// Renders the header with all information
return Backbone.Marionette.ItemView.extend({
@@ -19,10 +19,7 @@ define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'colle
speedgraph: '#speedgraph'
},
- // todo: maybe combine these
template: template,
- templateStatus: templateStatus,
- templateHeader: templateHeader,
// view
grabber: null,
@@ -39,6 +36,7 @@ define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'colle
// save if last progress was empty
wasEmpty: false,
+ lastStatus: null,
initialize: function() {
var self = this;
@@ -118,13 +116,13 @@ define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'colle
return speed[1];
})[1] * 1024;
this.$('.status-block').html(
- this.templateStatus(status)
+ templateStatus(status)
);
var data = {tasks: 0, downloads: 0, speed: 0, single: false};
this.progressList.each(function(progress) {
if (progress.isDownload()) {
- data.downloads += 1;
+ data.downloads++;
data.speed += progress.get('download').speed;
} else
data.tasks++;
@@ -139,15 +137,24 @@ define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'colle
data.name = progress.get('name');
data.statusmsg = progress.get('statusmsg');
}
- // TODO: better progressbar rendering
data.etaqueue = status.eta;
data.linksqueue = status.linksqueue;
data.sizequeue = status.sizequeue;
- this.$('#progress-info').html(
- this.templateHeader(data)
- );
+ // Render progressbar only when needed
+ if (!_.isEqual([data.tasks, data.downloads], this.lastStatus)) {
+ console.log('render bar');
+ this.lastStatus = [data.tasks, data.downloads];
+ this.$('#progress-info').html(templateProgress(data));
+ } else {
+ this.$('#progress-info .bar').width(data.percent + '%');
+ }
+
+ // render upper and lower part
+ this.$('.sup').html(templateSup(data));
+ this.$('.sub').html(templateSub(data));
+
return this;
},
diff --git a/pyload/web/app/scripts/views/progressView.js b/pyload/web/app/scripts/views/progressView.js
index 3a4bb2825..7b9dbb74b 100644
--- a/pyload/web/app/scripts/views/progressView.js
+++ b/pyload/web/app/scripts/views/progressView.js
@@ -1,6 +1,6 @@
define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', 'views/abstract/itemView',
- 'hbs!tpl/header/progress', 'helpers/pluginIcon'],
- function($, Backbone, _, App, Api, ItemView, template, pluginIcon) {
+ 'hbs!tpl/header/progress', 'hbs!tpl/header/progressStatus', 'helpers/pluginIcon'],
+ function($, Backbone, _, App, Api, ItemView, template, templateStatus, pluginIcon) {
'use strict';
// Renders single file item
@@ -12,20 +12,33 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', 'views/abst
events: {
},
+ // Last name
+ name: null,
+
initialize: function() {
- this.listenTo(this.model, 'change', this.render);
+ this.listenTo(this.model, 'change', this.update);
this.listenTo(this.model, 'remove', this.unrender);
},
onDestroy: function() {
},
+ // Update html without re-rendering
+ update: function() {
+ if (this.name !== this.model.get('name')) {
+ this.name = this.model.get('name');
+ this.render();
+ }
+
+ this.$('.bar').width(this.model.getPercent() + '%');
+ this.$('.progress-status').html(templateStatus(this.model.toJSON()));
+ },
+
render: function() {
// TODO: icon
// TODO: other states
// TODO: non download progress
- // TODO: better progressbar rendering
- this.$el.css('background-image', 'url('+ pluginIcon('todo') +')');
+ this.$el.css('background-image', 'url(' + pluginIcon('todo') + ')');
this.$el.html(this.template(this.model.toJSON()));
return this;
}
diff --git a/pyload/web/app/styles/default/dashboard.less b/pyload/web/app/styles/default/dashboard.less
index cd240f323..ed87e19a1 100644
--- a/pyload/web/app/styles/default/dashboard.less
+++ b/pyload/web/app/styles/default/dashboard.less
@@ -1,4 +1,5 @@
-@import "common";
+@import "bootstrap/less/mixins";
+@import "common";
/*
Dashboard
@@ -44,10 +45,8 @@
margin: 8px 0;
position: relative;
overflow: hidden;
+ .hyphens;
- -webkit-hyphens: auto;
- -moz-hyphens: auto;
- hyphens: auto;
i {
cursor: pointer;
@@ -274,6 +273,7 @@
.bar {
text-align: left;
.gradient(top, @yellow, @yellowDark);
+ .transition-duration(2s);
color: @dark;
}
diff --git a/pyload/web/app/styles/default/style.less b/pyload/web/app/styles/default/style.less
index d77558cd7..b75f45a65 100644
--- a/pyload/web/app/styles/default/style.less
+++ b/pyload/web/app/styles/default/style.less
@@ -1,4 +1,5 @@
-@import "common";
+@import "bootstrap/less/mixins";
+@import "common";
/*
Header
@@ -135,6 +136,7 @@ header { // background-color: @greyDark;
margin-bottom: 0;
.bar {
+ .transition-duration(2s);
.gradient(bottom, @blue, @blueLight);
}
}
@@ -153,6 +155,7 @@ header { // background-color: @greyDark;
color: @dark;
background-image: none;
background-color: @yellow;
+ .transition-duration(2s);
&.running {
width: 100%;
diff --git a/pyload/web/app/templates/default/header/progress.html b/pyload/web/app/templates/default/header/progress.html
index 4ef5a1cd6..740e18a4c 100644
--- a/pyload/web/app/templates/default/header/progress.html
+++ b/pyload/web/app/templates/default/header/progress.html
@@ -4,11 +4,7 @@
<div class="progress">
<div class="bar" style="width: {{ percent }}%"></div>
</div>
-{{#if downloading }}
-{{ formatSize done }} of {{ formatSize total }} ({{ formatSize download.speed }}/s)
-{{ else }}
-{{ statusmsg }}
-{{/if}}
-<span class="pull-right">
- {{ formatTime eta }}
-</span> \ No newline at end of file
+
+<div class="progress-status">
+ <!-- rendered by progressInfo template -->
+</div>
diff --git a/pyload/web/app/templates/default/header/progressStatus.html b/pyload/web/app/templates/default/header/progressStatus.html
new file mode 100644
index 000000000..020ed2e96
--- /dev/null
+++ b/pyload/web/app/templates/default/header/progressStatus.html
@@ -0,0 +1,8 @@
+{{#if downloading }}
+ {{ formatSize done }} of {{ formatSize total }} ({{ formatSize download.speed }}/s)
+{{ else }}
+ {{ statusmsg }}
+{{/if}}
+<span class="pull-right">
+ {{ formatTime eta }}
+</span> \ No newline at end of file
diff --git a/pyload/web/app/templates/default/header/progressSub.html b/pyload/web/app/templates/default/header/progressSub.html
new file mode 100644
index 000000000..3400ee011
--- /dev/null
+++ b/pyload/web/app/templates/default/header/progressSub.html
@@ -0,0 +1,6 @@
+{{#if linksqueue }}
+ {{ linksqueue }} downloads left ({{ formatSize sizequeue }})
+{{/if}}
+<span class="pull-right">
+ {{ formatTime etaqueue }}
+</span> \ No newline at end of file
diff --git a/pyload/web/app/templates/default/header/progressSup.html b/pyload/web/app/templates/default/header/progressSup.html
new file mode 100644
index 000000000..f2c0ac734
--- /dev/null
+++ b/pyload/web/app/templates/default/header/progressSup.html
@@ -0,0 +1,10 @@
+{{#if single }}
+ {{ truncate name 32}} ({{ statusmsg }})
+{{ else }}
+ {{#if downloads }}
+ {{ downloads }} downloads running {{#if speed }}({{ formatSize speed }}/s){{/if}}
+ {{ else }}
+ No running tasks
+ {{/if}}
+{{/if}}
+<i class="icon-list pull-right"></i> \ No newline at end of file
diff --git a/pyload/web/app/templates/default/header/progressbar.html b/pyload/web/app/templates/default/header/progressbar.html
index a36fb5684..2775e664b 100644
--- a/pyload/web/app/templates/default/header/progressbar.html
+++ b/pyload/web/app/templates/default/header/progressbar.html
@@ -1,14 +1,7 @@
-{{#if single }}
- {{ truncate name 32}} ({{ statusmsg }})
-{{ else }}
- {{#if downloads }}
- {{ downloads }} downloads running {{#if speed }}({{ formatSize speed }}/s){{/if}}
- {{ else }}
- No running tasks
- {{/if}}
-{{/if}}
-<i class="icon-list pull-right"></i>
-<!-- TODO active animation -->
+
+<div class="sup">
+</div>
+
<div class="progress" id="globalprogress">
{{#if single }}
<div class="bar" style="width: {{ percent }}%">
@@ -17,11 +10,7 @@
{{/if}}
</div>
</div>
- <div class="sub">
- {{#if linksqueue }}
- {{ linksqueue }} downloads left ({{ formatSize sizequeue }})
- {{/if}}
- <span class="pull-right">
- {{ formatTime etaqueue }}
- </span>
- </div> \ No newline at end of file
+</div>
+
+<div class="sub">
+</div> \ No newline at end of file