From 3c6330b5913e3575d7f3fd234803e01d18b4f45b Mon Sep 17 00:00:00 2001 From: "Alan P. Laudicina" Date: Wed, 12 Jun 2013 15:16:16 -0400 Subject: [PATCH 1/3] Bold / Italic / Strike / Underline buttons don't work correctly * Fixes #19 * Problem: addRange or removeAllRanges kills the browser command states. * Store cache in commandCache * Add updateCommandCache and restoreCommandCache methods * Add support for command-with-arg buttons to be in an active state * Update command cache when running execCommand * Store and then update selected commands when selecting a toolbar button * Create the command cache by looking up the buttons that are in the DOM, set the default value to false --- bootstrap-wysiwyg.js | 44 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) diff --git a/bootstrap-wysiwyg.js b/bootstrap-wysiwyg.js index 69f64a7..7a10c7f 100644 --- a/bootstrap-wysiwyg.js +++ b/bootstrap-wysiwyg.js @@ -23,12 +23,43 @@ selectedRange, options, toolbarBtnSelector, + commandCache = {}, + updateCommandCache = function () { + var key; + for (key in commandCache) { + var commandValue = document.queryCommandValue(key); + var commandState = document.queryCommandState(key); + + if (commandState) { + commandCache[key] = commandState; + } else if (commandValue.length > 0 && commandValue !== 'false') { + commandCache[key] = commandValue; + } else { + commandCache[key] = false; + } + } + }, + restoreCommandCache = function() { + var key; + for (key in commandCache) { + var val = commandCache[key]; + if (typeof(val) === 'boolean') { + if (val !== document.queryCommandState(key)) { + document.execCommand(key, 0, null); + } + } else if (val !== document.queryCommandValue(key)) { + document.execCommand(key, 0, val); + } + } + }, updateToolbar = function () { if (options.activeToolbarClass) { $(options.toolbarSelector).find(toolbarBtnSelector).each(function () { var command = $(this).data(options.commandRole); if (document.queryCommandState(command)) { $(this).addClass(options.activeToolbarClass); + } else if (command.split(' ')[0] + ' ' + document.queryCommandValue(command.split(' ')[0]) === command) { + $(this).addClass(options.activeToolbarClass); } else { $(this).removeClass(options.activeToolbarClass); } @@ -40,6 +71,11 @@ command = commandArr.shift(), args = commandArr.join(' ') + (valueArg || ''); document.execCommand(command, 0, args); + if (args.length > 0) { + commandCache[command] = document.queryCommandValue(command); + } else { + commandCache[command] = document.queryCommandState(command); + } updateToolbar(); }, bindHotkeys = function (hotKeys) { @@ -104,8 +140,10 @@ }, bindToolbar = function (toolbar, options) { toolbar.find(toolbarBtnSelector).click(function () { + updateCommandCache(); restoreSelection(); editor.focus(); + restoreCommandCache(); execCommand($(this).data(options.commandRole)); saveSelection(); }); @@ -164,6 +202,12 @@ saveSelection(); updateToolbar(); }); + + $(toolbarBtnSelector).each(function () { + var btnAttr = this.getAttribute('data-' + options.commandRole); + commandCache[btnAttr.split(' ')[0]] = false; + }); + $(window).bind('touchend', function (e) { var isInside = (editor.is(e.target) || editor.has(e.target).length > 0), currentRange = getCurrentRange(), From a73b7f9bcf92a16750d2708aa55e4895cc8e715a Mon Sep 17 00:00:00 2001 From: "Alan P. Laudicina" Date: Wed, 12 Jun 2013 15:17:38 -0400 Subject: [PATCH 2/3] Cleanup `split` with a `slice` --- bootstrap-wysiwyg.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/bootstrap-wysiwyg.js b/bootstrap-wysiwyg.js index 7a10c7f..58dcbe2 100644 --- a/bootstrap-wysiwyg.js +++ b/bootstrap-wysiwyg.js @@ -56,9 +56,10 @@ if (options.activeToolbarClass) { $(options.toolbarSelector).find(toolbarBtnSelector).each(function () { var command = $(this).data(options.commandRole); + var commandNoArgs = command.slice(0, command.indexOf(' ')); if (document.queryCommandState(command)) { $(this).addClass(options.activeToolbarClass); - } else if (command.split(' ')[0] + ' ' + document.queryCommandValue(command.split(' ')[0]) === command) { + } else if (commandNoArgs + ' ' + document.queryCommandValue(commandNoArgs) === command) { $(this).addClass(options.activeToolbarClass); } else { $(this).removeClass(options.activeToolbarClass); From d9afea6410f4ecc3879693259133cf54a934f108 Mon Sep 17 00:00:00 2001 From: "Alan P. Laudicina" Date: Wed, 12 Jun 2013 15:44:10 -0400 Subject: [PATCH 3/3] Fix command slicing --- bootstrap-wysiwyg.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/bootstrap-wysiwyg.js b/bootstrap-wysiwyg.js index 58dcbe2..2109bb6 100644 --- a/bootstrap-wysiwyg.js +++ b/bootstrap-wysiwyg.js @@ -56,7 +56,13 @@ if (options.activeToolbarClass) { $(options.toolbarSelector).find(toolbarBtnSelector).each(function () { var command = $(this).data(options.commandRole); - var commandNoArgs = command.slice(0, command.indexOf(' ')); + var commandNoArgs; // Temporarily store index, replace with command. + + if ((commandNoArgs = command.indexOf(' ')) >= 0) { + commandNoArgs = command.slice(0, commandNoArgs); + } else { + commandNoArgs = command; + } if (document.queryCommandState(command)) { $(this).addClass(options.activeToolbarClass); } else if (commandNoArgs + ' ' + document.queryCommandValue(commandNoArgs) === command) {