"]],
- useCSS: false, // use CSS to style HTML when possible (not supported in ie)
+ useCSS: true, // use CSS to style HTML when possible (not supported in ie)
docType: // Document type contained within the editor
'',
docCSSFile: // CSS file used to style the document contained within the editor
@@ -57,7 +52,7 @@
// Define all usable toolbar buttons - the init string property is
// expanded during initialization back into the buttons object and
- // seperate object properties are created for each button.
+ // separate object properties are created for each button.
// e.g. buttons.size.title = "Font Size"
buttons: {
// name,title,command,popupName (""=use name)
@@ -109,7 +104,7 @@
// Loop through all matching textareas and create the editors
this.each(function(idx, elem) {
- if (elem.tagName == "TEXTAREA") {
+ if (elem.tagName.toUpperCase() === "TEXTAREA") {
var data = $.data(elem, CLEDITOR);
if (!data) data = new cleditor(elem, options);
$result = $result.add(data);
@@ -129,6 +124,7 @@
// Misc constants
BACKGROUND_COLOR = "backgroundColor",
+ BLURRED = "blurred",
BUTTON = "button",
BUTTON_NAME = "buttonName",
CHANGE = "change",
@@ -136,6 +132,7 @@
CLICK = "click",
DISABLED = "disabled",
DIV_TAG = "
",
+ FOCUSED = "focused",
TRANSPARENT = "transparent",
UNSELECTABLE = "unselectable",
@@ -152,12 +149,15 @@
PROMPT_CLASS = "cleditorPrompt", // prompt popup divs inside body
MSG_CLASS = "cleditorMsg", // message popup div inside body
- // Test for ie
- ie = $.browser.msie,
- ie6 = /msie\s6/i.test(navigator.userAgent),
+ // Browser detection
+ ua = navigator.userAgent.toLowerCase(),
+ ie = /msie/.test(ua),
+ ie6 = /msie\s6/.test(ua),
+ iege11 = /(trident)(?:.*rv:([\w.]+))?/.test(ua),
+ webkit = /webkit/.test(ua),
// Test for iPhone/iTouch/iPad
- iOS = /iphone|ipad|ipod/i.test(navigator.userAgent),
+ iOS = /iphone|ipad|ipod/i.test(ua),
// Popups are created once as needed and shared by all editor instances
popups = {},
@@ -223,19 +223,26 @@
var $group = $(DIV_TAG)
.addClass(GROUP_CLASS)
.appendTo($toolbar);
+
+ // Initialize the group width
+ var groupWidth = 0;
// Add the buttons to the toolbar
$.each(options.controls.split(" "), function(idx, buttonName) {
if (buttonName === "") return true;
// Divider
- if (buttonName == "|") {
+ if (buttonName === "|") {
// Add a new divider to the group
var $div = $(DIV_TAG)
.addClass(DIVIDER_CLASS)
.appendTo($group);
+ // Update the group width
+ $group.width(groupWidth + 1);
+ groupWidth = 0;
+
// Create a new group
$group = $(DIV_TAG)
.addClass(GROUP_CLASS)
@@ -258,6 +265,10 @@
.appendTo($group)
.hover(hoverEnter, hoverLeave);
+ // Update the group width
+ groupWidth += 24;
+ $group.width(groupWidth + 1);
+
// Prepare the button image
var map = {};
if (button.css) map = button.css;
@@ -295,7 +306,7 @@
// Bind the window resize event when the width or height is auto or %
if (/auto|%/.test("" + options.width + options.height))
- $(window).resize(function() {
+ $(window).bind('resize.cleditor', function () {
//Forcefully blurred iframe contentWindow, chrome, IE, safari doesn't trigger blur on window resize and due to which text disappears
var contentWindow = editor.$frame[0].contentWindow;
if(!$.browser.mozilla && contentWindow){
@@ -306,7 +317,6 @@
refresh(editor);
}
});
-
// Create the iframe and resize the controls
refresh(editor);
@@ -347,13 +357,26 @@
return editor;
};
});
+
+ // blurred - shortcut for .bind("blurred", handler) or .trigger("blurred")
+ fn.blurred = function(handler) {
+ var $this = $(this);
+ return handler ? $this.bind(BLURRED, handler) : $this.trigger(BLURRED);
+ };
// change - shortcut for .bind("change", handler) or .trigger("change")
- fn.change = function(handler) {
+ fn.change = function change(handler) {
+ console.log('change test');
var $this = $(this);
return handler ? $this.bind(CHANGE, handler) : $this.trigger(CHANGE);
};
+ // focused - shortcut for .bind("focused", handler) or .trigger("focused")
+ fn.focused = function(handler) {
+ var $this = $(this);
+ return handler ? $this.bind(FOCUSED, handler) : $this.trigger(FOCUSED);
+ };
+
//===============
// Event Handlers
//===============
@@ -369,7 +392,7 @@
popup = popups[popupName];
// Check if disabled
- if (editor.disabled || $(buttonDiv).attr(DISABLED) == DISABLED)
+ if (editor.disabled || $(buttonDiv).attr(DISABLED) === DISABLED)
return;
// Fire the buttonClick event
@@ -387,7 +410,7 @@
return false;
// Toggle source
- if (buttonName == "source") {
+ if (buttonName === "source") {
// Show the iframe
if (sourceMode(editor)) {
@@ -418,10 +441,10 @@
var $popup = $(popup);
// URL
- if (popupName == "url") {
+ if (popupName === "url") {
// Check for selection before showing the link url popup
- if (buttonName == "link" && selectedText(editor) === "") {
+ if (buttonName === "link" && selectedText(editor) === "") {
showMessage(editor, "A selection is required when inserting a link.", buttonDiv);
return false;
}
@@ -447,7 +470,7 @@
}
// Paste as Text
- else if (popupName == "pastetext") {
+ else if (popupName === "pastetext") {
// Wire up the submit button click event handler
$popup.children(":button")
@@ -475,13 +498,13 @@
return false; // stop propagination to document click
}
- // propaginate to documnt click
+ // propaginate to document click
return;
}
// Print
- else if (buttonName == "print")
+ else if (buttonName === "print")
editor.$frame[0].contentWindow.print();
// All other buttons
@@ -526,19 +549,19 @@
useCSS = editor.options.useCSS;
// Get the command value
- if (buttonName == "font")
+ if (buttonName === "font")
// Opera returns the fontfamily wrapped in quotes
value = target.style.fontFamily.replace(/"/g, "");
- else if (buttonName == "size") {
- if (target.tagName == "DIV")
+ else if (buttonName === "size") {
+ if (target.tagName.toUpperCase() === "DIV")
target = target.children[0];
value = target.innerHTML;
}
- else if (buttonName == "style")
+ else if (buttonName === "style")
value = "<" + target.tagName + ">";
- else if (buttonName == "color")
+ else if (buttonName === "color")
value = hex(target.style.backgroundColor);
- else if (buttonName == "highlight") {
+ else if (buttonName === "highlight") {
value = hex(target.style.backgroundColor);
if (ie) command = 'backcolor';
else useCSS = true;
@@ -610,7 +633,7 @@
$popup.html(popupContent);
// Color
- else if (popupName == "color") {
+ else if (popupName === "color") {
var colors = options.colors.split(" ");
if (colors.length < 10)
$popup.width("auto");
@@ -622,7 +645,7 @@
}
// Font
- else if (popupName == "font")
+ else if (popupName === "font")
$.each(options.fonts.split(","), function(idx, font) {
$(DIV_TAG).appendTo($popup)
.css("fontFamily", font)
@@ -630,28 +653,28 @@
});
// Size
- else if (popupName == "size")
+ else if (popupName === "size")
$.each(options.sizes.split(","), function(idx, size) {
$(DIV_TAG).appendTo($popup)
- .html("" + size + "");
+ .html('' + size + '');
});
// Style
- else if (popupName == "style")
+ else if (popupName === "style")
$.each(options.styles, function(idx, style) {
$(DIV_TAG).appendTo($popup)
.html(style[1] + style[0] + style[1].replace("<", " ');
+ else if (popupName === "url") {
+ $popup.html('Enter URL:
');
popupTypeClass = PROMPT_CLASS;
}
// Paste as Text
- else if (popupName == "pastetext") {
- $popup.html('Paste your content here and click submit.
');
+ else if (popupName === "pastetext") {
+ $popup.html('Paste your content here and click submit.
');
popupTypeClass = PROMPT_CLASS;
}
@@ -720,12 +743,12 @@
}
// Execute the command and check for error
- var success = true, description;
- if (ie && command.toLowerCase() == "inserthtml")
+ var success = true, message;
+ if (ie && command.toLowerCase() === "inserthtml")
getRange(editor).pasteHTML(value);
else {
try { success = editor.doc.execCommand(command, 0, value || null); }
- catch (err) { description = err.description; success = false; }
+ catch (err) { message = err.message; success = false; }
if (!success) {
if ("cutcopypaste".indexOf(command) > -1)
showMessage(editor, "For security reasons, your browser does not support the " +
@@ -733,13 +756,14 @@
button);
else
showMessage(editor,
- (description ? description : "Error executing the " + command + " command."),
+ (message ? message : "Error executing the " + command + " command."),
button);
}
}
- // Enable the buttons
+ // Enable the buttons and update the textarea
refreshButtons(editor);
+ updateTextArea(editor, true);
return success;
}
@@ -765,19 +789,26 @@
return editor.$frame[0].contentWindow.getSelection();
}
- // Returns the hex value for the passed in string.
- // hex("rgb(255, 0, 0)"); // #FF0000
- // hex("#FF0000"); // #FF0000
- // hex("#F00"); // #FF0000
+ // hex - returns the hex value for the passed in color string
function hex(s) {
- var m = /rgba?\((\d+), (\d+), (\d+)/.exec(s),
- c = s.split("");
+
+ // hex("rgb(255, 0, 0)") returns #FF0000
+ var m = /rgba?\((\d+), (\d+), (\d+)/.exec(s);
if (m) {
- s = ( m[1] << 16 | m[2] << 8 | m[3] ).toString(16);
+ s = (m[1] << 16 | m[2] << 8 | m[3]).toString(16);
while (s.length < 6)
s = "0" + s;
+ return "#" + s;
}
- return "#" + (s.length == 6 ? s : c[1] + c[1] + c[2] + c[2] + c[3] + c[3]);
+
+ // hex("#F00") returns #FF0000
+ var c = s.split("");
+ if (s.length === 4)
+ return "#" + c[1] + c[1] + c[2] + c[2] + c[3] + c[3];
+
+ // hex("#FF0000") returns #FF0000
+ return s;
+
}
// hidePopups - hides all popups
@@ -792,9 +823,8 @@
// imagesPath - returns the path to the images folder
function imagesPath() {
- var cssFile = "jquery.cleditor.css",
- href = $("link[href$='" + cssFile +"']").attr("href");
- return href.substr(0, href.length - cssFile.length) + "images/";
+ var href = $("link[href*=cleditor]").attr("href");
+ return href.replace(/^(.*\/)[^\/]+$/, '$1') + "images/";
}
// imageUrl - Returns the css url string for a filemane
@@ -813,7 +843,7 @@
editor.$frame.remove();
// Create a new iframe
- var $frame = editor.$frame = $('