]>
git.immae.eu Git - perso/Immae/Projets/packagist/connexionswing-ckeditor-component.git/blob - sources/plugins/flash/dialogs/flash.js
af2b856253dd58b14af6976f02a9423b5227bf74
2 * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
3 * For licensing, see LICENSE.md or http://ckeditor.com/license
7 // It is possible to set things in three different places.
8 // 1. As attributes in the object tag.
9 // 2. As param tags under the object tag.
10 // 3. As attributes in the embed tag.
11 // It is possible for a single attribute to be present in more than one place.
12 // So let's define a mapping between a sementic attribute and its syntactic
14 // Then we'll set and retrieve attribute values according to the mapping,
15 // instead of having to check and set each syntactic attribute every time.
17 // Reference: http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_12701
18 var ATTRTYPE_OBJECT
= 1,
24 type: ATTRTYPE_OBJECT
, name: 'id'
27 type: ATTRTYPE_OBJECT
, name: 'classid'
30 type: ATTRTYPE_OBJECT
, name: 'codebase'
33 type: ATTRTYPE_EMBED
, name: 'pluginspage'
36 type: ATTRTYPE_PARAM
, name: 'movie'
38 type: ATTRTYPE_EMBED
, name: 'src'
40 type: ATTRTYPE_OBJECT
, name: 'data'
43 type: ATTRTYPE_EMBED
, name: 'name'
46 type: ATTRTYPE_OBJECT
, name: 'align'
49 type: ATTRTYPE_OBJECT
, name: 'class'
51 type: ATTRTYPE_EMBED
, name: 'class'
54 type: ATTRTYPE_OBJECT
, name: 'width'
56 type: ATTRTYPE_EMBED
, name: 'width'
59 type: ATTRTYPE_OBJECT
, name: 'height'
61 type: ATTRTYPE_EMBED
, name: 'height'
64 type: ATTRTYPE_OBJECT
, name: 'hSpace'
66 type: ATTRTYPE_EMBED
, name: 'hSpace'
69 type: ATTRTYPE_OBJECT
, name: 'vSpace'
71 type: ATTRTYPE_EMBED
, name: 'vSpace'
74 type: ATTRTYPE_OBJECT
, name: 'style'
76 type: ATTRTYPE_EMBED
, name: 'style'
79 type: ATTRTYPE_EMBED
, name: 'type'
83 var names
= [ 'play', 'loop', 'menu', 'quality', 'scale', 'salign', 'wmode', 'bgcolor', 'base', 'flashvars', 'allowScriptAccess', 'allowFullScreen' ];
84 for ( var i
= 0; i
< names
.length
; i
++ ) {
85 attributesMap
[ names
[ i
] ] = [ {
86 type: ATTRTYPE_EMBED
, name: names
[ i
]
88 type: ATTRTYPE_PARAM
, name: names
[ i
]
92 // These attributes are "true" by default and not present in editor data (when "true").
93 // Note that, though default value of "allowFullScreen" is "true", it is not listed here.
94 // "allowFullScreen" is present in editor data regardless of the value (#7634).
95 names
= [ 'play', 'loop', 'menu' ];
96 for ( i
= 0; i
< names
.length
; i
++ )
97 attributesMap
[ names
[ i
] ][ 0 ][ 'default' ] = attributesMap
[ names
[ i
] ][ 1 ][ 'default' ] = true;
99 function loadValue( objectNode
, embedNode
, paramMap
) {
100 var attributes
= attributesMap
[ this.id
];
104 var isCheckbox
= ( this instanceof CKEDITOR
.ui
.dialog
.checkbox
);
105 for ( var i
= 0; i
< attributes
.length
; i
++ ) {
106 var attrDef
= attributes
[ i
];
107 switch ( attrDef
.type
) {
108 case ATTRTYPE_OBJECT:
111 if ( objectNode
.getAttribute( attrDef
.name
) !== null ) {
112 var value
= objectNode
.getAttribute( attrDef
.name
);
114 this.setValue( value
.toLowerCase() == 'true' );
116 this.setValue( value
);
119 } else if ( isCheckbox
) {
120 this.setValue( !!attrDef
['default'] );
127 if ( attrDef
.name
in paramMap
) {
128 value
= paramMap
[ attrDef
.name
];
130 this.setValue( value
.toLowerCase() == 'true' );
132 this.setValue( value
);
134 } else if ( isCheckbox
) {
135 this.setValue( !!attrDef
[ 'default' ] );
141 if ( embedNode
.getAttribute( attrDef
.name
) ) {
142 value
= embedNode
.getAttribute( attrDef
.name
);
144 this.setValue( value
.toLowerCase() == 'true' );
146 this.setValue( value
);
148 } else if ( isCheckbox
) {
149 this.setValue( !!attrDef
[ 'default' ] );
155 function commitValue( objectNode
, embedNode
, paramMap
) {
156 var attributes
= attributesMap
[ this.id
];
160 var isRemove
= ( this.getValue() === '' ),
161 isCheckbox
= ( this instanceof CKEDITOR
.ui
.dialog
.checkbox
);
163 for ( var i
= 0; i
< attributes
.length
; i
++ ) {
164 var attrDef
= attributes
[ i
];
165 switch ( attrDef
.type
) {
166 case ATTRTYPE_OBJECT:
167 // Avoid applying the data attribute when not needed (#7733)
168 if ( !objectNode
|| ( attrDef
.name
== 'data' && embedNode
&& !objectNode
.hasAttribute( 'data' ) ) )
170 var value
= this.getValue();
171 if ( isRemove
|| isCheckbox
&& value
=== attrDef
[ 'default' ] )
172 objectNode
.removeAttribute( attrDef
.name
);
174 objectNode
.setAttribute( attrDef
.name
, value
);
179 value
= this.getValue();
180 if ( isRemove
|| isCheckbox
&& value
=== attrDef
[ 'default' ] ) {
181 if ( attrDef
.name
in paramMap
)
182 paramMap
[ attrDef
.name
].remove();
184 if ( attrDef
.name
in paramMap
)
185 paramMap
[ attrDef
.name
].setAttribute( 'value', value
);
187 var param
= CKEDITOR
.dom
.element
.createFromHtml( '<cke:param></cke:param>', objectNode
.getDocument() );
188 param
.setAttributes( { name: attrDef
.name
, value: value
} );
189 if ( objectNode
.getChildCount() < 1 )
190 param
.appendTo( objectNode
);
192 param
.insertBefore( objectNode
.getFirst() );
199 value
= this.getValue();
200 if ( isRemove
|| isCheckbox
&& value
=== attrDef
[ 'default' ] )
201 embedNode
.removeAttribute( attrDef
.name
);
203 embedNode
.setAttribute( attrDef
.name
, value
);
209 CKEDITOR
.dialog
.add( 'flash', function( editor
) {
210 var makeObjectTag
= !editor
.config
.flashEmbedTagOnly
,
211 makeEmbedTag
= editor
.config
.flashAddEmbedTag
|| editor
.config
.flashEmbedTagOnly
;
213 var previewPreloader
,
214 previewAreaHtml
= '<div>' + CKEDITOR
.tools
.htmlEncode( editor
.lang
.common
.preview
) + '<br>' +
215 '<div id="cke_FlashPreviewLoader' + CKEDITOR
.tools
.getNextNumber() + '" style="display:none"><div class="loading"> </div></div>' +
216 '<div id="cke_FlashPreviewBox' + CKEDITOR
.tools
.getNextNumber() + '" class="FlashPreviewBox"></div></div>';
219 title: editor
.lang
.flash
.title
,
223 // Clear previously saved elements.
224 this.fakeImage
= this.objectNode
= this.embedNode
= null;
225 previewPreloader
= new CKEDITOR
.dom
.element( 'embed', editor
.document
);
227 // Try to detect any embed or object tag that has Flash parameters.
228 var fakeImage
= this.getSelectedElement();
229 if ( fakeImage
&& fakeImage
.data( 'cke-real-element-type' ) && fakeImage
.data( 'cke-real-element-type' ) == 'flash' ) {
230 this.fakeImage
= fakeImage
;
232 var realElement
= editor
.restoreRealElement( fakeImage
),
236 if ( realElement
.getName() == 'cke:object' ) {
237 objectNode
= realElement
;
238 var embedList
= objectNode
.getElementsByTag( 'embed', 'cke' );
239 if ( embedList
.count() > 0 )
240 embedNode
= embedList
.getItem( 0 );
241 var paramList
= objectNode
.getElementsByTag( 'param', 'cke' );
242 for ( var i
= 0, length
= paramList
.count(); i
< length
; i
++ ) {
243 var item
= paramList
.getItem( i
),
244 name
= item
.getAttribute( 'name' ),
245 value
= item
.getAttribute( 'value' );
246 paramMap
[ name
] = value
;
248 } else if ( realElement
.getName() == 'cke:embed' ) {
249 embedNode
= realElement
;
252 this.objectNode
= objectNode
;
253 this.embedNode
= embedNode
;
255 this.setupContent( objectNode
, embedNode
, paramMap
, fakeImage
);
259 // If there's no selected object or embed, create one. Otherwise, reuse the
260 // selected object and embed nodes.
261 var objectNode
= null,
264 if ( !this.fakeImage
) {
265 if ( makeObjectTag
) {
266 objectNode
= CKEDITOR
.dom
.element
.createFromHtml( '<cke:object></cke:object>', editor
.document
);
268 classid: 'clsid:d27cdb6e-ae6d-11cf-96b8-444553540000',
269 codebase: 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0'
271 objectNode
.setAttributes( attributes
);
273 if ( makeEmbedTag
) {
274 embedNode
= CKEDITOR
.dom
.element
.createFromHtml( '<cke:embed></cke:embed>', editor
.document
);
275 embedNode
.setAttributes( {
276 type: 'application/x-shockwave-flash',
277 pluginspage: 'http://www.macromedia.com/go/getflashplayer'
280 embedNode
.appendTo( objectNode
);
283 objectNode
= this.objectNode
;
284 embedNode
= this.embedNode
;
287 // Produce the paramMap if there's an object tag.
290 var paramList
= objectNode
.getElementsByTag( 'param', 'cke' );
291 for ( var i
= 0, length
= paramList
.count(); i
< length
; i
++ )
292 paramMap
[ paramList
.getItem( i
).getAttribute( 'name' ) ] = paramList
.getItem( i
);
295 // A subset of the specified attributes/styles
296 // should also be applied on the fake element to
297 // have better visual effect. (#5240)
298 var extraStyles
= {},
299 extraAttributes
= {};
300 this.commitContent( objectNode
, embedNode
, paramMap
, extraStyles
, extraAttributes
);
302 // Refresh the fake image.
303 var newFakeImage
= editor
.createFakeElement( objectNode
|| embedNode
, 'cke_flash', 'flash', true );
304 newFakeImage
.setAttributes( extraAttributes
);
305 newFakeImage
.setStyles( extraStyles
);
306 if ( this.fakeImage
) {
307 newFakeImage
.replace( this.fakeImage
);
308 editor
.getSelection().selectElement( newFakeImage
);
310 editor
.insertElement( newFakeImage
);
316 this.preview
.setHtml( '' );
321 label: editor
.lang
.common
.generalTab
,
328 widths: [ '280px', '110px' ],
333 label: editor
.lang
.common
.url
,
335 validate: CKEDITOR
.dialog
.validate
.notEmpty( editor
.lang
.flash
.validateSrc
),
339 var dialog
= this.getDialog(),
340 updatePreview = function( src
) {
341 // Query the preloader to figure out the url impacted by based href.
342 previewPreloader
.setAttribute( 'src', src
);
343 dialog
.preview
.setHtml( '<embed height="100%" width="100%" src="' + CKEDITOR
.tools
.htmlEncode( previewPreloader
.getAttribute( 'src' ) ) +
344 '" type="application/x-shockwave-flash"></embed>' );
347 dialog
.preview
= dialog
.getContentElement( 'info', 'preview' ).getElement().getChild( 3 );
349 // Sync on inital value loaded.
350 this.on( 'change', function( evt
) {
352 if ( evt
.data
&& evt
.data
.value
)
353 updatePreview( evt
.data
.value
);
355 // Sync when input value changed.
356 this.getInputElement().on( 'change', function() {
358 updatePreview( this.getValue() );
365 filebrowser: 'info:src',
367 // v-align with the 'src' field.
368 // TODO: We need something better than a fixed size here.
369 style: 'display:inline-block;margin-top:14px;',
370 label: editor
.lang
.common
.browseServer
376 widths: [ '25%', '25%', '25%', '25%', '25%' ],
380 requiredContent: 'embed[width]',
382 label: editor
.lang
.common
.width
,
383 validate: CKEDITOR
.dialog
.validate
.htmlLength( editor
.lang
.common
.invalidHtmlLength
.replace( '%1', editor
.lang
.common
.width
) ),
390 requiredContent: 'embed[height]',
392 label: editor
.lang
.common
.height
,
393 validate: CKEDITOR
.dialog
.validate
.htmlLength( editor
.lang
.common
.invalidHtmlLength
.replace( '%1', editor
.lang
.common
.height
) ),
400 requiredContent: 'embed[hspace]',
402 label: editor
.lang
.flash
.hSpace
,
403 validate: CKEDITOR
.dialog
.validate
.integer( editor
.lang
.flash
.validateHSpace
),
410 requiredContent: 'embed[vspace]',
412 label: editor
.lang
.flash
.vSpace
,
413 validate: CKEDITOR
.dialog
.validate
.integer( editor
.lang
.flash
.validateVSpace
),
425 html: previewAreaHtml
432 filebrowser: 'uploadButton',
433 label: editor
.lang
.common
.upload
,
437 label: editor
.lang
.common
.upload
,
443 label: editor
.lang
.common
.uploadSubmit
,
444 filebrowser: 'info:src',
445 'for': [ 'Upload', 'upload' ]
450 label: editor
.lang
.flash
.propertiesTab
,
453 widths: [ '50%', '50%' ],
457 requiredContent: 'embed[scale]',
458 label: editor
.lang
.flash
.scale
,
460 style: 'width : 100%;',
462 [ editor
.lang
.common
.notSet
, '' ],
463 [ editor
.lang
.flash
.scaleAll
, 'showall' ],
464 [ editor
.lang
.flash
.scaleNoBorder
, 'noborder' ],
465 [ editor
.lang
.flash
.scaleFit
, 'exactfit' ]
471 id: 'allowScriptAccess',
473 requiredContent: 'embed[allowscriptaccess]',
474 label: editor
.lang
.flash
.access
,
476 style: 'width : 100%;',
478 [ editor
.lang
.common
.notSet
, '' ],
479 [ editor
.lang
.flash
.accessAlways
, 'always' ],
480 [ editor
.lang
.flash
.accessSameDomain
, 'samedomain' ],
481 [ editor
.lang
.flash
.accessNever
, 'never' ]
489 widths: [ '50%', '50%' ],
493 requiredContent: 'embed[wmode]',
494 label: editor
.lang
.flash
.windowMode
,
496 style: 'width : 100%;',
498 [ editor
.lang
.common
.notSet
, '' ],
499 [ editor
.lang
.flash
.windowModeWindow
, 'window' ],
500 [ editor
.lang
.flash
.windowModeOpaque
, 'opaque' ],
501 [ editor
.lang
.flash
.windowModeTransparent
, 'transparent' ]
509 requiredContent: 'embed[quality]',
510 label: editor
.lang
.flash
.quality
,
512 style: 'width : 100%;',
514 [ editor
.lang
.common
.notSet
, '' ],
515 [ editor
.lang
.flash
.qualityBest
, 'best' ],
516 [ editor
.lang
.flash
.qualityHigh
, 'high' ],
517 [ editor
.lang
.flash
.qualityAutoHigh
, 'autohigh' ],
518 [ editor
.lang
.flash
.qualityMedium
, 'medium' ],
519 [ editor
.lang
.flash
.qualityAutoLow
, 'autolow' ],
520 [ editor
.lang
.flash
.qualityLow
, 'low' ]
528 widths: [ '50%', '50%' ],
532 requiredContent: 'object[align]',
533 label: editor
.lang
.common
.align
,
535 style: 'width : 100%;',
537 [ editor
.lang
.common
.notSet
, '' ],
538 [ editor
.lang
.common
.alignLeft
, 'left' ],
539 [ editor
.lang
.flash
.alignAbsBottom
, 'absBottom' ],
540 [ editor
.lang
.flash
.alignAbsMiddle
, 'absMiddle' ],
541 [ editor
.lang
.flash
.alignBaseline
, 'baseline' ],
542 [ editor
.lang
.common
.alignBottom
, 'bottom' ],
543 [ editor
.lang
.common
.alignMiddle
, 'middle' ],
544 [ editor
.lang
.common
.alignRight
, 'right' ],
545 [ editor
.lang
.flash
.alignTextTop
, 'textTop' ],
546 [ editor
.lang
.common
.alignTop
, 'top' ]
549 commit: function( objectNode
, embedNode
, paramMap
, extraStyles
, extraAttributes
) {
550 var value
= this.getValue();
551 commitValue
.apply( this, arguments
);
552 value
&& ( extraAttributes
.align
= value
);
562 label: CKEDITOR
.tools
.htmlEncode( editor
.lang
.flash
.flashvars
),
569 label: editor
.lang
.flash
.chkMenu
,
577 label: editor
.lang
.flash
.chkPlay
,
585 label: editor
.lang
.flash
.chkLoop
,
592 id: 'allowFullScreen',
593 label: editor
.lang
.flash
.chkFull
,
603 label: editor
.lang
.common
.advancedTab
,
609 requiredContent: 'object[id]',
610 label: editor
.lang
.common
.id
,
617 widths: [ '45%', '55%' ],
621 requiredContent: 'embed[bgcolor]',
622 label: editor
.lang
.flash
.bgcolor
,
629 requiredContent: 'embed(cke-xyz)', // Random text like 'xyz' will check if all are allowed.
630 label: editor
.lang
.common
.cssClass
,
638 requiredContent: 'embed{cke-xyz}', // Random text like 'xyz' will check if all are allowed.
639 validate: CKEDITOR
.dialog
.validate
.inlineStyle( editor
.lang
.common
.invalidInlineStyle
),
640 label: editor
.lang
.common
.cssStyle
,