1 (function () { |
1 (function () { |
2 var image = (function () { |
2 var image = (function (domGlobals) { |
3 'use strict'; |
3 'use strict'; |
4 |
4 |
5 var global = tinymce.util.Tools.resolve('tinymce.PluginManager'); |
5 var global = tinymce.util.Tools.resolve('tinymce.PluginManager'); |
6 |
6 |
7 var hasDimensions = function (editor) { |
7 var hasDimensions = function (editor) { |
8 return editor.settings.image_dimensions === false ? false : true; |
8 return editor.settings.image_dimensions === false ? false : true; |
9 }; |
9 }; |
10 var hasAdvTab = function (editor) { |
10 var hasAdvTab = function (editor) { |
11 return editor.settings.image_advtab === true ? true : false; |
11 return editor.settings.image_advtab === true ? true : false; |
12 }; |
12 }; |
13 var getPrependUrl = function (editor) { |
13 var getPrependUrl = function (editor) { |
14 return editor.getParam('image_prepend_url', ''); |
14 return editor.getParam('image_prepend_url', ''); |
15 }; |
15 }; |
16 var getClassList = function (editor) { |
16 var getClassList = function (editor) { |
17 return editor.getParam('image_class_list'); |
17 return editor.getParam('image_class_list'); |
18 }; |
18 }; |
19 var hasDescription = function (editor) { |
19 var hasDescription = function (editor) { |
20 return editor.settings.image_description === false ? false : true; |
20 return editor.settings.image_description === false ? false : true; |
21 }; |
21 }; |
22 var hasImageTitle = function (editor) { |
22 var hasImageTitle = function (editor) { |
23 return editor.settings.image_title === true ? true : false; |
23 return editor.settings.image_title === true ? true : false; |
24 }; |
24 }; |
25 var hasImageCaption = function (editor) { |
25 var hasImageCaption = function (editor) { |
26 return editor.settings.image_caption === true ? true : false; |
26 return editor.settings.image_caption === true ? true : false; |
27 }; |
27 }; |
28 var getImageList = function (editor) { |
28 var getImageList = function (editor) { |
29 return editor.getParam('image_list', false); |
29 return editor.getParam('image_list', false); |
30 }; |
30 }; |
31 var hasUploadUrl = function (editor) { |
31 var hasUploadUrl = function (editor) { |
32 return editor.getParam('images_upload_url', false); |
32 return editor.getParam('images_upload_url', false); |
33 }; |
33 }; |
34 var hasUploadHandler = function (editor) { |
34 var hasUploadHandler = function (editor) { |
35 return editor.getParam('images_upload_handler', false); |
35 return editor.getParam('images_upload_handler', false); |
36 }; |
36 }; |
37 var getUploadUrl = function (editor) { |
37 var getUploadUrl = function (editor) { |
38 return editor.getParam('images_upload_url'); |
38 return editor.getParam('images_upload_url'); |
39 }; |
39 }; |
40 var getUploadHandler = function (editor) { |
40 var getUploadHandler = function (editor) { |
41 return editor.getParam('images_upload_handler'); |
41 return editor.getParam('images_upload_handler'); |
42 }; |
42 }; |
43 var getUploadBasePath = function (editor) { |
43 var getUploadBasePath = function (editor) { |
44 return editor.getParam('images_upload_base_path'); |
44 return editor.getParam('images_upload_base_path'); |
45 }; |
45 }; |
46 var getUploadCredentials = function (editor) { |
46 var getUploadCredentials = function (editor) { |
47 return editor.getParam('images_upload_credentials'); |
47 return editor.getParam('images_upload_credentials'); |
48 }; |
48 }; |
49 var $_1dn8wtctjjgwebvz = { |
49 var Settings = { |
50 hasDimensions: hasDimensions, |
50 hasDimensions: hasDimensions, |
51 hasAdvTab: hasAdvTab, |
51 hasAdvTab: hasAdvTab, |
52 getPrependUrl: getPrependUrl, |
52 getPrependUrl: getPrependUrl, |
53 getClassList: getClassList, |
53 getClassList: getClassList, |
54 hasDescription: hasDescription, |
54 hasDescription: hasDescription, |
55 hasImageTitle: hasImageTitle, |
55 hasImageTitle: hasImageTitle, |
56 hasImageCaption: hasImageCaption, |
56 hasImageCaption: hasImageCaption, |
57 getImageList: getImageList, |
57 getImageList: getImageList, |
58 hasUploadUrl: hasUploadUrl, |
58 hasUploadUrl: hasUploadUrl, |
59 hasUploadHandler: hasUploadHandler, |
59 hasUploadHandler: hasUploadHandler, |
60 getUploadUrl: getUploadUrl, |
60 getUploadUrl: getUploadUrl, |
61 getUploadHandler: getUploadHandler, |
61 getUploadHandler: getUploadHandler, |
62 getUploadBasePath: getUploadBasePath, |
62 getUploadBasePath: getUploadBasePath, |
63 getUploadCredentials: getUploadCredentials |
63 getUploadCredentials: getUploadCredentials |
64 }; |
64 }; |
65 |
65 |
66 var Global = typeof window !== 'undefined' ? window : Function('return this;')(); |
66 var Global = typeof domGlobals.window !== 'undefined' ? domGlobals.window : Function('return this;')(); |
67 |
67 |
68 var path = function (parts, scope) { |
68 var path = function (parts, scope) { |
69 var o = scope !== undefined && scope !== null ? scope : Global; |
69 var o = scope !== undefined && scope !== null ? scope : Global; |
70 for (var i = 0; i < parts.length && o !== undefined && o !== null; ++i) |
70 for (var i = 0; i < parts.length && o !== undefined && o !== null; ++i) |
71 o = o[parts[i]]; |
71 o = o[parts[i]]; |
72 return o; |
72 return o; |
73 }; |
73 }; |
74 var resolve = function (p, scope) { |
74 var resolve = function (p, scope) { |
75 var parts = p.split('.'); |
75 var parts = p.split('.'); |
76 return path(parts, scope); |
76 return path(parts, scope); |
77 }; |
77 }; |
78 |
78 |
79 var unsafe = function (name, scope) { |
79 var unsafe = function (name, scope) { |
80 return resolve(name, scope); |
80 return resolve(name, scope); |
81 }; |
81 }; |
82 var getOrDie = function (name, scope) { |
82 var getOrDie = function (name, scope) { |
83 var actual = unsafe(name, scope); |
83 var actual = unsafe(name, scope); |
84 if (actual === undefined || actual === null) |
84 if (actual === undefined || actual === null) |
85 throw name + ' not available on this browser'; |
85 throw name + ' not available on this browser'; |
86 return actual; |
86 return actual; |
87 }; |
87 }; |
88 var $_oab1bcwjjgwebwl = { getOrDie: getOrDie }; |
88 var Global$1 = { getOrDie: getOrDie }; |
89 |
89 |
90 function FileReader () { |
90 function FileReader () { |
91 var f = $_oab1bcwjjgwebwl.getOrDie('FileReader'); |
91 var f = Global$1.getOrDie('FileReader'); |
92 return new f(); |
92 return new f(); |
93 } |
93 } |
94 |
94 |
95 var global$1 = tinymce.util.Tools.resolve('tinymce.util.Promise'); |
95 var global$1 = tinymce.util.Tools.resolve('tinymce.util.Promise'); |
96 |
96 |
97 var global$2 = tinymce.util.Tools.resolve('tinymce.util.Tools'); |
97 var global$2 = tinymce.util.Tools.resolve('tinymce.util.Tools'); |
98 |
98 |
99 var global$3 = tinymce.util.Tools.resolve('tinymce.util.XHR'); |
99 var global$3 = tinymce.util.Tools.resolve('tinymce.util.XHR'); |
100 |
100 |
101 var parseIntAndGetMax = function (val1, val2) { |
101 var parseIntAndGetMax = function (val1, val2) { |
102 return Math.max(parseInt(val1, 10), parseInt(val2, 10)); |
102 return Math.max(parseInt(val1, 10), parseInt(val2, 10)); |
103 }; |
103 }; |
104 var getImageSize = function (url, callback) { |
104 var getImageSize = function (url, callback) { |
105 var img = document.createElement('img'); |
105 var img = domGlobals.document.createElement('img'); |
106 function done(width, height) { |
106 function done(width, height) { |
107 if (img.parentNode) { |
107 if (img.parentNode) { |
108 img.parentNode.removeChild(img); |
108 img.parentNode.removeChild(img); |
109 } |
109 } |
110 callback({ |
110 callback({ |
111 width: width, |
111 width: width, |
112 height: height |
112 height: height |
|
113 }); |
|
114 } |
|
115 img.onload = function () { |
|
116 var width = parseIntAndGetMax(img.width, img.clientWidth); |
|
117 var height = parseIntAndGetMax(img.height, img.clientHeight); |
|
118 done(width, height); |
|
119 }; |
|
120 img.onerror = function () { |
|
121 done(0, 0); |
|
122 }; |
|
123 var style = img.style; |
|
124 style.visibility = 'hidden'; |
|
125 style.position = 'fixed'; |
|
126 style.bottom = style.left = '0px'; |
|
127 style.width = style.height = 'auto'; |
|
128 domGlobals.document.body.appendChild(img); |
|
129 img.src = url; |
|
130 }; |
|
131 var buildListItems = function (inputList, itemCallback, startItems) { |
|
132 function appendItems(values, output) { |
|
133 output = output || []; |
|
134 global$2.each(values, function (item) { |
|
135 var menuItem = { text: item.text || item.title }; |
|
136 if (item.menu) { |
|
137 menuItem.menu = appendItems(item.menu); |
|
138 } else { |
|
139 menuItem.value = item.value; |
|
140 itemCallback(menuItem); |
|
141 } |
|
142 output.push(menuItem); |
|
143 }); |
|
144 return output; |
|
145 } |
|
146 return appendItems(inputList, startItems || []); |
|
147 }; |
|
148 var removePixelSuffix = function (value) { |
|
149 if (value) { |
|
150 value = value.replace(/px$/, ''); |
|
151 } |
|
152 return value; |
|
153 }; |
|
154 var addPixelSuffix = function (value) { |
|
155 if (value.length > 0 && /^[0-9]+$/.test(value)) { |
|
156 value += 'px'; |
|
157 } |
|
158 return value; |
|
159 }; |
|
160 var mergeMargins = function (css) { |
|
161 if (css.margin) { |
|
162 var splitMargin = css.margin.split(' '); |
|
163 switch (splitMargin.length) { |
|
164 case 1: |
|
165 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
166 css['margin-right'] = css['margin-right'] || splitMargin[0]; |
|
167 css['margin-bottom'] = css['margin-bottom'] || splitMargin[0]; |
|
168 css['margin-left'] = css['margin-left'] || splitMargin[0]; |
|
169 break; |
|
170 case 2: |
|
171 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
172 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
173 css['margin-bottom'] = css['margin-bottom'] || splitMargin[0]; |
|
174 css['margin-left'] = css['margin-left'] || splitMargin[1]; |
|
175 break; |
|
176 case 3: |
|
177 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
178 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
179 css['margin-bottom'] = css['margin-bottom'] || splitMargin[2]; |
|
180 css['margin-left'] = css['margin-left'] || splitMargin[1]; |
|
181 break; |
|
182 case 4: |
|
183 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
184 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
185 css['margin-bottom'] = css['margin-bottom'] || splitMargin[2]; |
|
186 css['margin-left'] = css['margin-left'] || splitMargin[3]; |
|
187 } |
|
188 delete css.margin; |
|
189 } |
|
190 return css; |
|
191 }; |
|
192 var createImageList = function (editor, callback) { |
|
193 var imageList = Settings.getImageList(editor); |
|
194 if (typeof imageList === 'string') { |
|
195 global$3.send({ |
|
196 url: imageList, |
|
197 success: function (text) { |
|
198 callback(JSON.parse(text)); |
|
199 } |
|
200 }); |
|
201 } else if (typeof imageList === 'function') { |
|
202 imageList(callback); |
|
203 } else { |
|
204 callback(imageList); |
|
205 } |
|
206 }; |
|
207 var waitLoadImage = function (editor, data, imgElm) { |
|
208 function selectImage() { |
|
209 imgElm.onload = imgElm.onerror = null; |
|
210 if (editor.selection) { |
|
211 editor.selection.select(imgElm); |
|
212 editor.nodeChanged(); |
|
213 } |
|
214 } |
|
215 imgElm.onload = function () { |
|
216 if (!data.width && !data.height && Settings.hasDimensions(editor)) { |
|
217 editor.dom.setAttribs(imgElm, { |
|
218 width: imgElm.clientWidth, |
|
219 height: imgElm.clientHeight |
|
220 }); |
|
221 } |
|
222 selectImage(); |
|
223 }; |
|
224 imgElm.onerror = selectImage; |
|
225 }; |
|
226 var blobToDataUri = function (blob) { |
|
227 return new global$1(function (resolve, reject) { |
|
228 var reader = FileReader(); |
|
229 reader.onload = function () { |
|
230 resolve(reader.result); |
|
231 }; |
|
232 reader.onerror = function () { |
|
233 reject(reader.error.message); |
|
234 }; |
|
235 reader.readAsDataURL(blob); |
113 }); |
236 }); |
|
237 }; |
|
238 var Utils = { |
|
239 getImageSize: getImageSize, |
|
240 buildListItems: buildListItems, |
|
241 removePixelSuffix: removePixelSuffix, |
|
242 addPixelSuffix: addPixelSuffix, |
|
243 mergeMargins: mergeMargins, |
|
244 createImageList: createImageList, |
|
245 waitLoadImage: waitLoadImage, |
|
246 blobToDataUri: blobToDataUri |
|
247 }; |
|
248 |
|
249 var global$4 = tinymce.util.Tools.resolve('tinymce.dom.DOMUtils'); |
|
250 |
|
251 var hasOwnProperty = Object.prototype.hasOwnProperty; |
|
252 var shallow = function (old, nu) { |
|
253 return nu; |
|
254 }; |
|
255 var baseMerge = function (merger) { |
|
256 return function () { |
|
257 var objects = new Array(arguments.length); |
|
258 for (var i = 0; i < objects.length; i++) |
|
259 objects[i] = arguments[i]; |
|
260 if (objects.length === 0) |
|
261 throw new Error('Can\'t merge zero objects'); |
|
262 var ret = {}; |
|
263 for (var j = 0; j < objects.length; j++) { |
|
264 var curObject = objects[j]; |
|
265 for (var key in curObject) |
|
266 if (hasOwnProperty.call(curObject, key)) { |
|
267 ret[key] = merger(ret[key], curObject[key]); |
|
268 } |
|
269 } |
|
270 return ret; |
|
271 }; |
|
272 }; |
|
273 var merge = baseMerge(shallow); |
|
274 |
|
275 var DOM = global$4.DOM; |
|
276 var getHspace = function (image) { |
|
277 if (image.style.marginLeft && image.style.marginRight && image.style.marginLeft === image.style.marginRight) { |
|
278 return Utils.removePixelSuffix(image.style.marginLeft); |
|
279 } else { |
|
280 return ''; |
|
281 } |
|
282 }; |
|
283 var getVspace = function (image) { |
|
284 if (image.style.marginTop && image.style.marginBottom && image.style.marginTop === image.style.marginBottom) { |
|
285 return Utils.removePixelSuffix(image.style.marginTop); |
|
286 } else { |
|
287 return ''; |
|
288 } |
|
289 }; |
|
290 var getBorder = function (image) { |
|
291 if (image.style.borderWidth) { |
|
292 return Utils.removePixelSuffix(image.style.borderWidth); |
|
293 } else { |
|
294 return ''; |
|
295 } |
|
296 }; |
|
297 var getAttrib = function (image, name) { |
|
298 if (image.hasAttribute(name)) { |
|
299 return image.getAttribute(name); |
|
300 } else { |
|
301 return ''; |
|
302 } |
|
303 }; |
|
304 var getStyle = function (image, name) { |
|
305 return image.style[name] ? image.style[name] : ''; |
|
306 }; |
|
307 var hasCaption = function (image) { |
|
308 return image.parentNode !== null && image.parentNode.nodeName === 'FIGURE'; |
|
309 }; |
|
310 var setAttrib = function (image, name, value) { |
|
311 image.setAttribute(name, value); |
|
312 }; |
|
313 var wrapInFigure = function (image) { |
|
314 var figureElm = DOM.create('figure', { class: 'image' }); |
|
315 DOM.insertAfter(figureElm, image); |
|
316 figureElm.appendChild(image); |
|
317 figureElm.appendChild(DOM.create('figcaption', { contentEditable: true }, 'Caption')); |
|
318 figureElm.contentEditable = 'false'; |
|
319 }; |
|
320 var removeFigure = function (image) { |
|
321 var figureElm = image.parentNode; |
|
322 DOM.insertAfter(image, figureElm); |
|
323 DOM.remove(figureElm); |
|
324 }; |
|
325 var toggleCaption = function (image) { |
|
326 if (hasCaption(image)) { |
|
327 removeFigure(image); |
|
328 } else { |
|
329 wrapInFigure(image); |
|
330 } |
|
331 }; |
|
332 var normalizeStyle = function (image, normalizeCss) { |
|
333 var attrValue = image.getAttribute('style'); |
|
334 var value = normalizeCss(attrValue !== null ? attrValue : ''); |
|
335 if (value.length > 0) { |
|
336 image.setAttribute('style', value); |
|
337 image.setAttribute('data-mce-style', value); |
|
338 } else { |
|
339 image.removeAttribute('style'); |
|
340 } |
|
341 }; |
|
342 var setSize = function (name, normalizeCss) { |
|
343 return function (image, name, value) { |
|
344 if (image.style[name]) { |
|
345 image.style[name] = Utils.addPixelSuffix(value); |
|
346 normalizeStyle(image, normalizeCss); |
|
347 } else { |
|
348 setAttrib(image, name, value); |
|
349 } |
|
350 }; |
|
351 }; |
|
352 var getSize = function (image, name) { |
|
353 if (image.style[name]) { |
|
354 return Utils.removePixelSuffix(image.style[name]); |
|
355 } else { |
|
356 return getAttrib(image, name); |
|
357 } |
|
358 }; |
|
359 var setHspace = function (image, value) { |
|
360 var pxValue = Utils.addPixelSuffix(value); |
|
361 image.style.marginLeft = pxValue; |
|
362 image.style.marginRight = pxValue; |
|
363 }; |
|
364 var setVspace = function (image, value) { |
|
365 var pxValue = Utils.addPixelSuffix(value); |
|
366 image.style.marginTop = pxValue; |
|
367 image.style.marginBottom = pxValue; |
|
368 }; |
|
369 var setBorder = function (image, value) { |
|
370 var pxValue = Utils.addPixelSuffix(value); |
|
371 image.style.borderWidth = pxValue; |
|
372 }; |
|
373 var setBorderStyle = function (image, value) { |
|
374 image.style.borderStyle = value; |
|
375 }; |
|
376 var getBorderStyle = function (image) { |
|
377 return getStyle(image, 'borderStyle'); |
|
378 }; |
|
379 var isFigure = function (elm) { |
|
380 return elm.nodeName === 'FIGURE'; |
|
381 }; |
|
382 var defaultData = function () { |
|
383 return { |
|
384 src: '', |
|
385 alt: '', |
|
386 title: '', |
|
387 width: '', |
|
388 height: '', |
|
389 class: '', |
|
390 style: '', |
|
391 caption: false, |
|
392 hspace: '', |
|
393 vspace: '', |
|
394 border: '', |
|
395 borderStyle: '' |
|
396 }; |
|
397 }; |
|
398 var getStyleValue = function (normalizeCss, data) { |
|
399 var image = domGlobals.document.createElement('img'); |
|
400 setAttrib(image, 'style', data.style); |
|
401 if (getHspace(image) || data.hspace !== '') { |
|
402 setHspace(image, data.hspace); |
|
403 } |
|
404 if (getVspace(image) || data.vspace !== '') { |
|
405 setVspace(image, data.vspace); |
|
406 } |
|
407 if (getBorder(image) || data.border !== '') { |
|
408 setBorder(image, data.border); |
|
409 } |
|
410 if (getBorderStyle(image) || data.borderStyle !== '') { |
|
411 setBorderStyle(image, data.borderStyle); |
|
412 } |
|
413 return normalizeCss(image.getAttribute('style')); |
|
414 }; |
|
415 var create = function (normalizeCss, data) { |
|
416 var image = domGlobals.document.createElement('img'); |
|
417 write(normalizeCss, merge(data, { caption: false }), image); |
|
418 setAttrib(image, 'alt', data.alt); |
|
419 if (data.caption) { |
|
420 var figure = DOM.create('figure', { class: 'image' }); |
|
421 figure.appendChild(image); |
|
422 figure.appendChild(DOM.create('figcaption', { contentEditable: true }, 'Caption')); |
|
423 figure.contentEditable = 'false'; |
|
424 return figure; |
|
425 } else { |
|
426 return image; |
|
427 } |
|
428 }; |
|
429 var read = function (normalizeCss, image) { |
|
430 return { |
|
431 src: getAttrib(image, 'src'), |
|
432 alt: getAttrib(image, 'alt'), |
|
433 title: getAttrib(image, 'title'), |
|
434 width: getSize(image, 'width'), |
|
435 height: getSize(image, 'height'), |
|
436 class: getAttrib(image, 'class'), |
|
437 style: normalizeCss(getAttrib(image, 'style')), |
|
438 caption: hasCaption(image), |
|
439 hspace: getHspace(image), |
|
440 vspace: getVspace(image), |
|
441 border: getBorder(image), |
|
442 borderStyle: getStyle(image, 'borderStyle') |
|
443 }; |
|
444 }; |
|
445 var updateProp = function (image, oldData, newData, name, set) { |
|
446 if (newData[name] !== oldData[name]) { |
|
447 set(image, name, newData[name]); |
|
448 } |
|
449 }; |
|
450 var normalized = function (set, normalizeCss) { |
|
451 return function (image, name, value) { |
|
452 set(image, value); |
|
453 normalizeStyle(image, normalizeCss); |
|
454 }; |
|
455 }; |
|
456 var write = function (normalizeCss, newData, image) { |
|
457 var oldData = read(normalizeCss, image); |
|
458 updateProp(image, oldData, newData, 'caption', function (image, _name, _value) { |
|
459 return toggleCaption(image); |
|
460 }); |
|
461 updateProp(image, oldData, newData, 'src', setAttrib); |
|
462 updateProp(image, oldData, newData, 'alt', setAttrib); |
|
463 updateProp(image, oldData, newData, 'title', setAttrib); |
|
464 updateProp(image, oldData, newData, 'width', setSize('width', normalizeCss)); |
|
465 updateProp(image, oldData, newData, 'height', setSize('height', normalizeCss)); |
|
466 updateProp(image, oldData, newData, 'class', setAttrib); |
|
467 updateProp(image, oldData, newData, 'style', normalized(function (image, value) { |
|
468 return setAttrib(image, 'style', value); |
|
469 }, normalizeCss)); |
|
470 updateProp(image, oldData, newData, 'hspace', normalized(setHspace, normalizeCss)); |
|
471 updateProp(image, oldData, newData, 'vspace', normalized(setVspace, normalizeCss)); |
|
472 updateProp(image, oldData, newData, 'border', normalized(setBorder, normalizeCss)); |
|
473 updateProp(image, oldData, newData, 'borderStyle', normalized(setBorderStyle, normalizeCss)); |
|
474 }; |
|
475 |
|
476 var normalizeCss = function (editor, cssText) { |
|
477 var css = editor.dom.styles.parse(cssText); |
|
478 var mergedCss = Utils.mergeMargins(css); |
|
479 var compressed = editor.dom.styles.parse(editor.dom.styles.serialize(mergedCss)); |
|
480 return editor.dom.styles.serialize(compressed); |
|
481 }; |
|
482 var getSelectedImage = function (editor) { |
|
483 var imgElm = editor.selection.getNode(); |
|
484 var figureElm = editor.dom.getParent(imgElm, 'figure.image'); |
|
485 if (figureElm) { |
|
486 return editor.dom.select('img', figureElm)[0]; |
|
487 } |
|
488 if (imgElm && (imgElm.nodeName !== 'IMG' || imgElm.getAttribute('data-mce-object') || imgElm.getAttribute('data-mce-placeholder'))) { |
|
489 return null; |
|
490 } |
|
491 return imgElm; |
|
492 }; |
|
493 var splitTextBlock = function (editor, figure) { |
|
494 var dom = editor.dom; |
|
495 var textBlock = dom.getParent(figure.parentNode, function (node) { |
|
496 return editor.schema.getTextBlockElements()[node.nodeName]; |
|
497 }, editor.getBody()); |
|
498 if (textBlock) { |
|
499 return dom.split(textBlock, figure); |
|
500 } else { |
|
501 return figure; |
|
502 } |
|
503 }; |
|
504 var readImageDataFromSelection = function (editor) { |
|
505 var image = getSelectedImage(editor); |
|
506 return image ? read(function (css) { |
|
507 return normalizeCss(editor, css); |
|
508 }, image) : defaultData(); |
|
509 }; |
|
510 var insertImageAtCaret = function (editor, data) { |
|
511 var elm = create(function (css) { |
|
512 return normalizeCss(editor, css); |
|
513 }, data); |
|
514 editor.dom.setAttrib(elm, 'data-mce-id', '__mcenew'); |
|
515 editor.focus(); |
|
516 editor.selection.setContent(elm.outerHTML); |
|
517 var insertedElm = editor.dom.select('*[data-mce-id="__mcenew"]')[0]; |
|
518 editor.dom.setAttrib(insertedElm, 'data-mce-id', null); |
|
519 if (isFigure(insertedElm)) { |
|
520 var figure = splitTextBlock(editor, insertedElm); |
|
521 editor.selection.select(figure); |
|
522 } else { |
|
523 editor.selection.select(insertedElm); |
|
524 } |
|
525 }; |
|
526 var syncSrcAttr = function (editor, image) { |
|
527 editor.dom.setAttrib(image, 'src', image.getAttribute('src')); |
|
528 }; |
|
529 var deleteImage = function (editor, image) { |
|
530 if (image) { |
|
531 var elm = editor.dom.is(image.parentNode, 'figure.image') ? image.parentNode : image; |
|
532 editor.dom.remove(elm); |
|
533 editor.focus(); |
|
534 editor.nodeChanged(); |
|
535 if (editor.dom.isEmpty(editor.getBody())) { |
|
536 editor.setContent(''); |
|
537 editor.selection.setCursorLocation(); |
|
538 } |
|
539 } |
|
540 }; |
|
541 var writeImageDataToSelection = function (editor, data) { |
|
542 var image = getSelectedImage(editor); |
|
543 write(function (css) { |
|
544 return normalizeCss(editor, css); |
|
545 }, data, image); |
|
546 syncSrcAttr(editor, image); |
|
547 if (isFigure(image.parentNode)) { |
|
548 var figure = image.parentNode; |
|
549 splitTextBlock(editor, figure); |
|
550 editor.selection.select(image.parentNode); |
|
551 } else { |
|
552 editor.selection.select(image); |
|
553 Utils.waitLoadImage(editor, data, image); |
|
554 } |
|
555 }; |
|
556 var insertOrUpdateImage = function (editor, data) { |
|
557 var image = getSelectedImage(editor); |
|
558 if (image) { |
|
559 if (data.src) { |
|
560 writeImageDataToSelection(editor, data); |
|
561 } else { |
|
562 deleteImage(editor, image); |
|
563 } |
|
564 } else if (data.src) { |
|
565 insertImageAtCaret(editor, data); |
|
566 } |
|
567 }; |
|
568 |
|
569 var updateVSpaceHSpaceBorder = function (editor) { |
|
570 return function (evt) { |
|
571 var dom = editor.dom; |
|
572 var rootControl = evt.control.rootControl; |
|
573 if (!Settings.hasAdvTab(editor)) { |
|
574 return; |
|
575 } |
|
576 var data = rootControl.toJSON(); |
|
577 var css = dom.parseStyle(data.style); |
|
578 rootControl.find('#vspace').value(''); |
|
579 rootControl.find('#hspace').value(''); |
|
580 css = Utils.mergeMargins(css); |
|
581 if (css['margin-top'] && css['margin-bottom'] || css['margin-right'] && css['margin-left']) { |
|
582 if (css['margin-top'] === css['margin-bottom']) { |
|
583 rootControl.find('#vspace').value(Utils.removePixelSuffix(css['margin-top'])); |
|
584 } else { |
|
585 rootControl.find('#vspace').value(''); |
|
586 } |
|
587 if (css['margin-right'] === css['margin-left']) { |
|
588 rootControl.find('#hspace').value(Utils.removePixelSuffix(css['margin-right'])); |
|
589 } else { |
|
590 rootControl.find('#hspace').value(''); |
|
591 } |
|
592 } |
|
593 if (css['border-width']) { |
|
594 rootControl.find('#border').value(Utils.removePixelSuffix(css['border-width'])); |
|
595 } else { |
|
596 rootControl.find('#border').value(''); |
|
597 } |
|
598 if (css['border-style']) { |
|
599 rootControl.find('#borderStyle').value(css['border-style']); |
|
600 } else { |
|
601 rootControl.find('#borderStyle').value(''); |
|
602 } |
|
603 rootControl.find('#style').value(dom.serializeStyle(dom.parseStyle(dom.serializeStyle(css)))); |
|
604 }; |
|
605 }; |
|
606 var updateStyle = function (editor, win) { |
|
607 win.find('#style').each(function (ctrl) { |
|
608 var value = getStyleValue(function (css) { |
|
609 return normalizeCss(editor, css); |
|
610 }, merge(defaultData(), win.toJSON())); |
|
611 ctrl.value(value); |
|
612 }); |
|
613 }; |
|
614 var makeTab = function (editor) { |
|
615 return { |
|
616 title: 'Advanced', |
|
617 type: 'form', |
|
618 pack: 'start', |
|
619 items: [ |
|
620 { |
|
621 label: 'Style', |
|
622 name: 'style', |
|
623 type: 'textbox', |
|
624 onchange: updateVSpaceHSpaceBorder(editor) |
|
625 }, |
|
626 { |
|
627 type: 'form', |
|
628 layout: 'grid', |
|
629 packV: 'start', |
|
630 columns: 2, |
|
631 padding: 0, |
|
632 defaults: { |
|
633 type: 'textbox', |
|
634 maxWidth: 50, |
|
635 onchange: function (evt) { |
|
636 updateStyle(editor, evt.control.rootControl); |
|
637 } |
|
638 }, |
|
639 items: [ |
|
640 { |
|
641 label: 'Vertical space', |
|
642 name: 'vspace' |
|
643 }, |
|
644 { |
|
645 label: 'Border width', |
|
646 name: 'border' |
|
647 }, |
|
648 { |
|
649 label: 'Horizontal space', |
|
650 name: 'hspace' |
|
651 }, |
|
652 { |
|
653 label: 'Border style', |
|
654 type: 'listbox', |
|
655 name: 'borderStyle', |
|
656 width: 90, |
|
657 maxWidth: 90, |
|
658 onselect: function (evt) { |
|
659 updateStyle(editor, evt.control.rootControl); |
|
660 }, |
|
661 values: [ |
|
662 { |
|
663 text: 'Select...', |
|
664 value: '' |
|
665 }, |
|
666 { |
|
667 text: 'Solid', |
|
668 value: 'solid' |
|
669 }, |
|
670 { |
|
671 text: 'Dotted', |
|
672 value: 'dotted' |
|
673 }, |
|
674 { |
|
675 text: 'Dashed', |
|
676 value: 'dashed' |
|
677 }, |
|
678 { |
|
679 text: 'Double', |
|
680 value: 'double' |
|
681 }, |
|
682 { |
|
683 text: 'Groove', |
|
684 value: 'groove' |
|
685 }, |
|
686 { |
|
687 text: 'Ridge', |
|
688 value: 'ridge' |
|
689 }, |
|
690 { |
|
691 text: 'Inset', |
|
692 value: 'inset' |
|
693 }, |
|
694 { |
|
695 text: 'Outset', |
|
696 value: 'outset' |
|
697 }, |
|
698 { |
|
699 text: 'None', |
|
700 value: 'none' |
|
701 }, |
|
702 { |
|
703 text: 'Hidden', |
|
704 value: 'hidden' |
|
705 } |
|
706 ] |
|
707 } |
|
708 ] |
|
709 } |
|
710 ] |
|
711 }; |
|
712 }; |
|
713 var AdvTab = { makeTab: makeTab }; |
|
714 |
|
715 var doSyncSize = function (widthCtrl, heightCtrl) { |
|
716 widthCtrl.state.set('oldVal', widthCtrl.value()); |
|
717 heightCtrl.state.set('oldVal', heightCtrl.value()); |
|
718 }; |
|
719 var doSizeControls = function (win, f) { |
|
720 var widthCtrl = win.find('#width')[0]; |
|
721 var heightCtrl = win.find('#height')[0]; |
|
722 var constrained = win.find('#constrain')[0]; |
|
723 if (widthCtrl && heightCtrl && constrained) { |
|
724 f(widthCtrl, heightCtrl, constrained.checked()); |
|
725 } |
|
726 }; |
|
727 var doUpdateSize = function (widthCtrl, heightCtrl, isContrained) { |
|
728 var oldWidth = widthCtrl.state.get('oldVal'); |
|
729 var oldHeight = heightCtrl.state.get('oldVal'); |
|
730 var newWidth = widthCtrl.value(); |
|
731 var newHeight = heightCtrl.value(); |
|
732 if (isContrained && oldWidth && oldHeight && newWidth && newHeight) { |
|
733 if (newWidth !== oldWidth) { |
|
734 newHeight = Math.round(newWidth / oldWidth * newHeight); |
|
735 if (!isNaN(newHeight)) { |
|
736 heightCtrl.value(newHeight); |
|
737 } |
|
738 } else { |
|
739 newWidth = Math.round(newHeight / oldHeight * newWidth); |
|
740 if (!isNaN(newWidth)) { |
|
741 widthCtrl.value(newWidth); |
|
742 } |
|
743 } |
|
744 } |
|
745 doSyncSize(widthCtrl, heightCtrl); |
|
746 }; |
|
747 var syncSize = function (win) { |
|
748 doSizeControls(win, doSyncSize); |
|
749 }; |
|
750 var updateSize = function (win) { |
|
751 doSizeControls(win, doUpdateSize); |
|
752 }; |
|
753 var createUi = function () { |
|
754 var recalcSize = function (evt) { |
|
755 updateSize(evt.control.rootControl); |
|
756 }; |
|
757 return { |
|
758 type: 'container', |
|
759 label: 'Dimensions', |
|
760 layout: 'flex', |
|
761 align: 'center', |
|
762 spacing: 5, |
|
763 items: [ |
|
764 { |
|
765 name: 'width', |
|
766 type: 'textbox', |
|
767 maxLength: 5, |
|
768 size: 5, |
|
769 onchange: recalcSize, |
|
770 ariaLabel: 'Width' |
|
771 }, |
|
772 { |
|
773 type: 'label', |
|
774 text: 'x' |
|
775 }, |
|
776 { |
|
777 name: 'height', |
|
778 type: 'textbox', |
|
779 maxLength: 5, |
|
780 size: 5, |
|
781 onchange: recalcSize, |
|
782 ariaLabel: 'Height' |
|
783 }, |
|
784 { |
|
785 name: 'constrain', |
|
786 type: 'checkbox', |
|
787 checked: true, |
|
788 text: 'Constrain proportions' |
|
789 } |
|
790 ] |
|
791 }; |
|
792 }; |
|
793 var SizeManager = { |
|
794 createUi: createUi, |
|
795 syncSize: syncSize, |
|
796 updateSize: updateSize |
|
797 }; |
|
798 |
|
799 var onSrcChange = function (evt, editor) { |
|
800 var srcURL, prependURL, absoluteURLPattern; |
|
801 var meta = evt.meta || {}; |
|
802 var control = evt.control; |
|
803 var rootControl = control.rootControl; |
|
804 var imageListCtrl = rootControl.find('#image-list')[0]; |
|
805 if (imageListCtrl) { |
|
806 imageListCtrl.value(editor.convertURL(control.value(), 'src')); |
|
807 } |
|
808 global$2.each(meta, function (value, key) { |
|
809 rootControl.find('#' + key).value(value); |
|
810 }); |
|
811 if (!meta.width && !meta.height) { |
|
812 srcURL = editor.convertURL(control.value(), 'src'); |
|
813 prependURL = Settings.getPrependUrl(editor); |
|
814 absoluteURLPattern = new RegExp('^(?:[a-z]+:)?//', 'i'); |
|
815 if (prependURL && !absoluteURLPattern.test(srcURL) && srcURL.substring(0, prependURL.length) !== prependURL) { |
|
816 srcURL = prependURL + srcURL; |
|
817 } |
|
818 control.value(srcURL); |
|
819 Utils.getImageSize(editor.documentBaseURI.toAbsolute(control.value()), function (data) { |
|
820 if (data.width && data.height && Settings.hasDimensions(editor)) { |
|
821 rootControl.find('#width').value(data.width); |
|
822 rootControl.find('#height').value(data.height); |
|
823 SizeManager.syncSize(rootControl); |
|
824 } |
|
825 }); |
|
826 } |
|
827 }; |
|
828 var onBeforeCall = function (evt) { |
|
829 evt.meta = evt.control.rootControl.toJSON(); |
|
830 }; |
|
831 var getGeneralItems = function (editor, imageListCtrl) { |
|
832 var generalFormItems = [ |
|
833 { |
|
834 name: 'src', |
|
835 type: 'filepicker', |
|
836 filetype: 'image', |
|
837 label: 'Source', |
|
838 autofocus: true, |
|
839 onchange: function (evt) { |
|
840 onSrcChange(evt, editor); |
|
841 }, |
|
842 onbeforecall: onBeforeCall |
|
843 }, |
|
844 imageListCtrl |
|
845 ]; |
|
846 if (Settings.hasDescription(editor)) { |
|
847 generalFormItems.push({ |
|
848 name: 'alt', |
|
849 type: 'textbox', |
|
850 label: 'Image description' |
|
851 }); |
|
852 } |
|
853 if (Settings.hasImageTitle(editor)) { |
|
854 generalFormItems.push({ |
|
855 name: 'title', |
|
856 type: 'textbox', |
|
857 label: 'Image Title' |
|
858 }); |
|
859 } |
|
860 if (Settings.hasDimensions(editor)) { |
|
861 generalFormItems.push(SizeManager.createUi()); |
|
862 } |
|
863 if (Settings.getClassList(editor)) { |
|
864 generalFormItems.push({ |
|
865 name: 'class', |
|
866 type: 'listbox', |
|
867 label: 'Class', |
|
868 values: Utils.buildListItems(Settings.getClassList(editor), function (item) { |
|
869 if (item.value) { |
|
870 item.textStyle = function () { |
|
871 return editor.formatter.getCssText({ |
|
872 inline: 'img', |
|
873 classes: [item.value] |
|
874 }); |
|
875 }; |
|
876 } |
|
877 }) |
|
878 }); |
|
879 } |
|
880 if (Settings.hasImageCaption(editor)) { |
|
881 generalFormItems.push({ |
|
882 name: 'caption', |
|
883 type: 'checkbox', |
|
884 label: 'Caption' |
|
885 }); |
|
886 } |
|
887 return generalFormItems; |
|
888 }; |
|
889 var makeTab$1 = function (editor, imageListCtrl) { |
|
890 return { |
|
891 title: 'General', |
|
892 type: 'form', |
|
893 items: getGeneralItems(editor, imageListCtrl) |
|
894 }; |
|
895 }; |
|
896 var MainTab = { |
|
897 makeTab: makeTab$1, |
|
898 getGeneralItems: getGeneralItems |
|
899 }; |
|
900 |
|
901 var url = function () { |
|
902 return Global$1.getOrDie('URL'); |
|
903 }; |
|
904 var createObjectURL = function (blob) { |
|
905 return url().createObjectURL(blob); |
|
906 }; |
|
907 var revokeObjectURL = function (u) { |
|
908 url().revokeObjectURL(u); |
|
909 }; |
|
910 var URL = { |
|
911 createObjectURL: createObjectURL, |
|
912 revokeObjectURL: revokeObjectURL |
|
913 }; |
|
914 |
|
915 var global$5 = tinymce.util.Tools.resolve('tinymce.ui.Factory'); |
|
916 |
|
917 function XMLHttpRequest () { |
|
918 var f = Global$1.getOrDie('XMLHttpRequest'); |
|
919 return new f(); |
114 } |
920 } |
115 img.onload = function () { |
921 |
116 var width = parseIntAndGetMax(img.width, img.clientWidth); |
922 var noop = function () { |
117 var height = parseIntAndGetMax(img.height, img.clientHeight); |
923 }; |
118 done(width, height); |
924 var pathJoin = function (path1, path2) { |
119 }; |
925 if (path1) { |
120 img.onerror = function () { |
926 return path1.replace(/\/$/, '') + '/' + path2.replace(/^\//, ''); |
121 done(0, 0); |
927 } |
122 }; |
928 return path2; |
123 var style = img.style; |
929 }; |
124 style.visibility = 'hidden'; |
930 function Uploader (settings) { |
125 style.position = 'fixed'; |
931 var defaultHandler = function (blobInfo, success, failure, progress) { |
126 style.bottom = style.left = '0px'; |
932 var xhr, formData; |
127 style.width = style.height = 'auto'; |
933 xhr = XMLHttpRequest(); |
128 document.body.appendChild(img); |
934 xhr.open('POST', settings.url); |
129 img.src = url; |
935 xhr.withCredentials = settings.credentials; |
130 }; |
936 xhr.upload.onprogress = function (e) { |
131 var buildListItems = function (inputList, itemCallback, startItems) { |
937 progress(e.loaded / e.total * 100); |
132 function appendItems(values, output) { |
938 }; |
133 output = output || []; |
939 xhr.onerror = function () { |
134 global$2.each(values, function (item) { |
940 failure('Image upload failed due to a XHR Transport error. Code: ' + xhr.status); |
135 var menuItem = { text: item.text || item.title }; |
941 }; |
136 if (item.menu) { |
942 xhr.onload = function () { |
137 menuItem.menu = appendItems(item.menu); |
943 var json; |
|
944 if (xhr.status < 200 || xhr.status >= 300) { |
|
945 failure('HTTP Error: ' + xhr.status); |
|
946 return; |
|
947 } |
|
948 json = JSON.parse(xhr.responseText); |
|
949 if (!json || typeof json.location !== 'string') { |
|
950 failure('Invalid JSON: ' + xhr.responseText); |
|
951 return; |
|
952 } |
|
953 success(pathJoin(settings.basePath, json.location)); |
|
954 }; |
|
955 formData = new domGlobals.FormData(); |
|
956 formData.append('file', blobInfo.blob(), blobInfo.filename()); |
|
957 xhr.send(formData); |
|
958 }; |
|
959 var uploadBlob = function (blobInfo, handler) { |
|
960 return new global$1(function (resolve, reject) { |
|
961 try { |
|
962 handler(blobInfo, resolve, reject, noop); |
|
963 } catch (ex) { |
|
964 reject(ex.message); |
|
965 } |
|
966 }); |
|
967 }; |
|
968 var isDefaultHandler = function (handler) { |
|
969 return handler === defaultHandler; |
|
970 }; |
|
971 var upload = function (blobInfo) { |
|
972 return !settings.url && isDefaultHandler(settings.handler) ? global$1.reject('Upload url missing from the settings.') : uploadBlob(blobInfo, settings.handler); |
|
973 }; |
|
974 settings = global$2.extend({ |
|
975 credentials: false, |
|
976 handler: defaultHandler |
|
977 }, settings); |
|
978 return { upload: upload }; |
|
979 } |
|
980 |
|
981 var onFileInput = function (editor) { |
|
982 return function (evt) { |
|
983 var Throbber = global$5.get('Throbber'); |
|
984 var rootControl = evt.control.rootControl; |
|
985 var throbber = new Throbber(rootControl.getEl()); |
|
986 var file = evt.control.value(); |
|
987 var blobUri = URL.createObjectURL(file); |
|
988 var uploader = Uploader({ |
|
989 url: Settings.getUploadUrl(editor), |
|
990 basePath: Settings.getUploadBasePath(editor), |
|
991 credentials: Settings.getUploadCredentials(editor), |
|
992 handler: Settings.getUploadHandler(editor) |
|
993 }); |
|
994 var finalize = function () { |
|
995 throbber.hide(); |
|
996 URL.revokeObjectURL(blobUri); |
|
997 }; |
|
998 throbber.show(); |
|
999 return Utils.blobToDataUri(file).then(function (dataUrl) { |
|
1000 var blobInfo = editor.editorUpload.blobCache.create({ |
|
1001 blob: file, |
|
1002 blobUri: blobUri, |
|
1003 name: file.name ? file.name.replace(/\.[^\.]+$/, '') : null, |
|
1004 base64: dataUrl.split(',')[1] |
|
1005 }); |
|
1006 return uploader.upload(blobInfo).then(function (url) { |
|
1007 var src = rootControl.find('#src'); |
|
1008 src.value(url); |
|
1009 rootControl.find('tabpanel')[0].activateTab(0); |
|
1010 src.fire('change'); |
|
1011 finalize(); |
|
1012 return url; |
|
1013 }); |
|
1014 }).catch(function (err) { |
|
1015 editor.windowManager.alert(err); |
|
1016 finalize(); |
|
1017 }); |
|
1018 }; |
|
1019 }; |
|
1020 var acceptExts = '.jpg,.jpeg,.png,.gif'; |
|
1021 var makeTab$2 = function (editor) { |
|
1022 return { |
|
1023 title: 'Upload', |
|
1024 type: 'form', |
|
1025 layout: 'flex', |
|
1026 direction: 'column', |
|
1027 align: 'stretch', |
|
1028 padding: '20 20 20 20', |
|
1029 items: [ |
|
1030 { |
|
1031 type: 'container', |
|
1032 layout: 'flex', |
|
1033 direction: 'column', |
|
1034 align: 'center', |
|
1035 spacing: 10, |
|
1036 items: [ |
|
1037 { |
|
1038 text: 'Browse for an image', |
|
1039 type: 'browsebutton', |
|
1040 accept: acceptExts, |
|
1041 onchange: onFileInput(editor) |
|
1042 }, |
|
1043 { |
|
1044 text: 'OR', |
|
1045 type: 'label' |
|
1046 } |
|
1047 ] |
|
1048 }, |
|
1049 { |
|
1050 text: 'Drop an image here', |
|
1051 type: 'dropzone', |
|
1052 accept: acceptExts, |
|
1053 height: 100, |
|
1054 onchange: onFileInput(editor) |
|
1055 } |
|
1056 ] |
|
1057 }; |
|
1058 }; |
|
1059 var UploadTab = { makeTab: makeTab$2 }; |
|
1060 |
|
1061 function curry(fn) { |
|
1062 var initialArgs = []; |
|
1063 for (var _i = 1; _i < arguments.length; _i++) { |
|
1064 initialArgs[_i - 1] = arguments[_i]; |
|
1065 } |
|
1066 return function () { |
|
1067 var restArgs = []; |
|
1068 for (var _i = 0; _i < arguments.length; _i++) { |
|
1069 restArgs[_i] = arguments[_i]; |
|
1070 } |
|
1071 var all = initialArgs.concat(restArgs); |
|
1072 return fn.apply(null, all); |
|
1073 }; |
|
1074 } |
|
1075 |
|
1076 var submitForm = function (editor, evt) { |
|
1077 var win = evt.control.getRoot(); |
|
1078 SizeManager.updateSize(win); |
|
1079 editor.undoManager.transact(function () { |
|
1080 var data = merge(readImageDataFromSelection(editor), win.toJSON()); |
|
1081 insertOrUpdateImage(editor, data); |
|
1082 }); |
|
1083 editor.editorUpload.uploadImagesAuto(); |
|
1084 }; |
|
1085 function Dialog (editor) { |
|
1086 function showDialog(imageList) { |
|
1087 var data = readImageDataFromSelection(editor); |
|
1088 var win, imageListCtrl; |
|
1089 if (imageList) { |
|
1090 imageListCtrl = { |
|
1091 type: 'listbox', |
|
1092 label: 'Image list', |
|
1093 name: 'image-list', |
|
1094 values: Utils.buildListItems(imageList, function (item) { |
|
1095 item.value = editor.convertURL(item.value || item.url, 'src'); |
|
1096 }, [{ |
|
1097 text: 'None', |
|
1098 value: '' |
|
1099 }]), |
|
1100 value: data.src && editor.convertURL(data.src, 'src'), |
|
1101 onselect: function (e) { |
|
1102 var altCtrl = win.find('#alt'); |
|
1103 if (!altCtrl.value() || e.lastControl && altCtrl.value() === e.lastControl.text()) { |
|
1104 altCtrl.value(e.control.text()); |
|
1105 } |
|
1106 win.find('#src').value(e.control.value()).fire('change'); |
|
1107 }, |
|
1108 onPostRender: function () { |
|
1109 imageListCtrl = this; |
|
1110 } |
|
1111 }; |
|
1112 } |
|
1113 if (Settings.hasAdvTab(editor) || Settings.hasUploadUrl(editor) || Settings.hasUploadHandler(editor)) { |
|
1114 var body = [MainTab.makeTab(editor, imageListCtrl)]; |
|
1115 if (Settings.hasAdvTab(editor)) { |
|
1116 body.push(AdvTab.makeTab(editor)); |
|
1117 } |
|
1118 if (Settings.hasUploadUrl(editor) || Settings.hasUploadHandler(editor)) { |
|
1119 body.push(UploadTab.makeTab(editor)); |
|
1120 } |
|
1121 win = editor.windowManager.open({ |
|
1122 title: 'Insert/edit image', |
|
1123 data: data, |
|
1124 bodyType: 'tabpanel', |
|
1125 body: body, |
|
1126 onSubmit: curry(submitForm, editor) |
|
1127 }); |
138 } else { |
1128 } else { |
139 menuItem.value = item.value; |
1129 win = editor.windowManager.open({ |
140 itemCallback(menuItem); |
1130 title: 'Insert/edit image', |
141 } |
1131 data: data, |
142 output.push(menuItem); |
1132 body: MainTab.getGeneralItems(editor, imageListCtrl), |
|
1133 onSubmit: curry(submitForm, editor) |
|
1134 }); |
|
1135 } |
|
1136 SizeManager.syncSize(win); |
|
1137 } |
|
1138 function open() { |
|
1139 Utils.createImageList(editor, showDialog); |
|
1140 } |
|
1141 return { open: open }; |
|
1142 } |
|
1143 |
|
1144 var register = function (editor) { |
|
1145 editor.addCommand('mceImage', Dialog(editor).open); |
|
1146 }; |
|
1147 var Commands = { register: register }; |
|
1148 |
|
1149 var hasImageClass = function (node) { |
|
1150 var className = node.attr('class'); |
|
1151 return className && /\bimage\b/.test(className); |
|
1152 }; |
|
1153 var toggleContentEditableState = function (state) { |
|
1154 return function (nodes) { |
|
1155 var i = nodes.length, node; |
|
1156 var toggleContentEditable = function (node) { |
|
1157 node.attr('contenteditable', state ? 'true' : null); |
|
1158 }; |
|
1159 while (i--) { |
|
1160 node = nodes[i]; |
|
1161 if (hasImageClass(node)) { |
|
1162 node.attr('contenteditable', state ? 'false' : null); |
|
1163 global$2.each(node.getAll('figcaption'), toggleContentEditable); |
|
1164 } |
|
1165 } |
|
1166 }; |
|
1167 }; |
|
1168 var setup = function (editor) { |
|
1169 editor.on('preInit', function () { |
|
1170 editor.parser.addNodeFilter('figure', toggleContentEditableState(true)); |
|
1171 editor.serializer.addNodeFilter('figure', toggleContentEditableState(false)); |
143 }); |
1172 }); |
144 return output; |
1173 }; |
|
1174 var FilterContent = { setup: setup }; |
|
1175 |
|
1176 var register$1 = function (editor) { |
|
1177 editor.addButton('image', { |
|
1178 icon: 'image', |
|
1179 tooltip: 'Insert/edit image', |
|
1180 onclick: Dialog(editor).open, |
|
1181 stateSelector: 'img:not([data-mce-object],[data-mce-placeholder]),figure.image' |
|
1182 }); |
|
1183 editor.addMenuItem('image', { |
|
1184 icon: 'image', |
|
1185 text: 'Image', |
|
1186 onclick: Dialog(editor).open, |
|
1187 context: 'insert', |
|
1188 prependToContext: true |
|
1189 }); |
|
1190 }; |
|
1191 var Buttons = { register: register$1 }; |
|
1192 |
|
1193 global.add('image', function (editor) { |
|
1194 FilterContent.setup(editor); |
|
1195 Buttons.register(editor); |
|
1196 Commands.register(editor); |
|
1197 }); |
|
1198 function Plugin () { |
145 } |
1199 } |
146 return appendItems(inputList, startItems || []); |
1200 |
147 }; |
1201 return Plugin; |
148 var removePixelSuffix = function (value) { |
1202 |
149 if (value) { |
1203 }(window)); |
150 value = value.replace(/px$/, ''); |
|
151 } |
|
152 return value; |
|
153 }; |
|
154 var addPixelSuffix = function (value) { |
|
155 if (value.length > 0 && /^[0-9]+$/.test(value)) { |
|
156 value += 'px'; |
|
157 } |
|
158 return value; |
|
159 }; |
|
160 var mergeMargins = function (css) { |
|
161 if (css.margin) { |
|
162 var splitMargin = css.margin.split(' '); |
|
163 switch (splitMargin.length) { |
|
164 case 1: |
|
165 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
166 css['margin-right'] = css['margin-right'] || splitMargin[0]; |
|
167 css['margin-bottom'] = css['margin-bottom'] || splitMargin[0]; |
|
168 css['margin-left'] = css['margin-left'] || splitMargin[0]; |
|
169 break; |
|
170 case 2: |
|
171 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
172 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
173 css['margin-bottom'] = css['margin-bottom'] || splitMargin[0]; |
|
174 css['margin-left'] = css['margin-left'] || splitMargin[1]; |
|
175 break; |
|
176 case 3: |
|
177 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
178 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
179 css['margin-bottom'] = css['margin-bottom'] || splitMargin[2]; |
|
180 css['margin-left'] = css['margin-left'] || splitMargin[1]; |
|
181 break; |
|
182 case 4: |
|
183 css['margin-top'] = css['margin-top'] || splitMargin[0]; |
|
184 css['margin-right'] = css['margin-right'] || splitMargin[1]; |
|
185 css['margin-bottom'] = css['margin-bottom'] || splitMargin[2]; |
|
186 css['margin-left'] = css['margin-left'] || splitMargin[3]; |
|
187 } |
|
188 delete css.margin; |
|
189 } |
|
190 return css; |
|
191 }; |
|
192 var createImageList = function (editor, callback) { |
|
193 var imageList = $_1dn8wtctjjgwebvz.getImageList(editor); |
|
194 if (typeof imageList === 'string') { |
|
195 global$3.send({ |
|
196 url: imageList, |
|
197 success: function (text) { |
|
198 callback(JSON.parse(text)); |
|
199 } |
|
200 }); |
|
201 } else if (typeof imageList === 'function') { |
|
202 imageList(callback); |
|
203 } else { |
|
204 callback(imageList); |
|
205 } |
|
206 }; |
|
207 var waitLoadImage = function (editor, data, imgElm) { |
|
208 function selectImage() { |
|
209 imgElm.onload = imgElm.onerror = null; |
|
210 if (editor.selection) { |
|
211 editor.selection.select(imgElm); |
|
212 editor.nodeChanged(); |
|
213 } |
|
214 } |
|
215 imgElm.onload = function () { |
|
216 if (!data.width && !data.height && $_1dn8wtctjjgwebvz.hasDimensions(editor)) { |
|
217 editor.dom.setAttribs(imgElm, { |
|
218 width: imgElm.clientWidth, |
|
219 height: imgElm.clientHeight |
|
220 }); |
|
221 } |
|
222 selectImage(); |
|
223 }; |
|
224 imgElm.onerror = selectImage; |
|
225 }; |
|
226 var blobToDataUri = function (blob) { |
|
227 return new global$1(function (resolve, reject) { |
|
228 var reader = new FileReader(); |
|
229 reader.onload = function () { |
|
230 resolve(reader.result); |
|
231 }; |
|
232 reader.onerror = function () { |
|
233 reject(FileReader.error.message); |
|
234 }; |
|
235 reader.readAsDataURL(blob); |
|
236 }); |
|
237 }; |
|
238 var $_1e8k4ncujjgwebw2 = { |
|
239 getImageSize: getImageSize, |
|
240 buildListItems: buildListItems, |
|
241 removePixelSuffix: removePixelSuffix, |
|
242 addPixelSuffix: addPixelSuffix, |
|
243 mergeMargins: mergeMargins, |
|
244 createImageList: createImageList, |
|
245 waitLoadImage: waitLoadImage, |
|
246 blobToDataUri: blobToDataUri |
|
247 }; |
|
248 |
|
249 var global$4 = tinymce.util.Tools.resolve('tinymce.dom.DOMUtils'); |
|
250 |
|
251 var hasOwnProperty = Object.prototype.hasOwnProperty; |
|
252 var shallow = function (old, nu) { |
|
253 return nu; |
|
254 }; |
|
255 var baseMerge = function (merger) { |
|
256 return function () { |
|
257 var objects = new Array(arguments.length); |
|
258 for (var i = 0; i < objects.length; i++) |
|
259 objects[i] = arguments[i]; |
|
260 if (objects.length === 0) |
|
261 throw new Error('Can\'t merge zero objects'); |
|
262 var ret = {}; |
|
263 for (var j = 0; j < objects.length; j++) { |
|
264 var curObject = objects[j]; |
|
265 for (var key in curObject) |
|
266 if (hasOwnProperty.call(curObject, key)) { |
|
267 ret[key] = merger(ret[key], curObject[key]); |
|
268 } |
|
269 } |
|
270 return ret; |
|
271 }; |
|
272 }; |
|
273 |
|
274 var merge = baseMerge(shallow); |
|
275 |
|
276 var DOM = global$4.DOM; |
|
277 var getHspace = function (image) { |
|
278 if (image.style.marginLeft && image.style.marginRight && image.style.marginLeft === image.style.marginRight) { |
|
279 return $_1e8k4ncujjgwebw2.removePixelSuffix(image.style.marginLeft); |
|
280 } else { |
|
281 return ''; |
|
282 } |
|
283 }; |
|
284 var getVspace = function (image) { |
|
285 if (image.style.marginTop && image.style.marginBottom && image.style.marginTop === image.style.marginBottom) { |
|
286 return $_1e8k4ncujjgwebw2.removePixelSuffix(image.style.marginTop); |
|
287 } else { |
|
288 return ''; |
|
289 } |
|
290 }; |
|
291 var getBorder = function (image) { |
|
292 if (image.style.borderWidth) { |
|
293 return $_1e8k4ncujjgwebw2.removePixelSuffix(image.style.borderWidth); |
|
294 } else { |
|
295 return ''; |
|
296 } |
|
297 }; |
|
298 var getAttrib = function (image, name$$1) { |
|
299 if (image.hasAttribute(name$$1)) { |
|
300 return image.getAttribute(name$$1); |
|
301 } else { |
|
302 return ''; |
|
303 } |
|
304 }; |
|
305 var getStyle = function (image, name$$1) { |
|
306 return image.style[name$$1] ? image.style[name$$1] : ''; |
|
307 }; |
|
308 var hasCaption = function (image) { |
|
309 return image.parentNode !== null && image.parentNode.nodeName === 'FIGURE'; |
|
310 }; |
|
311 var setAttrib = function (image, name$$1, value) { |
|
312 image.setAttribute(name$$1, value); |
|
313 }; |
|
314 var wrapInFigure = function (image) { |
|
315 var figureElm = DOM.create('figure', { class: 'image' }); |
|
316 DOM.insertAfter(figureElm, image); |
|
317 figureElm.appendChild(image); |
|
318 figureElm.appendChild(DOM.create('figcaption', { contentEditable: true }, 'Caption')); |
|
319 figureElm.contentEditable = 'false'; |
|
320 }; |
|
321 var removeFigure = function (image) { |
|
322 var figureElm = image.parentNode; |
|
323 DOM.insertAfter(image, figureElm); |
|
324 DOM.remove(figureElm); |
|
325 }; |
|
326 var toggleCaption = function (image) { |
|
327 if (hasCaption(image)) { |
|
328 removeFigure(image); |
|
329 } else { |
|
330 wrapInFigure(image); |
|
331 } |
|
332 }; |
|
333 var normalizeStyle = function (image, normalizeCss) { |
|
334 var attrValue = image.getAttribute('style'); |
|
335 var value = normalizeCss(attrValue !== null ? attrValue : ''); |
|
336 if (value.length > 0) { |
|
337 image.setAttribute('style', value); |
|
338 image.setAttribute('data-mce-style', value); |
|
339 } else { |
|
340 image.removeAttribute('style'); |
|
341 } |
|
342 }; |
|
343 var setSize = function (name$$1, normalizeCss) { |
|
344 return function (image, name$$1, value) { |
|
345 if (image.style[name$$1]) { |
|
346 image.style[name$$1] = $_1e8k4ncujjgwebw2.addPixelSuffix(value); |
|
347 normalizeStyle(image, normalizeCss); |
|
348 } else { |
|
349 setAttrib(image, name$$1, value); |
|
350 } |
|
351 }; |
|
352 }; |
|
353 var getSize = function (image, name$$1) { |
|
354 if (image.style[name$$1]) { |
|
355 return $_1e8k4ncujjgwebw2.removePixelSuffix(image.style[name$$1]); |
|
356 } else { |
|
357 return getAttrib(image, name$$1); |
|
358 } |
|
359 }; |
|
360 var setHspace = function (image, value) { |
|
361 var pxValue = $_1e8k4ncujjgwebw2.addPixelSuffix(value); |
|
362 image.style.marginLeft = pxValue; |
|
363 image.style.marginRight = pxValue; |
|
364 }; |
|
365 var setVspace = function (image, value) { |
|
366 var pxValue = $_1e8k4ncujjgwebw2.addPixelSuffix(value); |
|
367 image.style.marginTop = pxValue; |
|
368 image.style.marginBottom = pxValue; |
|
369 }; |
|
370 var setBorder = function (image, value) { |
|
371 var pxValue = $_1e8k4ncujjgwebw2.addPixelSuffix(value); |
|
372 image.style.borderWidth = pxValue; |
|
373 }; |
|
374 var setBorderStyle = function (image, value) { |
|
375 image.style.borderStyle = value; |
|
376 }; |
|
377 var getBorderStyle = function (image) { |
|
378 return getStyle(image, 'borderStyle'); |
|
379 }; |
|
380 var isFigure = function (elm) { |
|
381 return elm.nodeName === 'FIGURE'; |
|
382 }; |
|
383 var defaultData = function () { |
|
384 return { |
|
385 src: '', |
|
386 alt: '', |
|
387 title: '', |
|
388 width: '', |
|
389 height: '', |
|
390 class: '', |
|
391 style: '', |
|
392 caption: false, |
|
393 hspace: '', |
|
394 vspace: '', |
|
395 border: '', |
|
396 borderStyle: '' |
|
397 }; |
|
398 }; |
|
399 var getStyleValue = function (normalizeCss, data) { |
|
400 var image = document.createElement('img'); |
|
401 setAttrib(image, 'style', data.style); |
|
402 if (getHspace(image) || data.hspace !== '') { |
|
403 setHspace(image, data.hspace); |
|
404 } |
|
405 if (getVspace(image) || data.vspace !== '') { |
|
406 setVspace(image, data.vspace); |
|
407 } |
|
408 if (getBorder(image) || data.border !== '') { |
|
409 setBorder(image, data.border); |
|
410 } |
|
411 if (getBorderStyle(image) || data.borderStyle !== '') { |
|
412 setBorderStyle(image, data.borderStyle); |
|
413 } |
|
414 return normalizeCss(image.getAttribute('style')); |
|
415 }; |
|
416 var create = function (normalizeCss, data) { |
|
417 var image = document.createElement('img'); |
|
418 write(normalizeCss, merge(data, { caption: false }), image); |
|
419 setAttrib(image, 'alt', data.alt); |
|
420 if (data.caption) { |
|
421 var figure = DOM.create('figure', { class: 'image' }); |
|
422 figure.appendChild(image); |
|
423 figure.appendChild(DOM.create('figcaption', { contentEditable: true }, 'Caption')); |
|
424 figure.contentEditable = 'false'; |
|
425 return figure; |
|
426 } else { |
|
427 return image; |
|
428 } |
|
429 }; |
|
430 var read = function (normalizeCss, image) { |
|
431 return { |
|
432 src: getAttrib(image, 'src'), |
|
433 alt: getAttrib(image, 'alt'), |
|
434 title: getAttrib(image, 'title'), |
|
435 width: getSize(image, 'width'), |
|
436 height: getSize(image, 'height'), |
|
437 class: getAttrib(image, 'class'), |
|
438 style: normalizeCss(getAttrib(image, 'style')), |
|
439 caption: hasCaption(image), |
|
440 hspace: getHspace(image), |
|
441 vspace: getVspace(image), |
|
442 border: getBorder(image), |
|
443 borderStyle: getStyle(image, 'borderStyle') |
|
444 }; |
|
445 }; |
|
446 var updateProp = function (image, oldData, newData, name$$1, set) { |
|
447 if (newData[name$$1] !== oldData[name$$1]) { |
|
448 set(image, name$$1, newData[name$$1]); |
|
449 } |
|
450 }; |
|
451 var normalized = function (set, normalizeCss) { |
|
452 return function (image, name$$1, value) { |
|
453 set(image, value); |
|
454 normalizeStyle(image, normalizeCss); |
|
455 }; |
|
456 }; |
|
457 var write = function (normalizeCss, newData, image) { |
|
458 var oldData = read(normalizeCss, image); |
|
459 updateProp(image, oldData, newData, 'caption', function (image, _name, _value) { |
|
460 return toggleCaption(image); |
|
461 }); |
|
462 updateProp(image, oldData, newData, 'src', setAttrib); |
|
463 updateProp(image, oldData, newData, 'alt', setAttrib); |
|
464 updateProp(image, oldData, newData, 'title', setAttrib); |
|
465 updateProp(image, oldData, newData, 'width', setSize('width', normalizeCss)); |
|
466 updateProp(image, oldData, newData, 'height', setSize('height', normalizeCss)); |
|
467 updateProp(image, oldData, newData, 'class', setAttrib); |
|
468 updateProp(image, oldData, newData, 'style', normalized(function (image, value) { |
|
469 return setAttrib(image, 'style', value); |
|
470 }, normalizeCss)); |
|
471 updateProp(image, oldData, newData, 'hspace', normalized(setHspace, normalizeCss)); |
|
472 updateProp(image, oldData, newData, 'vspace', normalized(setVspace, normalizeCss)); |
|
473 updateProp(image, oldData, newData, 'border', normalized(setBorder, normalizeCss)); |
|
474 updateProp(image, oldData, newData, 'borderStyle', normalized(setBorderStyle, normalizeCss)); |
|
475 }; |
|
476 |
|
477 var normalizeCss = function (editor, cssText) { |
|
478 var css = editor.dom.styles.parse(cssText); |
|
479 var mergedCss = $_1e8k4ncujjgwebw2.mergeMargins(css); |
|
480 var compressed = editor.dom.styles.parse(editor.dom.styles.serialize(mergedCss)); |
|
481 return editor.dom.styles.serialize(compressed); |
|
482 }; |
|
483 var getSelectedImage = function (editor) { |
|
484 var imgElm = editor.selection.getNode(); |
|
485 var figureElm = editor.dom.getParent(imgElm, 'figure.image'); |
|
486 if (figureElm) { |
|
487 return editor.dom.select('img', figureElm)[0]; |
|
488 } |
|
489 if (imgElm && (imgElm.nodeName !== 'IMG' || imgElm.getAttribute('data-mce-object') || imgElm.getAttribute('data-mce-placeholder'))) { |
|
490 return null; |
|
491 } |
|
492 return imgElm; |
|
493 }; |
|
494 var splitTextBlock = function (editor, figure) { |
|
495 var dom = editor.dom; |
|
496 var textBlock = dom.getParent(figure.parentNode, function (node) { |
|
497 return editor.schema.getTextBlockElements()[node.nodeName]; |
|
498 }); |
|
499 if (textBlock) { |
|
500 return dom.split(textBlock, figure); |
|
501 } else { |
|
502 return figure; |
|
503 } |
|
504 }; |
|
505 var readImageDataFromSelection = function (editor) { |
|
506 var image = getSelectedImage(editor); |
|
507 return image ? read(function (css) { |
|
508 return normalizeCss(editor, css); |
|
509 }, image) : defaultData(); |
|
510 }; |
|
511 var insertImageAtCaret = function (editor, data) { |
|
512 var elm = create(function (css) { |
|
513 return normalizeCss(editor, css); |
|
514 }, data); |
|
515 editor.dom.setAttrib(elm, 'data-mce-id', '__mcenew'); |
|
516 editor.focus(); |
|
517 editor.selection.setContent(elm.outerHTML); |
|
518 var insertedElm = editor.dom.select('*[data-mce-id="__mcenew"]')[0]; |
|
519 editor.dom.setAttrib(insertedElm, 'data-mce-id', null); |
|
520 if (isFigure(insertedElm)) { |
|
521 var figure = splitTextBlock(editor, insertedElm); |
|
522 editor.selection.select(figure); |
|
523 } else { |
|
524 editor.selection.select(insertedElm); |
|
525 } |
|
526 }; |
|
527 var syncSrcAttr = function (editor, image) { |
|
528 editor.dom.setAttrib(image, 'src', image.getAttribute('src')); |
|
529 }; |
|
530 var deleteImage = function (editor, image) { |
|
531 if (image) { |
|
532 var elm = editor.dom.is(image.parentNode, 'figure.image') ? image.parentNode : image; |
|
533 editor.dom.remove(elm); |
|
534 editor.focus(); |
|
535 editor.nodeChanged(); |
|
536 if (editor.dom.isEmpty(editor.getBody())) { |
|
537 editor.setContent(''); |
|
538 editor.selection.setCursorLocation(); |
|
539 } |
|
540 } |
|
541 }; |
|
542 var writeImageDataToSelection = function (editor, data) { |
|
543 var image = getSelectedImage(editor); |
|
544 write(function (css) { |
|
545 return normalizeCss(editor, css); |
|
546 }, data, image); |
|
547 syncSrcAttr(editor, image); |
|
548 if (isFigure(image.parentNode)) { |
|
549 var figure = image.parentNode; |
|
550 splitTextBlock(editor, figure); |
|
551 editor.selection.select(image.parentNode); |
|
552 } else { |
|
553 editor.selection.select(image); |
|
554 $_1e8k4ncujjgwebw2.waitLoadImage(editor, data, image); |
|
555 } |
|
556 }; |
|
557 var insertOrUpdateImage = function (editor, data) { |
|
558 var image = getSelectedImage(editor); |
|
559 if (image) { |
|
560 if (data.src) { |
|
561 writeImageDataToSelection(editor, data); |
|
562 } else { |
|
563 deleteImage(editor, image); |
|
564 } |
|
565 } else if (data.src) { |
|
566 insertImageAtCaret(editor, data); |
|
567 } |
|
568 }; |
|
569 |
|
570 var updateVSpaceHSpaceBorder = function (editor) { |
|
571 return function (evt) { |
|
572 var dom = editor.dom; |
|
573 var rootControl = evt.control.rootControl; |
|
574 if (!$_1dn8wtctjjgwebvz.hasAdvTab(editor)) { |
|
575 return; |
|
576 } |
|
577 var data = rootControl.toJSON(); |
|
578 var css = dom.parseStyle(data.style); |
|
579 rootControl.find('#vspace').value(''); |
|
580 rootControl.find('#hspace').value(''); |
|
581 css = $_1e8k4ncujjgwebw2.mergeMargins(css); |
|
582 if (css['margin-top'] && css['margin-bottom'] || css['margin-right'] && css['margin-left']) { |
|
583 if (css['margin-top'] === css['margin-bottom']) { |
|
584 rootControl.find('#vspace').value($_1e8k4ncujjgwebw2.removePixelSuffix(css['margin-top'])); |
|
585 } else { |
|
586 rootControl.find('#vspace').value(''); |
|
587 } |
|
588 if (css['margin-right'] === css['margin-left']) { |
|
589 rootControl.find('#hspace').value($_1e8k4ncujjgwebw2.removePixelSuffix(css['margin-right'])); |
|
590 } else { |
|
591 rootControl.find('#hspace').value(''); |
|
592 } |
|
593 } |
|
594 if (css['border-width']) { |
|
595 rootControl.find('#border').value($_1e8k4ncujjgwebw2.removePixelSuffix(css['border-width'])); |
|
596 } else { |
|
597 rootControl.find('#border').value(''); |
|
598 } |
|
599 if (css['border-style']) { |
|
600 rootControl.find('#borderStyle').value(css['border-style']); |
|
601 } else { |
|
602 rootControl.find('#borderStyle').value(''); |
|
603 } |
|
604 rootControl.find('#style').value(dom.serializeStyle(dom.parseStyle(dom.serializeStyle(css)))); |
|
605 }; |
|
606 }; |
|
607 var updateStyle = function (editor, win) { |
|
608 win.find('#style').each(function (ctrl) { |
|
609 var value = getStyleValue(function (css) { |
|
610 return normalizeCss(editor, css); |
|
611 }, merge(defaultData(), win.toJSON())); |
|
612 ctrl.value(value); |
|
613 }); |
|
614 }; |
|
615 var makeTab = function (editor) { |
|
616 return { |
|
617 title: 'Advanced', |
|
618 type: 'form', |
|
619 pack: 'start', |
|
620 items: [ |
|
621 { |
|
622 label: 'Style', |
|
623 name: 'style', |
|
624 type: 'textbox', |
|
625 onchange: updateVSpaceHSpaceBorder(editor) |
|
626 }, |
|
627 { |
|
628 type: 'form', |
|
629 layout: 'grid', |
|
630 packV: 'start', |
|
631 columns: 2, |
|
632 padding: 0, |
|
633 defaults: { |
|
634 type: 'textbox', |
|
635 maxWidth: 50, |
|
636 onchange: function (evt) { |
|
637 updateStyle(editor, evt.control.rootControl); |
|
638 } |
|
639 }, |
|
640 items: [ |
|
641 { |
|
642 label: 'Vertical space', |
|
643 name: 'vspace' |
|
644 }, |
|
645 { |
|
646 label: 'Border width', |
|
647 name: 'border' |
|
648 }, |
|
649 { |
|
650 label: 'Horizontal space', |
|
651 name: 'hspace' |
|
652 }, |
|
653 { |
|
654 label: 'Border style', |
|
655 type: 'listbox', |
|
656 name: 'borderStyle', |
|
657 width: 90, |
|
658 maxWidth: 90, |
|
659 onselect: function (evt) { |
|
660 updateStyle(editor, evt.control.rootControl); |
|
661 }, |
|
662 values: [ |
|
663 { |
|
664 text: 'Select...', |
|
665 value: '' |
|
666 }, |
|
667 { |
|
668 text: 'Solid', |
|
669 value: 'solid' |
|
670 }, |
|
671 { |
|
672 text: 'Dotted', |
|
673 value: 'dotted' |
|
674 }, |
|
675 { |
|
676 text: 'Dashed', |
|
677 value: 'dashed' |
|
678 }, |
|
679 { |
|
680 text: 'Double', |
|
681 value: 'double' |
|
682 }, |
|
683 { |
|
684 text: 'Groove', |
|
685 value: 'groove' |
|
686 }, |
|
687 { |
|
688 text: 'Ridge', |
|
689 value: 'ridge' |
|
690 }, |
|
691 { |
|
692 text: 'Inset', |
|
693 value: 'inset' |
|
694 }, |
|
695 { |
|
696 text: 'Outset', |
|
697 value: 'outset' |
|
698 }, |
|
699 { |
|
700 text: 'None', |
|
701 value: 'none' |
|
702 }, |
|
703 { |
|
704 text: 'Hidden', |
|
705 value: 'hidden' |
|
706 } |
|
707 ] |
|
708 } |
|
709 ] |
|
710 } |
|
711 ] |
|
712 }; |
|
713 }; |
|
714 var $_6dfy5vd3jjgwebxf = { makeTab: makeTab }; |
|
715 |
|
716 var doSyncSize = function (widthCtrl, heightCtrl) { |
|
717 widthCtrl.state.set('oldVal', widthCtrl.value()); |
|
718 heightCtrl.state.set('oldVal', heightCtrl.value()); |
|
719 }; |
|
720 var doSizeControls = function (win, f) { |
|
721 var widthCtrl = win.find('#width')[0]; |
|
722 var heightCtrl = win.find('#height')[0]; |
|
723 var constrained = win.find('#constrain')[0]; |
|
724 if (widthCtrl && heightCtrl && constrained) { |
|
725 f(widthCtrl, heightCtrl, constrained.checked()); |
|
726 } |
|
727 }; |
|
728 var doUpdateSize = function (widthCtrl, heightCtrl, isContrained) { |
|
729 var oldWidth = widthCtrl.state.get('oldVal'); |
|
730 var oldHeight = heightCtrl.state.get('oldVal'); |
|
731 var newWidth = widthCtrl.value(); |
|
732 var newHeight = heightCtrl.value(); |
|
733 if (isContrained && oldWidth && oldHeight && newWidth && newHeight) { |
|
734 if (newWidth !== oldWidth) { |
|
735 newHeight = Math.round(newWidth / oldWidth * newHeight); |
|
736 if (!isNaN(newHeight)) { |
|
737 heightCtrl.value(newHeight); |
|
738 } |
|
739 } else { |
|
740 newWidth = Math.round(newHeight / oldHeight * newWidth); |
|
741 if (!isNaN(newWidth)) { |
|
742 widthCtrl.value(newWidth); |
|
743 } |
|
744 } |
|
745 } |
|
746 doSyncSize(widthCtrl, heightCtrl); |
|
747 }; |
|
748 var syncSize = function (win) { |
|
749 doSizeControls(win, doSyncSize); |
|
750 }; |
|
751 var updateSize = function (win) { |
|
752 doSizeControls(win, doUpdateSize); |
|
753 }; |
|
754 var createUi = function () { |
|
755 var recalcSize = function (evt) { |
|
756 updateSize(evt.control.rootControl); |
|
757 }; |
|
758 return { |
|
759 type: 'container', |
|
760 label: 'Dimensions', |
|
761 layout: 'flex', |
|
762 align: 'center', |
|
763 spacing: 5, |
|
764 items: [ |
|
765 { |
|
766 name: 'width', |
|
767 type: 'textbox', |
|
768 maxLength: 5, |
|
769 size: 5, |
|
770 onchange: recalcSize, |
|
771 ariaLabel: 'Width' |
|
772 }, |
|
773 { |
|
774 type: 'label', |
|
775 text: 'x' |
|
776 }, |
|
777 { |
|
778 name: 'height', |
|
779 type: 'textbox', |
|
780 maxLength: 5, |
|
781 size: 5, |
|
782 onchange: recalcSize, |
|
783 ariaLabel: 'Height' |
|
784 }, |
|
785 { |
|
786 name: 'constrain', |
|
787 type: 'checkbox', |
|
788 checked: true, |
|
789 text: 'Constrain proportions' |
|
790 } |
|
791 ] |
|
792 }; |
|
793 }; |
|
794 var $_ftlz5pdajjgweby4 = { |
|
795 createUi: createUi, |
|
796 syncSize: syncSize, |
|
797 updateSize: updateSize |
|
798 }; |
|
799 |
|
800 var onSrcChange = function (evt, editor) { |
|
801 var srcURL, prependURL, absoluteURLPattern; |
|
802 var meta = evt.meta || {}; |
|
803 var control = evt.control; |
|
804 var rootControl = control.rootControl; |
|
805 var imageListCtrl = rootControl.find('#image-list')[0]; |
|
806 if (imageListCtrl) { |
|
807 imageListCtrl.value(editor.convertURL(control.value(), 'src')); |
|
808 } |
|
809 global$2.each(meta, function (value, key) { |
|
810 rootControl.find('#' + key).value(value); |
|
811 }); |
|
812 if (!meta.width && !meta.height) { |
|
813 srcURL = editor.convertURL(control.value(), 'src'); |
|
814 prependURL = $_1dn8wtctjjgwebvz.getPrependUrl(editor); |
|
815 absoluteURLPattern = new RegExp('^(?:[a-z]+:)?//', 'i'); |
|
816 if (prependURL && !absoluteURLPattern.test(srcURL) && srcURL.substring(0, prependURL.length) !== prependURL) { |
|
817 srcURL = prependURL + srcURL; |
|
818 } |
|
819 control.value(srcURL); |
|
820 $_1e8k4ncujjgwebw2.getImageSize(editor.documentBaseURI.toAbsolute(control.value()), function (data) { |
|
821 if (data.width && data.height && $_1dn8wtctjjgwebvz.hasDimensions(editor)) { |
|
822 rootControl.find('#width').value(data.width); |
|
823 rootControl.find('#height').value(data.height); |
|
824 $_ftlz5pdajjgweby4.syncSize(rootControl); |
|
825 } |
|
826 }); |
|
827 } |
|
828 }; |
|
829 var onBeforeCall = function (evt) { |
|
830 evt.meta = evt.control.rootControl.toJSON(); |
|
831 }; |
|
832 var getGeneralItems = function (editor, imageListCtrl) { |
|
833 var generalFormItems = [ |
|
834 { |
|
835 name: 'src', |
|
836 type: 'filepicker', |
|
837 filetype: 'image', |
|
838 label: 'Source', |
|
839 autofocus: true, |
|
840 onchange: function (evt) { |
|
841 onSrcChange(evt, editor); |
|
842 }, |
|
843 onbeforecall: onBeforeCall |
|
844 }, |
|
845 imageListCtrl |
|
846 ]; |
|
847 if ($_1dn8wtctjjgwebvz.hasDescription(editor)) { |
|
848 generalFormItems.push({ |
|
849 name: 'alt', |
|
850 type: 'textbox', |
|
851 label: 'Image description' |
|
852 }); |
|
853 } |
|
854 if ($_1dn8wtctjjgwebvz.hasImageTitle(editor)) { |
|
855 generalFormItems.push({ |
|
856 name: 'title', |
|
857 type: 'textbox', |
|
858 label: 'Image Title' |
|
859 }); |
|
860 } |
|
861 if ($_1dn8wtctjjgwebvz.hasDimensions(editor)) { |
|
862 generalFormItems.push($_ftlz5pdajjgweby4.createUi()); |
|
863 } |
|
864 if ($_1dn8wtctjjgwebvz.getClassList(editor)) { |
|
865 generalFormItems.push({ |
|
866 name: 'class', |
|
867 type: 'listbox', |
|
868 label: 'Class', |
|
869 values: $_1e8k4ncujjgwebw2.buildListItems($_1dn8wtctjjgwebvz.getClassList(editor), function (item) { |
|
870 if (item.value) { |
|
871 item.textStyle = function () { |
|
872 return editor.formatter.getCssText({ |
|
873 inline: 'img', |
|
874 classes: [item.value] |
|
875 }); |
|
876 }; |
|
877 } |
|
878 }) |
|
879 }); |
|
880 } |
|
881 if ($_1dn8wtctjjgwebvz.hasImageCaption(editor)) { |
|
882 generalFormItems.push({ |
|
883 name: 'caption', |
|
884 type: 'checkbox', |
|
885 label: 'Caption' |
|
886 }); |
|
887 } |
|
888 return generalFormItems; |
|
889 }; |
|
890 var makeTab$1 = function (editor, imageListCtrl) { |
|
891 return { |
|
892 title: 'General', |
|
893 type: 'form', |
|
894 items: getGeneralItems(editor, imageListCtrl) |
|
895 }; |
|
896 }; |
|
897 var $_78zck5d9jjgweby1 = { |
|
898 makeTab: makeTab$1, |
|
899 getGeneralItems: getGeneralItems |
|
900 }; |
|
901 |
|
902 var url = function () { |
|
903 return $_oab1bcwjjgwebwl.getOrDie('URL'); |
|
904 }; |
|
905 var createObjectURL = function (blob) { |
|
906 return url().createObjectURL(blob); |
|
907 }; |
|
908 var revokeObjectURL = function (u) { |
|
909 url().revokeObjectURL(u); |
|
910 }; |
|
911 var $_86i13edcjjgwebya = { |
|
912 createObjectURL: createObjectURL, |
|
913 revokeObjectURL: revokeObjectURL |
|
914 }; |
|
915 |
|
916 var global$5 = tinymce.util.Tools.resolve('tinymce.ui.Factory'); |
|
917 |
|
918 function XMLHttpRequest () { |
|
919 var f = $_oab1bcwjjgwebwl.getOrDie('XMLHttpRequest'); |
|
920 return new f(); |
|
921 } |
|
922 |
|
923 var noop = function () { |
|
924 }; |
|
925 var pathJoin = function (path1, path2) { |
|
926 if (path1) { |
|
927 return path1.replace(/\/$/, '') + '/' + path2.replace(/^\//, ''); |
|
928 } |
|
929 return path2; |
|
930 }; |
|
931 function Uploader (settings) { |
|
932 var defaultHandler = function (blobInfo, success, failure, progress) { |
|
933 var xhr, formData; |
|
934 xhr = new XMLHttpRequest(); |
|
935 xhr.open('POST', settings.url); |
|
936 xhr.withCredentials = settings.credentials; |
|
937 xhr.upload.onprogress = function (e) { |
|
938 progress(e.loaded / e.total * 100); |
|
939 }; |
|
940 xhr.onerror = function () { |
|
941 failure('Image upload failed due to a XHR Transport error. Code: ' + xhr.status); |
|
942 }; |
|
943 xhr.onload = function () { |
|
944 var json; |
|
945 if (xhr.status < 200 || xhr.status >= 300) { |
|
946 failure('HTTP Error: ' + xhr.status); |
|
947 return; |
|
948 } |
|
949 json = JSON.parse(xhr.responseText); |
|
950 if (!json || typeof json.location !== 'string') { |
|
951 failure('Invalid JSON: ' + xhr.responseText); |
|
952 return; |
|
953 } |
|
954 success(pathJoin(settings.basePath, json.location)); |
|
955 }; |
|
956 formData = new FormData(); |
|
957 formData.append('file', blobInfo.blob(), blobInfo.filename()); |
|
958 xhr.send(formData); |
|
959 }; |
|
960 var uploadBlob = function (blobInfo, handler) { |
|
961 return new global$1(function (resolve, reject) { |
|
962 try { |
|
963 handler(blobInfo, resolve, reject, noop); |
|
964 } catch (ex) { |
|
965 reject(ex.message); |
|
966 } |
|
967 }); |
|
968 }; |
|
969 var isDefaultHandler = function (handler) { |
|
970 return handler === defaultHandler; |
|
971 }; |
|
972 var upload = function (blobInfo) { |
|
973 return !settings.url && isDefaultHandler(settings.handler) ? global$1.reject('Upload url missing from the settings.') : uploadBlob(blobInfo, settings.handler); |
|
974 }; |
|
975 settings = global$2.extend({ |
|
976 credentials: false, |
|
977 handler: defaultHandler |
|
978 }, settings); |
|
979 return { upload: upload }; |
|
980 } |
|
981 |
|
982 var onFileInput = function (editor) { |
|
983 return function (evt) { |
|
984 var Throbber = global$5.get('Throbber'); |
|
985 var rootControl = evt.control.rootControl; |
|
986 var throbber = new Throbber(rootControl.getEl()); |
|
987 var file = evt.control.value(); |
|
988 var blobUri = $_86i13edcjjgwebya.createObjectURL(file); |
|
989 var uploader = Uploader({ |
|
990 url: $_1dn8wtctjjgwebvz.getUploadUrl(editor), |
|
991 basePath: $_1dn8wtctjjgwebvz.getUploadBasePath(editor), |
|
992 credentials: $_1dn8wtctjjgwebvz.getUploadCredentials(editor), |
|
993 handler: $_1dn8wtctjjgwebvz.getUploadHandler(editor) |
|
994 }); |
|
995 var finalize = function () { |
|
996 throbber.hide(); |
|
997 $_86i13edcjjgwebya.revokeObjectURL(blobUri); |
|
998 }; |
|
999 throbber.show(); |
|
1000 return $_1e8k4ncujjgwebw2.blobToDataUri(file).then(function (dataUrl) { |
|
1001 var blobInfo = editor.editorUpload.blobCache.create({ |
|
1002 blob: file, |
|
1003 blobUri: blobUri, |
|
1004 name: file.name ? file.name.replace(/\.[^\.]+$/, '') : null, |
|
1005 base64: dataUrl.split(',')[1] |
|
1006 }); |
|
1007 return uploader.upload(blobInfo).then(function (url) { |
|
1008 var src = rootControl.find('#src'); |
|
1009 src.value(url); |
|
1010 rootControl.find('tabpanel')[0].activateTab(0); |
|
1011 src.fire('change'); |
|
1012 finalize(); |
|
1013 return url; |
|
1014 }); |
|
1015 }).catch(function (err) { |
|
1016 editor.windowManager.alert(err); |
|
1017 finalize(); |
|
1018 }); |
|
1019 }; |
|
1020 }; |
|
1021 var acceptExts = '.jpg,.jpeg,.png,.gif'; |
|
1022 var makeTab$2 = function (editor) { |
|
1023 return { |
|
1024 title: 'Upload', |
|
1025 type: 'form', |
|
1026 layout: 'flex', |
|
1027 direction: 'column', |
|
1028 align: 'stretch', |
|
1029 padding: '20 20 20 20', |
|
1030 items: [ |
|
1031 { |
|
1032 type: 'container', |
|
1033 layout: 'flex', |
|
1034 direction: 'column', |
|
1035 align: 'center', |
|
1036 spacing: 10, |
|
1037 items: [ |
|
1038 { |
|
1039 text: 'Browse for an image', |
|
1040 type: 'browsebutton', |
|
1041 accept: acceptExts, |
|
1042 onchange: onFileInput(editor) |
|
1043 }, |
|
1044 { |
|
1045 text: 'OR', |
|
1046 type: 'label' |
|
1047 } |
|
1048 ] |
|
1049 }, |
|
1050 { |
|
1051 text: 'Drop an image here', |
|
1052 type: 'dropzone', |
|
1053 accept: acceptExts, |
|
1054 height: 100, |
|
1055 onchange: onFileInput(editor) |
|
1056 } |
|
1057 ] |
|
1058 }; |
|
1059 }; |
|
1060 var $_71qd7mdbjjgweby7 = { makeTab: makeTab$2 }; |
|
1061 |
|
1062 var curry = function (f) { |
|
1063 var x = []; |
|
1064 for (var _i = 1; _i < arguments.length; _i++) { |
|
1065 x[_i - 1] = arguments[_i]; |
|
1066 } |
|
1067 var args = new Array(arguments.length - 1); |
|
1068 for (var i = 1; i < arguments.length; i++) |
|
1069 args[i - 1] = arguments[i]; |
|
1070 return function () { |
|
1071 var x = []; |
|
1072 for (var _i = 0; _i < arguments.length; _i++) { |
|
1073 x[_i] = arguments[_i]; |
|
1074 } |
|
1075 var newArgs = new Array(arguments.length); |
|
1076 for (var j = 0; j < newArgs.length; j++) |
|
1077 newArgs[j] = arguments[j]; |
|
1078 var all = args.concat(newArgs); |
|
1079 return f.apply(null, all); |
|
1080 }; |
|
1081 }; |
|
1082 |
|
1083 var submitForm = function (editor, evt) { |
|
1084 var win = evt.control.getRoot(); |
|
1085 $_ftlz5pdajjgweby4.updateSize(win); |
|
1086 editor.undoManager.transact(function () { |
|
1087 var data = merge(readImageDataFromSelection(editor), win.toJSON()); |
|
1088 insertOrUpdateImage(editor, data); |
|
1089 }); |
|
1090 editor.editorUpload.uploadImagesAuto(); |
|
1091 }; |
|
1092 function Dialog (editor) { |
|
1093 function showDialog(imageList) { |
|
1094 var data = readImageDataFromSelection(editor); |
|
1095 var win, imageListCtrl; |
|
1096 if (imageList) { |
|
1097 imageListCtrl = { |
|
1098 type: 'listbox', |
|
1099 label: 'Image list', |
|
1100 name: 'image-list', |
|
1101 values: $_1e8k4ncujjgwebw2.buildListItems(imageList, function (item) { |
|
1102 item.value = editor.convertURL(item.value || item.url, 'src'); |
|
1103 }, [{ |
|
1104 text: 'None', |
|
1105 value: '' |
|
1106 }]), |
|
1107 value: data.src && editor.convertURL(data.src, 'src'), |
|
1108 onselect: function (e) { |
|
1109 var altCtrl = win.find('#alt'); |
|
1110 if (!altCtrl.value() || e.lastControl && altCtrl.value() === e.lastControl.text()) { |
|
1111 altCtrl.value(e.control.text()); |
|
1112 } |
|
1113 win.find('#src').value(e.control.value()).fire('change'); |
|
1114 }, |
|
1115 onPostRender: function () { |
|
1116 imageListCtrl = this; |
|
1117 } |
|
1118 }; |
|
1119 } |
|
1120 if ($_1dn8wtctjjgwebvz.hasAdvTab(editor) || $_1dn8wtctjjgwebvz.hasUploadUrl(editor) || $_1dn8wtctjjgwebvz.hasUploadHandler(editor)) { |
|
1121 var body = [$_78zck5d9jjgweby1.makeTab(editor, imageListCtrl)]; |
|
1122 if ($_1dn8wtctjjgwebvz.hasAdvTab(editor)) { |
|
1123 body.push($_6dfy5vd3jjgwebxf.makeTab(editor)); |
|
1124 } |
|
1125 if ($_1dn8wtctjjgwebvz.hasUploadUrl(editor) || $_1dn8wtctjjgwebvz.hasUploadHandler(editor)) { |
|
1126 body.push($_71qd7mdbjjgweby7.makeTab(editor)); |
|
1127 } |
|
1128 win = editor.windowManager.open({ |
|
1129 title: 'Insert/edit image', |
|
1130 data: data, |
|
1131 bodyType: 'tabpanel', |
|
1132 body: body, |
|
1133 onSubmit: curry(submitForm, editor) |
|
1134 }); |
|
1135 } else { |
|
1136 win = editor.windowManager.open({ |
|
1137 title: 'Insert/edit image', |
|
1138 data: data, |
|
1139 body: $_78zck5d9jjgweby1.getGeneralItems(editor, imageListCtrl), |
|
1140 onSubmit: curry(submitForm, editor) |
|
1141 }); |
|
1142 } |
|
1143 $_ftlz5pdajjgweby4.syncSize(win); |
|
1144 } |
|
1145 function open() { |
|
1146 $_1e8k4ncujjgwebw2.createImageList(editor, showDialog); |
|
1147 } |
|
1148 return { open: open }; |
|
1149 } |
|
1150 |
|
1151 var register = function (editor) { |
|
1152 editor.addCommand('mceImage', Dialog(editor).open); |
|
1153 }; |
|
1154 var $_3lypdlcrjjgwebvs = { register: register }; |
|
1155 |
|
1156 var hasImageClass = function (node) { |
|
1157 var className = node.attr('class'); |
|
1158 return className && /\bimage\b/.test(className); |
|
1159 }; |
|
1160 var toggleContentEditableState = function (state) { |
|
1161 return function (nodes) { |
|
1162 var i = nodes.length, node; |
|
1163 var toggleContentEditable = function (node) { |
|
1164 node.attr('contenteditable', state ? 'true' : null); |
|
1165 }; |
|
1166 while (i--) { |
|
1167 node = nodes[i]; |
|
1168 if (hasImageClass(node)) { |
|
1169 node.attr('contenteditable', state ? 'false' : null); |
|
1170 global$2.each(node.getAll('figcaption'), toggleContentEditable); |
|
1171 } |
|
1172 } |
|
1173 }; |
|
1174 }; |
|
1175 var setup = function (editor) { |
|
1176 editor.on('preInit', function () { |
|
1177 editor.parser.addNodeFilter('figure', toggleContentEditableState(true)); |
|
1178 editor.serializer.addNodeFilter('figure', toggleContentEditableState(false)); |
|
1179 }); |
|
1180 }; |
|
1181 var $_5op6l2dhjjgwebym = { setup: setup }; |
|
1182 |
|
1183 var register$1 = function (editor) { |
|
1184 editor.addButton('image', { |
|
1185 icon: 'image', |
|
1186 tooltip: 'Insert/edit image', |
|
1187 onclick: Dialog(editor).open, |
|
1188 stateSelector: 'img:not([data-mce-object],[data-mce-placeholder]),figure.image' |
|
1189 }); |
|
1190 editor.addMenuItem('image', { |
|
1191 icon: 'image', |
|
1192 text: 'Image', |
|
1193 onclick: Dialog(editor).open, |
|
1194 context: 'insert', |
|
1195 prependToContext: true |
|
1196 }); |
|
1197 }; |
|
1198 var $_dm869adijjgwebyn = { register: register$1 }; |
|
1199 |
|
1200 global.add('image', function (editor) { |
|
1201 $_5op6l2dhjjgwebym.setup(editor); |
|
1202 $_dm869adijjgwebyn.register(editor); |
|
1203 $_3lypdlcrjjgwebvs.register(editor); |
|
1204 }); |
|
1205 function Plugin () { |
|
1206 } |
|
1207 |
|
1208 return Plugin; |
|
1209 |
|
1210 }()); |
|
1211 })(); |
1204 })(); |