rails_kindeditor 0.1.1 → 0.1.2

data/vendor/assets/javascripts/plugins/filemanager/filemanager.js

@@ -0,0 +1,189 @@
+/*******************************************************************************
+* KindEditor - WYSIWYG HTML Editor for Internet
+* Copyright (C) 2006-2011 kindsoft.net
+*
+* @author Roddy <luolonghao@gmail.com>
+* @site http://www.kindsoft.net/
+* @licence http://www.kindsoft.net/license.php
+*******************************************************************************/
+
+KindEditor.plugin('filemanager', function(K) {
+	var self = this, name = 'filemanager',
+		fileManagerJson = K.undef(self.fileManagerJson, self.basePath + 'php/file_manager_json.php'),
+		imgPath = self.pluginsPath + name + '/images/',
+		lang = self.lang(name + '.');
+	function makeFileTitle(filename, filesize, datetime) {
+		return filename + ' (' + Math.ceil(filesize / 1024) + 'KB, ' + datetime + ')';
+	}
+	function bindTitle(el, data) {
+		if (data.is_dir) {
+			el.attr('title', data.filename);
+		} else {
+			el.attr('title', makeFileTitle(data.filename, data.filesize, data.datetime));
+		}
+	}
+	self.plugin.filemanagerDialog = function(options) {
+		var width = K.undef(options.width, 520),
+			height = K.undef(options.height, 510),
+			dirName = K.undef(options.dirName, ''),
+			viewType = K.undef(options.viewType, 'VIEW').toUpperCase(), // "LIST" or "VIEW"
+			clickFn = options.clickFn;
+		var html = [
+			'<div style="padding:10px 20px;">',
+			// header start
+			'<div class="ke-plugin-filemanager-header">',
+			// left start
+			'<div class="ke-left">',
+			'<img class="ke-inline-block" name="moveupImg" src="' + imgPath + 'go-up.gif" width="16" height="16" border="0" alt="" /> ',
+			'<a class="ke-inline-block" name="moveupLink" href="javascript:;">' + lang.moveup + '</a>',
+			'</div>',
+			// right start
+			'<div class="ke-right">',
+			lang.viewType + ' <select class="ke-inline-block" name="viewType">',
+			'<option value="VIEW">' + lang.viewImage + '</option>',
+			'<option value="LIST">' + lang.listImage + '</option>',
+			'</select> ',
+			lang.orderType + ' <select class="ke-inline-block" name="orderType">',
+			'<option value="NAME">' + lang.fileName + '</option>',
+			'<option value="SIZE">' + lang.fileSize + '</option>',
+			'<option value="TYPE">' + lang.fileType + '</option>',
+			'</select>',
+			'</div>',
+			'<div class="ke-clearfix"></div>',
+			'</div>',
+			// body start
+			'<div class="ke-plugin-filemanager-body"></div>',
+			'</div>'
+		].join('');
+		var dialog = self.createDialog({
+			name : name,
+			width : width,
+			height : height,
+			title : self.lang(name),
+			body : html
+		}),
+		div = dialog.div,
+		bodyDiv = K('.ke-plugin-filemanager-body', div),
+		moveupImg = K('[name="moveupImg"]', div),
+		moveupLink = K('[name="moveupLink"]', div),
+		viewServerBtn = K('[name="viewServer"]', div),
+		viewTypeBox = K('[name="viewType"]', div),
+		orderTypeBox = K('[name="orderType"]', div);
+		function reloadPage(path, order, func) {
+			var url = fileManagerJson, param = '&path=' + path + '&order=' + order + '&dir=' + dirName;
+			if (!/\?/.test(url)) {
+				url += '?';
+				param = param.substr(1);
+			}
+			url += param + '&' + new Date().getTime();
+			K.ajax(url, func);
+		}
+		var elList = [];
+		function bindEvent(el, result, data, createFunc) {
+			var fileUrl = K.formatUrl(result.current_url + data.filename, 'absolute'),
+				dirPath = encodeURIComponent(result.current_dir_path + data.filename + '/');
+			if (data.is_dir) {
+				el.click(function(e) {
+					reloadPage(dirPath, orderTypeBox.val(), createFunc);
+				});
+			} else if (data.is_photo) {
+				el.click(function(e) {
+					clickFn.call(this, fileUrl, data.filename);
+				});
+			} else {
+				el.click(function(e) {
+					clickFn.call(this, fileUrl, data.filename);
+				});
+			}
+			elList.push(el);
+		}
+		function createCommon(result, createFunc) {
+			// remove events
+			K.each(elList, function() {
+				this.unbind();
+			});
+			moveupLink.unbind();
+			viewTypeBox.unbind();
+			orderTypeBox.unbind();
+			// add events
+			if (result.current_dir_path) {
+				moveupLink.click(function(e) {
+					reloadPage(result.moveup_dir_path, orderTypeBox.val(), createFunc);
+				});
+			}
+			function changeFunc() {
+				if (viewTypeBox.val() == 'VIEW') {
+					reloadPage(result.current_dir_path, orderTypeBox.val(), createView);
+				} else {
+					reloadPage(result.current_dir_path, orderTypeBox.val(), createList);
+				}
+			}
+			viewTypeBox.change(changeFunc);
+			orderTypeBox.change(changeFunc);
+			bodyDiv.html('');
+		}
+		function createList(result) {
+			createCommon(result, createList);
+			var table = document.createElement('table');
+			table.className = 'ke-table';
+			table.cellPadding = 0;
+			table.cellSpacing = 0;
+			table.border = 0;
+			bodyDiv.append(table);
+			var fileList = result.file_list;
+			for (var i = 0, len = fileList.length; i < len; i++) {
+				var data = fileList[i], row = K(table.insertRow(i));
+				row.mouseover(function(e) {
+					K(this).addClass('ke-on');
+				})
+				.mouseout(function(e) {
+					K(this).removeClass('ke-on');
+				});
+				var iconUrl = imgPath + (data.is_dir ? 'folder-16.gif' : 'file-16.gif'),
+					img = K('<img src="' + iconUrl + '" width="16" height="16" alt="' + data.filename + '" align="absmiddle" />'),
+					cell0 = K(row[0].insertCell(0)).addClass('ke-cell ke-name').append(img).append(document.createTextNode(' ' + data.filename));
+				if (!data.is_dir || data.has_file) {
+					row.css('cursor', 'pointer');
+					cell0.attr('title', data.filename);
+					bindEvent(cell0, result, data, createList);
+				} else {
+					cell0.attr('title', lang.emptyFolder);
+				}
+				K(row[0].insertCell(1)).addClass('ke-cell ke-size').html(data.is_dir ? '-' : Math.ceil(data.filesize / 1024) + 'KB');
+				K(row[0].insertCell(2)).addClass('ke-cell ke-datetime').html(data.datetime);
+			}
+		}
+		function createView(result) {
+			createCommon(result, createView);
+			var fileList = result.file_list;
+			for (var i = 0, len = fileList.length; i < len; i++) {
+				var data = fileList[i],
+					div = K('<div class="ke-inline-block ke-item"></div>');
+				bodyDiv.append(div);
+				var photoDiv = K('<div class="ke-inline-block ke-photo"></div>')
+					.mouseover(function(e) {
+						K(this).addClass('ke-on');
+					})
+					.mouseout(function(e) {
+						K(this).removeClass('ke-on');
+					});
+				div.append(photoDiv);
+				var fileUrl = result.current_url + data.filename,
+					iconUrl = data.is_dir ? imgPath + 'folder-64.gif' : (data.is_photo ? fileUrl : imgPath + 'file-64.gif');
+				var img = K('<img src="' + iconUrl + '" width="80" height="80" alt="' + data.filename + '" />');
+				if (!data.is_dir || data.has_file) {
+					photoDiv.css('cursor', 'pointer');
+					bindTitle(photoDiv, data);
+					bindEvent(photoDiv, result, data, createView);
+				} else {
+					photoDiv.attr('title', lang.emptyFolder);
+				}
+				photoDiv.append(img);
+				div.append('<div class="ke-name" title="' + data.filename + '">' + data.filename + '</div>');
+			}
+		}
+		viewTypeBox.val(viewType);
+		reloadPage('', orderTypeBox.val(), viewType == 'VIEW' ? createView : createList);
+	}
+
+});

