Эх сурвалжийг харах

HUE-654 added filechooser to Move dialog, fixed bug on filechooser, added onFolderChange callback

Enrico Berti 13 жил өмнө
parent
commit
c4e082126b

+ 21 - 1
apps/filebrowser/src/filebrowser/templates/move.mako

@@ -23,8 +23,12 @@
     <div class="modal-body">
         <div style="padding-left: 15px;">
         ${edit.render_field(form["src_path"], hidden=True)}
-        ${edit.render_field(form["dest_path"], notitle=True, klass="input-xlarge")}
+        ${edit.render_field(form["dest_path"], notitle=True, klass="input-xlarge pathChooser")}
         </div>
+		<br/>
+		<div id="fileChooserModal" class="smallModal well hide">
+			<a href="#" class="close" data-dismiss="modal">&times;</a>
+		</div>
     </div>
     <div class="modal-footer">
 		<div id="moveNameRequiredAlert" class="hide" style="position: absolute; left: 10;">
@@ -34,3 +38,19 @@
         <a class="btn" onclick="$('#moveModal').modal('hide');">Cancel</a>
     </div>
 </form>
+<script type="text/javascript" charset="utf-8">
+	$(".pathChooser").click(function(){
+		var self = this;
+		$("#fileChooserModal").jHueFileChooser({
+			onFileChoose: function(filePath) {
+				$(self).val(filePath);
+			},
+			onFolderChange: function(folderPath){
+				$(self).val(folderPath);
+			},
+			createFolder: false,
+			uploadFile: false
+		});
+		$("#fileChooserModal").slideDown();
+	});
+</script>

+ 99 - 90
desktop/core/static/js/Source/jHue/jquery.filechooser.js

@@ -8,7 +8,8 @@
 		initialPath: "",
 		createFolder: true,
 		uploadFile: true,
-		onFileChoose: function(){}
+		onFileChoose: function(){},
+        onFolderChange: function(){}
 	};
 
 	function Plugin(element, options) {
@@ -16,6 +17,7 @@
 		this.options = $.extend({}, defaults, options) ;
 		this._defaults = defaults;
 		this._name = pluginName;
+        this.previousPath = "";
 		this.init();
 	}
 	
