1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-02 07:47:32 +00:00

[mobile] added 'updateDirOpBarUI'

This commit is contained in:
llj 2017-01-12 11:39:21 +08:00
parent 7c4d32ac24
commit 01fb83c9b2
4 changed files with 63 additions and 19 deletions

View File

@ -3257,7 +3257,7 @@ button.sf-dropdown-toggle:focus {
/* multi repo operation */
.repo-op .op-link {
display:inline-block;
height:30px;
height:29px;
margin-right:15px;
color:#8a8a8a;
font-size:22px;
@ -3267,9 +3267,6 @@ button.sf-dropdown-toggle:focus {
text-decoration:none;
}
/* multi dirents operation */
#multi-dirents-op {
margin-left:5px;
}
#multi-dirents-op .op-btn {
margin:0;
}
@ -3590,11 +3587,37 @@ img.thumbnail {
font-size:12px;
color:#888;
}
/****** grid view *****/
/* view mode */
@media (max-width:499px) {
.repo-op-misc {
display:block;
margin:5px 0 0 0;
}
.switch-mode {
vertical-align:middle;
}
.trash-history {
display:inline-block;
margin-left:30px;
vertical-align:middle;
}
}
@media (min-width:500px) {
.repo-op-misc {
display:inline-block;
margin-left:12px;
overflow:hidden;
vertical-align:middle;
}
.trash-history {
float:right;
}
}
.trash-history {
height:29px;
}
.switch-mode {
display:inline-block;
margin-left:12px;
}
.grid-view-icon-btn,
.list-view-icon-btn {

View File

@ -244,22 +244,24 @@
<% } %>
</div><!-- div#cur-dir-ops ends here -->
<div class="switch-mode vam">
<button class="list-view-icon-btn sf2-icon-list-view <% if (mode == 'list') { %>active<% } %>" title="{% trans "List" %}" id="js-switch-list-view" aria-label="{% trans "list view" %}"></button><button class="grid-view-icon-btn sf2-icon-grid-view <% if (mode == 'grid') { %>active<% } %>" title="{% trans "Grid" %}" id="js-switch-grid-view" aria-label="{% trans "grid view" %}"></button>
</div>
<div class="repo-op-misc">
<div class="switch-mode">
<button class="list-view-icon-btn sf2-icon-list-view <% if (mode == 'list') { %>active<% } %>" title="{% trans "List" %}" id="js-switch-list-view" aria-label="{% trans "list view" %}"></button><button class="grid-view-icon-btn sf2-icon-grid-view <% if (mode == 'grid') { %>active<% } %>" title="{% trans "Grid" %}" id="js-switch-grid-view" aria-label="{% trans "grid view" %}"></button>
</div>
<% if (path == '/') { %>
<div class="fright">
<div class="trash-history">
<% if (path == '/') { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash" href="<%= site_root %>repo/recycle/<%- repo_id %>/?referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}" aria-label="{% trans "Trash" %}"></a>
<% } %>
<a class="op-link sf2-icon-history" href="<%= site_root %>repo/history/<%- repo_id %>/?referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'History' %}" aria-label="{% trans "History" %}"></a>
</div>
<% } else { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash fright" href="<%= site_root %>dir/recycle/<%- repo_id %>/?dir_path=<% print(encodeURIComponent(path)); %>&referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}"></a>
<% } else { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash" href="<%= site_root %>dir/recycle/<%- repo_id %>/?dir_path=<% print(encodeURIComponent(path)); %>&referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}"></a>
<% } %>
<% } %>
<% } %>
</div>
</div>
</script>
<script type="text/template" id="dir-path-bar-tmpl">
<% if (context == 'group') { %>

View File

@ -76,13 +76,16 @@ define([
this.render();
// scroll window: get 'more', fix 'op bar'
var _this = this;
// scroll window: get 'more', fix 'op bar'
$(window).scroll(function() {
if ($(_this.el).is(':visible')) {
_this.onWindowScroll();
}
});
$(window).resize(function() {
_this.updateDirOpBarUI();
});
// hide 'rename form'
$(document).click(function(e) {
@ -172,6 +175,9 @@ define([
this.$el_con.show();
this.setFileInput();
this.updateDirOpBarUI(); // should be after `setFileInput()`
// there may be a 'style' added via 'onWindowScroll()' when visiting last dir
this.$('.js-dir-content').removeAttr('style');
@ -200,11 +206,20 @@ define([
this.dir.limit = 100;
this.render_dirents_slice(this.dir.last_start, this.dir.limit);
this.setFileInput();
this.getImageThumbnail();
},
updateDirOpBarUI: function() {
var width;
if ($(window).width() > 500) {
width = this.$('.repo-op').width() - parseInt(this.$('.repo-op-misc').css('margin-left')) - 5;
width -= $('#multi-dirents-op').is(':visible') ? $('#multi-dirents-op').width() : $('#cur-dir-ops').width();
this.$('.repo-op-misc').css({'width': width});
} else {
this.$('.repo-op-misc').removeAttr('style');
}
},
updateMagnificPopupOptions: function() {
var imgs = this.dir.where({is_img: true});
var items = [];
@ -451,6 +466,7 @@ define([
})))
.removeAttr('style'); // there may be a 'style' added via 'onWindowScroll()' when visiting last dir
if (dir.user_perm == 'rw') {
// add new folder/file
this.new_dropdown = new DropdownView({
@ -848,6 +864,8 @@ define([
$dirents_op.hide();
$curDirOps.show();
}
this.updateDirOpBarUI();
},
download: function () {

View File

@ -134,6 +134,7 @@ define([
$dirents_op.hide();
$curDirOps.show();
}
dirView.updateDirOpBarUI();
if (checked_num == dirView.$('tr:gt(0)').length) {
$toggle_all_checkbox.prop('checked', true);
} else {