[example] configuable elFinder options in elfinder.html

mjyu51 · Jun 14, 2017 · 024b623 · 024b623
1 parent b7cf4fc
commit 024b623
Show file tree

Hide file tree

Showing 2 changed files with 87 additions and 31 deletions.
diff --git a/elfinder.html b/elfinder.html
@@ -8,7 +8,36 @@
 		<!-- Require JS (REQUIRED) -->
 		<!-- Rename "main.default.js" to "main.js" and edit it if you need configure elFInder options or any things -->
 		<script data-main="./main.default.js" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.3.2/require.min.js"></script>
-
+		<script>
+			define('elFinderConfig', {
+				// elFinder options (REQUIRED)
+				// Documentation for client options:
+				// https://github.com/Studio-42/elFinder/wiki/Client-configuration-options
+				defaultOpts : {
+					url : 'php/connector.minimal.php' // connector URL (REQUIRED)
+					,commandsOptions : {
+						edit : {
+							extraOptions : {
+								// set API key to enable Creative Cloud image editor
+								// see https://console.adobe.io/
+								creativeCloudApiKey : '',
+								// browsing manager URL for CKEditor, TinyMCE
+								// uses self location with the empty value
+								managerUrl : ''
+							}
+						}
+						,quicklook : {
+							// to enable preview with Google Docs Viewer
+							googleDocsMimes : ['application/pdf', 'image/tiff', 'application/vnd.ms-office', 'application/msword', 'application/vnd.ms-word', 'application/vnd.ms-excel', 'application/vnd.ms-powerpoint', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']
+						}
+					}
+				},
+				managers : {
+					// 'DOM Element ID': { /* elFinder options of this DOM Element */ }
+					'elfinder': {}
+				}
+			});
+		</script>
 	</head>
 	<body>
 

diff --git a/main.default.js b/main.default.js
@@ -29,48 +29,43 @@
 			return lang;
 		})(),
 
-		// elFinder options (REQUIRED)
-		// Documentation for client options:
-		// https://github.com/Studio-42/elFinder/wiki/Client-configuration-options
-		opts = {
-			url : 'php/connector.minimal.php' // connector URL (REQUIRED)
-			,lang: lang                       // auto detected language (optional)
-			,commandsOptions : {
-				edit : {
-					extraOptions : {
-						// set API key to enable Creative Cloud image editor
-						// see https://console.adobe.io/
-						creativeCloudApiKey : '',
-						// browsing manager URL for CKEditor, TinyMCE
-						// uses self location with the empty value
-						managerUrl : ''
-					}
-				}
-				,quicklook : {
-					// to enable preview with Google Docs Viewer
-					googleDocsMimes : ['application/pdf', 'image/tiff', 'application/vnd.ms-office', 'application/msword', 'application/vnd.ms-word', 'application/vnd.ms-excel', 'application/vnd.ms-powerpoint', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']
-				}
-			}
-		},
-
 		// Start elFinder (REQUIRED)
-		start = function(elFinder, editors) {
+		start = function(elFinder, editors, config) {
 			// load jQueryUI CSS
 			elFinder.prototype.loadCss('//cdnjs.cloudflare.com/ajax/libs/jqueryui/'+uiver+'/themes/smoothness/jquery-ui.css');
 
 			$(function() {
+				var optEeditors = {
+						commandsOptions: {
+							edit: {
+								editors: Array.isArray(editors)? editors : []
+							}
+						}
+					},
+					opts = {};
 				// Optional for Japanese decoder "extras/encoding-japanese.min"
 				if (window.Encoding && Encoding.convert) {
 					elFinder.prototype._options.rawStringDecoder = function(s) {
 						return Encoding.convert(s,{to:'UNICODE',type:'string'});
 					};
 				}
 
-				// editors marges to opts.commandOptions.edit
-				opts.commandsOptions.edit.editors = (opts.commandsOptions.edit.editors || []).concat(editors);
-
-				// Make elFinder (REQUIRED)
-				$('#elfinder').elfinder(opts);
+				// Interpretation of "elFinderConfig"
+				if (config && config.managers) {
+					$.each(config.managers, function(id, mOpts) {
+						opts = Object.assign({}, config.defaultOpts || {});
+						// editors marges to opts.commandOptions.edit
+						try {
+							mOpts.commandsOptions.edit.editors = mOpts.commandsOptions.edit.editors.concat(editors || []);
+						} catch(e) {
+							Object.assign(mOpts, optEeditors);
+						}
+						// Make elFinder
+						$('#' + id).elfinder($.extend(true, { lang: lang }, opts, mOpts || {}));
+					});
+				} else {
+					alert('"elFinderConfig" object is wrong.');
+				}
 			});
 		},
 
@@ -80,6 +75,7 @@
 				[
 					'elfinder'
 					, 'extras/editors.default'                   // load text, image editors
+					, 'elFinderConfig'
 					, (lang !== 'en')? 'elfinder.lang' : null    // load detected language
 				//	, 'extras/quicklook.googledocs'              // optional preview for GoogleApps contents on the GoogleDrive volume
 				//	, (lang === 'jp')? 'extras/encoding-japanese.min' : null // optional Japanese decoder for archive preview
@@ -109,6 +105,37 @@
 		waitSeconds : 10 // optional
 	});
 
+	// check elFinderConfig and fallback
+	if (! require.defined('elFinderConfig')) {
+		define('elFinderConfig', {
+			// elFinder options (REQUIRED)
+			// Documentation for client options:
+			// https://github.com/Studio-42/elFinder/wiki/Client-configuration-options
+			defaultOpts : {
+				url : 'php/connector.minimal.php' // connector URL (REQUIRED)
+				,commandsOptions : {
+					edit : {
+						extraOptions : {
+							// set API key to enable Creative Cloud image editor
+							// see https://console.adobe.io/
+							creativeCloudApiKey : '',
+							// browsing manager URL for CKEditor, TinyMCE
+							// uses self location with the empty value
+							managerUrl : ''
+						}
+					}
+					,quicklook : {
+						// to enable preview with Google Docs Viewer
+						googleDocsMimes : ['application/pdf', 'image/tiff', 'application/vnd.ms-office', 'application/msword', 'application/vnd.ms-word', 'application/vnd.ms-excel', 'application/vnd.ms-powerpoint', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']
+					}
+				}
+			},
+			managers : {
+				'elfinder': {},
+			}
+		});
+	}
+
 	// load JavaScripts (REQUIRED)
 	load();