plugin.js
6.18 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
/**
* plugin.js
*
* Released under LGPL License.
* Copyright (c) 1999-2015 Ephox Corp. All rights reserved
*
* License: http://www.tinymce.com/license
* Contributing: http://www.tinymce.com/contributing
*
* This plugin will force TinyMCE to produce deprecated legacy output such as font elements, u elements, align
* attributes and so forth. There are a few cases where these old items might be needed for example in email applications or with Flash
*
* However you should NOT use this plugin if you are building some system that produces web contents such as a CMS. All these elements are
* not apart of the newer specifications for HTML and XHTML.
*/
/*global tinymce:true */
(function(tinymce) {
tinymce.PluginManager.add('legacyoutput', function(editor, url, $) {
editor.settings.inline_styles = false;
editor.on('init', function() {
var alignElements = 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img',
fontSizes = tinymce.explode(editor.settings.font_size_style_values),
schema = editor.schema;
// Override some internal formats to produce legacy elements and attributes
editor.formatter.register({
// Change alignment formats to use the deprecated align attribute
alignleft: {selector: alignElements, attributes: {align: 'left'}},
aligncenter: {selector: alignElements, attributes: {align: 'center'}},
alignright: {selector: alignElements, attributes: {align: 'right'}},
alignjustify: {selector: alignElements, attributes: {align: 'justify'}},
// Change the basic formatting elements to use deprecated element types
bold: [
{inline: 'b', remove: 'all'},
{inline: 'strong', remove: 'all'},
{inline: 'span', styles: {fontWeight: 'bold'}}
],
italic: [
{inline: 'i', remove: 'all'},
{inline: 'em', remove: 'all'},
{inline: 'span', styles: {fontStyle: 'italic'}}
],
underline: [
{inline: 'u', remove: 'all'},
{inline: 'span', styles: {textDecoration: 'underline'}, exact: true}
],
strikethrough: [
{inline: 'strike', remove: 'all'},
{inline: 'span', styles: {textDecoration: 'line-through'}, exact: true}
],
// Change font size and font family to use the deprecated font element
fontname: {inline: 'font', attributes: {face: '%value'}},
fontsize: {
inline: 'font',
attributes: {
size: function(vars) {
return tinymce.inArray(fontSizes, vars.value) + 1;
}
}
},
// Setup font elements for colors as well
forecolor: {inline: 'font', attributes: {color: '%value'}},
hilitecolor: {inline: 'font', styles: {backgroundColor: '%value'}}
});
// Check that deprecated elements are allowed if not add them
tinymce.each('b,i,u,strike'.split(','), function(name) {
schema.addValidElements(name + '[*]');
});
// Add font element if it's missing
if (!schema.getElementRule("font")) {
schema.addValidElements("font[face|size|color|style]");
}
// Add the missing and depreacted align attribute for the serialization engine
tinymce.each(alignElements.split(','), function(name) {
var rule = schema.getElementRule(name);
if (rule) {
if (!rule.attributes.align) {
rule.attributes.align = {};
rule.attributesOrder.push('align');
}
}
});
});
editor.addButton('fontsizeselect', function() {
var items = [], defaultFontsizeFormats = '8pt=1 10pt=2 12pt=3 14pt=4 18pt=5 24pt=6 36pt=7';
var fontsize_formats = editor.settings.fontsize_formats || defaultFontsizeFormats;
editor.$.each(fontsize_formats.split(' '), function(i, item) {
var text = item, value = item;
var values = item.split('=');
if (values.length > 1) {
text = values[0];
value = values[1];
}
items.push({text: text, value: value});
});
return {
type: 'listbox',
text: 'Font Sizes',
tooltip: 'Font Sizes',
values: items,
fixedWidth: true,
onPostRender: function() {
var self = this;
editor.on('NodeChange', function() {
var fontElm;
fontElm = editor.dom.getParent(editor.selection.getNode(), 'font');
if (fontElm) {
self.value(fontElm.size);
} else {
self.value('');
}
});
},
onclick: function(e) {
if (e.control.settings.value) {
editor.execCommand('FontSize', false, e.control.settings.value);
}
}
};
});
editor.addButton('fontselect', function() {
function createFormats(formats) {
formats = formats.replace(/;$/, '').split(';');
var i = formats.length;
while (i--) {
formats[i] = formats[i].split('=');
}
return formats;
}
var defaultFontsFormats =
'Andale Mono=andale mono,monospace;' +
'Arial=arial,helvetica,sans-serif;' +
'Arial Black=arial black,sans-serif;' +
'Book Antiqua=book antiqua,palatino,serif;' +
'Comic Sans MS=comic sans ms,sans-serif;' +
'Courier New=courier new,courier,monospace;' +
'Georgia=georgia,palatino,serif;' +
'Helvetica=helvetica,arial,sans-serif;' +
'Impact=impact,sans-serif;' +
'Symbol=symbol;' +
'Tahoma=tahoma,arial,helvetica,sans-serif;' +
'Terminal=terminal,monaco,monospace;' +
'Times New Roman=times new roman,times,serif;' +
'Trebuchet MS=trebuchet ms,geneva,sans-serif;' +
'Verdana=verdana,geneva,sans-serif;' +
'Webdings=webdings;' +
'Wingdings=wingdings,zapf dingbats';
var items = [], fonts = createFormats(editor.settings.font_formats || defaultFontsFormats);
$.each(fonts, function(i, font) {
items.push({
text: {raw: font[0]},
value: font[1],
textStyle: font[1].indexOf('dings') == -1 ? 'font-family:' + font[1] : ''
});
});
return {
type: 'listbox',
text: 'Font Family',
tooltip: 'Font Family',
values: items,
fixedWidth: true,
onPostRender: function() {
var self = this;
editor.on('NodeChange', function() {
var fontElm;
fontElm = editor.dom.getParent(editor.selection.getNode(), 'font');
if (fontElm) {
self.value(fontElm.face);
} else {
self.value('');
}
});
},
onselect: function(e) {
if (e.control.settings.value) {
editor.execCommand('FontName', false, e.control.settings.value);
}
}
};
});
});
})(tinymce);