medium-editor-rails 1.0.0 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +9 -0
- data/README.md +1 -1
- data/lib/medium-editor-rails/version.rb +2 -2
- data/vendor/assets/javascripts/medium-editor.js +312 -164
- data/vendor/assets/stylesheets/medium-editor/medium-editor.css +4 -2
- data/vendor/assets/stylesheets/medium-editor/themes/bootstrap.css +4 -2
- data/vendor/assets/stylesheets/medium-editor/themes/default.css +7 -2
- data/vendor/assets/stylesheets/medium-editor/themes/flat.css +2 -1
- data/vendor/assets/stylesheets/medium-editor/themes/mani.css +4 -1
- data/vendor/assets/stylesheets/medium-editor/themes/roman.css +4 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 86d22c2442a80cae4e0997c6a788c195496b2836
|
4
|
+
data.tar.gz: f4f81a42f77f9b2c3c7ace98cd4269ac413ac328
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 525972afada765ebaf19a3f578f91dee550ba2265156cd90cd593d9cec71b30be68ae12b373c50b2e178a1e8da7274a2cab78cfa751cfc675912736d2a0174fc
|
7
|
+
data.tar.gz: 3d55b39f3304655c211e16be61c5d0ba6199055d0ea0950443b5a08ee73e58d560e400a8ae9b8353844331dcbe9c6c8deff369cf54baf806bf1262c5e899cd22
|
data/CHANGELOG.md
CHANGED
@@ -1,6 +1,15 @@
|
|
1
1
|
|
2
2
|
#### [Current]
|
3
|
+
* [6e3450b](../../commit/6e3450b) - __(Ahmet Sezgin Duran)__ Bump versions 1.1.0 and 2.1.0
|
4
|
+
* [c3d9387](../../commit/c3d9387) - __(Ahmet Sezgin Duran)__ Update Medium Editor files
|
5
|
+
* [ecf87f3](../../commit/ecf87f3) - __(Ahmet Sezgin Duran)__ Merge tag '1.0.0' into develop
|
6
|
+
|
7
|
+
1.0.0
|
8
|
+
|
9
|
+
#### 1.0.0
|
10
|
+
* [959341e](../../commit/959341e) - __(Ahmet Sezgin Duran)__ Dump changelog
|
3
11
|
* [fb35ea2](../../commit/fb35ea2) - __(Ahmet Sezgin Duran)__ Bump versions 1.0.0 and 2.0.0
|
12
|
+
* [97d7aeb](../../commit/97d7aeb) - __(Ahmet Sezgin Duran)__ Update Medium Editor files
|
4
13
|
* [937e1f2](../../commit/937e1f2) - __(Ahmet Sezgin Duran)__ Merge tag '0.13.1' into develop
|
5
14
|
|
6
15
|
0.13.1 0.13.1
|
data/README.md
CHANGED
@@ -8,7 +8,7 @@ This gem integrates [Medium Editor](https://github.com/daviferreira/medium-edito
|
|
8
8
|
|
9
9
|
## Version
|
10
10
|
|
11
|
-
The latest version of Medium Editor bundled by this gem is [2.
|
11
|
+
The latest version of Medium Editor bundled by this gem is [2.1.0](https://github.com/daviferreira/medium-editor/releases)
|
12
12
|
|
13
13
|
## Installation
|
14
14
|
|
@@ -30,6 +30,54 @@ else if (typeof define === 'function' && define.amd) {
|
|
30
30
|
return b;
|
31
31
|
}
|
32
32
|
|
33
|
+
// https://github.com/jashkenas/underscore
|
34
|
+
var now = Date.now || function() {
|
35
|
+
return new Date().getTime();
|
36
|
+
};
|
37
|
+
|
38
|
+
// https://github.com/jashkenas/underscore
|
39
|
+
function throttle(func, wait) {
|
40
|
+
var THROTTLE_INTERVAL = 50,
|
41
|
+
context,
|
42
|
+
args,
|
43
|
+
result,
|
44
|
+
timeout = null,
|
45
|
+
previous = 0,
|
46
|
+
later;
|
47
|
+
|
48
|
+
if (!wait && wait !== 0) {
|
49
|
+
wait = THROTTLE_INTERVAL;
|
50
|
+
}
|
51
|
+
|
52
|
+
later = function() {
|
53
|
+
previous = now();
|
54
|
+
timeout = null;
|
55
|
+
result = func.apply(context, args);
|
56
|
+
if (!timeout) {
|
57
|
+
context = args = null;
|
58
|
+
}
|
59
|
+
};
|
60
|
+
|
61
|
+
return function() {
|
62
|
+
var currNow = now(),
|
63
|
+
remaining = wait - (currNow - previous);
|
64
|
+
context = this;
|
65
|
+
args = arguments;
|
66
|
+
if (remaining <= 0 || remaining > wait) {
|
67
|
+
clearTimeout(timeout);
|
68
|
+
timeout = null;
|
69
|
+
previous = currNow;
|
70
|
+
result = func.apply(context, args);
|
71
|
+
if (!timeout) {
|
72
|
+
context = args = null;
|
73
|
+
}
|
74
|
+
} else if (!timeout) {
|
75
|
+
timeout = setTimeout(later, remaining);
|
76
|
+
}
|
77
|
+
return result;
|
78
|
+
};
|
79
|
+
}
|
80
|
+
|
33
81
|
function isDescendant(parent, child) {
|
34
82
|
var node = child.parentNode;
|
35
83
|
while (node !== null) {
|
@@ -41,6 +89,35 @@ else if (typeof define === 'function' && define.amd) {
|
|
41
89
|
return false;
|
42
90
|
}
|
43
91
|
|
92
|
+
// Find the next node in the DOM tree that represents any text that is being
|
93
|
+
// displayed directly next to the targetNode (passed as an argument)
|
94
|
+
// Text that appears directly next to the current node can be:
|
95
|
+
// - A sibling text node
|
96
|
+
// - A descendant of a sibling element
|
97
|
+
// - A sibling text node of an ancestor
|
98
|
+
// - A descendant of a sibling element of an ancestor
|
99
|
+
function findAdjacentTextNodeWithContent(rootNode, targetNode, ownerDocument) {
|
100
|
+
var pastTarget = false,
|
101
|
+
nextNode,
|
102
|
+
nodeIterator = ownerDocument.createNodeIterator(rootNode, NodeFilter.SHOW_TEXT);
|
103
|
+
|
104
|
+
// Use a native NodeIterator to iterate over all the text nodes that are descendants
|
105
|
+
// of the rootNode. Once past the targetNode, choose the first non-empty text node
|
106
|
+
nextNode = nodeIterator.nextNode();
|
107
|
+
while (nextNode) {
|
108
|
+
if (nextNode === targetNode) {
|
109
|
+
pastTarget = true;
|
110
|
+
} else if (pastTarget) {
|
111
|
+
if (nextNode.nodeType === 3 && nextNode.nodeValue.length > 0) {
|
112
|
+
break;
|
113
|
+
}
|
114
|
+
}
|
115
|
+
nextNode = nodeIterator.nextNode();
|
116
|
+
}
|
117
|
+
|
118
|
+
return nextNode;
|
119
|
+
}
|
120
|
+
|
44
121
|
// http://stackoverflow.com/questions/5605401/insert-link-in-contenteditable-element
|
45
122
|
// by Tim Down
|
46
123
|
function saveSelection() {
|
@@ -160,6 +237,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
160
237
|
disableAnchorForm: false,
|
161
238
|
disablePlaceholders: false,
|
162
239
|
elementsContainer: false,
|
240
|
+
standardizeSelectionStart: false,
|
163
241
|
contentWindow: window,
|
164
242
|
ownerDocument: document,
|
165
243
|
firstHeader: 'h3',
|
@@ -190,7 +268,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
190
268
|
}
|
191
269
|
this.parentElements = ['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote', 'pre'];
|
192
270
|
if (!this.options.elementsContainer) {
|
193
|
-
this.options.elementsContainer =
|
271
|
+
this.options.elementsContainer = this.options.ownerDocument.body;
|
194
272
|
}
|
195
273
|
|
196
274
|
while (this.options.elementsContainer.querySelector('#medium-editor-toolbar-' + uniqueId)) {
|
@@ -205,7 +283,8 @@ else if (typeof define === 'function' && define.amd) {
|
|
205
283
|
setup: function () {
|
206
284
|
this.events = [];
|
207
285
|
this.isActive = true;
|
208
|
-
this.
|
286
|
+
this.initThrottledMethods()
|
287
|
+
.initElements()
|
209
288
|
.bindSelect()
|
210
289
|
.bindPaste()
|
211
290
|
.setPlaceholders()
|
@@ -220,14 +299,34 @@ else if (typeof define === 'function' && define.amd) {
|
|
220
299
|
},
|
221
300
|
|
222
301
|
off: function(target, event, listener, useCapture) {
|
223
|
-
var index = this.
|
302
|
+
var index = this.indexOfListener(target, event, listener, useCapture),
|
224
303
|
e;
|
225
304
|
if(index !== -1) {
|
226
|
-
e = this.events.splice(index, 1);
|
305
|
+
e = this.events.splice(index, 1)[0];
|
227
306
|
e[0].removeEventListener(e[1], e[2], e[3]);
|
228
307
|
}
|
229
308
|
},
|
230
309
|
|
310
|
+
indexOfListener: function(target, event, listener, useCapture) {
|
311
|
+
var i, n, item;
|
312
|
+
for (i = 0, n = this.events.length; i < n; i = i + 1) {
|
313
|
+
item = this.events[i];
|
314
|
+
if (item[0] === target && item[1] === event && item[2] === listener && item[3] === useCapture) {
|
315
|
+
return i;
|
316
|
+
}
|
317
|
+
}
|
318
|
+
return -1;
|
319
|
+
},
|
320
|
+
|
321
|
+
delay: function(fn) {
|
322
|
+
var self = this;
|
323
|
+
setTimeout(function() {
|
324
|
+
if (self.isActive) {
|
325
|
+
fn();
|
326
|
+
}
|
327
|
+
}, this.options.delay);
|
328
|
+
},
|
329
|
+
|
231
330
|
removeAllEvents: function() {
|
232
331
|
var e = this.events.pop();
|
233
332
|
while(e) {
|
@@ -236,8 +335,32 @@ else if (typeof define === 'function' && define.amd) {
|
|
236
335
|
}
|
237
336
|
},
|
238
337
|
|
338
|
+
initThrottledMethods: function() {
|
339
|
+
var self = this;
|
340
|
+
|
341
|
+
// handleResize is throttled because:
|
342
|
+
// - It will be called when the browser is resizing, which can fire many times very quickly
|
343
|
+
// - For some event (like resize) a slight lag in UI responsiveness is OK and provides performance benefits
|
344
|
+
this.handleResize = throttle(function() {
|
345
|
+
if (self.isActive) {
|
346
|
+
self.positionToolbarIfShown();
|
347
|
+
}
|
348
|
+
});
|
349
|
+
|
350
|
+
// handleBlur is throttled because:
|
351
|
+
// - This method could be called many times due to the type of event handlers that are calling it
|
352
|
+
// - We want a slight delay so that other events in the stack can run, some of which may
|
353
|
+
// prevent the toolbar from being hidden (via this.keepToolbarAlive).
|
354
|
+
this.handleBlur = throttle(function() {
|
355
|
+
if (self.isActive && !self.keepToolbarAlive) {
|
356
|
+
self.hideToolbarActions();
|
357
|
+
}
|
358
|
+
});
|
359
|
+
|
360
|
+
return this;
|
361
|
+
},
|
362
|
+
|
239
363
|
initElements: function () {
|
240
|
-
this.updateElementList();
|
241
364
|
var i,
|
242
365
|
addToolbar = false;
|
243
366
|
for (i = 0; i < this.elements.length; i += 1) {
|
@@ -248,6 +371,8 @@ else if (typeof define === 'function' && define.amd) {
|
|
248
371
|
this.elements[i].setAttribute('data-placeholder', this.options.placeholder);
|
249
372
|
}
|
250
373
|
this.elements[i].setAttribute('data-medium-element', true);
|
374
|
+
this.elements[i].setAttribute('role', 'textbox');
|
375
|
+
this.elements[i].setAttribute('aria-multiline', true);
|
251
376
|
this.bindParagraphCreation(i);
|
252
377
|
if (!this.options.disableToolbar && !this.elements[i].getAttribute('data-disable-toolbar')) {
|
253
378
|
addToolbar = true;
|
@@ -264,20 +389,23 @@ else if (typeof define === 'function' && define.amd) {
|
|
264
389
|
},
|
265
390
|
|
266
391
|
setElementSelection: function (selector) {
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
if (this.elements.nodeType === 1) {
|
274
|
-
this.elements = [this.elements];
|
392
|
+
if (!selector) {
|
393
|
+
selector = [];
|
394
|
+
}
|
395
|
+
// If string, use as query selector
|
396
|
+
if (typeof selector === 'string') {
|
397
|
+
selector = this.options.ownerDocument.querySelectorAll(selector);
|
275
398
|
}
|
399
|
+
// If element, put into array
|
400
|
+
if (isElement(selector)) {
|
401
|
+
selector = [selector];
|
402
|
+
}
|
403
|
+
// Convert NodeList (or other array like object) into an array
|
404
|
+
this.elements = Array.prototype.slice.apply(selector);
|
276
405
|
},
|
277
406
|
|
278
407
|
bindBlur: function(i) {
|
279
408
|
var self = this,
|
280
|
-
timeout,
|
281
409
|
blurFunction = function(e){
|
282
410
|
// If it's not part of the editor, or the toolbar
|
283
411
|
if ( e.target !== self.toolbar
|
@@ -288,37 +416,17 @@ else if (typeof define === 'function' && define.amd) {
|
|
288
416
|
|
289
417
|
// Activate the placeholder
|
290
418
|
if (!self.options.disablePlaceholders) {
|
291
|
-
self.placeholderWrapper(self.elements[0]
|
419
|
+
self.placeholderWrapper(e, self.elements[0]);
|
292
420
|
}
|
293
421
|
|
294
|
-
clearTimeout(timeout);
|
295
422
|
// Hide the toolbar after a small delay so we can prevent this on toolbar click
|
296
|
-
|
297
|
-
if ( !self.keepToolbarAlive ) {
|
298
|
-
self.hideToolbarActions();
|
299
|
-
}
|
300
|
-
}, 200);
|
423
|
+
self.handleBlur();
|
301
424
|
}
|
302
425
|
};
|
303
426
|
|
304
427
|
// Hide the toolbar when focusing outside of the editor.
|
305
|
-
this.on(
|
306
|
-
this.on(
|
307
|
-
|
308
|
-
return this;
|
309
|
-
},
|
310
|
-
|
311
|
-
bindKeypress: function(i) {
|
312
|
-
if (this.options.disablePlaceholders) {
|
313
|
-
return this;
|
314
|
-
}
|
315
|
-
|
316
|
-
var self = this;
|
317
|
-
|
318
|
-
// Set up the keypress events
|
319
|
-
this.on(this.elements[i], 'keypress', function(event){
|
320
|
-
self.placeholderWrapper(this,event);
|
321
|
-
});
|
428
|
+
this.on(this.options.ownerDocument.body, 'click', blurFunction, true);
|
429
|
+
this.on(this.options.ownerDocument.body, 'focus', blurFunction, true);
|
322
430
|
|
323
431
|
return this;
|
324
432
|
},
|
@@ -358,9 +466,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
358
466
|
this.bindReturn(i)
|
359
467
|
.bindTab(i)
|
360
468
|
.bindBlur(i)
|
361
|
-
.bindClick(i)
|
362
|
-
.bindKeypress(i);
|
363
|
-
|
469
|
+
.bindClick(i);
|
364
470
|
}
|
365
471
|
|
366
472
|
return this;
|
@@ -368,7 +474,6 @@ else if (typeof define === 'function' && define.amd) {
|
|
368
474
|
|
369
475
|
// Two functions to handle placeholders
|
370
476
|
activatePlaceholder: function (el) {
|
371
|
-
|
372
477
|
if (!(el.querySelector('img')) &&
|
373
478
|
!(el.querySelector('blockquote')) &&
|
374
479
|
el.textContent.replace(/^\s+|\s+$/g, '') === '') {
|
@@ -376,9 +481,10 @@ else if (typeof define === 'function' && define.amd) {
|
|
376
481
|
el.classList.add('medium-editor-placeholder');
|
377
482
|
}
|
378
483
|
},
|
379
|
-
placeholderWrapper: function (
|
484
|
+
placeholderWrapper: function (evt, el) {
|
485
|
+
el = el || evt.target;
|
380
486
|
el.classList.remove('medium-editor-placeholder');
|
381
|
-
if (
|
487
|
+
if (evt.type !== 'keypress') {
|
382
488
|
this.activatePlaceholder(el);
|
383
489
|
}
|
384
490
|
},
|
@@ -454,7 +560,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
454
560
|
node = getSelectionStart.call(self);
|
455
561
|
tagName = node.tagName.toLowerCase();
|
456
562
|
if (tagName === 'a') {
|
457
|
-
|
563
|
+
self.options.ownerDocument.execCommand('unlink', false, null);
|
458
564
|
}
|
459
565
|
}
|
460
566
|
});
|
@@ -465,7 +571,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
465
571
|
editorElement;
|
466
572
|
|
467
573
|
if (node && node.getAttribute('data-medium-element') && node.children.length === 0 && !(self.options.disableReturn || node.getAttribute('data-disable-return'))) {
|
468
|
-
|
574
|
+
self.options.ownerDocument.execCommand('formatBlock', false, 'p');
|
469
575
|
}
|
470
576
|
if (e.which === 13) {
|
471
577
|
node = getSelectionStart.call(self);
|
@@ -475,10 +581,10 @@ else if (typeof define === 'function' && define.amd) {
|
|
475
581
|
if (!(self.options.disableReturn || editorElement.getAttribute('data-disable-return')) &&
|
476
582
|
tagName !== 'li' && !self.isListItemChild(node)) {
|
477
583
|
if (!e.shiftKey) {
|
478
|
-
|
584
|
+
self.options.ownerDocument.execCommand('formatBlock', false, 'p');
|
479
585
|
}
|
480
586
|
if (tagName === 'a') {
|
481
|
-
|
587
|
+
self.options.ownerDocument.execCommand('unlink', false, null);
|
482
588
|
}
|
483
589
|
}
|
484
590
|
}
|
@@ -528,7 +634,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
528
634
|
var tag = getSelectionStart.call(self).tagName.toLowerCase();
|
529
635
|
if (tag === 'pre') {
|
530
636
|
e.preventDefault();
|
531
|
-
|
637
|
+
self.options.ownerDocument.execCommand('insertHtml', null, ' ');
|
532
638
|
}
|
533
639
|
|
534
640
|
// Tab to indent list structures!
|
@@ -537,9 +643,9 @@ else if (typeof define === 'function' && define.amd) {
|
|
537
643
|
|
538
644
|
// If Shift is down, outdent, otherwise indent
|
539
645
|
if (e.shiftKey) {
|
540
|
-
|
646
|
+
self.options.ownerDocument.execCommand('outdent', e);
|
541
647
|
} else {
|
542
|
-
|
648
|
+
self.options.ownerDocument.execCommand('indent', e);
|
543
649
|
}
|
544
650
|
}
|
545
651
|
}
|
@@ -550,26 +656,26 @@ else if (typeof define === 'function' && define.amd) {
|
|
550
656
|
buttonTemplate: function (btnType) {
|
551
657
|
var buttonLabels = this.getButtonLabels(this.options.buttonLabels),
|
552
658
|
buttonTemplates = {
|
553
|
-
'bold': '<button class="medium-editor-action medium-editor-action-bold" data-action="bold" data-element="b">' + buttonLabels.bold + '</button>',
|
554
|
-
'italic': '<button class="medium-editor-action medium-editor-action-italic" data-action="italic" data-element="i">' + buttonLabels.italic + '</button>',
|
555
|
-
'underline': '<button class="medium-editor-action medium-editor-action-underline" data-action="underline" data-element="u">' + buttonLabels.underline + '</button>',
|
556
|
-
'strikethrough': '<button class="medium-editor-action medium-editor-action-strikethrough" data-action="strikethrough" data-element="strike">' + buttonLabels.strikethrough +'</button>',
|
557
|
-
'superscript': '<button class="medium-editor-action medium-editor-action-superscript" data-action="superscript" data-element="sup">' + buttonLabels.superscript + '</button>',
|
558
|
-
'subscript': '<button class="medium-editor-action medium-editor-action-subscript" data-action="subscript" data-element="sub">' + buttonLabels.subscript + '</button>',
|
559
|
-
'anchor': '<button class="medium-editor-action medium-editor-action-anchor" data-action="anchor" data-element="a">' + buttonLabels.anchor + '</button>',
|
560
|
-
'image': '<button class="medium-editor-action medium-editor-action-image" data-action="image" data-element="img">' + buttonLabels.image + '</button>',
|
561
|
-
'header1': '<button class="medium-editor-action medium-editor-action-header1" data-action="append-' + this.options.firstHeader + '" data-element="' + this.options.firstHeader + '">' + buttonLabels.header1 + '</button>',
|
562
|
-
'header2': '<button class="medium-editor-action medium-editor-action-header2" data-action="append-' + this.options.secondHeader + '" data-element="' + this.options.secondHeader + '">' + buttonLabels.header2 + '</button>',
|
563
|
-
'quote': '<button class="medium-editor-action medium-editor-action-quote" data-action="append-blockquote" data-element="blockquote">' + buttonLabels.quote + '</button>',
|
564
|
-
'orderedlist': '<button class="medium-editor-action medium-editor-action-orderedlist" data-action="insertorderedlist" data-element="ol">' + buttonLabels.orderedlist + '</button>',
|
565
|
-
'unorderedlist': '<button class="medium-editor-action medium-editor-action-unorderedlist" data-action="insertunorderedlist" data-element="ul">' + buttonLabels.unorderedlist + '</button>',
|
566
|
-
'pre': '<button class="medium-editor-action medium-editor-action-pre" data-action="append-pre" data-element="pre">' + buttonLabels.pre + '</button>',
|
567
|
-
'indent': '<button class="medium-editor-action medium-editor-action-indent" data-action="indent" data-element="ul">' + buttonLabels.indent + '</button>',
|
568
|
-
'outdent': '<button class="medium-editor-action medium-editor-action-outdent" data-action="outdent" data-element="ul">' + buttonLabels.outdent + '</button>',
|
569
|
-
'justifyCenter': '<button class="medium-editor-action medium-editor-action-justifyCenter" data-action="justifyCenter" data-element="">' + buttonLabels.justifyCenter + '</button>',
|
570
|
-
'justifyFull': '<button class="medium-editor-action medium-editor-action-justifyFull" data-action="justifyFull" data-element="">' + buttonLabels.justifyFull + '</button>',
|
571
|
-
'justifyLeft': '<button class="medium-editor-action medium-editor-action-justifyLeft" data-action="justifyLeft" data-element="">' + buttonLabels.justifyLeft + '</button>',
|
572
|
-
'justifyRight': '<button class="medium-editor-action medium-editor-action-justifyRight" data-action="justifyRight" data-element="">' + buttonLabels.justifyRight + '</button>'
|
659
|
+
'bold': '<button class="medium-editor-action medium-editor-action-bold" data-action="bold" data-element="b" aria-label="bold">' + buttonLabels.bold + '</button>',
|
660
|
+
'italic': '<button class="medium-editor-action medium-editor-action-italic" data-action="italic" data-element="i" aria-label="italic">' + buttonLabels.italic + '</button>',
|
661
|
+
'underline': '<button class="medium-editor-action medium-editor-action-underline" data-action="underline" data-element="u" aria-label="underline">' + buttonLabels.underline + '</button>',
|
662
|
+
'strikethrough': '<button class="medium-editor-action medium-editor-action-strikethrough" data-action="strikethrough" data-element="strike" aria-label="strike through">' + buttonLabels.strikethrough +'</button>',
|
663
|
+
'superscript': '<button class="medium-editor-action medium-editor-action-superscript" data-action="superscript" data-element="sup" aria-label="superscript">' + buttonLabels.superscript + '</button>',
|
664
|
+
'subscript': '<button class="medium-editor-action medium-editor-action-subscript" data-action="subscript" data-element="sub" aria-label="subscript">' + buttonLabels.subscript + '</button>',
|
665
|
+
'anchor': '<button class="medium-editor-action medium-editor-action-anchor" data-action="anchor" data-element="a" aria-label="link">' + buttonLabels.anchor + '</button>',
|
666
|
+
'image': '<button class="medium-editor-action medium-editor-action-image" data-action="image" data-element="img" aria-label="image">' + buttonLabels.image + '</button>',
|
667
|
+
'header1': '<button class="medium-editor-action medium-editor-action-header1" data-action="append-' + this.options.firstHeader + '" data-element="' + this.options.firstHeader + '" aria-label="h1">' + buttonLabels.header1 + '</button>',
|
668
|
+
'header2': '<button class="medium-editor-action medium-editor-action-header2" data-action="append-' + this.options.secondHeader + '" data-element="' + this.options.secondHeader + ' "aria-label="h2">' + buttonLabels.header2 + '</button>',
|
669
|
+
'quote': '<button class="medium-editor-action medium-editor-action-quote" data-action="append-blockquote" data-element="blockquote" aria-label="blockquote">' + buttonLabels.quote + '</button>',
|
670
|
+
'orderedlist': '<button class="medium-editor-action medium-editor-action-orderedlist" data-action="insertorderedlist" data-element="ol" aria-label="ordered list">' + buttonLabels.orderedlist + '</button>',
|
671
|
+
'unorderedlist': '<button class="medium-editor-action medium-editor-action-unorderedlist" data-action="insertunorderedlist" data-element="ul" aria-label="unordered list">' + buttonLabels.unorderedlist + '</button>',
|
672
|
+
'pre': '<button class="medium-editor-action medium-editor-action-pre" data-action="append-pre" data-element="pre" aria-label="preformatted text">' + buttonLabels.pre + '</button>',
|
673
|
+
'indent': '<button class="medium-editor-action medium-editor-action-indent" data-action="indent" data-element="ul" aria-label="indent">' + buttonLabels.indent + '</button>',
|
674
|
+
'outdent': '<button class="medium-editor-action medium-editor-action-outdent" data-action="outdent" data-element="ul" aria-label="outdent">' + buttonLabels.outdent + '</button>',
|
675
|
+
'justifyCenter': '<button class="medium-editor-action medium-editor-action-justifyCenter" data-action="justifyCenter" data-element="" aria-label="center justify">' + buttonLabels.justifyCenter + '</button>',
|
676
|
+
'justifyFull': '<button class="medium-editor-action medium-editor-action-justifyFull" data-action="justifyFull" data-element="" aria-label="full justify">' + buttonLabels.justifyFull + '</button>',
|
677
|
+
'justifyLeft': '<button class="medium-editor-action medium-editor-action-justifyLeft" data-action="justifyLeft" data-element="" aria-label="left justify">' + buttonLabels.justifyLeft + '</button>',
|
678
|
+
'justifyRight': '<button class="medium-editor-action medium-editor-action-justifyRight" data-action="justifyRight" data-element="" aria-label="right justify">' + buttonLabels.justifyRight + '</button>'
|
573
679
|
};
|
574
680
|
return buttonTemplates[btnType] || false;
|
575
681
|
},
|
@@ -647,13 +753,13 @@ else if (typeof define === 'function' && define.amd) {
|
|
647
753
|
this.anchorForm = this.toolbar.querySelector('.medium-editor-toolbar-form-anchor');
|
648
754
|
this.anchorInput = this.anchorForm.querySelector('input.medium-editor-toolbar-anchor-input');
|
649
755
|
this.anchorTarget = this.anchorForm.querySelector('input.medium-editor-toolbar-anchor-target');
|
650
|
-
this.anchorButton = this.anchorForm.querySelector('input.medium-editor-toolbar-anchor-button');
|
756
|
+
this.anchorButton = this.anchorForm.querySelector('input.medium-editor-toolbar-anchor-button');
|
651
757
|
}
|
652
758
|
return this;
|
653
759
|
},
|
654
760
|
|
655
761
|
createToolbar: function () {
|
656
|
-
var toolbar =
|
762
|
+
var toolbar = this.options.ownerDocument.createElement('div');
|
657
763
|
toolbar.id = 'medium-editor-toolbar-' + this.id;
|
658
764
|
toolbar.className = 'medium-editor-toolbar';
|
659
765
|
|
@@ -674,7 +780,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
674
780
|
//TODO: actionTemplate
|
675
781
|
toolbarButtons: function () {
|
676
782
|
var btns = this.options.buttons,
|
677
|
-
ul =
|
783
|
+
ul = this.options.ownerDocument.createElement('ul'),
|
678
784
|
li,
|
679
785
|
i,
|
680
786
|
btn,
|
@@ -686,13 +792,13 @@ else if (typeof define === 'function' && define.amd) {
|
|
686
792
|
for (i = 0; i < btns.length; i += 1) {
|
687
793
|
if (this.options.extensions.hasOwnProperty(btns[i])) {
|
688
794
|
ext = this.options.extensions[btns[i]];
|
689
|
-
btn = ext.getButton !== undefined ? ext.getButton() : null;
|
795
|
+
btn = ext.getButton !== undefined ? ext.getButton(this) : null;
|
690
796
|
} else {
|
691
797
|
btn = this.buttonTemplate(btns[i]);
|
692
798
|
}
|
693
799
|
|
694
800
|
if (btn) {
|
695
|
-
li =
|
801
|
+
li = this.options.ownerDocument.createElement('li');
|
696
802
|
if (isElement(btn)) {
|
697
803
|
li.appendChild(btn);
|
698
804
|
} else {
|
@@ -706,14 +812,14 @@ else if (typeof define === 'function' && define.amd) {
|
|
706
812
|
},
|
707
813
|
|
708
814
|
toolbarFormAnchor: function () {
|
709
|
-
var anchor =
|
710
|
-
input =
|
711
|
-
target_label =
|
712
|
-
target =
|
713
|
-
button_label =
|
714
|
-
button =
|
715
|
-
close =
|
716
|
-
save =
|
815
|
+
var anchor = this.options.ownerDocument.createElement('div'),
|
816
|
+
input = this.options.ownerDocument.createElement('input'),
|
817
|
+
target_label = this.options.ownerDocument.createElement('label'),
|
818
|
+
target = this.options.ownerDocument.createElement('input'),
|
819
|
+
button_label = this.options.ownerDocument.createElement('label'),
|
820
|
+
button = this.options.ownerDocument.createElement('input'),
|
821
|
+
close = this.options.ownerDocument.createElement('a'),
|
822
|
+
save = this.options.ownerDocument.createElement('a');
|
717
823
|
|
718
824
|
close.setAttribute('href', '#');
|
719
825
|
close.className = 'medium-editor-toobar-anchor-close';
|
@@ -759,23 +865,18 @@ else if (typeof define === 'function' && define.amd) {
|
|
759
865
|
|
760
866
|
bindSelect: function () {
|
761
867
|
var self = this,
|
762
|
-
timer = '',
|
763
868
|
i;
|
764
869
|
|
765
870
|
this.checkSelectionWrapper = function (e) {
|
766
|
-
|
767
871
|
// Do not close the toolbar when bluring the editable area and clicking into the anchor form
|
768
872
|
if (!self.options.disableAnchorForm && e && self.clickingIntoArchorForm(e)) {
|
769
873
|
return false;
|
770
874
|
}
|
771
875
|
|
772
|
-
|
773
|
-
timer = setTimeout(function () {
|
774
|
-
self.checkSelection();
|
775
|
-
}, self.options.delay);
|
876
|
+
self.checkSelection();
|
776
877
|
};
|
777
878
|
|
778
|
-
this.on(
|
879
|
+
this.on(this.options.ownerDocument.documentElement, 'mouseup', this.checkSelectionWrapper);
|
779
880
|
|
780
881
|
for (i = 0; i < this.elements.length; i += 1) {
|
781
882
|
this.on(this.elements[i], 'keyup', this.checkSelectionWrapper);
|
@@ -785,11 +886,21 @@ else if (typeof define === 'function' && define.amd) {
|
|
785
886
|
return this;
|
786
887
|
},
|
787
888
|
|
889
|
+
stopSelectionUpdates: function() {
|
890
|
+
this.preventSelectionUpdates = true;
|
891
|
+
},
|
892
|
+
|
893
|
+
startSelectionUpdates: function() {
|
894
|
+
this.preventSelectionUpdates = false;
|
895
|
+
},
|
896
|
+
|
788
897
|
checkSelection: function () {
|
789
898
|
var newSelection,
|
790
899
|
selectionElement;
|
791
900
|
|
792
|
-
if (this.
|
901
|
+
if (!this.preventSelectionUpdates &&
|
902
|
+
this.keepToolbarAlive !== true &&
|
903
|
+
!this.options.disableToolbar) {
|
793
904
|
|
794
905
|
newSelection = this.options.contentWindow.getSelection();
|
795
906
|
if ((!this.options.updateOnEmptySelection && newSelection.toString().trim() === '') ||
|
@@ -835,9 +946,48 @@ else if (typeof define === 'function' && define.amd) {
|
|
835
946
|
},
|
836
947
|
|
837
948
|
checkSelectionElement: function (newSelection, selectionElement) {
|
838
|
-
var i
|
949
|
+
var i,
|
950
|
+
adjacentNode,
|
951
|
+
offset = 0,
|
952
|
+
newRange;
|
839
953
|
this.selection = newSelection;
|
840
954
|
this.selectionRange = this.selection.getRangeAt(0);
|
955
|
+
|
956
|
+
/*
|
957
|
+
* In firefox, there are cases (ie doubleclick of a word) where the selectionRange start
|
958
|
+
* will be at the very end of an element. In other browsers, the selectionRange start
|
959
|
+
* would instead be at the very beginning of an element that actually has content.
|
960
|
+
* example:
|
961
|
+
* <span>foo</span><span>bar</span>
|
962
|
+
*
|
963
|
+
* If the text 'bar' is selected, most browsers will have the selectionRange start at the beginning
|
964
|
+
* of the 'bar' span. However, there are cases where firefox will have the selectionRange start
|
965
|
+
* at the end of the 'foo' span. The contenteditable behavior will be ok, but if there are any
|
966
|
+
* properties on the 'bar' span, they won't be reflected accurately in the toolbar
|
967
|
+
* (ie 'Bold' button wouldn't be active)
|
968
|
+
*
|
969
|
+
* So, for cases where the selectionRange start is at the end of an element/node, find the next
|
970
|
+
* adjacent text node that actually has content in it, and move the selectionRange start there.
|
971
|
+
*/
|
972
|
+
if (
|
973
|
+
this.options.standardizeSelectionStart &&
|
974
|
+
this.selectionRange.startOffset === this.selectionRange.startContainer.nodeValue.length
|
975
|
+
) {
|
976
|
+
adjacentNode = findAdjacentTextNodeWithContent(this.getSelectionElement(), this.selectionRange.startContainer, this.options.ownerDocument);
|
977
|
+
if (adjacentNode) {
|
978
|
+
offset = 0;
|
979
|
+
while(adjacentNode.nodeValue.substr(offset, 1).trim().length === 0) {
|
980
|
+
offset = offset + 1;
|
981
|
+
}
|
982
|
+
newRange = this.options.ownerDocument.createRange();
|
983
|
+
newRange.setStart(adjacentNode, offset);
|
984
|
+
newRange.setEnd(this.selectionRange.endContainer, this.selectionRange.endOffset);
|
985
|
+
this.selection.removeAllRanges();
|
986
|
+
this.selection.addRange(newRange);
|
987
|
+
this.selectionRange = newRange;
|
988
|
+
}
|
989
|
+
}
|
990
|
+
|
841
991
|
for (i = 0; i < this.elements.length; i += 1) {
|
842
992
|
if (this.elements[i] === selectionElement) {
|
843
993
|
this.setToolbarButtonStates()
|
@@ -894,12 +1044,12 @@ else if (typeof define === 'function' && define.amd) {
|
|
894
1044
|
|
895
1045
|
setToolbarPosition: function () {
|
896
1046
|
// document.documentElement for IE 9
|
897
|
-
var scrollTop = (
|
1047
|
+
var scrollTop = (this.options.ownerDocument.documentElement && this.options.ownerDocument.documentElement.scrollTop) || this.options.ownerDocument.body.scrollTop,
|
898
1048
|
container = this.elements[0],
|
899
1049
|
containerRect = container.getBoundingClientRect(),
|
900
1050
|
containerTop = containerRect.top + scrollTop,
|
901
1051
|
buttonHeight = 50,
|
902
|
-
selection =
|
1052
|
+
selection = this.options.contentWindow.getSelection(),
|
903
1053
|
range,
|
904
1054
|
boundary,
|
905
1055
|
middleBoundary,
|
@@ -910,7 +1060,7 @@ else if (typeof define === 'function' && define.amd) {
|
|
910
1060
|
return this;
|
911
1061
|
}
|
912
1062
|
|
913
|
-
this.
|
1063
|
+
this.showToolbar();
|
914
1064
|
|
915
1065
|
if ( this.options.staticToolbar ) {
|
916
1066
|
|
@@ -1137,9 +1287,21 @@ else if (typeof define === 'function' && define.amd) {
|
|
1137
1287
|
return firstChild;
|
1138
1288
|
},
|
1139
1289
|
|
1140
|
-
|
1141
|
-
this.
|
1142
|
-
|
1290
|
+
isToolbarShown: function() {
|
1291
|
+
return this.toolbar && this.toolbar.classList.contains('medium-editor-toolbar-active');
|
1292
|
+
},
|
1293
|
+
|
1294
|
+
showToolbar: function() {
|
1295
|
+
if (this.toolbar && !this.isToolbarShown()) {
|
1296
|
+
this.toolbar.classList.add('medium-editor-toolbar-active');
|
1297
|
+
if (this.onShowToolbar) {
|
1298
|
+
this.onShowToolbar();
|
1299
|
+
}
|
1300
|
+
}
|
1301
|
+
},
|
1302
|
+
|
1303
|
+
hideToolbar: function() {
|
1304
|
+
if (this.isToolbarShown()) {
|
1143
1305
|
this.toolbar.classList.remove('medium-editor-toolbar-active');
|
1144
1306
|
if (this.onHideToolbar) {
|
1145
1307
|
this.onHideToolbar();
|
@@ -1147,20 +1309,23 @@ else if (typeof define === 'function' && define.amd) {
|
|
1147
1309
|
}
|
1148
1310
|
},
|
1149
1311
|
|
1312
|
+
hideToolbarActions: function () {
|
1313
|
+
this.keepToolbarAlive = false;
|
1314
|
+
this.hideToolbar();
|
1315
|
+
},
|
1316
|
+
|
1150
1317
|
showToolbarActions: function () {
|
1151
|
-
var self = this
|
1152
|
-
timer;
|
1318
|
+
var self = this;
|
1153
1319
|
if (this.anchorForm) {
|
1154
1320
|
this.anchorForm.style.display = 'none';
|
1155
1321
|
}
|
1156
1322
|
this.toolbarActions.style.display = 'block';
|
1157
1323
|
this.keepToolbarAlive = false;
|
1158
|
-
|
1159
|
-
|
1160
|
-
|
1161
|
-
|
1162
|
-
|
1163
|
-
}, 100);
|
1324
|
+
// Using setTimeout + options.delay because:
|
1325
|
+
// We will actually be displaying the toolbar, which should be controlled by options.delay
|
1326
|
+
this.delay(function () {
|
1327
|
+
self.showToolbar();
|
1328
|
+
});
|
1164
1329
|
},
|
1165
1330
|
|
1166
1331
|
saveSelection: function() {
|
@@ -1218,6 +1383,11 @@ else if (typeof define === 'function' && define.amd) {
|
|
1218
1383
|
|
1219
1384
|
self.createLink(this, target, button);
|
1220
1385
|
}
|
1386
|
+
else if (e.keyCode === 27) {
|
1387
|
+
e.preventDefault();
|
1388
|
+
self.showToolbarActions();
|
1389
|
+
restoreSelection.call(self, self.savedSelection);
|
1390
|
+
}
|
1221
1391
|
});
|
1222
1392
|
|
1223
1393
|
this.on(linkSave, 'click', function(e) {
|
@@ -1283,20 +1453,12 @@ else if (typeof define === 'function' && define.amd) {
|
|
1283
1453
|
boundary = anchorEl.getBoundingClientRect(),
|
1284
1454
|
middleBoundary = (boundary.left + boundary.right) / 2,
|
1285
1455
|
halfOffsetWidth,
|
1286
|
-
defaultLeft
|
1287
|
-
timer;
|
1456
|
+
defaultLeft;
|
1288
1457
|
|
1289
1458
|
self.anchorPreview.querySelector('i').textContent = anchorEl.href;
|
1290
1459
|
halfOffsetWidth = self.anchorPreview.offsetWidth / 2;
|
1291
1460
|
defaultLeft = self.options.diffLeft - halfOffsetWidth;
|
1292
1461
|
|
1293
|
-
clearTimeout(timer);
|
1294
|
-
timer = setTimeout(function () {
|
1295
|
-
if (self.anchorPreview && !self.anchorPreview.classList.contains('medium-editor-anchor-preview-active')) {
|
1296
|
-
self.anchorPreview.classList.add('medium-editor-anchor-preview-active');
|
1297
|
-
}
|
1298
|
-
}, 100);
|
1299
|
-
|
1300
1462
|
self.observeAnchorPreview(anchorEl);
|
1301
1463
|
|
1302
1464
|
self.anchorPreview.classList.add('medium-toolbar-arrow-over');
|
@@ -1310,6 +1472,10 @@ else if (typeof define === 'function' && define.amd) {
|
|
1310
1472
|
self.anchorPreview.style.left = defaultLeft + middleBoundary + 'px';
|
1311
1473
|
}
|
1312
1474
|
|
1475
|
+
if (this.anchorPreview && !this.anchorPreview.classList.contains('medium-editor-anchor-preview-active')) {
|
1476
|
+
this.anchorPreview.classList.add('medium-editor-anchor-preview-active');
|
1477
|
+
}
|
1478
|
+
|
1313
1479
|
return this;
|
1314
1480
|
},
|
1315
1481
|
|
@@ -1384,12 +1550,14 @@ else if (typeof define === 'function' && define.amd) {
|
|
1384
1550
|
range.selectNodeContents(self.activeAnchor);
|
1385
1551
|
sel.removeAllRanges();
|
1386
1552
|
sel.addRange(range);
|
1387
|
-
setTimeout
|
1553
|
+
// Using setTimeout + options.delay because:
|
1554
|
+
// We may actually be displaying the anchor preview, which should be controlled by options.delay
|
1555
|
+
this.delay(function () {
|
1388
1556
|
if (self.activeAnchor) {
|
1389
1557
|
self.showAnchorForm(self.activeAnchor.href);
|
1390
1558
|
}
|
1391
1559
|
self.keepToolbarAlive = false;
|
1392
|
-
}
|
1560
|
+
});
|
1393
1561
|
|
1394
1562
|
}
|
1395
1563
|
|
@@ -1415,21 +1583,20 @@ else if (typeof define === 'function' && define.amd) {
|
|
1415
1583
|
}
|
1416
1584
|
|
1417
1585
|
// only show when hovering on anchors
|
1418
|
-
if (this.
|
1586
|
+
if (this.isToolbarShown()) {
|
1419
1587
|
// only show when toolbar is not present
|
1420
1588
|
return true;
|
1421
1589
|
}
|
1422
1590
|
this.activeAnchor = e.target;
|
1423
1591
|
this.on(this.activeAnchor, 'mouseout', leaveAnchor);
|
1424
|
-
//
|
1425
|
-
//
|
1426
|
-
|
1592
|
+
// Using setTimeout + options.delay because:
|
1593
|
+
// - We're going to show the anchor preview according to the configured delay
|
1594
|
+
// if the mouse has not left the anchor tag in that time
|
1595
|
+
this.delay(function () {
|
1427
1596
|
if (overAnchor) {
|
1428
1597
|
self.showAnchorPreview(e.target);
|
1429
1598
|
}
|
1430
|
-
}
|
1431
|
-
|
1432
|
-
|
1599
|
+
});
|
1433
1600
|
}
|
1434
1601
|
},
|
1435
1602
|
|
@@ -1518,30 +1685,26 @@ else if (typeof define === 'function' && define.amd) {
|
|
1518
1685
|
input.value = '';
|
1519
1686
|
},
|
1520
1687
|
|
1688
|
+
positionToolbarIfShown: function() {
|
1689
|
+
if (this.isToolbarShown()) {
|
1690
|
+
this.setToolbarPosition();
|
1691
|
+
}
|
1692
|
+
},
|
1693
|
+
|
1521
1694
|
bindWindowActions: function () {
|
1522
|
-
var
|
1523
|
-
self = this;
|
1524
|
-
this.windowResizeHandler = function () {
|
1525
|
-
clearTimeout(timerResize);
|
1526
|
-
timerResize = setTimeout(function () {
|
1527
|
-
if (self.toolbar && self.toolbar.classList.contains('medium-editor-toolbar-active')) {
|
1528
|
-
self.setToolbarPosition();
|
1529
|
-
}
|
1530
|
-
}, 100);
|
1531
|
-
};
|
1695
|
+
var self = this;
|
1532
1696
|
|
1533
1697
|
// Add a scroll event for sticky toolbar
|
1534
1698
|
if ( this.options.staticToolbar && this.options.stickyToolbar ) {
|
1535
|
-
|
1536
1699
|
// On scroll, re-position the toolbar
|
1537
|
-
this.on(
|
1538
|
-
|
1539
|
-
self.setToolbarPosition();
|
1540
|
-
}
|
1700
|
+
this.on(this.options.contentWindow, 'scroll', function() {
|
1701
|
+
self.positionToolbarIfShown();
|
1541
1702
|
}, true);
|
1542
1703
|
}
|
1543
1704
|
|
1544
|
-
this.on(this.options.contentWindow, 'resize',
|
1705
|
+
this.on(this.options.contentWindow, 'resize', function() {
|
1706
|
+
self.handleResize();
|
1707
|
+
});
|
1545
1708
|
return this;
|
1546
1709
|
},
|
1547
1710
|
|
@@ -1596,8 +1759,8 @@ else if (typeof define === 'function' && define.amd) {
|
|
1596
1759
|
return this;
|
1597
1760
|
}
|
1598
1761
|
|
1599
|
-
if (
|
1600
|
-
e.clipboardData =
|
1762
|
+
if (self.options.contentWindow.clipboardData && e.clipboardData === undefined) {
|
1763
|
+
e.clipboardData = self.options.contentWindow.clipboardData;
|
1601
1764
|
// If window.clipboardData exists, but e.clipboardData doesn't exist,
|
1602
1765
|
// we're probably in IE. IE only has two possibilities for clipboard
|
1603
1766
|
// data format: 'Text' and 'URL'.
|
@@ -1638,29 +1801,14 @@ else if (typeof define === 'function' && define.amd) {
|
|
1638
1801
|
},
|
1639
1802
|
|
1640
1803
|
setPlaceholders: function () {
|
1641
|
-
if (this.options.disablePlaceholders) {
|
1642
|
-
|
1804
|
+
if (!this.options.disablePlaceholders && this.elements && this.elements.length) {
|
1805
|
+
this.elements.forEach(function(el) {
|
1806
|
+
this.activatePlaceholder(el);
|
1807
|
+
this.on(el, 'blur', this.placeholderWrapper.bind(this));
|
1808
|
+
this.on(el, 'keypress', this.placeholderWrapper.bind(this));
|
1809
|
+
}.bind(this));
|
1643
1810
|
}
|
1644
1811
|
|
1645
|
-
var i,
|
1646
|
-
activatePlaceholder = function (el) {
|
1647
|
-
if (!(el.querySelector('img')) &&
|
1648
|
-
!(el.querySelector('blockquote')) &&
|
1649
|
-
el.textContent.replace(/^\s+|\s+$/g, '') === '') {
|
1650
|
-
el.classList.add('medium-editor-placeholder');
|
1651
|
-
}
|
1652
|
-
},
|
1653
|
-
placeholderWrapper = function (e) {
|
1654
|
-
this.classList.remove('medium-editor-placeholder');
|
1655
|
-
if (e.type !== 'keypress') {
|
1656
|
-
activatePlaceholder(this);
|
1657
|
-
}
|
1658
|
-
};
|
1659
|
-
for (i = 0; i < this.elements.length; i += 1) {
|
1660
|
-
activatePlaceholder(this.elements[i]);
|
1661
|
-
this.on(this.elements[i], 'blur', placeholderWrapper);
|
1662
|
-
this.on(this.elements[i], 'keypress', placeholderWrapper);
|
1663
|
-
}
|
1664
1812
|
return this;
|
1665
1813
|
},
|
1666
1814
|
|
@@ -126,7 +126,8 @@
|
|
126
126
|
-webkit-animation: pop-upwards 160ms forwards linear;
|
127
127
|
-ms-animation: pop-upwards 160ms forwards linear;
|
128
128
|
animation: pop-upwards 160ms forwards linear;
|
129
|
-
transition: top 0.075s ease-out, left 0.075s ease-out;
|
129
|
+
-webkit-transition: top 0.075s ease-out, left 0.075s ease-out;
|
130
|
+
transition: top 0.075s ease-out, left 0.075s ease-out; }
|
130
131
|
|
131
132
|
.medium-editor-action-bold {
|
132
133
|
font-weight: bolder; }
|
@@ -167,4 +168,5 @@
|
|
167
168
|
top: 0;
|
168
169
|
left: 0;
|
169
170
|
content: attr(data-placeholder) !important;
|
170
|
-
font-style: italic;
|
171
|
+
font-style: italic;
|
172
|
+
white-space: pre; }
|
@@ -9,7 +9,8 @@
|
|
9
9
|
border: 1px solid #357ebd;
|
10
10
|
background-color: #428bca;
|
11
11
|
border-radius: 4px;
|
12
|
-
transition: top 0.075s ease-out, left 0.075s ease-out;
|
12
|
+
-webkit-transition: top 0.075s ease-out, left 0.075s ease-out;
|
13
|
+
transition: top 0.075s ease-out, left 0.075s ease-out; }
|
13
14
|
.medium-editor-toolbar li button {
|
14
15
|
min-width: 60px;
|
15
16
|
height: 60px;
|
@@ -18,7 +19,8 @@
|
|
18
19
|
background-color: transparent;
|
19
20
|
color: #fff;
|
20
21
|
box-sizing: border-box;
|
21
|
-
transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
22
|
+
-webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
23
|
+
transition: background-color 0.2s ease-in, color 0.2s ease-in; }
|
22
24
|
.medium-editor-toolbar li button:hover {
|
23
25
|
background-color: #3276b1;
|
24
26
|
color: #fff; }
|
@@ -9,10 +9,12 @@
|
|
9
9
|
.medium-editor-toolbar {
|
10
10
|
border: 1px solid #000;
|
11
11
|
background-color: #242424;
|
12
|
+
background: -webkit-linear-gradient(bottom, #242424, rgba(36, 36, 36, 0.75));
|
12
13
|
background: linear-gradient(bottom, #242424, rgba(36, 36, 36, 0.75));
|
13
14
|
border-radius: 5px;
|
14
15
|
box-shadow: 0 0 3px #000;
|
15
|
-
transition: top 0.075s ease-out, left 0.075s ease-out;
|
16
|
+
-webkit-transition: top 0.075s ease-out, left 0.075s ease-out;
|
17
|
+
transition: top 0.075s ease-out, left 0.075s ease-out; }
|
16
18
|
.medium-editor-toolbar li button {
|
17
19
|
min-width: 50px;
|
18
20
|
height: 50px;
|
@@ -22,9 +24,11 @@
|
|
22
24
|
border-left: 1px solid rgba(255, 255, 255, 0.1);
|
23
25
|
background-color: #242424;
|
24
26
|
color: #fff;
|
27
|
+
background: -webkit-linear-gradient(bottom, #242424, rgba(36, 36, 36, 0.89));
|
25
28
|
background: linear-gradient(bottom, #242424, rgba(36, 36, 36, 0.89));
|
26
29
|
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
|
27
|
-
transition: background-color 0.2s ease-in;
|
30
|
+
-webkit-transition: background-color 0.2s ease-in;
|
31
|
+
transition: background-color 0.2s ease-in; }
|
28
32
|
.medium-editor-toolbar li button:hover {
|
29
33
|
background-color: #000;
|
30
34
|
color: yellow; }
|
@@ -37,6 +41,7 @@
|
|
37
41
|
.medium-editor-toolbar li .medium-editor-button-active {
|
38
42
|
background-color: #000;
|
39
43
|
color: #fff;
|
44
|
+
background: -webkit-linear-gradient(bottom, #242424, rgba(0, 0, 0, 0.89));
|
40
45
|
background: linear-gradient(bottom, #242424, rgba(0, 0, 0, 0.89)); }
|
41
46
|
|
42
47
|
.medium-editor-toolbar-form-anchor {
|
@@ -17,7 +17,8 @@
|
|
17
17
|
border-right: 1px solid #9ccea6;
|
18
18
|
background-color: transparent;
|
19
19
|
color: #fff;
|
20
|
-
transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
20
|
+
-webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
21
|
+
transition: background-color 0.2s ease-in, color 0.2s ease-in; }
|
21
22
|
.medium-editor-toolbar li button:hover {
|
22
23
|
background-color: #346a3f;
|
23
24
|
color: #fff; }
|
@@ -5,6 +5,7 @@
|
|
5
5
|
border: 1px solid #cdd6e0;
|
6
6
|
background-color: #dee7f0;
|
7
7
|
background-color: rgba(222, 231, 240, 0.95);
|
8
|
+
background: -webkit-linear-gradient(bottom, #dee7f0, #ffffff);
|
8
9
|
background: linear-gradient(bottom, #dee7f0, #ffffff);
|
9
10
|
border-radius: 2px;
|
10
11
|
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.45); }
|
@@ -15,7 +16,8 @@
|
|
15
16
|
border-right: 1px solid #cdd6e0;
|
16
17
|
background-color: transparent;
|
17
18
|
color: #40648a;
|
18
|
-
transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
19
|
+
-webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;
|
20
|
+
transition: background-color 0.2s ease-in, color 0.2s ease-in; }
|
19
21
|
.medium-editor-toolbar li button:hover {
|
20
22
|
background-color: #5c90c7;
|
21
23
|
background-color: rgba(92, 144, 199, 0.45);
|
@@ -30,6 +32,7 @@
|
|
30
32
|
background-color: #5c90c7;
|
31
33
|
background-color: rgba(92, 144, 199, 0.45);
|
32
34
|
color: #000;
|
35
|
+
background: -webkit-linear-gradient(bottom, #dee7f0, rgba(0, 0, 0, 0.1));
|
33
36
|
background: linear-gradient(bottom, #dee7f0, rgba(0, 0, 0, 0.1)); }
|
34
37
|
|
35
38
|
.medium-editor-toolbar-form-anchor {
|
@@ -14,9 +14,11 @@
|
|
14
14
|
background-color: transparent;
|
15
15
|
color: #889aac;
|
16
16
|
box-shadow: inset 0 0 3px #f8f8e6;
|
17
|
+
background: -webkit-linear-gradient(top, #fff, rgba(0, 0, 0, 0.1));
|
17
18
|
background: linear-gradient(top, #fff, rgba(0, 0, 0, 0.1));
|
18
19
|
text-shadow: 1px 4px 6px #def, 0 0 0 #000, 1px 4px 6px #def;
|
19
|
-
transition: background-color 0.2s ease-in;
|
20
|
+
-webkit-transition: background-color 0.2s ease-in;
|
21
|
+
transition: background-color 0.2s ease-in; }
|
20
22
|
.medium-editor-toolbar li button:hover {
|
21
23
|
background-color: #fff;
|
22
24
|
color: #000;
|
@@ -31,6 +33,7 @@
|
|
31
33
|
background-color: #ccc;
|
32
34
|
color: #000;
|
33
35
|
color: rgba(0, 0, 0, 0.8);
|
36
|
+
background: -webkit-linear-gradient(bottom, #fff, rgba(0, 0, 0, 0.2));
|
34
37
|
background: linear-gradient(bottom, #fff, rgba(0, 0, 0, 0.2)); }
|
35
38
|
|
36
39
|
.medium-editor-toolbar-form-anchor {
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: medium-editor-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.1.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Ahmet Sezgin Duran
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2015-01-
|
11
|
+
date: 2015-01-27 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: railties
|