]>
git.immae.eu Git - perso/Immae/Projets/packagist/piedsjaloux-ckeditor-component.git/blob - sources/plugins/oembed/plugin.js
3 * Licensed under the MIT license
4 * jQuery Embed Plugin: http://code.google.com/p/jquery-oembed/ (MIT License)
5 * Plugin for: http://ckeditor.com/license (GPL/LGPL/MPL: http://ckeditor.com/license)
9 CKEDITOR
.plugins
.add('oembed', {
12 requires: 'widget,dialog',
13 lang: 'de,en,fr,nl,pl,pt-br,ru,tr', // %REMOVE_LINE_CORE%
15 init: function(editor
) {
19 CKEDITOR
.tools
.extend(CKEDITOR
.editor
.prototype, {
20 oEmbed: function(url
, maxWidth
, maxHeight
, responsiveResize
) {
22 if (url
.length
< 1 || url
.indexOf('http') < 0) {
23 alert(editor
.lang
.oembed
.invalidUrl
);
28 if (maxWidth
== null || maxWidth
== 'undefined') {
32 if (maxHeight
== null || maxHeight
== 'undefined') {
36 if (responsiveResize
== null || responsiveResize
== 'undefined') {
37 responsiveResize
= false;
40 embedCode(url
, editor
, false, maxWidth
, maxHeight
, responsiveResize
);
43 if (typeof(jQuery
.fn
.oembed
) === 'undefined') {
44 CKEDITOR
.scriptLoader
.load(CKEDITOR
.getUrl(CKEDITOR
.plugins
.getPath('oembed') + 'libs/jquery.oembed.min.js'), function() {
55 editor
.widgets
.add('oembed', {
61 styles: 'text-align,float',
63 classes: editor
.config
.oembed_WrapperClass
!= null ? editor
.config
.oembed_WrapperClass : "embeddedContent"
65 'div(embeddedContent,oembed-provider-*) iframe': {
68 'div(embeddedContent,oembed-provider-*) blockquote': {
71 'div(embeddedContent,oembed-provider-*) script': {
76 '<div class="' + (editor
.config
.oembed_WrapperClass
!= null ? editor
.config
.oembed_WrapperClass : "embeddedContent") + '">' +
78 upcast: function(element
) {
79 return element
.name
== 'div' && element
.hasClass(editor
.config
.oembed_WrapperClass
!= null ? editor
.config
.oembed_WrapperClass : "embeddedContent");
83 oembed: this.element
.data('oembed') || '',
84 resizeType: this.element
.data('resizeType') || 'noresize',
85 maxWidth: this.element
.data('maxWidth') || 560,
86 maxHeight: this.element
.data('maxHeight') || 315,
87 align: this.element
.data('align') || 'none',
88 oembed_provider: this.element
.data('oembed_provider') || ''
92 this.element
.addClass('oembed-provider-' + data
.oembed_provider
);
94 this.on('dialog', function(evt
) {
95 evt
.data
.widget
= this;
100 editor
.ui
.addButton('oembed', {
101 label: editor
.lang
.oembed
.button
,
103 toolbar: 'insert,10',
104 icon: this.path
+ "icons/" + (CKEDITOR
.env
.hidpi
? "hidpi/" : "") + "oembed.png"
107 var resizeTypeChanged = function() {
108 var dialog
= this.getDialog(),
109 resizetype
= this.getValue(),
110 maxSizeBox
= dialog
.getContentElement('general', 'maxSizeBox').getElement(),
111 sizeBox
= dialog
.getContentElement('general', 'sizeBox').getElement();
113 if (resizetype
== 'noresize') {
117 } else if (resizetype
== "custom") {
129 String
.prototype.beginsWith = function(string
) {
130 return (this.indexOf(string
) === 0);
133 function loadjQueryLibaries() {
134 if (typeof(jQuery
) === 'undefined') {
135 CKEDITOR
.scriptLoader
.load('//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', function() {
137 if (typeof(jQuery
.fn
.oembed
) === 'undefined') {
138 CKEDITOR
.scriptLoader
.load(
139 CKEDITOR
.getUrl(CKEDITOR
.plugins
.getPath('oembed') + 'libs/jquery.oembed.min.js')
144 } else if (typeof(jQuery
.fn
.oembed
) === 'undefined') {
145 CKEDITOR
.scriptLoader
.load(CKEDITOR
.getUrl(CKEDITOR
.plugins
.getPath('oembed') + 'libs/jquery.oembed.min.js'));
149 function embedCode(url
, instance
, maxWidth
, maxHeight
, responsiveResize
, resizeType
, align
, widget
) {
150 jQuery('body').oembed(url
, {
151 onEmbed: function(e
) {
152 var elementAdded
= false,
153 provider
= jQuery
.fn
.oembed
.getOEmbedProvider(url
);
155 widget
.element
.data('resizeType', resizeType
);
156 if (resizeType
== "responsive" || resizeType
== "custom") {
157 widget
.element
.data('maxWidth', maxWidth
);
158 widget
.element
.data('maxHeight', maxHeight
);
161 widget
.element
.data('align', align
);
164 if (align
== 'center') {
166 widget
.element
.setStyle('text-align', 'center');
168 widget
.element
.removeStyle('float');
171 widget
.element
.removeStyle('text-align');
174 widget
.element
.removeStyle('float');
176 widget
.element
.setStyle('float', align
);
179 if (typeof e
.code
=== 'string') {
180 if (widget
.element
.$.firstChild
) {
181 widget
.element
.$.removeChild(widget
.element
.$.firstChild
);
184 widget
.element
.appendHtml(e
.code
);
185 widget
.element
.data('oembed', url
);
186 widget
.element
.data('oembed_provider', provider
.name
);
187 widget
.element
.addClass('oembed-provider-' + provider
.name
);
190 } else if (typeof e
.code
[0].outerHTML
=== 'string') {
192 if (widget
.element
.$.firstChild
) {
193 widget
.element
.$.removeChild(widget
.element
.$.firstChild
);
196 widget
.element
.appendHtml(e
.code
[0].outerHTML
);
197 widget
.element
.data('oembed', url
);
198 widget
.element
.data('oembed_provider', provider
.name
);
199 widget
.element
.addClass('oembed-provider-' + provider
.name
);
203 alert(editor
.lang
.oembed
.noEmbedCode
);
206 onError: function(externalUrl
) {
207 if (externalUrl
.indexOf("vimeo.com") > 0) {
208 alert(editor
.lang
.oembed
.noVimeo
);
210 alert(editor
.lang
.oembed
.Error
);
214 maxHeight: maxHeight
,
216 useResponsiveResize: responsiveResize
,
217 embedMethod: 'editor'
221 CKEDITOR
.dialog
.add('oembed', function(editor
) {
223 title: editor
.lang
.oembed
.title
,
224 minWidth: CKEDITOR
.env
.ie
&& CKEDITOR
.env
.quirks
? 568 : 550,
228 oembed: this.widget
.element
.data('oembed') || '',
229 resizeType: this.widget
.element
.data('resizeType') || 'noresize',
230 maxWidth: this.widget
.element
.data('maxWidth'),
231 maxHeight: this.widget
.element
.data('maxHeight'),
232 align: this.widget
.element
.data('align') || 'none'
235 this.widget
.setData(data
);
237 this.getContentElement('general', 'resizeType').setValue(data
.resizeType
);
239 this.getContentElement('general', 'align').setValue(data
.align
);
241 var resizetype
= this.getContentElement('general', 'resizeType').getValue(),
242 maxSizeBox
= this.getContentElement('general', 'maxSizeBox').getElement(),
243 sizeBox
= this.getContentElement('general', 'sizeBox').getElement();
245 if (resizetype
== 'noresize') {
248 } else if (resizetype
== "custom") {
263 label: editor
.lang
.common
.generalTab
,
269 html: '<div style="white-space:normal;width:500px;padding-bottom:10px">' + editor
.lang
.oembed
.pasteUrl
+ '</div>'
274 this.getElement().focus();
276 label: editor
.lang
.oembed
.url
,
277 title: editor
.lang
.oembed
.pasteUrl
,
278 setup: function(widget
) {
279 if (widget
.data
.oembed
) {
280 this.setValue(widget
.data
.oembed
);
283 commit: function(widget
) {
284 var dialog
= CKEDITOR
.dialog
.getCurrent(),
285 inputCode
= dialog
.getValueOf('general', 'embedCode').replace(/\s/g, ""),
286 resizeType
= dialog
.getContentElement('general', 'resizeType').
288 align
= dialog
.getContentElement('general', 'align').
292 responsiveResize
= false,
293 editorInstance
= dialog
.getParentEditor();
295 if (inputCode
.length
< 1 || inputCode
.indexOf('http') < 0) {
296 alert(editor
.lang
.oembed
.invalidUrl
);
300 if (resizeType
== "noresize") {
301 responsiveResize
= false;
304 } else if (resizeType
== "responsive") {
305 maxWidth
= dialog
.getContentElement('general', 'maxWidth').
308 maxHeight
= dialog
.getContentElement('general', 'maxHeight').
312 responsiveResize
= true;
313 } else if (resizeType
== "custom") {
314 maxWidth
= dialog
.getContentElement('general', 'width').
317 maxHeight
= dialog
.getContentElement('general', 'height').
321 responsiveResize
= false;
324 embedCode(inputCode
, editorInstance
, maxWidth
, maxHeight
, responsiveResize
, resizeType
, align
, widget
);
326 widget
.setData('oembed', inputCode
);
327 widget
.setData('resizeType', resizeType
);
328 widget
.setData('align', align
);
329 widget
.setData('maxWidth', maxWidth
);
330 widget
.setData('maxHeight', maxHeight
);
334 widths: ['50%', '50%'],
339 label: editor
.lang
.oembed
.resizeType
,
340 'default': 'noresize',
341 setup: function(widget
) {
342 if (widget
.data
.resizeType
) {
343 this.setValue(widget
.data
.resizeType
);
347 [editor
.lang
.oembed
.noresize
, 'noresize'],
348 [editor
.lang
.oembed
.responsive
, 'responsive'],
349 [editor
.lang
.oembed
.custom
, 'custom']
351 onChange: resizeTypeChanged
355 widths: ['120px', '120px'],
356 style: 'float:left;position:absolute;left:58%;width:200px',
362 'default': editor
.config
.oembed_maxWidth
!= null ? editor
.config
.oembed_maxWidth : '560',
363 label: editor
.lang
.oembed
.maxWidth
,
364 title: editor
.lang
.oembed
.maxWidthTitle
,
365 setup: function(widget
) {
366 if (widget
.data
.maxWidth
) {
367 this.setValue(widget
.data
.maxWidth
);
374 'default': editor
.config
.oembed_maxHeight
!= null ? editor
.config
.oembed_maxHeight : '315',
375 label: editor
.lang
.oembed
.maxHeight
,
376 title: editor
.lang
.oembed
.maxHeightTitle
,
377 setup: function(widget
) {
378 if (widget
.data
.maxHeight
) {
379 this.setValue(widget
.data
.maxHeight
);
387 widths: ['120px', '120px'],
388 style: 'float:left;position:absolute;left:58%;width:200px',
394 'default': editor
.config
.oembed_maxWidth
!= null ? editor
.config
.oembed_maxWidth : '560',
395 label: editor
.lang
.oembed
.width
,
396 title: editor
.lang
.oembed
.widthTitle
,
397 setup: function(widget
) {
398 if (widget
.data
.maxWidth
) {
399 this.setValue(widget
.data
.maxWidth
);
406 'default': editor
.config
.oembed_maxHeight
!= null ? editor
.config
.oembed_maxHeight : '315',
407 label: editor
.lang
.oembed
.height
,
408 title: editor
.lang
.oembed
.heightTitle
,
409 setup: function(widget
) {
410 if (widget
.data
.maxHeight
) {
411 this.setValue(widget
.data
.maxHeight
);
426 [editor
.lang
.oembed
.none
, 'none'],
427 [editor
.lang
.common
.alignLeft
, 'left'],
428 [editor
.lang
.common
.alignCenter
, 'center'],
429 [editor
.lang
.common
.alignRight
, 'right']
431 label: editor
.lang
.common
.align
,
432 setup: function(widget
) {
433 this.setValue(widget
.data
.align
);