data/vendor/assets/javascripts/plugins/flash/flash.js

@@ -0,0 +1,128 @@
+/*******************************************************************************
+* KindEditor - WYSIWYG HTML Editor for Internet
+* Copyright (C) 2006-2011 kindsoft.net
+*
+* @author Roddy <luolonghao@gmail.com>
+* @site http://www.kindsoft.net/
+* @licence http://www.kindsoft.net/license.php
+*******************************************************************************/
+
+KindEditor.plugin('flash', function(K) {
+	var self = this, name = 'flash', lang = self.lang(name + '.'),
+		allowFlashUpload = K.undef(self.allowFlashUpload, true),
+		allowFileManager = K.undef(self.allowFileManager, false),
+		uploadJson = K.undef(self.uploadJson, self.basePath + 'php/upload_json.php');
+	self.plugin.flash = {
+		edit : function() {
+			var html = [
+				'<div style="padding:10px 20px;">',
+				//url
+				'<div class="ke-dialog-row">',
+				'<label for="keUrl" style="width:60px;">' + lang.url + '</label>',
+				'<input class="ke-input-text" type="text" id="keUrl" name="url" value="" style="width:160px;" /> &nbsp;',
+				'<input type="button" class="ke-upload-button" value="' + lang.upload + '" /> &nbsp;',
+				'<span class="ke-button-common ke-button-outer">',
+				'<input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />',
+				'</span>',
+				'</div>',
+				//width
+				'<div class="ke-dialog-row">',
+				'<label for="keWidth" style="width:60px;">' + lang.width + '</label>',
+				'<input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="550" maxlength="4" /> ',
+				'</div>',
+				//height
+				'<div class="ke-dialog-row">',
+				'<label for="keHeight" style="width:60px;">' + lang.height + '</label>',
+				'<input type="text" id="keHeight" class="ke-input-text ke-input-number" name="height" value="400" maxlength="4" /> ',
+				'</div>',
+				'</div>'
+			].join('');
+			var dialog = self.createDialog({
+				name : name,
+				width : 450,
+				height : 200,
+				title : self.lang(name),
+				body : html,
+				yesBtn : {
+					name : self.lang('yes'),
+					click : function(e) {
+						var url = urlBox.val(),
+							html = K.mediaImg(self.themesPath + 'common/blank.gif', {
+								src : url,
+								type : K.mediaType('.swf'),
+								width : widthBox.val(),
+								height : heightBox.val(),
+								quality : 'high'
+							});
+						self.insertHtml(html).hideDialog().focus();
+					}
+				}
+			}),
+			div = dialog.div,
+			urlBox = K('[name="url"]', div),
+			viewServerBtn = K('[name="viewServer"]', div),
+			widthBox = K('[name="width"]', div),
+			heightBox = K('[name="height"]', div);
+			urlBox.val('http://');
+
+			if (allowFlashUpload) {
+				var uploadbutton = K.uploadbutton({
+					button : K('.ke-upload-button', div)[0],
+					fieldName : 'imgFile',
+					url : uploadJson + '?dir=flash',
+					afterUpload : function(data) {
+						if (data.error === 0) {
+							var url = K.formatUrl(data.url, 'absolute');
+							urlBox.val(url);
+							if (self.afterUpload) {
+								self.afterUpload.call(self, url);
+							}
+							alert(self.lang('uploadSuccess'));
+						} else {
+							alert(data.message);
+						}
+					}
+				});
+				uploadbutton.fileBox.change(function(e) {
+					uploadbutton.submit();
+				});
+			} else {
+				K('.ke-upload-button', div).hide();
+				urlBox.width(250);
+			}
+
+			if (allowFileManager) {
+				viewServerBtn.click(function(e) {
+					self.loadPlugin('filemanager', function() {
+						self.plugin.filemanagerDialog({
+							viewType : 'LIST',
+							dirName : 'flash',
+							clickFn : function(url, title) {
+								if (self.dialogs.length > 1) {
+									K('[name="url"]', div).val(url);
+									self.hideDialog();
+								}
+							}
+						});
+					});
+				});
+			} else {
+				viewServerBtn.hide();
+			}
+
+			var img = self.plugin.getSelectedFlash();
+			if (img) {
+				var attrs = K.mediaAttrs(img.attr('data-ke-tag'));
+				urlBox.val(attrs.src);
+				widthBox.val(K.removeUnit(img.css('width')) || attrs.width || 0);
+				heightBox.val(K.removeUnit(img.css('height')) || attrs.height || 0);
+			}
+			urlBox[0].focus();
+			urlBox[0].select();
+		},
+		'delete' : function() {
+			self.plugin.getSelectedFlash().remove();
+		}
+	};
+	self.clickToolbar(name, self.plugin.flash.edit);
+});

