Skip to content

Commit 1e2f216

Browse files
author
RandomlyKnighted
committed
Fixed #58 and Fixed #19 - throttle interfering with UI
1 parent fe268ae commit 1e2f216

File tree

4 files changed

+40
-24
lines changed

4 files changed

+40
-24
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
11
.DS_Store
2+
node_modules
3+
bower_components

‎examples/simple-toolbar.html

+3-4
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,13 @@
88
<link href="../bower_components/google-code-prettify/src/prettify.css" rel="stylesheet" />
99
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
1010
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet" />
11-
<link href="../css/style.css" rel="stylesheet" />
11+
<link href="../css/style.css" rel="stylesheet" />
1212
</head>
13-
13+
1414
<body>
1515
<div class="container">
1616
<h1>Simple Editor with Toolbar</h1>
17-
<div class="btn-toolbar" data-role="editor-toolbar"
18-
data-target="#editor">
17+
<div class="btn-toolbar" data-role="editor-toolbar" data-target="#editor">
1918
<div class="btn-group">
2019
<a class="btn btn-default dropdown-toggle" data-toggle="dropdown" title="Font Size"><i class="fa fa-text-height"></i>&nbsp;<b class="caret"></b></a>
2120
<ul class="dropdown-menu">

‎js/bootstrap-wysiwyg.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/bootstrap-wysiwyg.js

+34-19
Original file line numberDiff line numberDiff line change
@@ -11,25 +11,41 @@
1111
/** underscoreThrottle()
1212
* From underscore http://underscorejs.org/docs/underscore.html
1313
*/
14-
var underscoreThrottle = function(func, wait) {
15-
var context, args, timeout, result;
14+
var underscoreThrottle = function(func, wait, options) {
15+
var context, args, result;
16+
var timeout = null;
1617
var previous = 0;
18+
if (!options) {
19+
options = {};
20+
}
1721
var later = function() {
18-
previous = new Date();
22+
previous = options.leading === false ? 0 : $.now();
1923
timeout = null;
2024
result = func.apply(context, args);
25+
if (!timeout) {
26+
context = args = null;
27+
}
2128
};
2229
return function() {
23-
var now = new Date();
30+
var now = $.now();
31+
if (!previous && options.leading === false) {
32+
previous = now;
33+
}
2434
var remaining = wait - (now - previous);
2535
context = this;
2636
args = arguments;
27-
if (remaining <= 0) {
28-
clearTimeout(timeout);
29-
timeout = null;
37+
if (remaining <= 0 || remaining > wait) {
38+
if (timeout) {
39+
clearTimeout(timeout);
40+
timeout = null;
41+
}
3042
previous = now;
3143
result = func.apply(context, args);
32-
} else if (!timeout) {
44+
if (!timeout) {
45+
context = args = null;
46+
}
47+
}
48+
else if (!timeout && options.trailing !== false) {
3349
timeout = setTimeout(later, remaining);
3450
}
3551
return result;
@@ -73,13 +89,12 @@
7389
};
7490
$.fn.wysiwyg = function (userOptions) {
7591
var editor = this,
76-
wrapper = $(editor).parent(),
7792
selectedRange,
7893
options,
7994
toolbarBtnSelector,
8095
updateToolbar = function () {
8196
if (options.activeToolbarClass) {
82-
$(options.toolbarSelector,wrapper).find(toolbarBtnSelector).each(underscoreThrottle(function () {
97+
$(options.toolbarSelector).find(toolbarBtnSelector).each(function () {
8398
var commandArr = $(this).data(options.commandRole).split(' '),
8499
command = commandArr[0];
85100

@@ -93,7 +108,7 @@
93108
} else {
94109
$(this).removeClass(options.activeToolbarClass);
95110
}
96-
}, options.keypressTimeout));
111+
});
97112
}
98113
},
99114
execCommand = function (commandWithArgs, valueArg) {
@@ -104,10 +119,10 @@
104119
var parts = commandWithArgs.split('-');
105120

106121
if ( parts.length === 1 ) {
107-
document.execCommand(command, 0, args);
122+
underscoreThrottle(document.execCommand(command, false, args), options.keypressTimeout);
108123
}
109124
else if ( parts[0] === 'format' && parts.length === 2 ) {
110-
document.execCommand('formatBlock', false, parts[1] );
125+
underscoreThrottle(document.execCommand('formatBlock', false, parts[1] ), options.keypressTimeout);
111126
}
112127

113128
editor.trigger('change');
@@ -119,7 +134,7 @@
119134
if (editor.attr('contenteditable') && editor.is(':visible')) {
120135
e.preventDefault();
121136
e.stopPropagation();
122-
execCommand(command);
137+
underscoreThrottle(execCommand(command), options.keypressTimeout);
123138
}
124139
}).keyup(hotkey, function (e) {
125140
if (editor.attr('contenteditable') && editor.is(':visible')) {
@@ -190,7 +205,7 @@
190205
$.each(files, function (idx, fileInfo) {
191206
if (/^image\//.test(fileInfo.type)) {
192207
$.when(readFileIntoDataUrl(fileInfo)).done(function (dataUrl) {
193-
execCommand('insertimage', dataUrl);
208+
underscoreThrottle(execCommand('insertimage', dataUrl), options.keypressTimeout);
194209
editor.trigger('image-inserted');
195210
}).fail(function (e) {
196211
options.fileUploadError("file-reader", e);
@@ -203,21 +218,21 @@
203218
markSelection = function (input, color) {
204219
restoreSelection();
205220
if (document.queryCommandSupported('hiliteColor')) {
206-
document.execCommand('hiliteColor', 0, color || 'transparent');
221+
underscoreThrottle(document.execCommand('hiliteColor', false, color || 'transparent'), options.keypressTimeout);
207222
}
208223
saveSelection();
209224
input.data(options.selectionMarker, color);
210225
},
211226
bindToolbar = function (toolbar, options) {
212-
toolbar.find(toolbarBtnSelector, wrapper).click(function () {
227+
toolbar.find(toolbarBtnSelector).click(function () {
213228
restoreSelection();
214229
editor.focus();
215230

216231
if ($(this).data(options.commandRole) === 'html') {
217232
toggleHtmlEdit();
218233
}
219234
else {
220-
execCommand($(this).data(options.commandRole));
235+
underscoreThrottle(execCommand($(this).data(options.commandRole)), options.keypressTimeout);
221236
}
222237
saveSelection();
223238
});
@@ -229,7 +244,7 @@
229244
restoreSelection();
230245
if (newValue) {
231246
editor.focus();
232-
execCommand($(this).data(options.commandRole), newValue);
247+
underscoreThrottle(execCommand($(this).data(options.commandRole), newValue), options.keypressTimeout);
233248
}
234249
saveSelection();
235250
}).on('focus', function () {

0 commit comments

Comments
 (0)