medium-editor
Version:
Medium.com WYSIWYG editor clone.
259 lines (254 loc) • 8.54 kB
JavaScript
(function () {
'use strict';
/* MediumEditor.extensions.button.defaults: [Object]
* Set of default config options for all of the built-in MediumEditor buttons
*/
MediumEditor.extensions.button.prototype.defaults = {
'bold': {
name: 'bold',
action: 'bold',
aria: 'bold',
tagNames: ['b', 'strong'],
style: {
prop: 'font-weight',
value: '700|bold'
},
useQueryState: true,
contentDefault: '<b>B</b>',
contentFA: '<i class="fa fa-bold"></i>'
},
'italic': {
name: 'italic',
action: 'italic',
aria: 'italic',
tagNames: ['i', 'em'],
style: {
prop: 'font-style',
value: 'italic'
},
useQueryState: true,
contentDefault: '<b><i>I</i></b>',
contentFA: '<i class="fa fa-italic"></i>'
},
'underline': {
name: 'underline',
action: 'underline',
aria: 'underline',
tagNames: ['u'],
style: {
prop: 'text-decoration',
value: 'underline'
},
useQueryState: true,
contentDefault: '<b><u>U</u></b>',
contentFA: '<i class="fa fa-underline"></i>'
},
'strikethrough': {
name: 'strikethrough',
action: 'strikethrough',
aria: 'strike through',
tagNames: ['strike'],
style: {
prop: 'text-decoration',
value: 'line-through'
},
useQueryState: true,
contentDefault: '<s>A</s>',
contentFA: '<i class="fa fa-strikethrough"></i>'
},
'superscript': {
name: 'superscript',
action: 'superscript',
aria: 'superscript',
tagNames: ['sup'],
/* firefox doesn't behave the way we want it to, so we CAN'T use queryCommandState for superscript
https://github.com/guardian/scribe/blob/master/BROWSERINCONSISTENCIES.md#documentquerycommandstate */
// useQueryState: true
contentDefault: '<b>x<sup>1</sup></b>',
contentFA: '<i class="fa fa-superscript"></i>'
},
'subscript': {
name: 'subscript',
action: 'subscript',
aria: 'subscript',
tagNames: ['sub'],
/* firefox doesn't behave the way we want it to, so we CAN'T use queryCommandState for subscript
https://github.com/guardian/scribe/blob/master/BROWSERINCONSISTENCIES.md#documentquerycommandstate */
// useQueryState: true
contentDefault: '<b>x<sub>1</sub></b>',
contentFA: '<i class="fa fa-subscript"></i>'
},
'image': {
name: 'image',
action: 'image',
aria: 'image',
tagNames: ['img'],
contentDefault: '<b>image</b>',
contentFA: '<i class="fa fa-picture-o"></i>'
},
'html': {
name: 'html',
action: 'html',
aria: 'evaluate html',
tagNames: ['iframe', 'object'],
contentDefault: '<b>html</b>',
contentFA: '<i class="fa fa-code"></i>'
},
'orderedlist': {
name: 'orderedlist',
action: 'insertorderedlist',
aria: 'ordered list',
tagNames: ['ol'],
useQueryState: true,
contentDefault: '<b>1.</b>',
contentFA: '<i class="fa fa-list-ol"></i>'
},
'unorderedlist': {
name: 'unorderedlist',
action: 'insertunorderedlist',
aria: 'unordered list',
tagNames: ['ul'],
useQueryState: true,
contentDefault: '<b>•</b>',
contentFA: '<i class="fa fa-list-ul"></i>'
},
'indent': {
name: 'indent',
action: 'indent',
aria: 'indent',
tagNames: [],
contentDefault: '<b>→</b>',
contentFA: '<i class="fa fa-indent"></i>'
},
'outdent': {
name: 'outdent',
action: 'outdent',
aria: 'outdent',
tagNames: [],
contentDefault: '<b>←</b>',
contentFA: '<i class="fa fa-outdent"></i>'
},
'justifyCenter': {
name: 'justifyCenter',
action: 'justifyCenter',
aria: 'center justify',
tagNames: [],
style: {
prop: 'text-align',
value: 'center'
},
contentDefault: '<b>C</b>',
contentFA: '<i class="fa fa-align-center"></i>'
},
'justifyFull': {
name: 'justifyFull',
action: 'justifyFull',
aria: 'full justify',
tagNames: [],
style: {
prop: 'text-align',
value: 'justify'
},
contentDefault: '<b>J</b>',
contentFA: '<i class="fa fa-align-justify"></i>'
},
'justifyLeft': {
name: 'justifyLeft',
action: 'justifyLeft',
aria: 'left justify',
tagNames: [],
style: {
prop: 'text-align',
value: 'left'
},
contentDefault: '<b>L</b>',
contentFA: '<i class="fa fa-align-left"></i>'
},
'justifyRight': {
name: 'justifyRight',
action: 'justifyRight',
aria: 'right justify',
tagNames: [],
style: {
prop: 'text-align',
value: 'right'
},
contentDefault: '<b>R</b>',
contentFA: '<i class="fa fa-align-right"></i>'
},
// Known inline elements that are not removed, or not removed consistantly across browsers:
// <span>, <label>, <br>
'removeFormat': {
name: 'removeFormat',
aria: 'remove formatting',
action: 'removeFormat',
contentDefault: '<b>X</b>',
contentFA: '<i class="fa fa-eraser"></i>'
},
/***** Buttons for appending block elements (append-<element> action) *****/
'quote': {
name: 'quote',
action: 'append-blockquote',
aria: 'blockquote',
tagNames: ['blockquote'],
contentDefault: '<b>“</b>',
contentFA: '<i class="fa fa-quote-right"></i>'
},
'pre': {
name: 'pre',
action: 'append-pre',
aria: 'preformatted text',
tagNames: ['pre'],
contentDefault: '<b>0101</b>',
contentFA: '<i class="fa fa-code fa-lg"></i>'
},
'h1': {
name: 'h1',
action: 'append-h1',
aria: 'header type one',
tagNames: ['h1'],
contentDefault: '<b>H1</b>',
contentFA: '<i class="fa fa-header"><sup>1</sup>'
},
'h2': {
name: 'h2',
action: 'append-h2',
aria: 'header type two',
tagNames: ['h2'],
contentDefault: '<b>H2</b>',
contentFA: '<i class="fa fa-header"><sup>2</sup>'
},
'h3': {
name: 'h3',
action: 'append-h3',
aria: 'header type three',
tagNames: ['h3'],
contentDefault: '<b>H3</b>',
contentFA: '<i class="fa fa-header"><sup>3</sup>'
},
'h4': {
name: 'h4',
action: 'append-h4',
aria: 'header type four',
tagNames: ['h4'],
contentDefault: '<b>H4</b>',
contentFA: '<i class="fa fa-header"><sup>4</sup>'
},
'h5': {
name: 'h5',
action: 'append-h5',
aria: 'header type five',
tagNames: ['h5'],
contentDefault: '<b>H5</b>',
contentFA: '<i class="fa fa-header"><sup>5</sup>'
},
'h6': {
name: 'h6',
action: 'append-h6',
aria: 'header type six',
tagNames: ['h6'],
contentDefault: '<b>H6</b>',
contentFA: '<i class="fa fa-header"><sup>6</sup>'
}
};
})();