haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-25 14:50:29 +00:00
Code Issues Releases Wiki Activity

Merge pull request #1139 from haiwen/fileupload2

Browse Source 
Fileupload
This commit is contained in:
llj
2016-04-21 16:07:05 +08:00
parent f9237a15e1 6e98536793
commit 88a73c4323
5 changed files with 85 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
media/css/seahub.css
View File

@@ -358,6 +358,7 @@ p { margin:0.5em 0; }
.label { color:#333; font-size:12px; font-style:normal; }
.italic { font-style:italic; }
.alc { text-align: center;}
.inline-block { display: inline-block; }
.cspt { cursor:pointer; }
.pos-rel { position:relative; }
.top-tip {
@@ -2086,36 +2087,6 @@ button.dropdown-toggle:focus {
margin-top:8px;
}
/* file upload */
.repo-op .upload-file-btn {
display: inline-block;
height: auto;
padding: 5px 6px;
border: 1px solid #c5c5c5;
border-radius: 2px;
position:relative;
overflow:hidden;
}
#upload-menu,
#add-pub-lib-menu {
position:absolute;
z-index:12; /* make it on top of a checkbox */
border:1px solid #c5c5c5;
border-radius:2px;
box-shadow: 0 0 2px #c5c5c5;
background:#fff;
}
#upload-menu .item,
#add-pub-lib-menu .item {
padding:0 10px;
height:27px;
line-height:27px;
cursor:pointer;
}
#upload-menu .item {
position:relative;
text-align:left;
overflow:hidden; /* for 'hover', as long 'input' in it. */
}
.fixed-upload-file-dialog {
width: 540px;
position: fixed;
@@ -2162,9 +2133,7 @@ button.dropdown-toggle:focus {
font-size:13px;
color:#333;
}
.fileinput-button input,
#upload-file input,
#upload-menu input {
.fileinput-button input {
position: absolute;
top: 0;
right: 0;

23
seahub/templates/js/templates.html
View File

@@ -100,21 +100,24 @@
<button id="cp-dirents" title="{% trans 'Copy' %}" class="op-btn sf2-icon-copy op-icon"></button>
<button id="del-dirents" title="{% trans 'Delete' %}" class="op-btn sf2-icon-delete op-icon"></button>
</div>
<div id="upload-file" class="op-btn upload-file-btn">
<span>{% trans "Upload" %}</span>
<input type="file" name="file" multiple />
<div id="basic-upload" class="inline-block">
<button class="op-btn basic-upload-btn" >{% trans "Upload" %}</button>
<input id="basic-upload-input" class="hide" type="file" name="file" multiple />
</div>
<% if (enable_upload_folder) { %>
<ul id="upload-menu" class="hide">
<li class="item">
<span>{% trans "Upload Files" %}</span>
<input type="file" name="file" multiple />
<div id="advanced-upload" class="dropdown dropdown-inline">
<button class="dropdown-toggle op-btn">{% trans "Upload" %}</button>
<ul id="upload-menu" class="dropdown-menu hide">
<li>
<a class="op advanced-upload-file" href="#">{% trans "Upload Files" %}</a>
<input id="advanced-upload-file-input" class="hide" type="file" name="file" multiple />
</li>
<li class="item">
<span>{% trans "Upload Folder" %}</span>
<input type="file" name="file" multiple directory webkitdirectory />
<li>
<a class="op advanced-upload-folder" href="#">{% trans "Upload Folder" %}</a>
<input id="advanced-upload-folder-input" class="hide" type="file" name="file" multiple directory webkitdirectory />
</li>
</ul>
</div>
<% } %>
<button id="add-new-dir" class="op-btn">{% trans "New Folder" %}</button>
<button id="add-new-file" class="op-btn">{% trans "New File" %}</button>

10
seahub/templates/sysadmin/admin_repo_view.html
View File

@@ -27,9 +27,9 @@
</p>
{% if is_default_repo %}
<div class="repo-op fright">
<div id="upload-file" class="op-btn upload-file-btn">
<span class="icon-upload-alt"></span><span>{% trans "Upload"%}</span>
<input type="file" name="file" multiple />
<div id="upload-file" class="inline-block">
<button class="op-btn"><span class="icon-upload-alt"></span><span>{% trans "Upload"%}</span></button>
<input class="hide" type="file" name="file" multiple />
</div>
<button id="add-new-dir" class="op-btn"><span class="icon-plus-sign-alt"></span>{% trans "New Directory"%}</button>
</div>
@@ -257,6 +257,10 @@ $(function() {
});
});
$('#upload-file button').click(function() {
$('#upload-file input').click();
});
// fold/unfold the dialog
$('#upload-file-dialog .fold-switch').click(function() {
var popup = $('#upload-file-dialog');

63
static/scripts/app/views/dir.js
View File

@@ -12,10 +12,11 @@ define([
'app/views/dirent',
'app/views/dirent-grid',
'app/views/fileupload',
'app/views/share'
'app/views/share',
'app/views/widgets/dropdown'
], function($, progressbar, magnificPopup, simplemodal, _, Backbone, Common,
FileTree, Cookies, DirentCollection, DirentView, DirentGridView,
FileUploadView, ShareView) {
FileUploadView, ShareView, DropdownView) {
'use strict';
var DirView = Backbone.View.extend({
@@ -204,10 +205,47 @@ define([
this.dir.limit = 100;
this.render_dirents_slice(this.dir.last_start, this.dir.limit);
this.fileUploadView.setFileInput();
this.setFileInput();
this.getImageThumbnail();
},
// for fileupload
setFileInput: function () {
var dir = this.dir;
if (!dir.user_perm || dir.user_perm != 'rw') {
return;
}
var $popup = this.fileUploadView.$el;
if (app.pageOptions.enable_upload_folder) {
if ('webkitdirectory' in $('#basic-upload-input')[0]) {
// if enable_upload_folder and is chrome
this.$("#basic-upload").remove();
this.$("#advanced-upload").show();
this.upload_dropdown = new DropdownView({
el: this.$("#advanced-upload")
});
$popup.fileupload(
'option',
'fileInput',
this.$('#advanced-upload input[type="file"]'));
} else {
this.$("#advanced-upload").remove();
$popup.fileupload(
'option',
'fileInput',
this.$('#basic-upload-input'));
}
} else {
$popup.fileupload(
'option',
'fileInput',
this.$('#basic-upload-input'));
}
},
getImageThumbnail: function() {
if (!app.pageOptions.enable_thumbnail || this.dir.encrypted) {
return false;
@@ -429,7 +467,24 @@ define([
'click #cp-dirents': 'cp',
'click #del-dirents': 'del',
'click .by-name': 'sortByName',
'click .by-time': 'sortByTime'
'click .by-time': 'sortByTime',
'click .basic-upload-btn': 'uploadFile',
'click .advanced-upload-file': 'advancedUploadFile',
'click .advanced-upload-folder': 'advancedUploadFolder'
},
uploadFile: function() {
this.$('#basic-upload-input').trigger('click');
},
advancedUploadFile: function() {
this.$('#advanced-upload-file-input').trigger('click');
return false;
},
advancedUploadFolder: function() {
this.$('#advanced-upload-folder-input').trigger('click');
return false;
},
newDir: function() {

57
static/scripts/app/views/fileupload.js
View File

@@ -98,8 +98,7 @@ define([
// hide the upload menu
var menu = dirView.$('#upload-menu');
if (!menu.hasClass('hide')) {
menu.find('.item').removeAttr('style')
.end().addClass('hide');
menu.addClass('hide');
}
var file = data.files[0];
@@ -422,15 +421,6 @@ define([
window.location.href.replace(/\/repo\/[-a-z0-9]{36}\/.*/, app.config.mediaUrl + 'cors/result.html?%s')
);
$(document).click(function(e) {
var target = e.target || event.srcElement;
var closePopup = function(popup, popup_switch) {
if (!popup.hasClass('hide') && !popup.is(target) && !popup.find('*').is(target) && !popup_switch.is(target) && !popup_switch.find('*').is(target) ) {
popup.addClass('hide');
}
};
closePopup(dirView.$('#upload-menu'), dirView.$('#upload-file'));
});
},
events: {
@@ -455,51 +445,6 @@ define([
var popup = this.$el;
popup.addClass('hide');
$('.files', popup).empty();
},
setFileInput: function () {
var dirView = this.dirView,
dir = dirView.dir;
var popup = this.$el;
if (dir.user_perm && dir.user_perm == 'rw') {
popup.fileupload(
'option',
'fileInput',
dirView.$('#upload-file input'));
}
if (!app.pageOptions.enable_upload_folder) {
return;
}
var upload_btn = dirView.$('#upload-file'),
upload_menu = dirView.$('#upload-menu');
if (dir.user_perm && dir.user_perm == 'rw' &&
'webkitdirectory' in $('input[type="file"]', upload_btn)[0]) {
upload_btn.find('input').remove().end().addClass('cspt');
$('.item', upload_menu).click(function() {
popup.fileupload(
'option',
'fileInput',
$('input[type="file"]', $(this))
);
})
.hover(
function() {
$(this).css({'background':'#f3f3f3'});
},
function() {
$(this).css({'background':'transparent'});
}
);
upload_btn.click(function () {
upload_menu.toggleClass('hide');
upload_menu.css({
'left': upload_btn.position().left,
'top': parseInt(dirView.$('.repo-op').css('padding-top')) + upload_btn.outerHeight(true)
});
});
}
}
});