data/vendor/assets/javascripts/plugins/image/image.js

@@ -0,0 +1,226 @@
+/*******************************************************************************
+* KindEditor - WYSIWYG HTML Editor for Internet
+* Copyright (C) 2006-2011 kindsoft.net
+*
+* @author Roddy <luolonghao@gmail.com>
+* @site http://www.kindsoft.net/
+* @licence http://www.kindsoft.net/license.php
+*******************************************************************************/
+
+KindEditor.plugin('image', function(K) {
+	var self = this, name = 'image',
+		allowImageUpload = K.undef(self.allowImageUpload, true),
+		allowFileManager = K.undef(self.allowFileManager, false),
+		uploadJson = K.undef(self.uploadJson, self.basePath + 'php/upload_json.php'),
+		imgPath = self.basePath + 'plugins/image/images/',
+		lang = self.lang(name + '.');
+	self.plugin.image = {
+		edit : function() {
+			var html = [
+				'<div style="padding:10px 20px;">',
+				//tabs
+				'<div class="tabs"></div>',
+				//url or file
+				'<div class="ke-dialog-row">',
+				'<div class="tab1" style="display:none;">',
+				'<label for="keUrl" style="width:60px;">' + lang.remoteUrl + '</label>',
+				'<input type="text" id="keUrl" class="ke-input-text" name="url" value="" style="width:200px;" /> &nbsp;',
+				'<span class="ke-button-common ke-button-outer">',
+				'<input type="button" class="ke-button-common ke-button" name="viewServer" value="' + lang.viewServer + '" />',
+				'</span>',
+				'</div>',
+				'<div class="tab2" style="display:none;">',
+				'<label style="width:60px;">' + lang.localUrl + '</label>',
+				'<input type="text" name="localUrl" class="ke-input-text" tabindex="-1" style="width:200px;" readonly="true" /> &nbsp;',
+				'<input type="button" class="ke-upload-button" value="' + lang.viewServer + '" />',
+				'</div>',
+				'</div>',
+				//size
+				'<div class="ke-dialog-row">',
+				'<label for="keWidth" style="width:60px;">' + lang.size + '</label>',
+				lang.width + ' <input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="" maxlength="4" /> ',
+				lang.height + ' <input type="text" class="ke-input-text ke-input-number" name="height" value="" maxlength="4" /> ',
+				'<img class="ke-refresh-btn" src="' + imgPath + 'refresh.gif" width="16" height="16" alt="" style="cursor:pointer;" />',
+				'</div>',
+				//align
+				'<div class="ke-dialog-row">',
+				'<label style="width:60px;">' + lang.align + '</label>',
+				'<input type="radio" name="align" class="ke-inline-block" value="" checked="checked" /> <img name="defaultImg" src="' + imgPath + 'align_top.gif" width="23" height="25" alt="" />',
+				' <input type="radio" name="align" class="ke-inline-block" value="left" /> <img name="leftImg" src="' + imgPath + 'align_left.gif" width="23" height="25" alt="" />',
+				' <input type="radio" name="align" class="ke-inline-block" value="right" /> <img name="rightImg" src="' + imgPath + 'align_right.gif" width="23" height="25" alt="" />',
+				'</div>',
+				//title
+				'<div class="ke-dialog-row">',
+				'<label for="keTitle" style="width:60px;">' + lang.imgTitle + '</label>',
+				'<input type="text" id="keTitle" class="ke-input-text" name="title" value="" style="width:200px;" /></div>',
+				'</div>',
+				'</div>'
+			].join('');
+			var dialogWidth = allowImageUpload ? 450 : 400;
+				dialogHeight = allowImageUpload ? 300 : 250;
+			var dialog = self.createDialog({
+				name : name,
+				width : dialogWidth,
+				height : dialogHeight,
+				title : self.lang(name),
+				body : html,
+				yesBtn : {
+					name : self.lang('yes'),
+					click : function(e) {
+						// insert local image
+						if (tabs.selectedIndex === 1) {
+							uploadbutton.submit();
+							return;
+						}
+						// insert remote image
+						var url = urlBox.val(),
+							width = widthBox.val(),
+							height = heightBox.val(),
+							title = titleBox.val(),
+							align = '';
+						alignBox.each(function() {
+							if (this.checked) {
+								align = this.value;
+								return false;
+							}
+						});
+						self.exec('insertimage', url, title, width, height, 0, align).hideDialog().focus();
+					}
+				},
+				beforeRemove : function() {
+					viewServerBtn.remove();
+					widthBox.remove();
+					heightBox.remove();
+					refreshBtn.remove();
+					uploadbutton.remove();
+				}
+			}),
+			div = dialog.div;
+
+			var tabs;
+			if (allowImageUpload) {
+				tabs = K.tabs({
+					src : K('.tabs', div),
+					afterSelect : function(i) {
+				
+					}
+				});
+				tabs.add({
+					title : lang.remoteImage,
+					panel : K('.tab1', div)
+				});
+				tabs.add({
+					title : lang.localImage,
+					panel : K('.tab2', div)
+				});
+				tabs.select(0);
+			} else {
+				K('.tab1', div).show();
+			}
+
+			var urlBox = K('[name="url"]', div),
+				localUrlBox = K('[name="localUrl"]', div),
+				viewServerBtn = K('[name="viewServer"]', div),
+				widthBox = K('[name="width"]', div),
+				heightBox = K('[name="height"]', div),
+				refreshBtn = K('.ke-refresh-btn', div),
+				titleBox = K('[name="title"]', div),
+				alignBox = K('[name="align"]');
+
+			var uploadbutton = K.uploadbutton({
+				button : K('.ke-upload-button', div)[0],
+				fieldName : 'imgFile',
+				url : uploadJson + '?dir=image',
+				afterUpload : function(data) {
+					if (data.error === 0) {
+						var width = widthBox.val(),
+							height = heightBox.val(),
+							title = titleBox.val(),
+							align = '';
+						alignBox.each(function() {
+							if (this.checked) {
+								align = this.value;
+								return false;
+							}
+						});
+						var url = K.formatUrl(data.url, 'absolute');
+						self.exec('insertimage', url, title, width, height, 0, align).hideDialog().focus();
+						if (self.afterUpload) {
+							self.afterUpload.call(self, url);
+						}
+					} else {
+						alert(data.message);
+					}
+				}
+			});
+			uploadbutton.fileBox.change(function(e) {
+				localUrlBox.val(uploadbutton.fileBox.val());
+			});
+			if (allowFileManager) {
+				viewServerBtn.click(function(e) {
+					self.loadPlugin('filemanager', function() {
+						self.plugin.filemanagerDialog({
+							viewType : 'VIEW',
+							dirName : 'image',
+							clickFn : function(url, title) {
+								if (self.dialogs.length > 1) {
+									K('[name="url"]', div).val(url);
+									self.hideDialog();
+								}
+							}
+						});
+					});
+				});
+			} else {
+				viewServerBtn.hide();
+			}
+			var originalWidth = 0, originalHeight = 0;
+			function setSize(width, height) {
+				widthBox.val(width);
+				heightBox.val(height);
+				originalWidth = width;
+				originalHeight = height;
+			}
+			refreshBtn.click(function(e) {
+				var tempImg = K('<img src="' + urlBox.val() + '" />', self.edit.doc).css({
+						position : 'absolute',
+						visibility : 'hidden',
+						top : 0,
+						left : '1000px'
+					});
+				K(self.edit.doc.body).append(tempImg);
+				setSize(tempImg.width(), tempImg.height());
+				tempImg.remove();
+			});
+			widthBox.change(function(e) {
+				if (originalWidth > 0) {
+					heightBox.val(Math.round(originalHeight / originalWidth * parseInt(this.value, 10)));
+				}
+			});
+			heightBox.change(function(e) {
+				if (originalHeight > 0) {
+					widthBox.val(Math.round(originalWidth / originalHeight * parseInt(this.value, 10)));
+				}
+			});
+			urlBox.val('http://');
+			var img = self.plugin.getSelectedImage();
+			if (img) {
+				urlBox.val(img.attr('data-ke-src'));
+				setSize(img.width(), img.height());
+				titleBox.val(img.attr('title'));
+				alignBox.each(function() {
+					if (this.value === img.attr('align')) {
+						this.checked = true;
+						return false;
+					}
+				});
+			}
+			urlBox[0].focus();
+			urlBox[0].select();
+		},
+		'delete' : function() {
+			self.plugin.getSelectedImage().remove();
+		}
+	};
+	self.clickToolbar(name, self.plugin.image.edit);
+});