summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--module/web/static/css/default/dashboard.less47
-rw-r--r--module/web/static/css/default/style.less6
-rw-r--r--module/web/static/img/default/checks_sheet.pngbin0 -> 1178 bytes
-rw-r--r--module/web/static/js/views/packageTreeView.js186
-rw-r--r--module/web/static/js/views/packageView.js2
-rw-r--r--module/web/templates/default/dashboard.html13
6 files changed, 152 insertions, 102 deletions
diff --git a/module/web/static/css/default/dashboard.less b/module/web/static/css/default/dashboard.less
index ab62cc657..4f82eb82e 100644
--- a/module/web/static/css/default/dashboard.less
+++ b/module/web/static/css/default/dashboard.less
@@ -60,10 +60,8 @@
.package-view > div {
color: @light;
.gradient(top, @blue, @blueLight); // background-color: @blue;
- font-weight: bold;
border-radius: 5px;
line-height: 28px;
- cursor: pointer;
}
.package-view > div:hover {
@@ -75,10 +73,25 @@
height: 100%;
padding-left: 8px;
padding-right: 8px;
+
+ i {
+ margin-top: 3px;
+ }
+
+ i.pull-right {
+ margin-top: 8px;
+ }
+
+ .badge {
+ margin-right: 4px;
+ }
+
}
.package-row.first {
width: 50%;
+ font-weight: bold;
+ cursor: pointer;
}
.package-row.second {
@@ -87,10 +100,19 @@
font-size: smaller;
}
+.package-row.third {
+ line-height: 26px;
+}
+
.package-view a {
color: @light;
}
+// Box containing the files
+.package-view > ul {
+ .gradient(left, @yellowLighter, @yellowLightest);
+// box-shadow: 0 0 5px black;
+}
/*
File view
*/
@@ -101,7 +123,7 @@
.file-view > div {
border-radius: 5px;
- .gradient(top, @blueLighter, @blueLightest);
+// .gradient(top, @blueLighter, @blueLightest);
line-height: 26px;
}
@@ -119,6 +141,23 @@
.file-row.first {
width: 50%;
}
+
.file-row.second {
width: 30%;
-} \ No newline at end of file
+}
+/*
+FANCY CHECKBOXES
+*/
+.checkbox {
+ display: inline;
+ width: 20px;
+ height: 21px;
+ margin: -1px 4px 0 0;
+ vertical-align: middle;
+ background: url(../../img/default/checks_sheet.png) left top no-repeat;
+ cursor: pointer;
+}
+
+.checkbox .checked {
+ background: url(../../img/default/checks_sheet.png) -21px top no-repeat;
+}
diff --git a/module/web/static/css/default/style.less b/module/web/static/css/default/style.less
index 8fe9aeb0e..f0628b45a 100644
--- a/module/web/static/css/default/style.less
+++ b/module/web/static/css/default/style.less
@@ -36,6 +36,12 @@
@blueDark: darken(spin(@blue, -5), 10%);
@blueDarker: darken(spin(@blue, -10), 20%);
+@green: #468847;
+@greenLight: lighten(spin(@green, 5), 10%);
+
+@red: #b94a48;
+@redLight: lighten(spin(@red, 5), 10%);
+
@emph: #FF7637;
/*
diff --git a/module/web/static/img/default/checks_sheet.png b/module/web/static/img/default/checks_sheet.png
new file mode 100644
index 000000000..3cc2b0824
--- /dev/null
+++ b/module/web/static/img/default/checks_sheet.png
Binary files differ
diff --git a/module/web/static/js/views/packageTreeView.js b/module/web/static/js/views/packageTreeView.js
index 516c2f5d1..92e4d78a0 100644
--- a/module/web/static/js/views/packageTreeView.js
+++ b/module/web/static/js/views/packageTreeView.js
@@ -1,94 +1,94 @@
-define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/packageView', 'views/fileView'],
- function($, Backbone, _, TreeCollection, packageView, fileView) {
-
- // Renders whole PackageView
- return Backbone.View.extend({
-
- el: '#content',
-
- events: {
- 'click #add': 'addPackage',
- 'keypress #name': 'addOnEnter',
- 'click #show_active': 'filter'
- },
-
- initialize: function() {
- this.tree = new TreeCollection();
-
- },
-
- init: function() {
- var self = this;
- this.tree.fetch({success: function() {
- self.render();
- }});
- },
-
- render: function() {
- var packs = this.tree.get('packages'),
- files = this.tree.get('files'),
- el = this.$('#dashboard');
-
- el.empty();
- el.append($('<span>Root: ' + this.tree.get('root').get('name') + ' </span>'));
- el.append($('<input id="name" type="text" size="20">'));
- el.append($('<a id="add" href="#"> Add</a><br>'));
-
- var ul = $('<ul></ul>');
- packs.each(function(pack) {
- ul.append(new packageView({model: pack}).render().el);
- });
-
- el.append(ul);
- el.append($('<br> Files: ' + files.size() + '<br>'));
-
- ul = $('<ul></ul>');
- files.each(function(file) {
- ul.append(new fileView({model: file}).render().el);
- });
-
- el.append(ul);
- $('#name').focus();
-
- return this;
- },
-
- addOnEnter: function(e) {
- if (e.keyCode != 13) return;
- this.addPackage(e);
- },
-
- addPackage: function(e) {
- var self = this;
- var settings = {
- type: 'POST',
- data: {
- name: JSON.stringify($('#name').val()),
- links: JSON.stringify(['http://download.pyload.org/random.bin', 'invalid link'])
- },
- success: function() {
- self.tree.fetch({success: function() {
- self.render();
- }});
- }
- };
-
- $.ajax('api/addPackage', settings);
- $('#name').val('');
- },
-
- toggle: false,
-
- filter: function(e) {
- var self = this;
- this.tree.get('packages').each(function(item){
- if(!self.toggle)
- item.trigger('filter:added');
- else
- item.trigger('filter:removed');
-
- });
- self.toggle ^= true;
- }
- });
+define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/packageView', 'views/fileView'],
+ function($, Backbone, _, TreeCollection, packageView, fileView) {
+
+ // Renders whole PackageView
+ return Backbone.View.extend({
+
+ el: '#content',
+
+ events: {
+ 'click #add': 'addPackage',
+ 'keypress #name': 'addOnEnter',
+ 'click #show_active': 'filter'
+ },
+
+ initialize: function() {
+ this.tree = new TreeCollection();
+
+ },
+
+ init: function() {
+ var self = this;
+ this.tree.fetch({success: function() {
+ self.render();
+ }});
+ },
+
+ render: function() {
+ var packs = this.tree.get('packages'),
+ files = this.tree.get('files'),
+ el = this.$('#dashboard');
+
+ /* el.empty();
+ el.append($('<span>Root: ' + this.tree.get('root').get('name') + ' </span>'));
+ el.append($('<input id="name" type="text" size="20">'));
+ el.append($('<a id="add" href="#"> Add</a><br>'));*/
+
+ var ul = $('<ul></ul>');
+ packs.each(function(pack) {
+ ul.append(new packageView({model: pack}).render().el);
+ });
+
+ el.append(ul);
+ el.append($('<br> Files: ' + files.size() + '<br>'));
+
+ ul = $('<ul></ul>');
+ files.each(function(file) {
+ ul.append(new fileView({model: file}).render().el);
+ });
+
+ el.append(ul);
+ $('#name').focus();
+
+ return this;
+ },
+
+ addOnEnter: function(e) {
+ if (e.keyCode != 13) return;
+ this.addPackage(e);
+ },
+
+ addPackage: function(e) {
+ var self = this;
+ var settings = {
+ type: 'POST',
+ data: {
+ name: JSON.stringify($('#name').val()),
+ links: JSON.stringify(['http://download.pyload.org/random.bin', 'invalid link'])
+ },
+ success: function() {
+ self.tree.fetch({success: function() {
+ self.render();
+ }});
+ }
+ };
+
+ $.ajax('api/addPackage', settings);
+ $('#name').val('');
+ },
+
+ toggle: false,
+
+ filter: function(e) {
+ var self = this;
+ this.tree.get('packages').each(function(item){
+ if(!self.toggle)
+ item.trigger('filter:added');
+ else
+ item.trigger('filter:removed');
+
+ });
+ self.toggle ^= true;
+ }
+ });
}); \ No newline at end of file
diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/packageView.js
index efbf6b76e..154e7af77 100644
--- a/module/web/static/js/views/packageView.js
+++ b/module/web/static/js/views/packageView.js
@@ -8,7 +8,7 @@ define(['jquery', 'views/abstract/itemView', 'underscore', 'views/fileView'],
className: 'package-view',
template: _.compile($("#template-package").html()),
events: {
- 'click .package-header': 'load',
+ 'click .package-row.first': 'load',
'click .delete': 'delete'
},
diff --git a/module/web/templates/default/dashboard.html b/module/web/templates/default/dashboard.html
index 8275011f0..0d2b65565 100644
--- a/module/web/templates/default/dashboard.html
+++ b/module/web/templates/default/dashboard.html
@@ -15,20 +15,25 @@
<script type="text/template" id="template-package">
<div class="package-header">
<div class="package-row first">
+ <span class="checkbox"></span>
+ <i class="icon-folder-close icon-white"></i>&nbsp;
Package <%= pid %>: <%= name %>
+
+ <i class="icon-edit icon-white pull-right"></i>
</div>
<div class="package-row second">
<span>
- <%= stats.linkstotal %> Files (xy / z /t)
+ <%= stats.linksdone %> / <%= stats.linkstotal %>
</span>
<span class="pull-right">
<%= formatSize stats.sizedone %> / <%= formatSize stats.sizetotal %>
</span>
</div>
- <div class="package-row third">
- <a class="delete"> Delete</a>
- <a class="show-dialog"> Show</a>
+ <div class="package-row third pull-right">
+ <span class="badge badge-important"><i class="icon-tag icon-white"></i> tag</span>
+ <span class="badge badge-important"><i class="icon-tag icon-white"></i> tag2</span>
+ <i class="icon-wrench icon-white pull-right"></i>
</div>
</div>
</script>
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-24 19:38:58 +0100