| 1 |
efrain |
1 |
/**
|
|
|
2 |
* TinyMCE version 6.8.3 (2024-02-08)
|
|
|
3 |
*/
|
|
|
4 |
|
|
|
5 |
(function () {
|
|
|
6 |
'use strict';
|
|
|
7 |
|
|
|
8 |
var global$6 = tinymce.util.Tools.resolve('tinymce.PluginManager');
|
|
|
9 |
|
|
|
10 |
const hasProto = (v, constructor, predicate) => {
|
|
|
11 |
var _a;
|
|
|
12 |
if (predicate(v, constructor.prototype)) {
|
|
|
13 |
return true;
|
|
|
14 |
} else {
|
|
|
15 |
return ((_a = v.constructor) === null || _a === void 0 ? void 0 : _a.name) === constructor.name;
|
|
|
16 |
}
|
|
|
17 |
};
|
|
|
18 |
const typeOf = x => {
|
|
|
19 |
const t = typeof x;
|
|
|
20 |
if (x === null) {
|
|
|
21 |
return 'null';
|
|
|
22 |
} else if (t === 'object' && Array.isArray(x)) {
|
|
|
23 |
return 'array';
|
|
|
24 |
} else if (t === 'object' && hasProto(x, String, (o, proto) => proto.isPrototypeOf(o))) {
|
|
|
25 |
return 'string';
|
|
|
26 |
} else {
|
|
|
27 |
return t;
|
|
|
28 |
}
|
|
|
29 |
};
|
|
|
30 |
const isType = type => value => typeOf(value) === type;
|
|
|
31 |
const isString = isType('string');
|
|
|
32 |
const isObject = isType('object');
|
|
|
33 |
const isArray = isType('array');
|
|
|
34 |
const isNullable = a => a === null || a === undefined;
|
|
|
35 |
const isNonNullable = a => !isNullable(a);
|
|
|
36 |
|
|
|
37 |
class Optional {
|
|
|
38 |
constructor(tag, value) {
|
|
|
39 |
this.tag = tag;
|
|
|
40 |
this.value = value;
|
|
|
41 |
}
|
|
|
42 |
static some(value) {
|
|
|
43 |
return new Optional(true, value);
|
|
|
44 |
}
|
|
|
45 |
static none() {
|
|
|
46 |
return Optional.singletonNone;
|
|
|
47 |
}
|
|
|
48 |
fold(onNone, onSome) {
|
|
|
49 |
if (this.tag) {
|
|
|
50 |
return onSome(this.value);
|
|
|
51 |
} else {
|
|
|
52 |
return onNone();
|
|
|
53 |
}
|
|
|
54 |
}
|
|
|
55 |
isSome() {
|
|
|
56 |
return this.tag;
|
|
|
57 |
}
|
|
|
58 |
isNone() {
|
|
|
59 |
return !this.tag;
|
|
|
60 |
}
|
|
|
61 |
map(mapper) {
|
|
|
62 |
if (this.tag) {
|
|
|
63 |
return Optional.some(mapper(this.value));
|
|
|
64 |
} else {
|
|
|
65 |
return Optional.none();
|
|
|
66 |
}
|
|
|
67 |
}
|
|
|
68 |
bind(binder) {
|
|
|
69 |
if (this.tag) {
|
|
|
70 |
return binder(this.value);
|
|
|
71 |
} else {
|
|
|
72 |
return Optional.none();
|
|
|
73 |
}
|
|
|
74 |
}
|
|
|
75 |
exists(predicate) {
|
|
|
76 |
return this.tag && predicate(this.value);
|
|
|
77 |
}
|
|
|
78 |
forall(predicate) {
|
|
|
79 |
return !this.tag || predicate(this.value);
|
|
|
80 |
}
|
|
|
81 |
filter(predicate) {
|
|
|
82 |
if (!this.tag || predicate(this.value)) {
|
|
|
83 |
return this;
|
|
|
84 |
} else {
|
|
|
85 |
return Optional.none();
|
|
|
86 |
}
|
|
|
87 |
}
|
|
|
88 |
getOr(replacement) {
|
|
|
89 |
return this.tag ? this.value : replacement;
|
|
|
90 |
}
|
|
|
91 |
or(replacement) {
|
|
|
92 |
return this.tag ? this : replacement;
|
|
|
93 |
}
|
|
|
94 |
getOrThunk(thunk) {
|
|
|
95 |
return this.tag ? this.value : thunk();
|
|
|
96 |
}
|
|
|
97 |
orThunk(thunk) {
|
|
|
98 |
return this.tag ? this : thunk();
|
|
|
99 |
}
|
|
|
100 |
getOrDie(message) {
|
|
|
101 |
if (!this.tag) {
|
|
|
102 |
throw new Error(message !== null && message !== void 0 ? message : 'Called getOrDie on None');
|
|
|
103 |
} else {
|
|
|
104 |
return this.value;
|
|
|
105 |
}
|
|
|
106 |
}
|
|
|
107 |
static from(value) {
|
|
|
108 |
return isNonNullable(value) ? Optional.some(value) : Optional.none();
|
|
|
109 |
}
|
|
|
110 |
getOrNull() {
|
|
|
111 |
return this.tag ? this.value : null;
|
|
|
112 |
}
|
|
|
113 |
getOrUndefined() {
|
|
|
114 |
return this.value;
|
|
|
115 |
}
|
|
|
116 |
each(worker) {
|
|
|
117 |
if (this.tag) {
|
|
|
118 |
worker(this.value);
|
|
|
119 |
}
|
|
|
120 |
}
|
|
|
121 |
toArray() {
|
|
|
122 |
return this.tag ? [this.value] : [];
|
|
|
123 |
}
|
|
|
124 |
toString() {
|
|
|
125 |
return this.tag ? `some(${ this.value })` : 'none()';
|
|
|
126 |
}
|
|
|
127 |
}
|
|
|
128 |
Optional.singletonNone = new Optional(false);
|
|
|
129 |
|
|
|
130 |
const nativePush = Array.prototype.push;
|
|
|
131 |
const each$1 = (xs, f) => {
|
|
|
132 |
for (let i = 0, len = xs.length; i < len; i++) {
|
|
|
133 |
const x = xs[i];
|
|
|
134 |
f(x, i);
|
|
|
135 |
}
|
|
|
136 |
};
|
|
|
137 |
const flatten = xs => {
|
|
|
138 |
const r = [];
|
|
|
139 |
for (let i = 0, len = xs.length; i < len; ++i) {
|
|
|
140 |
if (!isArray(xs[i])) {
|
|
|
141 |
throw new Error('Arr.flatten item ' + i + ' was not an array, input: ' + xs);
|
|
|
142 |
}
|
|
|
143 |
nativePush.apply(r, xs[i]);
|
|
|
144 |
}
|
|
|
145 |
return r;
|
|
|
146 |
};
|
|
|
147 |
|
|
|
148 |
const Cell = initial => {
|
|
|
149 |
let value = initial;
|
|
|
150 |
const get = () => {
|
|
|
151 |
return value;
|
|
|
152 |
};
|
|
|
153 |
const set = v => {
|
|
|
154 |
value = v;
|
|
|
155 |
};
|
|
|
156 |
return {
|
|
|
157 |
get,
|
|
|
158 |
set
|
|
|
159 |
};
|
|
|
160 |
};
|
|
|
161 |
|
|
|
162 |
const keys = Object.keys;
|
|
|
163 |
const hasOwnProperty = Object.hasOwnProperty;
|
|
|
164 |
const each = (obj, f) => {
|
|
|
165 |
const props = keys(obj);
|
|
|
166 |
for (let k = 0, len = props.length; k < len; k++) {
|
|
|
167 |
const i = props[k];
|
|
|
168 |
const x = obj[i];
|
|
|
169 |
f(x, i);
|
|
|
170 |
}
|
|
|
171 |
};
|
|
|
172 |
const get$1 = (obj, key) => {
|
|
|
173 |
return has(obj, key) ? Optional.from(obj[key]) : Optional.none();
|
|
|
174 |
};
|
|
|
175 |
const has = (obj, key) => hasOwnProperty.call(obj, key);
|
|
|
176 |
|
|
|
177 |
const option = name => editor => editor.options.get(name);
|
|
|
178 |
const register$2 = editor => {
|
|
|
179 |
const registerOption = editor.options.register;
|
|
|
180 |
registerOption('audio_template_callback', { processor: 'function' });
|
|
|
181 |
registerOption('video_template_callback', { processor: 'function' });
|
|
|
182 |
registerOption('iframe_template_callback', { processor: 'function' });
|
|
|
183 |
registerOption('media_live_embeds', {
|
|
|
184 |
processor: 'boolean',
|
|
|
185 |
default: true
|
|
|
186 |
});
|
|
|
187 |
registerOption('media_filter_html', {
|
|
|
188 |
processor: 'boolean',
|
|
|
189 |
default: true
|
|
|
190 |
});
|
|
|
191 |
registerOption('media_url_resolver', { processor: 'function' });
|
|
|
192 |
registerOption('media_alt_source', {
|
|
|
193 |
processor: 'boolean',
|
|
|
194 |
default: true
|
|
|
195 |
});
|
|
|
196 |
registerOption('media_poster', {
|
|
|
197 |
processor: 'boolean',
|
|
|
198 |
default: true
|
|
|
199 |
});
|
|
|
200 |
registerOption('media_dimensions', {
|
|
|
201 |
processor: 'boolean',
|
|
|
202 |
default: true
|
|
|
203 |
});
|
|
|
204 |
};
|
|
|
205 |
const getAudioTemplateCallback = option('audio_template_callback');
|
|
|
206 |
const getVideoTemplateCallback = option('video_template_callback');
|
|
|
207 |
const getIframeTemplateCallback = option('iframe_template_callback');
|
|
|
208 |
const hasLiveEmbeds = option('media_live_embeds');
|
|
|
209 |
const shouldFilterHtml = option('media_filter_html');
|
|
|
210 |
const getUrlResolver = option('media_url_resolver');
|
|
|
211 |
const hasAltSource = option('media_alt_source');
|
|
|
212 |
const hasPoster = option('media_poster');
|
|
|
213 |
const hasDimensions = option('media_dimensions');
|
|
|
214 |
|
|
|
215 |
var global$5 = tinymce.util.Tools.resolve('tinymce.util.Tools');
|
|
|
216 |
|
|
|
217 |
var global$4 = tinymce.util.Tools.resolve('tinymce.dom.DOMUtils');
|
|
|
218 |
|
|
|
219 |
var global$3 = tinymce.util.Tools.resolve('tinymce.html.DomParser');
|
|
|
220 |
|
|
|
221 |
const DOM$1 = global$4.DOM;
|
|
|
222 |
const trimPx = value => value.replace(/px$/, '');
|
|
|
223 |
const getEphoxEmbedData = node => {
|
|
|
224 |
const style = node.attr('style');
|
|
|
225 |
const styles = style ? DOM$1.parseStyle(style) : {};
|
|
|
226 |
return {
|
|
|
227 |
type: 'ephox-embed-iri',
|
|
|
228 |
source: node.attr('data-ephox-embed-iri'),
|
|
|
229 |
altsource: '',
|
|
|
230 |
poster: '',
|
|
|
231 |
width: get$1(styles, 'max-width').map(trimPx).getOr(''),
|
|
|
232 |
height: get$1(styles, 'max-height').map(trimPx).getOr('')
|
|
|
233 |
};
|
|
|
234 |
};
|
|
|
235 |
const htmlToData = (html, schema) => {
|
|
|
236 |
let data = {};
|
|
|
237 |
const parser = global$3({
|
|
|
238 |
validate: false,
|
|
|
239 |
forced_root_block: false
|
|
|
240 |
}, schema);
|
|
|
241 |
const rootNode = parser.parse(html);
|
|
|
242 |
for (let node = rootNode; node; node = node.walk()) {
|
|
|
243 |
if (node.type === 1) {
|
|
|
244 |
const name = node.name;
|
|
|
245 |
if (node.attr('data-ephox-embed-iri')) {
|
|
|
246 |
data = getEphoxEmbedData(node);
|
|
|
247 |
break;
|
|
|
248 |
} else {
|
|
|
249 |
if (!data.source && name === 'param') {
|
|
|
250 |
data.source = node.attr('movie');
|
|
|
251 |
}
|
|
|
252 |
if (name === 'iframe' || name === 'object' || name === 'embed' || name === 'video' || name === 'audio') {
|
|
|
253 |
if (!data.type) {
|
|
|
254 |
data.type = name;
|
|
|
255 |
}
|
|
|
256 |
data = global$5.extend(node.attributes.map, data);
|
|
|
257 |
}
|
|
|
258 |
if (name === 'source') {
|
|
|
259 |
if (!data.source) {
|
|
|
260 |
data.source = node.attr('src');
|
|
|
261 |
} else if (!data.altsource) {
|
|
|
262 |
data.altsource = node.attr('src');
|
|
|
263 |
}
|
|
|
264 |
}
|
|
|
265 |
if (name === 'img' && !data.poster) {
|
|
|
266 |
data.poster = node.attr('src');
|
|
|
267 |
}
|
|
|
268 |
}
|
|
|
269 |
}
|
|
|
270 |
}
|
|
|
271 |
data.source = data.source || data.src || '';
|
|
|
272 |
data.altsource = data.altsource || '';
|
|
|
273 |
data.poster = data.poster || '';
|
|
|
274 |
return data;
|
|
|
275 |
};
|
|
|
276 |
|
|
|
277 |
const guess = url => {
|
|
|
278 |
var _a;
|
|
|
279 |
const mimes = {
|
|
|
280 |
mp3: 'audio/mpeg',
|
|
|
281 |
m4a: 'audio/x-m4a',
|
|
|
282 |
wav: 'audio/wav',
|
|
|
283 |
mp4: 'video/mp4',
|
|
|
284 |
webm: 'video/webm',
|
|
|
285 |
ogg: 'video/ogg',
|
|
|
286 |
swf: 'application/x-shockwave-flash'
|
|
|
287 |
};
|
|
|
288 |
const fileEnd = (_a = url.toLowerCase().split('.').pop()) !== null && _a !== void 0 ? _a : '';
|
|
|
289 |
return get$1(mimes, fileEnd).getOr('');
|
|
|
290 |
};
|
|
|
291 |
|
|
|
292 |
var global$2 = tinymce.util.Tools.resolve('tinymce.html.Node');
|
|
|
293 |
|
|
|
294 |
var global$1 = tinymce.util.Tools.resolve('tinymce.html.Serializer');
|
|
|
295 |
|
|
|
296 |
const Parser = (schema, settings = {}) => global$3({
|
|
|
297 |
forced_root_block: false,
|
|
|
298 |
validate: false,
|
|
|
299 |
allow_conditional_comments: true,
|
|
|
300 |
...settings
|
|
|
301 |
}, schema);
|
|
|
302 |
|
|
|
303 |
const DOM = global$4.DOM;
|
|
|
304 |
const addPx = value => /^[0-9.]+$/.test(value) ? value + 'px' : value;
|
|
|
305 |
const updateEphoxEmbed = (data, node) => {
|
|
|
306 |
const style = node.attr('style');
|
|
|
307 |
const styleMap = style ? DOM.parseStyle(style) : {};
|
|
|
308 |
if (isNonNullable(data.width)) {
|
|
|
309 |
styleMap['max-width'] = addPx(data.width);
|
|
|
310 |
}
|
|
|
311 |
if (isNonNullable(data.height)) {
|
|
|
312 |
styleMap['max-height'] = addPx(data.height);
|
|
|
313 |
}
|
|
|
314 |
node.attr('style', DOM.serializeStyle(styleMap));
|
|
|
315 |
};
|
|
|
316 |
const sources = [
|
|
|
317 |
'source',
|
|
|
318 |
'altsource'
|
|
|
319 |
];
|
|
|
320 |
const updateHtml = (html, data, updateAll, schema) => {
|
|
|
321 |
let numSources = 0;
|
|
|
322 |
let sourceCount = 0;
|
|
|
323 |
const parser = Parser(schema);
|
|
|
324 |
parser.addNodeFilter('source', nodes => numSources = nodes.length);
|
|
|
325 |
const rootNode = parser.parse(html);
|
|
|
326 |
for (let node = rootNode; node; node = node.walk()) {
|
|
|
327 |
if (node.type === 1) {
|
|
|
328 |
const name = node.name;
|
|
|
329 |
if (node.attr('data-ephox-embed-iri')) {
|
|
|
330 |
updateEphoxEmbed(data, node);
|
|
|
331 |
break;
|
|
|
332 |
} else {
|
|
|
333 |
switch (name) {
|
|
|
334 |
case 'video':
|
|
|
335 |
case 'object':
|
|
|
336 |
case 'embed':
|
|
|
337 |
case 'img':
|
|
|
338 |
case 'iframe':
|
|
|
339 |
if (data.height !== undefined && data.width !== undefined) {
|
|
|
340 |
node.attr('width', data.width);
|
|
|
341 |
node.attr('height', data.height);
|
|
|
342 |
}
|
|
|
343 |
break;
|
|
|
344 |
}
|
|
|
345 |
if (updateAll) {
|
|
|
346 |
switch (name) {
|
|
|
347 |
case 'video':
|
|
|
348 |
node.attr('poster', data.poster);
|
|
|
349 |
node.attr('src', null);
|
|
|
350 |
for (let index = numSources; index < 2; index++) {
|
|
|
351 |
if (data[sources[index]]) {
|
|
|
352 |
const source = new global$2('source', 1);
|
|
|
353 |
source.attr('src', data[sources[index]]);
|
|
|
354 |
source.attr('type', data[sources[index] + 'mime'] || null);
|
|
|
355 |
node.append(source);
|
|
|
356 |
}
|
|
|
357 |
}
|
|
|
358 |
break;
|
|
|
359 |
case 'iframe':
|
|
|
360 |
node.attr('src', data.source);
|
|
|
361 |
break;
|
|
|
362 |
case 'object':
|
|
|
363 |
const hasImage = node.getAll('img').length > 0;
|
|
|
364 |
if (data.poster && !hasImage) {
|
|
|
365 |
node.attr('src', data.poster);
|
|
|
366 |
const img = new global$2('img', 1);
|
|
|
367 |
img.attr('src', data.poster);
|
|
|
368 |
img.attr('width', data.width);
|
|
|
369 |
img.attr('height', data.height);
|
|
|
370 |
node.append(img);
|
|
|
371 |
}
|
|
|
372 |
break;
|
|
|
373 |
case 'source':
|
|
|
374 |
if (sourceCount < 2) {
|
|
|
375 |
node.attr('src', data[sources[sourceCount]]);
|
|
|
376 |
node.attr('type', data[sources[sourceCount] + 'mime'] || null);
|
|
|
377 |
if (!data[sources[sourceCount]]) {
|
|
|
378 |
node.remove();
|
|
|
379 |
continue;
|
|
|
380 |
}
|
|
|
381 |
}
|
|
|
382 |
sourceCount++;
|
|
|
383 |
break;
|
|
|
384 |
case 'img':
|
|
|
385 |
if (!data.poster) {
|
|
|
386 |
node.remove();
|
|
|
387 |
}
|
|
|
388 |
break;
|
|
|
389 |
}
|
|
|
390 |
}
|
|
|
391 |
}
|
|
|
392 |
}
|
|
|
393 |
}
|
|
|
394 |
return global$1({}, schema).serialize(rootNode);
|
|
|
395 |
};
|
|
|
396 |
|
|
|
397 |
const urlPatterns = [
|
|
|
398 |
{
|
|
|
399 |
regex: /youtu\.be\/([\w\-_\?&=.]+)/i,
|
|
|
400 |
type: 'iframe',
|
|
|
401 |
w: 560,
|
|
|
402 |
h: 314,
|
|
|
403 |
url: 'www.youtube.com/embed/$1',
|
|
|
404 |
allowFullscreen: true
|
|
|
405 |
},
|
|
|
406 |
{
|
|
|
407 |
regex: /youtube\.com(.+)v=([^&]+)(&([a-z0-9&=\-_]+))?/i,
|
|
|
408 |
type: 'iframe',
|
|
|
409 |
w: 560,
|
|
|
410 |
h: 314,
|
|
|
411 |
url: 'www.youtube.com/embed/$2?$4',
|
|
|
412 |
allowFullscreen: true
|
|
|
413 |
},
|
|
|
414 |
{
|
|
|
415 |
regex: /youtube.com\/embed\/([a-z0-9\?&=\-_]+)/i,
|
|
|
416 |
type: 'iframe',
|
|
|
417 |
w: 560,
|
|
|
418 |
h: 314,
|
|
|
419 |
url: 'www.youtube.com/embed/$1',
|
|
|
420 |
allowFullscreen: true
|
|
|
421 |
},
|
|
|
422 |
{
|
|
|
423 |
regex: /vimeo\.com\/([0-9]+)\?h=(\w+)/,
|
|
|
424 |
type: 'iframe',
|
|
|
425 |
w: 425,
|
|
|
426 |
h: 350,
|
|
|
427 |
url: 'player.vimeo.com/video/$1?h=$2&title=0&byline=0&portrait=0&color=8dc7dc',
|
|
|
428 |
allowFullscreen: true
|
|
|
429 |
},
|
|
|
430 |
{
|
|
|
431 |
regex: /vimeo\.com\/(.*)\/([0-9]+)\?h=(\w+)/,
|
|
|
432 |
type: 'iframe',
|
|
|
433 |
w: 425,
|
|
|
434 |
h: 350,
|
|
|
435 |
url: 'player.vimeo.com/video/$2?h=$3&title=0&byline=0',
|
|
|
436 |
allowFullscreen: true
|
|
|
437 |
},
|
|
|
438 |
{
|
|
|
439 |
regex: /vimeo\.com\/([0-9]+)/,
|
|
|
440 |
type: 'iframe',
|
|
|
441 |
w: 425,
|
|
|
442 |
h: 350,
|
|
|
443 |
url: 'player.vimeo.com/video/$1?title=0&byline=0&portrait=0&color=8dc7dc',
|
|
|
444 |
allowFullscreen: true
|
|
|
445 |
},
|
|
|
446 |
{
|
|
|
447 |
regex: /vimeo\.com\/(.*)\/([0-9]+)/,
|
|
|
448 |
type: 'iframe',
|
|
|
449 |
w: 425,
|
|
|
450 |
h: 350,
|
|
|
451 |
url: 'player.vimeo.com/video/$2?title=0&byline=0',
|
|
|
452 |
allowFullscreen: true
|
|
|
453 |
},
|
|
|
454 |
{
|
|
|
455 |
regex: /maps\.google\.([a-z]{2,3})\/maps\/(.+)msid=(.+)/,
|
|
|
456 |
type: 'iframe',
|
|
|
457 |
w: 425,
|
|
|
458 |
h: 350,
|
|
|
459 |
url: 'maps.google.com/maps/ms?msid=$2&output=embed"',
|
|
|
460 |
allowFullscreen: false
|
|
|
461 |
},
|
|
|
462 |
{
|
|
|
463 |
regex: /dailymotion\.com\/video\/([^_]+)/,
|
|
|
464 |
type: 'iframe',
|
|
|
465 |
w: 480,
|
|
|
466 |
h: 270,
|
|
|
467 |
url: 'www.dailymotion.com/embed/video/$1',
|
|
|
468 |
allowFullscreen: true
|
|
|
469 |
},
|
|
|
470 |
{
|
|
|
471 |
regex: /dai\.ly\/([^_]+)/,
|
|
|
472 |
type: 'iframe',
|
|
|
473 |
w: 480,
|
|
|
474 |
h: 270,
|
|
|
475 |
url: 'www.dailymotion.com/embed/video/$1',
|
|
|
476 |
allowFullscreen: true
|
|
|
477 |
}
|
|
|
478 |
];
|
|
|
479 |
const getProtocol = url => {
|
|
|
480 |
const protocolMatches = url.match(/^(https?:\/\/|www\.)(.+)$/i);
|
|
|
481 |
if (protocolMatches && protocolMatches.length > 1) {
|
|
|
482 |
return protocolMatches[1] === 'www.' ? 'https://' : protocolMatches[1];
|
|
|
483 |
} else {
|
|
|
484 |
return 'https://';
|
|
|
485 |
}
|
|
|
486 |
};
|
|
|
487 |
const getUrl = (pattern, url) => {
|
|
|
488 |
const protocol = getProtocol(url);
|
|
|
489 |
const match = pattern.regex.exec(url);
|
|
|
490 |
let newUrl = protocol + pattern.url;
|
|
|
491 |
if (isNonNullable(match)) {
|
|
|
492 |
for (let i = 0; i < match.length; i++) {
|
|
|
493 |
newUrl = newUrl.replace('$' + i, () => match[i] ? match[i] : '');
|
|
|
494 |
}
|
|
|
495 |
}
|
|
|
496 |
return newUrl.replace(/\?$/, '');
|
|
|
497 |
};
|
|
|
498 |
const matchPattern = url => {
|
|
|
499 |
const patterns = urlPatterns.filter(pattern => pattern.regex.test(url));
|
|
|
500 |
if (patterns.length > 0) {
|
|
|
501 |
return global$5.extend({}, patterns[0], { url: getUrl(patterns[0], url) });
|
|
|
502 |
} else {
|
|
|
503 |
return null;
|
|
|
504 |
}
|
|
|
505 |
};
|
|
|
506 |
|
|
|
507 |
const getIframeHtml = (data, iframeTemplateCallback) => {
|
|
|
508 |
if (iframeTemplateCallback) {
|
|
|
509 |
return iframeTemplateCallback(data);
|
|
|
510 |
} else {
|
|
|
511 |
const allowFullscreen = data.allowfullscreen ? ' allowFullscreen="1"' : '';
|
|
|
512 |
return '<iframe src="' + data.source + '" width="' + data.width + '" height="' + data.height + '"' + allowFullscreen + '></iframe>';
|
|
|
513 |
}
|
|
|
514 |
};
|
|
|
515 |
const getFlashHtml = data => {
|
|
|
516 |
let html = '<object data="' + data.source + '" width="' + data.width + '" height="' + data.height + '" type="application/x-shockwave-flash">';
|
|
|
517 |
if (data.poster) {
|
|
|
518 |
html += '<img src="' + data.poster + '" width="' + data.width + '" height="' + data.height + '" />';
|
|
|
519 |
}
|
|
|
520 |
html += '</object>';
|
|
|
521 |
return html;
|
|
|
522 |
};
|
|
|
523 |
const getAudioHtml = (data, audioTemplateCallback) => {
|
|
|
524 |
if (audioTemplateCallback) {
|
|
|
525 |
return audioTemplateCallback(data);
|
|
|
526 |
} else {
|
|
|
527 |
return '<audio controls="controls" src="' + data.source + '">' + (data.altsource ? '\n<source src="' + data.altsource + '"' + (data.altsourcemime ? ' type="' + data.altsourcemime + '"' : '') + ' />\n' : '') + '</audio>';
|
|
|
528 |
}
|
|
|
529 |
};
|
|
|
530 |
const getVideoHtml = (data, videoTemplateCallback) => {
|
|
|
531 |
if (videoTemplateCallback) {
|
|
|
532 |
return videoTemplateCallback(data);
|
|
|
533 |
} else {
|
|
|
534 |
return '<video width="' + data.width + '" height="' + data.height + '"' + (data.poster ? ' poster="' + data.poster + '"' : '') + ' controls="controls">\n' + '<source src="' + data.source + '"' + (data.sourcemime ? ' type="' + data.sourcemime + '"' : '') + ' />\n' + (data.altsource ? '<source src="' + data.altsource + '"' + (data.altsourcemime ? ' type="' + data.altsourcemime + '"' : '') + ' />\n' : '') + '</video>';
|
|
|
535 |
}
|
|
|
536 |
};
|
|
|
537 |
const dataToHtml = (editor, dataIn) => {
|
|
|
538 |
var _a;
|
|
|
539 |
const data = global$5.extend({}, dataIn);
|
|
|
540 |
if (!data.source) {
|
|
|
541 |
global$5.extend(data, htmlToData((_a = data.embed) !== null && _a !== void 0 ? _a : '', editor.schema));
|
|
|
542 |
if (!data.source) {
|
|
|
543 |
return '';
|
|
|
544 |
}
|
|
|
545 |
}
|
|
|
546 |
if (!data.altsource) {
|
|
|
547 |
data.altsource = '';
|
|
|
548 |
}
|
|
|
549 |
if (!data.poster) {
|
|
|
550 |
data.poster = '';
|
|
|
551 |
}
|
|
|
552 |
data.source = editor.convertURL(data.source, 'source');
|
|
|
553 |
data.altsource = editor.convertURL(data.altsource, 'source');
|
|
|
554 |
data.sourcemime = guess(data.source);
|
|
|
555 |
data.altsourcemime = guess(data.altsource);
|
|
|
556 |
data.poster = editor.convertURL(data.poster, 'poster');
|
|
|
557 |
const pattern = matchPattern(data.source);
|
|
|
558 |
if (pattern) {
|
|
|
559 |
data.source = pattern.url;
|
|
|
560 |
data.type = pattern.type;
|
|
|
561 |
data.allowfullscreen = pattern.allowFullscreen;
|
|
|
562 |
data.width = data.width || String(pattern.w);
|
|
|
563 |
data.height = data.height || String(pattern.h);
|
|
|
564 |
}
|
|
|
565 |
if (data.embed) {
|
|
|
566 |
return updateHtml(data.embed, data, true, editor.schema);
|
|
|
567 |
} else {
|
|
|
568 |
const audioTemplateCallback = getAudioTemplateCallback(editor);
|
|
|
569 |
const videoTemplateCallback = getVideoTemplateCallback(editor);
|
|
|
570 |
const iframeTemplateCallback = getIframeTemplateCallback(editor);
|
|
|
571 |
data.width = data.width || '300';
|
|
|
572 |
data.height = data.height || '150';
|
|
|
573 |
global$5.each(data, (value, key) => {
|
|
|
574 |
data[key] = editor.dom.encode('' + value);
|
|
|
575 |
});
|
|
|
576 |
if (data.type === 'iframe') {
|
|
|
577 |
return getIframeHtml(data, iframeTemplateCallback);
|
|
|
578 |
} else if (data.sourcemime === 'application/x-shockwave-flash') {
|
|
|
579 |
return getFlashHtml(data);
|
|
|
580 |
} else if (data.sourcemime.indexOf('audio') !== -1) {
|
|
|
581 |
return getAudioHtml(data, audioTemplateCallback);
|
|
|
582 |
} else {
|
|
|
583 |
return getVideoHtml(data, videoTemplateCallback);
|
|
|
584 |
}
|
|
|
585 |
}
|
|
|
586 |
};
|
|
|
587 |
|
|
|
588 |
const isMediaElement = element => element.hasAttribute('data-mce-object') || element.hasAttribute('data-ephox-embed-iri');
|
|
|
589 |
const setup$2 = editor => {
|
|
|
590 |
editor.on('click keyup touchend', () => {
|
|
|
591 |
const selectedNode = editor.selection.getNode();
|
|
|
592 |
if (selectedNode && editor.dom.hasClass(selectedNode, 'mce-preview-object')) {
|
|
|
593 |
if (editor.dom.getAttrib(selectedNode, 'data-mce-selected')) {
|
|
|
594 |
selectedNode.setAttribute('data-mce-selected', '2');
|
|
|
595 |
}
|
|
|
596 |
}
|
|
|
597 |
});
|
|
|
598 |
editor.on('ObjectResized', e => {
|
|
|
599 |
const target = e.target;
|
|
|
600 |
if (target.getAttribute('data-mce-object')) {
|
|
|
601 |
let html = target.getAttribute('data-mce-html');
|
|
|
602 |
if (html) {
|
|
|
603 |
html = unescape(html);
|
|
|
604 |
target.setAttribute('data-mce-html', escape(updateHtml(html, {
|
|
|
605 |
width: String(e.width),
|
|
|
606 |
height: String(e.height)
|
|
|
607 |
}, false, editor.schema)));
|
|
|
608 |
}
|
|
|
609 |
}
|
|
|
610 |
});
|
|
|
611 |
};
|
|
|
612 |
|
|
|
613 |
const cache = {};
|
|
|
614 |
const embedPromise = (data, dataToHtml, handler) => {
|
|
|
615 |
return new Promise((res, rej) => {
|
|
|
616 |
const wrappedResolve = response => {
|
|
|
617 |
if (response.html) {
|
|
|
618 |
cache[data.source] = response;
|
|
|
619 |
}
|
|
|
620 |
return res({
|
|
|
621 |
url: data.source,
|
|
|
622 |
html: response.html ? response.html : dataToHtml(data)
|
|
|
623 |
});
|
|
|
624 |
};
|
|
|
625 |
if (cache[data.source]) {
|
|
|
626 |
wrappedResolve(cache[data.source]);
|
|
|
627 |
} else {
|
|
|
628 |
handler({ url: data.source }, wrappedResolve, rej);
|
|
|
629 |
}
|
|
|
630 |
});
|
|
|
631 |
};
|
|
|
632 |
const defaultPromise = (data, dataToHtml) => Promise.resolve({
|
|
|
633 |
html: dataToHtml(data),
|
|
|
634 |
url: data.source
|
|
|
635 |
});
|
|
|
636 |
const loadedData = editor => data => dataToHtml(editor, data);
|
|
|
637 |
const getEmbedHtml = (editor, data) => {
|
|
|
638 |
const embedHandler = getUrlResolver(editor);
|
|
|
639 |
return embedHandler ? embedPromise(data, loadedData(editor), embedHandler) : defaultPromise(data, loadedData(editor));
|
|
|
640 |
};
|
|
|
641 |
const isCached = url => has(cache, url);
|
|
|
642 |
|
|
|
643 |
const extractMeta = (sourceInput, data) => get$1(data, sourceInput).bind(mainData => get$1(mainData, 'meta'));
|
|
|
644 |
const getValue = (data, metaData, sourceInput) => prop => {
|
|
|
645 |
const getFromData = () => get$1(data, prop);
|
|
|
646 |
const getFromMetaData = () => get$1(metaData, prop);
|
|
|
647 |
const getNonEmptyValue = c => get$1(c, 'value').bind(v => v.length > 0 ? Optional.some(v) : Optional.none());
|
|
|
648 |
const getFromValueFirst = () => getFromData().bind(child => isObject(child) ? getNonEmptyValue(child).orThunk(getFromMetaData) : getFromMetaData().orThunk(() => Optional.from(child)));
|
|
|
649 |
const getFromMetaFirst = () => getFromMetaData().orThunk(() => getFromData().bind(child => isObject(child) ? getNonEmptyValue(child) : Optional.from(child)));
|
|
|
650 |
return { [prop]: (prop === sourceInput ? getFromValueFirst() : getFromMetaFirst()).getOr('') };
|
|
|
651 |
};
|
|
|
652 |
const getDimensions = (data, metaData) => {
|
|
|
653 |
const dimensions = {};
|
|
|
654 |
get$1(data, 'dimensions').each(dims => {
|
|
|
655 |
each$1([
|
|
|
656 |
'width',
|
|
|
657 |
'height'
|
|
|
658 |
], prop => {
|
|
|
659 |
get$1(metaData, prop).orThunk(() => get$1(dims, prop)).each(value => dimensions[prop] = value);
|
|
|
660 |
});
|
|
|
661 |
});
|
|
|
662 |
return dimensions;
|
|
|
663 |
};
|
|
|
664 |
const unwrap = (data, sourceInput) => {
|
|
|
665 |
const metaData = sourceInput && sourceInput !== 'dimensions' ? extractMeta(sourceInput, data).getOr({}) : {};
|
|
|
666 |
const get = getValue(data, metaData, sourceInput);
|
|
|
667 |
return {
|
|
|
668 |
...get('source'),
|
|
|
669 |
...get('altsource'),
|
|
|
670 |
...get('poster'),
|
|
|
671 |
...get('embed'),
|
|
|
672 |
...getDimensions(data, metaData)
|
|
|
673 |
};
|
|
|
674 |
};
|
|
|
675 |
const wrap = data => {
|
|
|
676 |
const wrapped = {
|
|
|
677 |
...data,
|
|
|
678 |
source: { value: get$1(data, 'source').getOr('') },
|
|
|
679 |
altsource: { value: get$1(data, 'altsource').getOr('') },
|
|
|
680 |
poster: { value: get$1(data, 'poster').getOr('') }
|
|
|
681 |
};
|
|
|
682 |
each$1([
|
|
|
683 |
'width',
|
|
|
684 |
'height'
|
|
|
685 |
], prop => {
|
|
|
686 |
get$1(data, prop).each(value => {
|
|
|
687 |
const dimensions = wrapped.dimensions || {};
|
|
|
688 |
dimensions[prop] = value;
|
|
|
689 |
wrapped.dimensions = dimensions;
|
|
|
690 |
});
|
|
|
691 |
});
|
|
|
692 |
return wrapped;
|
|
|
693 |
};
|
|
|
694 |
const handleError = editor => error => {
|
|
|
695 |
const errorMessage = error && error.msg ? 'Media embed handler error: ' + error.msg : 'Media embed handler threw unknown error.';
|
|
|
696 |
editor.notificationManager.open({
|
|
|
697 |
type: 'error',
|
|
|
698 |
text: errorMessage
|
|
|
699 |
});
|
|
|
700 |
};
|
|
|
701 |
const getEditorData = editor => {
|
|
|
702 |
const element = editor.selection.getNode();
|
|
|
703 |
const snippet = isMediaElement(element) ? editor.serializer.serialize(element, { selection: true }) : '';
|
|
|
704 |
const data = htmlToData(snippet, editor.schema);
|
|
|
705 |
const getDimensionsOfElement = () => {
|
|
|
706 |
if (isEmbedIframe(data.source, data.type)) {
|
|
|
707 |
const rect = editor.dom.getRect(element);
|
|
|
708 |
return {
|
|
|
709 |
width: rect.w.toString().replace(/px$/, ''),
|
|
|
710 |
height: rect.h.toString().replace(/px$/, '')
|
|
|
711 |
};
|
|
|
712 |
} else {
|
|
|
713 |
return {};
|
|
|
714 |
}
|
|
|
715 |
};
|
|
|
716 |
const dimensions = getDimensionsOfElement();
|
|
|
717 |
return {
|
|
|
718 |
embed: snippet,
|
|
|
719 |
...data,
|
|
|
720 |
...dimensions
|
|
|
721 |
};
|
|
|
722 |
};
|
|
|
723 |
const addEmbedHtml = (api, editor) => response => {
|
|
|
724 |
if (isString(response.url) && response.url.trim().length > 0) {
|
|
|
725 |
const html = response.html;
|
|
|
726 |
const snippetData = htmlToData(html, editor.schema);
|
|
|
727 |
const nuData = {
|
|
|
728 |
...snippetData,
|
|
|
729 |
source: response.url,
|
|
|
730 |
embed: html
|
|
|
731 |
};
|
|
|
732 |
api.setData(wrap(nuData));
|
|
|
733 |
}
|
|
|
734 |
};
|
|
|
735 |
const selectPlaceholder = (editor, beforeObjects) => {
|
|
|
736 |
const afterObjects = editor.dom.select('*[data-mce-object]');
|
|
|
737 |
for (let i = 0; i < beforeObjects.length; i++) {
|
|
|
738 |
for (let y = afterObjects.length - 1; y >= 0; y--) {
|
|
|
739 |
if (beforeObjects[i] === afterObjects[y]) {
|
|
|
740 |
afterObjects.splice(y, 1);
|
|
|
741 |
}
|
|
|
742 |
}
|
|
|
743 |
}
|
|
|
744 |
editor.selection.select(afterObjects[0]);
|
|
|
745 |
};
|
|
|
746 |
const handleInsert = (editor, html) => {
|
|
|
747 |
const beforeObjects = editor.dom.select('*[data-mce-object]');
|
|
|
748 |
editor.insertContent(html);
|
|
|
749 |
selectPlaceholder(editor, beforeObjects);
|
|
|
750 |
editor.nodeChanged();
|
|
|
751 |
};
|
|
|
752 |
const isEmbedIframe = (url, mediaDataType) => isNonNullable(mediaDataType) && mediaDataType === 'ephox-embed-iri' && isNonNullable(matchPattern(url));
|
|
|
753 |
const shouldInsertAsNewIframe = (prevData, newData) => {
|
|
|
754 |
const hasDimensionsChanged = (prevData, newData) => prevData.width !== newData.width || prevData.height !== newData.height;
|
|
|
755 |
return hasDimensionsChanged(prevData, newData) && isEmbedIframe(newData.source, prevData.type);
|
|
|
756 |
};
|
|
|
757 |
const submitForm = (prevData, newData, editor) => {
|
|
|
758 |
var _a;
|
|
|
759 |
newData.embed = shouldInsertAsNewIframe(prevData, newData) && hasDimensions(editor) ? dataToHtml(editor, {
|
|
|
760 |
...newData,
|
|
|
761 |
embed: ''
|
|
|
762 |
}) : updateHtml((_a = newData.embed) !== null && _a !== void 0 ? _a : '', newData, false, editor.schema);
|
|
|
763 |
if (newData.embed && (prevData.source === newData.source || isCached(newData.source))) {
|
|
|
764 |
handleInsert(editor, newData.embed);
|
|
|
765 |
} else {
|
|
|
766 |
getEmbedHtml(editor, newData).then(response => {
|
|
|
767 |
handleInsert(editor, response.html);
|
|
|
768 |
}).catch(handleError(editor));
|
|
|
769 |
}
|
|
|
770 |
};
|
|
|
771 |
const showDialog = editor => {
|
|
|
772 |
const editorData = getEditorData(editor);
|
|
|
773 |
const currentData = Cell(editorData);
|
|
|
774 |
const initialData = wrap(editorData);
|
|
|
775 |
const handleSource = (prevData, api) => {
|
|
|
776 |
const serviceData = unwrap(api.getData(), 'source');
|
|
|
777 |
if (prevData.source !== serviceData.source) {
|
|
|
778 |
addEmbedHtml(win, editor)({
|
|
|
779 |
url: serviceData.source,
|
|
|
780 |
html: ''
|
|
|
781 |
});
|
|
|
782 |
getEmbedHtml(editor, serviceData).then(addEmbedHtml(win, editor)).catch(handleError(editor));
|
|
|
783 |
}
|
|
|
784 |
};
|
|
|
785 |
const handleEmbed = api => {
|
|
|
786 |
var _a;
|
|
|
787 |
const data = unwrap(api.getData());
|
|
|
788 |
const dataFromEmbed = htmlToData((_a = data.embed) !== null && _a !== void 0 ? _a : '', editor.schema);
|
|
|
789 |
api.setData(wrap(dataFromEmbed));
|
|
|
790 |
};
|
|
|
791 |
const handleUpdate = (api, sourceInput, prevData) => {
|
|
|
792 |
const dialogData = unwrap(api.getData(), sourceInput);
|
|
|
793 |
const data = shouldInsertAsNewIframe(prevData, dialogData) && hasDimensions(editor) ? {
|
|
|
794 |
...dialogData,
|
|
|
795 |
embed: ''
|
|
|
796 |
} : dialogData;
|
|
|
797 |
const embed = dataToHtml(editor, data);
|
|
|
798 |
api.setData(wrap({
|
|
|
799 |
...data,
|
|
|
800 |
embed
|
|
|
801 |
}));
|
|
|
802 |
};
|
|
|
803 |
const mediaInput = [{
|
|
|
804 |
name: 'source',
|
|
|
805 |
type: 'urlinput',
|
|
|
806 |
filetype: 'media',
|
|
|
807 |
label: 'Source',
|
|
|
808 |
picker_text: 'Browse files'
|
|
|
809 |
}];
|
|
|
810 |
const sizeInput = !hasDimensions(editor) ? [] : [{
|
|
|
811 |
type: 'sizeinput',
|
|
|
812 |
name: 'dimensions',
|
|
|
813 |
label: 'Constrain proportions',
|
|
|
814 |
constrain: true
|
|
|
815 |
}];
|
|
|
816 |
const generalTab = {
|
|
|
817 |
title: 'General',
|
|
|
818 |
name: 'general',
|
|
|
819 |
items: flatten([
|
|
|
820 |
mediaInput,
|
|
|
821 |
sizeInput
|
|
|
822 |
])
|
|
|
823 |
};
|
|
|
824 |
const embedTextarea = {
|
|
|
825 |
type: 'textarea',
|
|
|
826 |
name: 'embed',
|
|
|
827 |
label: 'Paste your embed code below:'
|
|
|
828 |
};
|
|
|
829 |
const embedTab = {
|
|
|
830 |
title: 'Embed',
|
|
|
831 |
items: [embedTextarea]
|
|
|
832 |
};
|
|
|
833 |
const advancedFormItems = [];
|
|
|
834 |
if (hasAltSource(editor)) {
|
|
|
835 |
advancedFormItems.push({
|
|
|
836 |
name: 'altsource',
|
|
|
837 |
type: 'urlinput',
|
|
|
838 |
filetype: 'media',
|
|
|
839 |
label: 'Alternative source URL'
|
|
|
840 |
});
|
|
|
841 |
}
|
|
|
842 |
if (hasPoster(editor)) {
|
|
|
843 |
advancedFormItems.push({
|
|
|
844 |
name: 'poster',
|
|
|
845 |
type: 'urlinput',
|
|
|
846 |
filetype: 'image',
|
|
|
847 |
label: 'Media poster (Image URL)'
|
|
|
848 |
});
|
|
|
849 |
}
|
|
|
850 |
const advancedTab = {
|
|
|
851 |
title: 'Advanced',
|
|
|
852 |
name: 'advanced',
|
|
|
853 |
items: advancedFormItems
|
|
|
854 |
};
|
|
|
855 |
const tabs = [
|
|
|
856 |
generalTab,
|
|
|
857 |
embedTab
|
|
|
858 |
];
|
|
|
859 |
if (advancedFormItems.length > 0) {
|
|
|
860 |
tabs.push(advancedTab);
|
|
|
861 |
}
|
|
|
862 |
const body = {
|
|
|
863 |
type: 'tabpanel',
|
|
|
864 |
tabs
|
|
|
865 |
};
|
|
|
866 |
const win = editor.windowManager.open({
|
|
|
867 |
title: 'Insert/Edit Media',
|
|
|
868 |
size: 'normal',
|
|
|
869 |
body,
|
|
|
870 |
buttons: [
|
|
|
871 |
{
|
|
|
872 |
type: 'cancel',
|
|
|
873 |
name: 'cancel',
|
|
|
874 |
text: 'Cancel'
|
|
|
875 |
},
|
|
|
876 |
{
|
|
|
877 |
type: 'submit',
|
|
|
878 |
name: 'save',
|
|
|
879 |
text: 'Save',
|
|
|
880 |
primary: true
|
|
|
881 |
}
|
|
|
882 |
],
|
|
|
883 |
onSubmit: api => {
|
|
|
884 |
const serviceData = unwrap(api.getData());
|
|
|
885 |
submitForm(currentData.get(), serviceData, editor);
|
|
|
886 |
api.close();
|
|
|
887 |
},
|
|
|
888 |
onChange: (api, detail) => {
|
|
|
889 |
switch (detail.name) {
|
|
|
890 |
case 'source':
|
|
|
891 |
handleSource(currentData.get(), api);
|
|
|
892 |
break;
|
|
|
893 |
case 'embed':
|
|
|
894 |
handleEmbed(api);
|
|
|
895 |
break;
|
|
|
896 |
case 'dimensions':
|
|
|
897 |
case 'altsource':
|
|
|
898 |
case 'poster':
|
|
|
899 |
handleUpdate(api, detail.name, currentData.get());
|
|
|
900 |
break;
|
|
|
901 |
}
|
|
|
902 |
currentData.set(unwrap(api.getData()));
|
|
|
903 |
},
|
|
|
904 |
initialData
|
|
|
905 |
});
|
|
|
906 |
};
|
|
|
907 |
|
|
|
908 |
const get = editor => {
|
|
|
909 |
const showDialog$1 = () => {
|
|
|
910 |
showDialog(editor);
|
|
|
911 |
};
|
|
|
912 |
return { showDialog: showDialog$1 };
|
|
|
913 |
};
|
|
|
914 |
|
|
|
915 |
const register$1 = editor => {
|
|
|
916 |
const showDialog$1 = () => {
|
|
|
917 |
showDialog(editor);
|
|
|
918 |
};
|
|
|
919 |
editor.addCommand('mceMedia', showDialog$1);
|
|
|
920 |
};
|
|
|
921 |
|
|
|
922 |
const checkRange = (str, substr, start) => substr === '' || str.length >= substr.length && str.substr(start, start + substr.length) === substr;
|
|
|
923 |
const startsWith = (str, prefix) => {
|
|
|
924 |
return checkRange(str, prefix, 0);
|
|
|
925 |
};
|
|
|
926 |
|
|
|
927 |
var global = tinymce.util.Tools.resolve('tinymce.Env');
|
|
|
928 |
|
|
|
929 |
const isLiveEmbedNode = node => {
|
|
|
930 |
const name = node.name;
|
|
|
931 |
return name === 'iframe' || name === 'video' || name === 'audio';
|
|
|
932 |
};
|
|
|
933 |
const getDimension = (node, styles, dimension, defaultValue = null) => {
|
|
|
934 |
const value = node.attr(dimension);
|
|
|
935 |
if (isNonNullable(value)) {
|
|
|
936 |
return value;
|
|
|
937 |
} else if (!has(styles, dimension)) {
|
|
|
938 |
return defaultValue;
|
|
|
939 |
} else {
|
|
|
940 |
return null;
|
|
|
941 |
}
|
|
|
942 |
};
|
|
|
943 |
const setDimensions = (node, previewNode, styles) => {
|
|
|
944 |
const useDefaults = previewNode.name === 'img' || node.name === 'video';
|
|
|
945 |
const defaultWidth = useDefaults ? '300' : null;
|
|
|
946 |
const fallbackHeight = node.name === 'audio' ? '30' : '150';
|
|
|
947 |
const defaultHeight = useDefaults ? fallbackHeight : null;
|
|
|
948 |
previewNode.attr({
|
|
|
949 |
width: getDimension(node, styles, 'width', defaultWidth),
|
|
|
950 |
height: getDimension(node, styles, 'height', defaultHeight)
|
|
|
951 |
});
|
|
|
952 |
};
|
|
|
953 |
const appendNodeContent = (editor, nodeName, previewNode, html) => {
|
|
|
954 |
const newNode = Parser(editor.schema).parse(html, { context: nodeName });
|
|
|
955 |
while (newNode.firstChild) {
|
|
|
956 |
previewNode.append(newNode.firstChild);
|
|
|
957 |
}
|
|
|
958 |
};
|
|
|
959 |
const createPlaceholderNode = (editor, node) => {
|
|
|
960 |
const name = node.name;
|
|
|
961 |
const placeHolder = new global$2('img', 1);
|
|
|
962 |
retainAttributesAndInnerHtml(editor, node, placeHolder);
|
|
|
963 |
setDimensions(node, placeHolder, {});
|
|
|
964 |
placeHolder.attr({
|
|
|
965 |
'style': node.attr('style'),
|
|
|
966 |
'src': global.transparentSrc,
|
|
|
967 |
'data-mce-object': name,
|
|
|
968 |
'class': 'mce-object mce-object-' + name
|
|
|
969 |
});
|
|
|
970 |
return placeHolder;
|
|
|
971 |
};
|
|
|
972 |
const createPreviewNode = (editor, node) => {
|
|
|
973 |
var _a;
|
|
|
974 |
const name = node.name;
|
|
|
975 |
const previewWrapper = new global$2('span', 1);
|
|
|
976 |
previewWrapper.attr({
|
|
|
977 |
'contentEditable': 'false',
|
|
|
978 |
'style': node.attr('style'),
|
|
|
979 |
'data-mce-object': name,
|
|
|
980 |
'class': 'mce-preview-object mce-object-' + name
|
|
|
981 |
});
|
|
|
982 |
retainAttributesAndInnerHtml(editor, node, previewWrapper);
|
|
|
983 |
const styles = editor.dom.parseStyle((_a = node.attr('style')) !== null && _a !== void 0 ? _a : '');
|
|
|
984 |
const previewNode = new global$2(name, 1);
|
|
|
985 |
setDimensions(node, previewNode, styles);
|
|
|
986 |
previewNode.attr({
|
|
|
987 |
src: node.attr('src'),
|
|
|
988 |
style: node.attr('style'),
|
|
|
989 |
class: node.attr('class')
|
|
|
990 |
});
|
|
|
991 |
if (name === 'iframe') {
|
|
|
992 |
previewNode.attr({
|
|
|
993 |
allowfullscreen: node.attr('allowfullscreen'),
|
|
|
994 |
frameborder: '0',
|
|
|
995 |
sandbox: node.attr('sandbox')
|
|
|
996 |
});
|
|
|
997 |
} else {
|
|
|
998 |
const attrs = [
|
|
|
999 |
'controls',
|
|
|
1000 |
'crossorigin',
|
|
|
1001 |
'currentTime',
|
|
|
1002 |
'loop',
|
|
|
1003 |
'muted',
|
|
|
1004 |
'poster',
|
|
|
1005 |
'preload'
|
|
|
1006 |
];
|
|
|
1007 |
each$1(attrs, attrName => {
|
|
|
1008 |
previewNode.attr(attrName, node.attr(attrName));
|
|
|
1009 |
});
|
|
|
1010 |
const sanitizedHtml = previewWrapper.attr('data-mce-html');
|
|
|
1011 |
if (isNonNullable(sanitizedHtml)) {
|
|
|
1012 |
appendNodeContent(editor, name, previewNode, unescape(sanitizedHtml));
|
|
|
1013 |
}
|
|
|
1014 |
}
|
|
|
1015 |
const shimNode = new global$2('span', 1);
|
|
|
1016 |
shimNode.attr('class', 'mce-shim');
|
|
|
1017 |
previewWrapper.append(previewNode);
|
|
|
1018 |
previewWrapper.append(shimNode);
|
|
|
1019 |
return previewWrapper;
|
|
|
1020 |
};
|
|
|
1021 |
const retainAttributesAndInnerHtml = (editor, sourceNode, targetNode) => {
|
|
|
1022 |
var _a;
|
|
|
1023 |
const attribs = (_a = sourceNode.attributes) !== null && _a !== void 0 ? _a : [];
|
|
|
1024 |
let ai = attribs.length;
|
|
|
1025 |
while (ai--) {
|
|
|
1026 |
const attrName = attribs[ai].name;
|
|
|
1027 |
let attrValue = attribs[ai].value;
|
|
|
1028 |
if (attrName !== 'width' && attrName !== 'height' && attrName !== 'style' && !startsWith(attrName, 'data-mce-')) {
|
|
|
1029 |
if (attrName === 'data' || attrName === 'src') {
|
|
|
1030 |
attrValue = editor.convertURL(attrValue, attrName);
|
|
|
1031 |
}
|
|
|
1032 |
targetNode.attr('data-mce-p-' + attrName, attrValue);
|
|
|
1033 |
}
|
|
|
1034 |
}
|
|
|
1035 |
const serializer = global$1({ inner: true }, editor.schema);
|
|
|
1036 |
const tempNode = new global$2('div', 1);
|
|
|
1037 |
each$1(sourceNode.children(), child => tempNode.append(child));
|
|
|
1038 |
const innerHtml = serializer.serialize(tempNode);
|
|
|
1039 |
if (innerHtml) {
|
|
|
1040 |
targetNode.attr('data-mce-html', escape(innerHtml));
|
|
|
1041 |
targetNode.empty();
|
|
|
1042 |
}
|
|
|
1043 |
};
|
|
|
1044 |
const isPageEmbedWrapper = node => {
|
|
|
1045 |
const nodeClass = node.attr('class');
|
|
|
1046 |
return isString(nodeClass) && /\btiny-pageembed\b/.test(nodeClass);
|
|
|
1047 |
};
|
|
|
1048 |
const isWithinEmbedWrapper = node => {
|
|
|
1049 |
let tempNode = node;
|
|
|
1050 |
while (tempNode = tempNode.parent) {
|
|
|
1051 |
if (tempNode.attr('data-ephox-embed-iri') || isPageEmbedWrapper(tempNode)) {
|
|
|
1052 |
return true;
|
|
|
1053 |
}
|
|
|
1054 |
}
|
|
|
1055 |
return false;
|
|
|
1056 |
};
|
|
|
1057 |
const placeHolderConverter = editor => nodes => {
|
|
|
1058 |
let i = nodes.length;
|
|
|
1059 |
let node;
|
|
|
1060 |
while (i--) {
|
|
|
1061 |
node = nodes[i];
|
|
|
1062 |
if (!node.parent) {
|
|
|
1063 |
continue;
|
|
|
1064 |
}
|
|
|
1065 |
if (node.parent.attr('data-mce-object')) {
|
|
|
1066 |
continue;
|
|
|
1067 |
}
|
|
|
1068 |
if (isLiveEmbedNode(node) && hasLiveEmbeds(editor)) {
|
|
|
1069 |
if (!isWithinEmbedWrapper(node)) {
|
|
|
1070 |
node.replace(createPreviewNode(editor, node));
|
|
|
1071 |
}
|
|
|
1072 |
} else {
|
|
|
1073 |
if (!isWithinEmbedWrapper(node)) {
|
|
|
1074 |
node.replace(createPlaceholderNode(editor, node));
|
|
|
1075 |
}
|
|
|
1076 |
}
|
|
|
1077 |
}
|
|
|
1078 |
};
|
|
|
1079 |
|
|
|
1080 |
const parseAndSanitize = (editor, context, html) => {
|
|
|
1081 |
const getEditorOption = editor.options.get;
|
|
|
1082 |
const sanitize = getEditorOption('xss_sanitization');
|
|
|
1083 |
const validate = shouldFilterHtml(editor);
|
|
|
1084 |
return Parser(editor.schema, {
|
|
|
1085 |
sanitize,
|
|
|
1086 |
validate
|
|
|
1087 |
}).parse(html, { context });
|
|
|
1088 |
};
|
|
|
1089 |
|
|
|
1090 |
const setup$1 = editor => {
|
|
|
1091 |
editor.on('PreInit', () => {
|
|
|
1092 |
const {schema, serializer, parser} = editor;
|
|
|
1093 |
const boolAttrs = schema.getBoolAttrs();
|
|
|
1094 |
each$1('webkitallowfullscreen mozallowfullscreen'.split(' '), name => {
|
|
|
1095 |
boolAttrs[name] = {};
|
|
|
1096 |
});
|
|
|
1097 |
each({ embed: ['wmode'] }, (attrs, name) => {
|
|
|
1098 |
const rule = schema.getElementRule(name);
|
|
|
1099 |
if (rule) {
|
|
|
1100 |
each$1(attrs, attr => {
|
|
|
1101 |
rule.attributes[attr] = {};
|
|
|
1102 |
rule.attributesOrder.push(attr);
|
|
|
1103 |
});
|
|
|
1104 |
}
|
|
|
1105 |
});
|
|
|
1106 |
parser.addNodeFilter('iframe,video,audio,object,embed', placeHolderConverter(editor));
|
|
|
1107 |
serializer.addAttributeFilter('data-mce-object', (nodes, name) => {
|
|
|
1108 |
var _a;
|
|
|
1109 |
let i = nodes.length;
|
|
|
1110 |
while (i--) {
|
|
|
1111 |
const node = nodes[i];
|
|
|
1112 |
if (!node.parent) {
|
|
|
1113 |
continue;
|
|
|
1114 |
}
|
|
|
1115 |
const realElmName = node.attr(name);
|
|
|
1116 |
const realElm = new global$2(realElmName, 1);
|
|
|
1117 |
if (realElmName !== 'audio') {
|
|
|
1118 |
const className = node.attr('class');
|
|
|
1119 |
if (className && className.indexOf('mce-preview-object') !== -1 && node.firstChild) {
|
|
|
1120 |
realElm.attr({
|
|
|
1121 |
width: node.firstChild.attr('width'),
|
|
|
1122 |
height: node.firstChild.attr('height')
|
|
|
1123 |
});
|
|
|
1124 |
} else {
|
|
|
1125 |
realElm.attr({
|
|
|
1126 |
width: node.attr('width'),
|
|
|
1127 |
height: node.attr('height')
|
|
|
1128 |
});
|
|
|
1129 |
}
|
|
|
1130 |
}
|
|
|
1131 |
realElm.attr({ style: node.attr('style') });
|
|
|
1132 |
const attribs = (_a = node.attributes) !== null && _a !== void 0 ? _a : [];
|
|
|
1133 |
let ai = attribs.length;
|
|
|
1134 |
while (ai--) {
|
|
|
1135 |
const attrName = attribs[ai].name;
|
|
|
1136 |
if (attrName.indexOf('data-mce-p-') === 0) {
|
|
|
1137 |
realElm.attr(attrName.substr(11), attribs[ai].value);
|
|
|
1138 |
}
|
|
|
1139 |
}
|
|
|
1140 |
const innerHtml = node.attr('data-mce-html');
|
|
|
1141 |
if (innerHtml) {
|
|
|
1142 |
const fragment = parseAndSanitize(editor, realElmName, unescape(innerHtml));
|
|
|
1143 |
each$1(fragment.children(), child => realElm.append(child));
|
|
|
1144 |
}
|
|
|
1145 |
node.replace(realElm);
|
|
|
1146 |
}
|
|
|
1147 |
});
|
|
|
1148 |
});
|
|
|
1149 |
editor.on('SetContent', () => {
|
|
|
1150 |
const dom = editor.dom;
|
|
|
1151 |
each$1(dom.select('span.mce-preview-object'), elm => {
|
|
|
1152 |
if (dom.select('span.mce-shim', elm).length === 0) {
|
|
|
1153 |
dom.add(elm, 'span', { class: 'mce-shim' });
|
|
|
1154 |
}
|
|
|
1155 |
});
|
|
|
1156 |
});
|
|
|
1157 |
};
|
|
|
1158 |
|
|
|
1159 |
const setup = editor => {
|
|
|
1160 |
editor.on('ResolveName', e => {
|
|
|
1161 |
let name;
|
|
|
1162 |
if (e.target.nodeType === 1 && (name = e.target.getAttribute('data-mce-object'))) {
|
|
|
1163 |
e.name = name;
|
|
|
1164 |
}
|
|
|
1165 |
});
|
|
|
1166 |
};
|
|
|
1167 |
|
|
|
1168 |
const onSetupEditable = editor => api => {
|
|
|
1169 |
const nodeChanged = () => {
|
|
|
1170 |
api.setEnabled(editor.selection.isEditable());
|
|
|
1171 |
};
|
|
|
1172 |
editor.on('NodeChange', nodeChanged);
|
|
|
1173 |
nodeChanged();
|
|
|
1174 |
return () => {
|
|
|
1175 |
editor.off('NodeChange', nodeChanged);
|
|
|
1176 |
};
|
|
|
1177 |
};
|
|
|
1178 |
const register = editor => {
|
|
|
1179 |
const onAction = () => editor.execCommand('mceMedia');
|
|
|
1180 |
editor.ui.registry.addToggleButton('media', {
|
|
|
1181 |
tooltip: 'Insert/edit media',
|
|
|
1182 |
icon: 'embed',
|
|
|
1183 |
onAction,
|
|
|
1184 |
onSetup: buttonApi => {
|
|
|
1185 |
const selection = editor.selection;
|
|
|
1186 |
buttonApi.setActive(isMediaElement(selection.getNode()));
|
|
|
1187 |
const unbindSelectorChanged = selection.selectorChangedWithUnbind('img[data-mce-object],span[data-mce-object],div[data-ephox-embed-iri]', buttonApi.setActive).unbind;
|
|
|
1188 |
const unbindEditable = onSetupEditable(editor)(buttonApi);
|
|
|
1189 |
return () => {
|
|
|
1190 |
unbindSelectorChanged();
|
|
|
1191 |
unbindEditable();
|
|
|
1192 |
};
|
|
|
1193 |
}
|
|
|
1194 |
});
|
|
|
1195 |
editor.ui.registry.addMenuItem('media', {
|
|
|
1196 |
icon: 'embed',
|
|
|
1197 |
text: 'Media...',
|
|
|
1198 |
onAction,
|
|
|
1199 |
onSetup: onSetupEditable(editor)
|
|
|
1200 |
});
|
|
|
1201 |
};
|
|
|
1202 |
|
|
|
1203 |
var Plugin = () => {
|
|
|
1204 |
global$6.add('media', editor => {
|
|
|
1205 |
register$2(editor);
|
|
|
1206 |
register$1(editor);
|
|
|
1207 |
register(editor);
|
|
|
1208 |
setup(editor);
|
|
|
1209 |
setup$1(editor);
|
|
|
1210 |
setup$2(editor);
|
|
|
1211 |
return get(editor);
|
|
|
1212 |
});
|
|
|
1213 |
};
|
|
|
1214 |
|
|
|
1215 |
Plugin();
|
|
|
1216 |
|
|
|
1217 |
})();
|