FEATURE: added ability to upload images from site content pane. Merged via r9130, r91347, r91350, r91480

git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/branches/2.4@91496 467b73ca-7a2a-4603-9d3b-597d59a354a9

code/AssetAdmin.php

@@ -86,7 +86,7 @@ class AssetAdmin extends LeftAndMain {
 
 		Requirements::javascript(CMS_DIR . "/javascript/CMSMain_upload.js");
 		Requirements::javascript(CMS_DIR . "/javascript/Upload.js");
-		Requirements::javascript(THIRDPARTY_DIR . "/SWFUpload/SWFUpload.js");
+		Requirements::javascript(THIRDPARTY_DIR . "/SWFUpload/swfupload.js");
 		
 		Requirements::javascript(THIRDPARTY_DIR . "/greybox/AmiJS.js");
 		Requirements::javascript(THIRDPARTY_DIR . "/greybox/greybox.js");
@@ -165,15 +165,29 @@ JS
 	 * It will save the uploaded files to /assets/ and create new File objects as required.
 	 */
 	function doUpload($data, $form) {
+		$processedFiles = array();
+		
+		if(!isset($data['Files'])) return Director::set_status_code("404");
+		
+		if(is_array($data['Files'])) {
 			foreach($data['Files'] as $param => $files) {
 				if(!is_array($files)) $files = array($files);
 				foreach($files as $key => $value) {
 					$processedFiles[$key][$param] = $value;
 				}
 			}
+		}
+		else {
+			$proccessedFiles[] = $data['Files'];
+		}
 		
-		if($data['ID'] && $data['ID'] != 'root') $folder = DataObject::get_by_id("Folder", $data['ID']);
+		// get the folder to upload to.
-		else $folder = singleton('Folder');
+		if(isset($data['FolderID']) && $data['FolderID'] != "root") {
+			$folder = DataObject::get_by_id('Folder', $data['FolderID']);
+		}
+		else {
+			$folder = DataObject::get_one('Folder');
+		}
 		
 		$newFiles = array();
 		$fileSizeWarnings = '';

javascript/CMSMain_upload.js

@@ -6,15 +6,6 @@
 CMSMain_upload = Class.create();
 CMSMain_upload.prototype = {
 	initialize: function() {
-		// This is disabled until we get it working reliably
-		return;
-	
-		// We require flash 9
-		pv = getFlashPlayerVersion();
-		if(pv.major < 9) return;
-	
-		// Due to a bug in the flash plugin on Linux and Mac, we need at least version 9.0.64 to use SWFUpload
-		if(pv.major == 9 && pv.minor == 0 && pv.rev < 64) return;
 
 		// If those 2 checks pass, we can provide upload capabilities to the user
 		this.iframe = window.top.document.getElementById('AssetAdmin_upload');

javascript/TinyMCEImageEnhancement.js

@@ -7,21 +7,29 @@ TinyMCEImageEnhancement.prototype = {
     initialize: function() {
         this.filesUploaded = 0;
         this.processInProgress = false;
-        Event.observe(window,'load',this.onWindowLoad.bind(this));
-    },
 
-    addListeners: function() {
-        $('Form_EditorToolbarImageForm_FolderID').value = "";
         Event.observe($('AddFolder'),'click',this.onAddFolder.bind(this));
         Event.observe($('FolderOk'),'click',this.onFolderOk.bind(this));
         Event.observe($('FolderCancel'),'click',this.onFolderCancel.bind(this));
-        Event.observe($('UploadFiles'),'click',this.onUpload.bind(this));
+
+		this.onLoad();
+    },   
+	
+	onLoad: function() {
+		this.upload = new Upload({
+			fileUploadLimit : '6',
+			button_image_url : 'cms/images/swf-upload-button-small.jpg',
+			button_width : 59,
+			button_height: 18,
+			fileQueued: this.uploadFileQueuedCallback.bind(this),
+			fileComplete: this.uploadFileCompleteCallback.bind(this),
+			queueComplete: this.uploadQueueCompleteCallback.bind(this)
+		});
 	},
 	
 	/**
      * Method creates HTML element, only reason for this method is DRY. 
     */
-    
     addElement: function(tag, className, parent, properties) {
         var e = document.createElement(tag);
         Element.addClassName(e,className);
@@ -30,17 +38,6 @@ TinyMCEImageEnhancement.prototype = {
         return e;
     },
         
-    onUpload: function(event) {
-        Event.stop(event);
-        if(!this.processInProgress) {
-	        if(this.getParentID() != 'root') {
-	            this.upload.browse();
-	        } else {
-	            statusMessage("Please choose folder","bad");                                                
-	        }
-	    }
-    },
-    
     /**
      * Called when user clicks "add folder" anchor. 
     */
@@ -115,60 +112,31 @@ TinyMCEImageEnhancement.prototype = {
 		return false;
     },
     
-    /**
-     * Called on window.onload
-    */
-    
-    onWindowLoad: function() {
-        // Due to a bug in the flash plugin on Linux and Mac, 
-		 //we need at least version 9.0.64 to use SWFUpload
-		// see http://open.silverstripe.com/ticket/3023
-	   pv = getFlashPlayerVersion();
-	   if(pv.major < 9 || pv.major > 9 || (pv.major == 9 && pv.minor == 0 && pv.rev < 64)) {
-		  if($('AddFolderGroup')) $('AddFolderGroup').style.display = 'none';
-		  if($('PipeSeparator')) $('PipeSeparator').style.display = 'none';
-		  if($('UploadGroup')) $('UploadGroup').style.display = 'none';
-		  return;
-	   }
-	
-		if($('FolderID') != null) {
-			if($('SecurityID')) var securityid=$('SecurityID').value;
-			else var securityid=null;
-			this.upload = new Upload(
-				{
-				   fileTypes : '*.jpeg;*.jpg;*.jpe;*.png;*.gif;',
-				   fileTypesDescription : 'Image files',
-				   fileUploadLimit : '100',
-				   securityID : securityid,
-				   beginUploadOnQueue : true,
-				   buildUI : this.addListeners.bind(this),
-				   fileQueued : this.uploadFileQueuedCallback.bind(this),
-				   fileComplete : this.uploadFileCompleteCallback.bind(this),
-				   queueComplete : this.uploadQueueCompleteCallback.bind(this)
-				}		
-			);
-		}
-	},
-	
 	uploadFileQueuedCallback: function(file,queueLength) {
+		if(this.getParentID() == "root") {
+			statusMessage("Please choose folder","bad");	
+		}
+		else {
 			this.processInProgress = true;
-		this.upload.setFolderID(this.getParentID()); 
+			this.upload.swfu.addPostParam('FolderID', this.getParentID());
-		$('UploadFiles').innerHTML = "Uploading ... 1/" + this.upload.getFilesToUpload();	
+			this.upload.swfu.addFileParam(file.id,'ID',this.folderID);
-		this.upload.startUpload();
+			this.upload.swfu.addFileParam(file.id,'Files',file.name);
+			$('UploadFiles').innerHTML = "Uploading Files...("+ this.filesUploaded +")";	
+			this.upload.swfu.startUpload(file.id);		
+		}
 	},
 	
 	uploadFileCompleteCallback: function(file,serverData) {
-		Element.addClassName($('UploadFiles'),'link');//Safari hack
+		this.filesUploaded++;
-		$('UploadFiles').innerHTML = 'Uploading ... ' + this.upload.getFilesUploaded() + "/" + this.upload.getFilesToUpload();
+		$('UploadFiles').innerHTML = 'Uploading Files..... ('+ this.filesUploaded +")";
 	},
 	
-	uploadQueueCompleteCallback: function() {
+	uploadQueueCompleteCallback: function(serverData) {
 		this.filesUploaded = this.upload.getFilesUploaded();
-		$('UploadFiles').innerHTML = "upload";
+		$('UploadFiles').innerHTML = "";
-		statusMessage('Uploaded ' + this.upload.getFilesUploaded() + ' files','good');
+		statusMessage('Uploaded Files Successfully','good');
-		if(this.getParentID() != 'root') {
+		
-			$('Image').ajaxGetFiles(this.getParentID(), null, this.insertImages.bind(this));	
+		$('FolderImages').ajaxGetFiles(this.getParentID(), null);	
-		}
 	},
 	
 	/**
@@ -187,7 +155,6 @@ TinyMCEImageEnhancement.prototype = {
         $('Image').reapplyBehaviour();
 
         this.addToTinyMCE = this.addToTinyMCE.bind(this);
-
 		this.processInProgress = false;
     },
     

javascript/Upload.js

@@ -14,23 +14,33 @@ Upload.prototype = {
 	 * @param params object contains all configuration data for upload.
 	*/
 	initialize: function(params) {
+		
 		this.filesUploaded = 0;
 		this.filesToUpload = 0;
 		this.folderID = 'root';
 		this.uploadInProgress = false;
 		this.uploadMessage = '';
+		this.queueComplete = this.uploadQueueCompleteCallback.bind(this);
+		this.fileComplete = this.uploadFileCompleteCallback.bind(this);
+		this.fileQueued = this.uploadFileQueuedCallback;
+		
 		if(typeof params.fileSizeLimit != 'undefined') this.setFileSizeLimit = params.fileSizeLimit; else this.fileSizeLimit = '30720';
 		if(typeof params.fileTypes != 'undefined') this.fileTypes = params.fileTypes; else this.fileTypes = '*.*';
 		if(typeof params.fileTypesDescription != 'undefined') this.fileTypesDescription = params.fileTypesDescription; else this.fileTypesDescription = 'All Files';
 		if(typeof params.fileUploadLimit != 'undefined') this.fileUploadLimit = params.fileUploadLimit; else this.fileUploadLimit = '6';
-		if(typeof params.beginUploadOnQueue != 'undefined') this.beginUploadOnQueue = params.beginUploadOnQueue; else this.beginUploadOnQueue = false;
+		if(typeof params.beginUploadOnQueue != 'undefined') this.beginUploadOnQueue = params.beginUploadOnQueue; else this.beginUploadOnQueue = true;
 		if(typeof params.fileQueued != 'undefined') this.fileQueued = params.fileQueued; 
+		
 		if(typeof params.fileProgress != 'undefined') this.fileProgress = params.fileProgress; else this.fileProgress = Prototype.emptyFunction;
 		if(typeof params.fileCancelled != 'undefined') this.fileCancelled  = params.fileCancelled;
-		if(typeof params.fileComplete != 'undefined') this.fileComplete = params.fileComplete ;
+		if(typeof params.fileComplete != 'undefined') this.fileComplete = params.fileComplete;
 		if(typeof params.queueComplete != 'undefined') this.queueComplete = params.queueComplete;
 		if(typeof params.buildUI != 'undefined') this.customBuildUI = params.buildUI;
 		if(typeof params.securityID != 'undefined') this.securityID = params.securityID;
+		if(typeof params.button_image_url != 'undefined') this.buttonImageURL = params.button_image_url;
+		if(typeof params.button_width != 'undefined') this.buttonWidth = params.button_width;
+		if(typeof params.button_height != 'undefined') this.buttonHeight = params.button_height;
+		
 		this.onLoad();
 	},
 	
@@ -39,10 +49,11 @@ Upload.prototype = {
 	 * 
 	*/
 	onLoad: function() {
+		
 		path = this.getBasePath();
 		sessId = this.getSessionId();//Because flash doesn't send proper cookies, we need to set session id in URL. 
 		this.swfu = new SWFUpload({
-				upload_url: path + 'admin/assets/UploadForm?SecurityID=' + this.securityID +  '&PHPSESSID=' + sessId,   // Relative to the SWF file
+				upload_url: path + 'admin/assets/UploadForm?action_doUpload=1&PHPSESSID=' + sessId,   // Relative to the SWF file
 				file_post_name: 'Files',
 				file_size_limit : this.fileSizeLimit,
 				file_types : this.fileTypes,
@@ -51,18 +62,24 @@ Upload.prototype = {
 				begin_upload_on_queue : this.beginUploadOnQueue,
 				use_server_data_event : true,
 				validate_files: false,
-
+				button_placeholder_id: "SWFUploadButton",
-				file_queued_handler : this.uploadFileQueuedCallback.bind(this),
+				file_queued_handler : this.fileQueued,
-				upload_success_handler : this.uploadFileCompleteCallback.bind(this),
+				upload_success_handler : this.queueComplete,
+				file_dialog_complete_handler : this.fileCompleted,
 				upload_progress_handler: this.uploadFileProgressCallback.bind(this),
 				error_handler : this.uploadErrorCallback.bind(this),
 				file_validation_handler : Prototype.emptyFunction,
 				file_cancelled_handler: Prototype.emptyFunction,
-				
+				button_image_url : this.buttonImageURL,
-				flash_url : 'jsparty/SWFUpload/swfupload_f9.swf',	// Relative to this file
+				button_window_mode : "transparent",
+				button_width : this.buttonWidth,
+				button_height : this.buttonHeight,
+				flash_url : 'jsparty/SWFUpload/swfupload.swf',	// Relative to this file
 				swfupload_loaded_handler: this.buildUI.bind(this),
-				debug: false
+				debug: false,
+				preserve_relative_urls: true
 			});
+
 	},	
 	
 	/**
@@ -95,7 +112,7 @@ Upload.prototype = {
 	*/
 	
 	buildUI: function() {
-		this.customBuildUI();			
+		return;
 	},
 	
 	/**
@@ -107,7 +124,7 @@ Upload.prototype = {
 	
 	uploadFileQueuedCallback: function(file,queueLength) {
 		this.filesToUpload++;
-		this.fileQueued(file, queueLength);
+//		this.swfu.fileQueued(file, queueLength);
 		this.addFileParam(file);
 	},
 	
@@ -151,6 +168,10 @@ Upload.prototype = {
 		this.fileProgress(file, bytes_complete);
 	},
 		
+	uploadQueueCompleteCallback: function(event) {
+		
+	},
+	
 	/**
 	 * Called on error.
 	 * @param error_code int