1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-16 15:19:06 +00:00

Rewrite repo.js with DropdownView

This commit is contained in:
Daniel Pan
2016-03-22 18:32:42 +08:00
parent cb02bca661
commit 0f335a8aa3
3 changed files with 26 additions and 33 deletions

View File

@@ -1202,9 +1202,11 @@ textarea:-moz-placeholder {/* for FF */
/**** dropdown menu ******/
.dropdown {
position:relative;
display:inline;
}
.dropdown-menu {
position:absolute;
left:0px;
background:#fff;
padding:6px 1px;
border:1px solid rgba(34,36,38,.15);

View File

@@ -41,8 +41,9 @@
<div class="op-container">
<span class="sf2-icon-share sf2-x repo-share-btn op-icon vh" title="{% trans "Share" %}"></span>
<span class="sf2-icon-delete sf2-x repo-delete-btn op-icon vh" title="{% trans "Delete" %}"></span>
<span class="sf2-icon-caret-down more-op-icon op-icon vh js-toggle-popup" title="{% trans "More operations" %}"></span>
<ul class="hidden-op repo-hidden-op hide dropdown-menu">
<div class="dropdown js-dropdown">
<span class="sf2-icon-caret-down more-op-icon op-icon vh js-dropdown-toggle" title="{% trans "More operations" %}"></span>
<ul class="hidden-op repo-hidden-op hide dropdown-menu js-dropdown-content">
<li><a class="op js-repo-rename" href="#">{% trans "Rename" %}</a></li>
<li><a class="op js-repo-transfer" href="#">{% trans "Transfer" %}</a></li>
<li><a class="op js-popup-history-setting" href="#">{% trans "History Setting" %}</a></li>
@@ -57,6 +58,7 @@
<% } %>
</ul>
</div>
</div>
</td>
<td><%= size_formatted %></td>
<td><%= mtime_relative %></td>

View File

@@ -8,10 +8,11 @@ define([
'app/views/dialogs/repo-history-settings',
'app/views/dialogs/repo-share-link-admin',
'app/views/dialogs/repo-folder-perm-admin',
'app/views/widgets/hl-item-view'
'app/views/widgets/hl-item-view',
'app/views/widgets/dropdown'
], function($, _, Backbone, Common, ShareView, RepoChangePasswordDialog,
HistorySettingsDialog, RepoShareLinkAdminDialog, RepoFolderPermAdminDialog,
HLItemView) {
HLItemView, DropdownView) {
'use strict';
var RepoView = HLItemView.extend({
@@ -25,7 +26,6 @@ define([
events: {
'click .repo-delete-btn': 'del',
'click .repo-share-btn': 'share',
'click .js-toggle-popup': 'togglePopup',
'click .js-repo-rename': 'rename',
'click .js-repo-transfer': 'transfer',
'click .js-repo-change-password': 'changePassword',
@@ -49,6 +49,9 @@ define([
'icon_title': this.model.getIconTitle()
});
this.$el.html(this.template(obj));
this.dropdown = new DropdownView({
el: this.$('.js-dropdown')
});
return this;
},
@@ -119,21 +122,7 @@ define([
},
togglePopup: function() {
var $icon = this.$('.js-toggle-popup'),
$popup = this.$('.hidden-op');
if ($popup.hasClass('hide')) { // the popup is not shown
$popup.css({'left': $icon.position().left});
if ($icon.offset().top + $popup.height() <= $('#main').offset().top + $('#main').height()) {
// below the icon
$popup.css('top', $icon.position().top + $icon.outerHeight(true) + 3);
} else {
$popup.css('bottom', $icon.parent().outerHeight() - $icon.position().top + 3);
}
$popup.removeClass('hide');
} else {
$popup.addClass('hide');
}
this.dropdown.hide();
},
rename: function() {