]>
git.immae.eu Git - perso/Immae/Projets/packagist/connexionswing-ckeditor-component.git/blob - sources/plugins/forms/dialogs/select.js
32cf76d0b55a483e2b91fc42621fb3112f857e6b
2 * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
3 * For licensing, see LICENSE.md or http://ckeditor.com/license
5 CKEDITOR
.dialog
.add( 'select', function( editor
) {
6 // Add a new option to a SELECT object (combo or list).
7 function addOption( combo
, optionText
, optionValue
, documentObject
, index
) {
8 combo
= getSelect( combo
);
11 oOption
= documentObject
.createElement( 'OPTION' );
13 oOption
= document
.createElement( 'OPTION' );
15 if ( combo
&& oOption
&& oOption
.getName() == 'option' ) {
16 if ( CKEDITOR
.env
.ie
) {
17 if ( !isNaN( parseInt( index
, 10 ) ) )
18 combo
.$.options
.add( oOption
.$, index
);
20 combo
.$.options
.add( oOption
.$ );
22 oOption
.$.innerHTML
= optionText
.length
> 0 ? optionText : '';
23 oOption
.$.value
= optionValue
;
25 if ( index
!== null && index
< combo
.getChildCount() )
26 combo
.getChild( index
< 0 ? 0 : index
).insertBeforeMe( oOption
);
28 combo
.append( oOption
);
30 oOption
.setText( optionText
.length
> 0 ? optionText : '' );
31 oOption
.setValue( optionValue
);
39 // Remove all selected options from a SELECT object.
40 function removeSelectedOptions( combo
) {
41 combo
= getSelect( combo
);
43 // Save the selected index
44 var iSelectedIndex
= getSelectedIndex( combo
);
46 // Remove all selected options.
47 for ( var i
= combo
.getChildren().count() - 1; i
>= 0; i
-- ) {
48 if ( combo
.getChild( i
).$.selected
)
49 combo
.getChild( i
).remove();
52 // Reset the selection based on the original selected index.
53 setSelectedIndex( combo
, iSelectedIndex
);
55 //Modify option from a SELECT object.
56 function modifyOption( combo
, index
, title
, value
) {
57 combo
= getSelect( combo
);
60 var child
= combo
.getChild( index
);
61 child
.setText( title
);
62 child
.setValue( value
);
66 function removeAllOptions( combo
) {
67 combo
= getSelect( combo
);
68 while ( combo
.getChild( 0 ) && combo
.getChild( 0 ).remove() ) {
72 // Moves the selected option by a number of steps (also negative).
73 function changeOptionPosition( combo
, steps
, documentObject
) {
74 combo
= getSelect( combo
);
75 var iActualIndex
= getSelectedIndex( combo
);
76 if ( iActualIndex
< 0 )
79 var iFinalIndex
= iActualIndex
+ steps
;
80 iFinalIndex
= ( iFinalIndex
< 0 ) ? 0 : iFinalIndex
;
81 iFinalIndex
= ( iFinalIndex
>= combo
.getChildCount() ) ? combo
.getChildCount() - 1 : iFinalIndex
;
83 if ( iActualIndex
== iFinalIndex
)
86 var oOption
= combo
.getChild( iActualIndex
),
87 sText
= oOption
.getText(),
88 sValue
= oOption
.getValue();
92 oOption
= addOption( combo
, sText
, sValue
, ( !documentObject
) ? null : documentObject
, iFinalIndex
);
93 setSelectedIndex( combo
, iFinalIndex
);
97 function getSelectedIndex( combo
) {
98 combo
= getSelect( combo
);
99 return combo
? combo
.$.selectedIndex : -1;
102 function setSelectedIndex( combo
, index
) {
103 combo
= getSelect( combo
);
106 var count
= combo
.getChildren().count();
107 combo
.$.selectedIndex
= ( index
>= count
) ? ( count
- 1 ) : index
;
111 function getOptions( combo
) {
112 combo
= getSelect( combo
);
113 return combo
? combo
.getChildren() : false;
116 function getSelect( obj
) {
117 if ( obj
&& obj
.domId
&& obj
.getInputElement().$ ) // Dialog element.
118 return obj
.getInputElement();
119 else if ( obj
&& obj
.$ )
125 title: editor
.lang
.forms
.select
.title
,
126 minWidth: CKEDITOR
.env
.ie
? 460 : 395,
127 minHeight: CKEDITOR
.env
.ie
? 320 : 300,
129 delete this.selectBox
;
130 this.setupContent( 'clear' );
131 var element
= this.getParentEditor().getSelection().getSelectedElement();
132 if ( element
&& element
.getName() == 'select' ) {
133 this.selectBox
= element
;
134 this.setupContent( element
.getName(), element
);
136 // Load Options into dialog.
137 var objOptions
= getOptions( element
);
138 for ( var i
= 0; i
< objOptions
.count(); i
++ )
139 this.setupContent( 'option', objOptions
.getItem( i
) );
143 var editor
= this.getParentEditor(),
144 element
= this.selectBox
,
145 isInsertMode
= !element
;
148 element
= editor
.document
.createElement( 'select' );
149 this.commitContent( element
);
151 if ( isInsertMode
) {
152 editor
.insertElement( element
);
153 if ( CKEDITOR
.env
.ie
) {
154 var sel
= editor
.getSelection(),
155 bms
= sel
.createBookmarks();
156 setTimeout( function() {
157 sel
.selectBookmarks( bms
);
164 label: editor
.lang
.forms
.select
.selectInfo
,
165 title: editor
.lang
.forms
.select
.selectInfo
,
170 widths: [ '25%', '75%' ],
171 labelLayout: 'horizontal',
172 label: editor
.lang
.common
.name
,
175 style: 'width:350px',
176 setup: function( name
, element
) {
177 if ( name
== 'clear' )
178 this.setValue( this[ 'default' ] || '' );
179 else if ( name
== 'select' )
180 this.setValue( element
.data( 'cke-saved-name' ) || element
.getAttribute( 'name' ) || '' );
183 commit: function( element
) {
184 if ( this.getValue() )
185 element
.data( 'cke-saved-name', this.getValue() );
187 element
.data( 'cke-saved-name', false );
188 element
.removeAttribute( 'name' );
195 widths: [ '25%', '75%' ],
196 labelLayout: 'horizontal',
197 label: editor
.lang
.forms
.select
.value
,
198 style: 'width:350px',
200 className: 'cke_disabled',
202 this.getInputElement().setAttribute( 'readOnly', true );
204 setup: function( name
, element
) {
205 if ( name
== 'clear' )
207 else if ( name
== 'option' && element
.getAttribute( 'selected' ) )
208 this.setValue( element
.$.value
);
213 widths: [ '175px', '170px' ],
217 labelLayout: 'horizontal',
218 label: editor
.lang
.forms
.select
.size
,
221 style: 'width:175px',
222 validate: function() {
223 var func
= CKEDITOR
.dialog
.validate
.integer( editor
.lang
.common
.validateNumberFailed
);
224 return ( ( this.getValue() === '' ) || func
.apply( this ) );
226 setup: function( name
, element
) {
227 if ( name
== 'select' )
228 this.setValue( element
.getAttribute( 'size' ) || '' );
229 if ( CKEDITOR
.env
.webkit
)
230 this.getInputElement().setStyle( 'width', '86px' );
232 commit: function( element
) {
233 if ( this.getValue() )
234 element
.setAttribute( 'size', this.getValue() );
236 element
.removeAttribute( 'size' );
241 html: '<span>' + CKEDITOR
.tools
.htmlEncode( editor
.lang
.forms
.select
.lines
) + '</span>'
246 html: '<span>' + CKEDITOR
.tools
.htmlEncode( editor
.lang
.forms
.select
.opAvail
) + '</span>'
250 widths: [ '115px', '115px', '100px' ],
256 label: editor
.lang
.forms
.select
.opText
,
257 style: 'width:115px',
258 setup: function( name
) {
259 if ( name
== 'clear' )
269 style: 'width:115px;height:75px',
271 onChange: function() {
272 var dialog
= this.getDialog(),
273 values
= dialog
.getContentElement( 'info', 'cmbValue' ),
274 optName
= dialog
.getContentElement( 'info', 'txtOptName' ),
275 optValue
= dialog
.getContentElement( 'info', 'txtOptValue' ),
276 iIndex
= getSelectedIndex( this );
278 setSelectedIndex( values
, iIndex
);
279 optName
.setValue( this.getValue() );
280 optValue
.setValue( values
.getValue() );
282 setup: function( name
, element
) {
283 if ( name
== 'clear' )
284 removeAllOptions( this );
285 else if ( name
== 'option' )
286 addOption( this, element
.getText(), element
.getText(), this.getDialog().getParentEditor().document
);
288 commit: function( element
) {
289 var dialog
= this.getDialog(),
290 optionsNames
= getOptions( this ),
291 optionsValues
= getOptions( dialog
.getContentElement( 'info', 'cmbValue' ) ),
292 selectValue
= dialog
.getContentElement( 'info', 'txtValue' ).getValue();
294 removeAllOptions( element
);
296 for ( var i
= 0; i
< optionsNames
.count(); i
++ ) {
297 var oOption
= addOption( element
, optionsNames
.getItem( i
).getValue(), optionsValues
.getItem( i
).getValue(), dialog
.getParentEditor().document
);
298 if ( optionsValues
.getItem( i
).getValue() == selectValue
) {
299 oOption
.setAttribute( 'selected', 'selected' );
300 oOption
.selected
= true;
311 label: editor
.lang
.forms
.select
.opValue
,
312 style: 'width:115px',
313 setup: function( name
) {
314 if ( name
== 'clear' )
323 style: 'width:115px;height:75px',
325 onChange: function() {
326 var dialog
= this.getDialog(),
327 names
= dialog
.getContentElement( 'info', 'cmbName' ),
328 optName
= dialog
.getContentElement( 'info', 'txtOptName' ),
329 optValue
= dialog
.getContentElement( 'info', 'txtOptValue' ),
330 iIndex
= getSelectedIndex( this );
332 setSelectedIndex( names
, iIndex
);
333 optName
.setValue( names
.getValue() );
334 optValue
.setValue( this.getValue() );
336 setup: function( name
, element
) {
337 if ( name
== 'clear' )
338 removeAllOptions( this );
339 else if ( name
== 'option' ) {
340 var oValue
= element
.getValue();
341 addOption( this, oValue
, oValue
, this.getDialog().getParentEditor().document
);
342 if ( element
.getAttribute( 'selected' ) == 'selected' )
343 this.getDialog().getContentElement( 'info', 'txtValue' ).setValue( oValue
);
354 label: editor
.lang
.forms
.select
.btnAdd
,
355 title: editor
.lang
.forms
.select
.btnAdd
,
356 style: 'width:100%;',
357 onClick: function() {
359 var dialog
= this.getDialog(),
360 optName
= dialog
.getContentElement( 'info', 'txtOptName' ),
361 optValue
= dialog
.getContentElement( 'info', 'txtOptValue' ),
362 names
= dialog
.getContentElement( 'info', 'cmbName' ),
363 values
= dialog
.getContentElement( 'info', 'cmbValue' );
365 addOption( names
, optName
.getValue(), optName
.getValue(), dialog
.getParentEditor().document
);
366 addOption( values
, optValue
.getValue(), optValue
.getValue(), dialog
.getParentEditor().document
);
368 optName
.setValue( '' );
369 optValue
.setValue( '' );
375 label: editor
.lang
.forms
.select
.btnModify
,
376 title: editor
.lang
.forms
.select
.btnModify
,
377 style: 'width:100%;',
378 onClick: function() {
379 //Modify selected option.
380 var dialog
= this.getDialog(),
381 optName
= dialog
.getContentElement( 'info', 'txtOptName' ),
382 optValue
= dialog
.getContentElement( 'info', 'txtOptValue' ),
383 names
= dialog
.getContentElement( 'info', 'cmbName' ),
384 values
= dialog
.getContentElement( 'info', 'cmbValue' ),
385 iIndex
= getSelectedIndex( names
);
388 modifyOption( names
, iIndex
, optName
.getValue(), optName
.getValue() );
389 modifyOption( values
, iIndex
, optValue
.getValue(), optValue
.getValue() );
396 style: 'width:100%;',
397 label: editor
.lang
.forms
.select
.btnUp
,
398 title: editor
.lang
.forms
.select
.btnUp
,
399 onClick: function() {
401 var dialog
= this.getDialog(),
402 names
= dialog
.getContentElement( 'info', 'cmbName' ),
403 values
= dialog
.getContentElement( 'info', 'cmbValue' );
405 changeOptionPosition( names
, -1, dialog
.getParentEditor().document
);
406 changeOptionPosition( values
, -1, dialog
.getParentEditor().document
);
412 style: 'width:100%;',
413 label: editor
.lang
.forms
.select
.btnDown
,
414 title: editor
.lang
.forms
.select
.btnDown
,
415 onClick: function() {
417 var dialog
= this.getDialog(),
418 names
= dialog
.getContentElement( 'info', 'cmbName' ),
419 values
= dialog
.getContentElement( 'info', 'cmbValue' );
421 changeOptionPosition( names
, 1, dialog
.getParentEditor().document
);
422 changeOptionPosition( values
, 1, dialog
.getParentEditor().document
);
429 widths: [ '40%', '20%', '40%' ],
433 label: editor
.lang
.forms
.select
.btnSetValue
,
434 title: editor
.lang
.forms
.select
.btnSetValue
,
435 onClick: function() {
436 //Set as default value.
437 var dialog
= this.getDialog(),
438 values
= dialog
.getContentElement( 'info', 'cmbValue' ),
439 txtValue
= dialog
.getContentElement( 'info', 'txtValue' );
440 txtValue
.setValue( values
.getValue() );
446 label: editor
.lang
.forms
.select
.btnDelete
,
447 title: editor
.lang
.forms
.select
.btnDelete
,
448 onClick: function() {
450 var dialog
= this.getDialog(),
451 names
= dialog
.getContentElement( 'info', 'cmbName' ),
452 values
= dialog
.getContentElement( 'info', 'cmbValue' ),
453 optName
= dialog
.getContentElement( 'info', 'txtOptName' ),
454 optValue
= dialog
.getContentElement( 'info', 'txtOptValue' );
456 removeSelectedOptions( names
);
457 removeSelectedOptions( values
);
459 optName
.setValue( '' );
460 optValue
.setValue( '' );
468 label: editor
.lang
.forms
.select
.chkMulti
,
472 setup: function( name
, element
) {
473 if ( name
== 'select' )
474 this.setValue( element
.getAttribute( 'multiple' ) );
476 commit: function( element
) {
477 if ( this.getValue() )
478 element
.setAttribute( 'multiple', this.getValue() );
480 element
.removeAttribute( 'multiple' );
486 label: editor
.lang
.forms
.select
.required
,
490 setup: function( name
, element
) {
491 if ( name
== 'select' )
492 this.setValue( element
.getAttribute( 'required' ) );
494 commit: function( element
) {
495 if ( this.getValue() )
496 element
.setAttribute( 'required', 'required' );
498 element
.removeAttribute( 'required' );