summaryrefslogtreecommitdiffstats
path: root/module
diff options
context:
space:
mode:
Diffstat (limited to 'module')
-rw-r--r--module/web/static/css/default/dashboard.less7
-rw-r--r--module/web/static/js/models/File.js6
-rw-r--r--module/web/static/js/views/fileView.js8
-rw-r--r--module/web/static/js/views/selectionView.js33
-rw-r--r--module/web/templates/default/dashboard.html78
5 files changed, 80 insertions, 52 deletions
diff --git a/module/web/static/css/default/dashboard.less b/module/web/static/css/default/dashboard.less
index 12d833168..e9d313d32 100644
--- a/module/web/static/css/default/dashboard.less
+++ b/module/web/static/css/default/dashboard.less
@@ -167,14 +167,13 @@
.gradient(top, @blue, @blueDark);
}
- &.selected {
+ &.ui-selected {
.gradient(top, @yellow, @yellowDark);
color: @dark;
.iconf-chevron-down:hover {
color: @light;
}
-
}
img {
@@ -252,6 +251,6 @@ FANCY CHECKBOXES
cursor: pointer;
}
-.file-view.selected .checkbox {
+.file-view.ui-selected .checkbox {
background: url(../../img/default/checks_sheet.png) -21px top no-repeat;
-}
+} \ No newline at end of file
diff --git a/module/web/static/js/models/File.js b/module/web/static/js/models/File.js
index efea23254..e965df9df 100644
--- a/module/web/static/js/models/File.js
+++ b/module/web/static/js/models/File.js
@@ -14,7 +14,11 @@ define(['jquery', 'backbone', 'underscore'], function($, Backbone, _) {
media: -1,
added: -1,
fileorder: -1,
- download: null
+ download: null,
+
+ // UI attributes
+ selected: false,
+ visible: true
},
diff --git a/module/web/static/js/views/fileView.js b/module/web/static/js/views/fileView.js
index ef1f5bba8..3a4183289 100644
--- a/module/web/static/js/views/fileView.js
+++ b/module/web/static/js/views/fileView.js
@@ -41,9 +41,9 @@ define(['jquery', 'backbone', 'underscore', 'app', 'views/abstract/itemView'],
this.$el.html(this.template(data));
if (this.model.get('selected'))
- this.$el.addClass('selected');
+ this.$el.addClass('ui-selected');
else
- this.$el.removeClass('selected');
+ this.$el.removeClass('ui-selected');
this.$('.iconf-chevron-down').dropdown();
@@ -52,10 +52,10 @@ define(['jquery', 'backbone', 'underscore', 'app', 'views/abstract/itemView'],
select: function(e) {
e.preventDefault();
- var checked = this.$el.hasClass('selected');
+ var checked = this.$el.hasClass('ui-selected');
// toggle class immediately, so no re-render needed
this.model.set('selected', !checked, {silent: true});
- this.$el.toggleClass('selected');
+ this.$el.toggleClass('ui-selected');
App.vent.trigger('file:selection');
}
diff --git a/module/web/static/js/views/selectionView.js b/module/web/static/js/views/selectionView.js
index 6d346b6ee..4c433e31c 100644
--- a/module/web/static/js/views/selectionView.js
+++ b/module/web/static/js/views/selectionView.js
@@ -17,6 +17,8 @@ define(['jquery', 'backbone', 'underscore', 'app'],
tree: null,
// selected files
files: null,
+ // Element of the action bar
+ actionBar: null,
// needed to know when slide down
current: 0,
@@ -28,7 +30,10 @@ define(['jquery', 'backbone', 'underscore', 'app'],
App.vent.on('package:selection', _.bind(this.render, this));
App.vent.on('file:selection', _.bind(this.render, this));
- // TODO
+ this.actionBar = $('.actionbar .btn-check');
+ this.actionBar.parent().click(_.bind(this.select_toggle, this));
+
+ // TODO when something gets deleted
// this.tree.get('packages').on('delete', _.bind(this.render, this));
},
@@ -58,8 +63,12 @@ define(['jquery', 'backbone', 'underscore', 'app'],
else if (files + packs === 0 && this.current > 0)
this.$el.slideIn();
- this.current = files + packs;
+ if (files > 0)
+ this.actionBar.addClass('iconf-check').removeClass('iconf-check-empty');
+ else
+ this.actionBar.addClass('iconf-check-empty').removeClass('iconf-check');
+ this.current = files + packs;
},
set_files: function(files) {
@@ -67,7 +76,8 @@ define(['jquery', 'backbone', 'underscore', 'app'],
this.render();
},
- deselect: function() {
+ // Deselects all items, optional only files
+ deselect: function(filesOnly) {
this.get_files().map(function(file) {
file.set('selected', false);
});
@@ -107,6 +117,23 @@ define(['jquery', 'backbone', 'underscore', 'app'],
});
this.deselect();
+ },
+
+ // Select or deselect all visible files
+ select_toggle: function() {
+ var files = this.get_files();
+ if (files.length === 0) {
+ // TODO Select only visible files
+ this.files.map(function(file) {
+ file.set('selected', true);
+ });
+
+ } else
+ files.map(function(file) {
+ file.set('selected', false);
+ });
+
+ this.render();
}
});
}); \ No newline at end of file
diff --git a/module/web/templates/default/dashboard.html b/module/web/templates/default/dashboard.html
index c7bcb3783..e80426dcc 100644
--- a/module/web/templates/default/dashboard.html
+++ b/module/web/templates/default/dashboard.html
@@ -61,38 +61,38 @@
<script type="text/template" id="template-file">
<div class="file-row first">
<i class="checkbox"></i>
- <i class="iconf-file-alt icon-white"></i>&nbsp;
+ <i class="iconf-file-alt"></i>&nbsp;
<span class="name">
<% name %>
</span>
</div>
<%= if finished %>
<div class="file-row second finished">
- <% else %> <%= if failed %>
- <div class="file-row second failed">
- <% download.error %>
- <% else %>
- <div class="file-row second">
- <%/if%><%/if%>
- <% download.statusmsg %>
- </div>
+ <% else %> <%= if failed %>
+ <div class="file-row second failed">
+ <% download.error %>
+ <% else %>
+ <div class="file-row second">
+ <%/if%><%/if%>
+ <% download.statusmsg %>
+ </div>
- <div class="file-row third pull-right">
- {# TODO: file type as icon #}
- <% formatSize size %>
- <i class="iconf-music"></i>
- <img src="icons/<% download.plugin %>"/>
- <% download.plugin %>&nbsp;
- <i class="iconf-chevron-down" data-toggle="dropdown"></i>
- <ul class="dropdown-menu">
- <li><a href="#"><i class="iconf-trash"></i> Delete</a></li>
- <li><a href="#"><i class="iconf-refresh"></i> Restart</a></li>
- <li><a href="#"><i class="iconf-download"></i> Download</a></li>
- <li><a href="#"><i class="iconf-share"></i> Share</a></li>
- <li class="divider"></li>
- <li><a>Addons</a></li>
- </ul>
- </div>
+ <div class="file-row third pull-right">
+ {# TODO: file type as icon #}
+ <% formatSize size %>
+ <i class="iconf-music"></i>
+ <img src="icons/<% download.plugin %>"/>
+ <% download.plugin %>&nbsp;
+ <i class="iconf-chevron-down" data-toggle="dropdown"></i>
+ <ul class="dropdown-menu">
+ <li><a href="#"><i class="iconf-trash"></i> Delete</a></li>
+ <li><a href="#"><i class="iconf-refresh"></i> Restart</a></li>
+ <li><a href="#"><i class="iconf-download"></i> Download</a></li>
+ <li><a href="#"><i class="iconf-share"></i> Share</a></li>
+ <li class="divider"></li>
+ <li><a>Addons</a></li>
+ </ul>
+ </div>
</script>
<script type="text/template" id="template-select">
@@ -123,11 +123,14 @@
<li style="float: right;">
<form class="form-search">
<div class="input-append">
- <input type="text" class="search-query" style="width: 100px">
+ <input type="text" class="search-query" style="width: 120px">
<button type="submit" class="btn">{{ _("Search") }}</button>
</div>
</form>
</li>
+ <li style="float: right">
+ <a href="#"><i class="iconf-check-empty btn-check"></i></a>
+ </li>
<li class="dropdown" style="float: right;">
<a class="dropdown-toggle"
data-toggle="dropdown"
@@ -137,32 +140,27 @@
</a>
<ul class="dropdown-menu">
<li><a><i class="icon-ok"></i>&nbsp;Audio</a></li>
- <li><a><i class="icon-remove"></i>&nbsp;Video</a></li>
- <li><a>Archive</a></li>
+ <li><a><i class="icon-ok"></i>&nbsp;Image</a></li>
+ <li><a><i class="icon-ok"></i>&nbsp;Video</a></li>
+ <li><a><i class="icon-ok"></i>&nbsp;Document</a></li>
+ <li><a><i class="icon-remove"></i>&nbsp;Archive</a></li>
+ <li><a><i class="icon-remove"></i>&nbsp;Other</a></li>
</ul>
</li>
<li class="dropdown" style="float: right;">
<a class="dropdown-toggle"
data-toggle="dropdown"
href="#">
- More
+ All
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
- <li><a>Active</a></li>
+ <li><a>All</a></li>
+ <li><a>Finished</a></li>
+ <li><a>Unfinished</a></li>
<li><a>Failed</a></li>
</ul>
</li>
-
- <li style="float: right;">
- <a>Failed</a>
- </li>
- <li style="float: right;">
- <a>Unfinished</a>
- </li>
- <li class="active" style="float: right;">
- <a href="#" id="show_active">All</a>
- </li>
</ul>
{% endblock %}
generated by cgit v1.2.3 (git 2.25.1) at 2025-10-31 21:35:01 +0100