@@ -29,101 +31,108 @@
 		$(_parent.element).empty();
 		$.getJSON("/filebrowser/chooser"+path, function(data){
 			var _flist = $("<ul>").addClass("unstyled");
-			$(data.files).each(function(cnt, file){
-				var _f = $("<li>");
-				var _flink = $("<a>");
-				_flink.attr("href","#").text(file.name).appendTo(_f);
-				if (file.type == "dir"){
-					_f.addClass("folder");
-					_f.click(function(){
-						_parent.navigateTo(file.path);
-					});
-				}
-				if (file.type == "file"){
-					_f.addClass("file");
-					_f.click(function(){
-						_parent.options.onFileChoose(file.path)
-					});
-				}
-				_f.appendTo(_flist);
-			});
-			_flist.appendTo($(_parent.element));
-			var _actions = $("<div>").addClass("clearfix").attr('id', 'actionsDiv');
-			var _uploadFileBtn;
-			var _createFolderBtn;
-			if (_parent.options.uploadFile){
-				_uploadFileBtn = $("<div>").attr('id', 'file-uploader');
-				_uploadFileBtn.appendTo(_actions);
+            if (data.title != null && data.title == "Error"){
+                var _errorMsg = $("<div>").addClass("alert").addClass("alert-error").text(data.message + " -- " + _parent.previousPath);
+                _errorMsg.appendTo($(_parent.element));
+                var _previousLink = $("<button>").addClass("btn").addClass("bnt-small").text("Back").click(function(){
+                    _parent.options.onFolderChange(_parent.previousPath);
+                    _parent.navigateTo(_parent.previousPath);
+                });
+                _previousLink.appendTo($(_parent.element));                
+            }
+            else {
+                _parent.previousPath = path;
+                $(data.files).each(function(cnt, file){
+                    var _f = $("<li>");
+                    var _flink = $("<a>");
+                    _flink.attr("href","#").text(file.name).appendTo(_f);
+                    if (file.type == "dir"){
+                        _f.addClass("folder");
+                        _f.click(function(){
+                            _parent.options.onFolderChange(file.path);
+                            _parent.navigateTo(file.path);
+                        });
+                    }
+                    if (file.type == "file"){
+                        _f.addClass("file");
+                        _f.click(function(){
+                            _parent.options.onFileChoose(file.path);
+                        });
+                    }
+                    _f.appendTo(_flist);
+                });
+                _flist.appendTo($(_parent.element));
+                var _actions = $("<div>").addClass("clearfix").attr('id', 'actionsDiv');
+                var _uploadFileBtn;
+                var _createFolderBtn;
+                if (_parent.options.uploadFile){
+                    _uploadFileBtn = $("<div>").attr('id', 'file-uploader');
+                    _uploadFileBtn.appendTo(_actions);
+                    initUploader(path, _parent, _uploadFileBtn);
+                }
+                $("<span> </span>").appendTo(_actions);
+                if (_parent.options.createFolder){
+                    _createFolderBtn = $("<button>").addClass("btn").addClass("small").text("Create folder");
+                    _createFolderBtn.appendTo(_actions);
+                    var _createFolderDetails = $("<div>").css("padding-top","10px");
+                    _createFolderDetails.hide();
+                    
+                    var _folderName = $("<input>").attr("type","text").attr("placeholder","Folder name").appendTo(_createFolderDetails);
+                    $("<span> </span>").appendTo(_createFolderDetails);
+                    var _folderBtn = $("<input>").attr("type","button").attr("value","Create").addClass("btn primary").appendTo(_createFolderDetails);
+                    $("<span> or </span>").appendTo(_createFolderDetails);
+                    var _folderCancel = $("<a>").attr("href","#").text("cancel").appendTo(_createFolderDetails);
+                    _folderCancel.click(function(){
+                        if (_uploadFileBtn){
+                            _uploadFileBtn.removeClass("disabled");
+                        }
+                        _createFolderBtn.removeClass("disabled");
+                        _createFolderDetails.slideUp();
+                    });
+                    _folderBtn.click(function(){
+                        $.ajax({
+                            type: "POST",
+                            url: "/filebrowser/mkdir",
+                            data: {
+                                name: _folderName.val(),
+                                path: path
+                            },
+                            beforeSend: function(xhr){ 
+                                xhr.setRequestHeader("X-Requested-With", "Hue"); // need to override the default one because otherwise Django returns HTTP 500
+                            },
+                            success: function(xhr, status){
+                                if (status == "success"){
+                                    _parent.navigateTo(path);
+                                    if (_uploadFileBtn){
+                                        _uploadFileBtn.removeClass("disabled");
+                                    }
+                                    _createFolderBtn.removeClass("disabled");
+                                    _createFolderDetails.slideUp();
+                                }
+                            }
+                        });
+                        
+                    });
 				
-			
-				if ($.fn.upload){
-
-					//_uploadFileBtn.upload();
-				}
-			}
-			$("<span> </span>").appendTo(_actions);
-			if (_parent.options.createFolder){
-				_createFolderBtn = $("<button>").addClass("btn").addClass("small").text("Create folder");
-				_createFolderBtn.appendTo(_actions);
-				var _createFolderDetails = $("<div>").css("padding-top","10px");
-				_createFolderDetails.hide();
-				
-				var _folderName = $("<input>").attr("type","text").attr("placeholder","Folder name").appendTo(_createFolderDetails);
-				$("<span> </span>").appendTo(_createFolderDetails);
-				var _folderBtn = $("<input>").attr("type","button").attr("value","Create").addClass("btn primary").appendTo(_createFolderDetails);
-				$("<span> or </span>").appendTo(_createFolderDetails);
-				var _folderCancel = $("<a>").attr("href","#").text("cancel").appendTo(_createFolderDetails);
-				_folderCancel.click(function(){
-					if (_uploadFileBtn){
-						_uploadFileBtn.removeClass("disabled");
-					}
-					_createFolderBtn.removeClass("disabled");
-					_createFolderDetails.slideUp();
-				});
-				_folderBtn.click(function(){
-					$.ajax({
-						type: "POST",
-						url: "/filebrowser/mkdir",
-						data: {
-							name: _folderName.val(),
-							path: path
-						},
-						beforeSend: function(xhr){ 
-							xhr.setRequestHeader("X-Requested-With", "Hue"); // need to override the default one because otherwise Django returns HTTP 500
-						},
-						success: function(xhr, status){
-							if (status == "success"){
-								_parent.navigateTo(path);
-								if (_uploadFileBtn){
-									_uploadFileBtn.removeClass("disabled");
-								}
-								_createFolderBtn.removeClass("disabled");
-								_createFolderDetails.slideUp();
-							}
-						}
-					});
-					
-				});
-				
-				_createFolderDetails.appendTo(_actions);
-				
-				_createFolderBtn.click(function(){
-					if (_uploadFileBtn){
-						_uploadFileBtn.addClass("disabled");
-					}
-					_createFolderBtn.addClass("disabled");
-					_createFolderDetails.slideDown();
-				});
+                    _createFolderDetails.appendTo(_actions);
+                    
+                    _createFolderBtn.click(function(){
+                        if (_uploadFileBtn){
+                            _uploadFileBtn.addClass("disabled");
+                        }
+                        _createFolderBtn.addClass("disabled");
+                        _createFolderDetails.slideDown();
+                    });
+                    _actions.appendTo($(_parent.element));
+                }
 			}
-			_actions.appendTo($(_parent.element));
-			initUploader(path, _parent);
 		});
 		
 	};
-	function initUploader(path, _parent){
+	function initUploader(path, _parent, el){
 		completeRefreshPath = path;
 		var uploader = new qq.FileUploader({
-            element: document.getElementById('file-uploader'),
+            element: el[0],
             action: '/filebrowser/upload',
             params:{
                 dest: path,
@@ -132,7 +141,7 @@
             onComplete:function(id, fileName, responseJSON){
 				_parent.navigateTo(path);
             },
-            debug: true
+            debug: false
         });
 	}