source: trunk/admin/inc/ckeditor/_source/plugins/forms/dialogs/select.js@ 239

Last change on this file since 239 was 239, checked in by luc, 9 years ago

Admin: correzione visulaizzazione immissione dati spoglio per Chrome e Safari - Aggiornamento dell'editor da FCKeditor a CKeditor , accessibili anche a Chrome e Safari.

  • Property svn:executable set to *
File size: 16.8 KB
Line 
1/*
2Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
3For licensing, see LICENSE.html or http://ckeditor.com/license
4*/
5CKEDITOR.dialog.add( 'select', function( editor )
6{
7 // Add a new option to a SELECT object (combo or list).
8 function addOption( combo, optionText, optionValue, documentObject, index )
9 {
10 combo = getSelect( combo );
11 var oOption;
12 if ( documentObject )
13 oOption = documentObject.createElement( "OPTION" );
14 else
15 oOption = document.createElement( "OPTION" );
16
17 if ( combo && oOption && oOption.getName() == 'option' )
18 {
19 if ( CKEDITOR.env.ie ) {
20 if ( !isNaN( parseInt( index, 10) ) )
21 combo.$.options.add( oOption.$, index );
22 else
23 combo.$.options.add( oOption.$ );
24
25 oOption.$.innerHTML = optionText.length > 0 ? optionText : '';
26 oOption.$.value = optionValue;
27 }
28 else
29 {
30 if ( index !== null && index < combo.getChildCount() )
31 combo.getChild( index < 0 ? 0 : index ).insertBeforeMe( oOption );
32 else
33 combo.append( oOption );
34
35 oOption.setText( optionText.length > 0 ? optionText : '' );
36 oOption.setValue( optionValue );
37 }
38 }
39 else
40 return false;
41
42 return oOption;
43 }
44 // Remove all selected options from a SELECT object.
45 function removeSelectedOptions( combo )
46 {
47 combo = getSelect( combo );
48
49 // Save the selected index
50 var iSelectedIndex = getSelectedIndex( combo );
51
52 // Remove all selected options.
53 for ( var i = combo.getChildren().count() - 1 ; i >= 0 ; i-- )
54 {
55 if ( combo.getChild( i ).$.selected )
56 combo.getChild( i ).remove();
57 }
58
59 // Reset the selection based on the original selected index.
60 setSelectedIndex( combo, iSelectedIndex );
61 }
62 //Modify option from a SELECT object.
63 function modifyOption( combo, index, title, value )
64 {
65 combo = getSelect( combo );
66 if ( index < 0 )
67 return false;
68 var child = combo.getChild( index );
69 child.setText( title );
70 child.setValue( value );
71 return child;
72 }
73 function removeAllOptions( combo )
74 {
75 combo = getSelect( combo );
76 while ( combo.getChild( 0 ) && combo.getChild( 0 ).remove() )
77 { /*jsl:pass*/ }
78 }
79 // Moves the selected option by a number of steps (also negative).
80 function changeOptionPosition( combo, steps, documentObject )
81 {
82 combo = getSelect( combo );
83 var iActualIndex = getSelectedIndex( combo );
84 if ( iActualIndex < 0 )
85 return false;
86
87 var iFinalIndex = iActualIndex + steps;
88 iFinalIndex = ( iFinalIndex < 0 ) ? 0 : iFinalIndex;
89 iFinalIndex = ( iFinalIndex >= combo.getChildCount() ) ? combo.getChildCount() - 1 : iFinalIndex;
90
91 if ( iActualIndex == iFinalIndex )
92 return false;
93
94 var oOption = combo.getChild( iActualIndex ),
95 sText = oOption.getText(),
96 sValue = oOption.getValue();
97
98 oOption.remove();
99
100 oOption = addOption( combo, sText, sValue, ( !documentObject ) ? null : documentObject, iFinalIndex );
101 setSelectedIndex( combo, iFinalIndex );
102 return oOption;
103 }
104 function getSelectedIndex( combo )
105 {
106 combo = getSelect( combo );
107 return combo ? combo.$.selectedIndex : -1;
108 }
109 function setSelectedIndex( combo, index )
110 {
111 combo = getSelect( combo );
112 if ( index < 0 )
113 return null;
114 var count = combo.getChildren().count();
115 combo.$.selectedIndex = ( index >= count ) ? ( count - 1 ) : index;
116 return combo;
117 }
118 function getOptions( combo )
119 {
120 combo = getSelect( combo );
121 return combo ? combo.getChildren() : false;
122 }
123 function getSelect( obj )
124 {
125 if ( obj && obj.domId && obj.getInputElement().$ ) // Dialog element.
126 return obj.getInputElement();
127 else if ( obj && obj.$ )
128 return obj;
129 return false;
130 }
131
132 return {
133 title : editor.lang.select.title,
134 minWidth : CKEDITOR.env.ie ? 460 : 395,
135 minHeight : CKEDITOR.env.ie ? 320 : 300,
136 onShow : function()
137 {
138 delete this.selectBox;
139 this.setupContent( 'clear' );
140 var element = this.getParentEditor().getSelection().getSelectedElement();
141 if ( element && element.getName() == "select" )
142 {
143 this.selectBox = element;
144 this.setupContent( element.getName(), element );
145
146 // Load Options into dialog.
147 var objOptions = getOptions( element );
148 for ( var i = 0 ; i < objOptions.count() ; i++ )
149 this.setupContent( 'option', objOptions.getItem( i ) );
150 }
151 },
152 onOk : function()
153 {
154 var editor = this.getParentEditor(),
155 element = this.selectBox,
156 isInsertMode = !element;
157
158 if ( isInsertMode )
159 element = editor.document.createElement( 'select' );
160 this.commitContent( element );
161
162 if ( isInsertMode )
163 {
164 editor.insertElement( element );
165 if ( CKEDITOR.env.ie )
166 {
167 var sel = editor.getSelection(),
168 bms = sel.createBookmarks();
169 setTimeout(function()
170 {
171 sel.selectBookmarks( bms );
172 }, 0 );
173 }
174 }
175 },
176 contents : [
177 {
178 id : 'info',
179 label : editor.lang.select.selectInfo,
180 title : editor.lang.select.selectInfo,
181 accessKey : '',
182 elements : [
183 {
184 id : 'txtName',
185 type : 'text',
186 widths : [ '25%','75%' ],
187 labelLayout : 'horizontal',
188 label : editor.lang.common.name,
189 'default' : '',
190 accessKey : 'N',
191 style : 'width:350px',
192 setup : function( name, element )
193 {
194 if ( name == 'clear' )
195 this.setValue( this[ 'default' ] || '' );
196 else if ( name == 'select' )
197 {
198 this.setValue(
199 element.data( 'cke-saved-name' ) ||
200 element.getAttribute( 'name' ) ||
201 '' );
202 }
203 },
204 commit : function( element )
205 {
206 if ( this.getValue() )
207 element.data( 'cke-saved-name', this.getValue() );
208 else
209 {
210 element.data( 'cke-saved-name', false );
211 element.removeAttribute( 'name' );
212 }
213 }
214 },
215 {
216 id : 'txtValue',
217 type : 'text',
218 widths : [ '25%','75%' ],
219 labelLayout : 'horizontal',
220 label : editor.lang.select.value,
221 style : 'width:350px',
222 'default' : '',
223 className : 'cke_disabled',
224 onLoad : function()
225 {
226 this.getInputElement().setAttribute( 'readOnly', true );
227 },
228 setup : function( name, element )
229 {
230 if ( name == 'clear' )
231 this.setValue( '' );
232 else if ( name == 'option' && element.getAttribute( 'selected' ) )
233 this.setValue( element.$.value );
234 }
235 },
236 {
237 type : 'hbox',
238 widths : [ '175px', '170px' ],
239 children :
240 [
241 {
242 id : 'txtSize',
243 type : 'text',
244 labelLayout : 'horizontal',
245 label : editor.lang.select.size,
246 'default' : '',
247 accessKey : 'S',
248 style : 'width:175px',
249 validate: function()
250 {
251 var func = CKEDITOR.dialog.validate.integer( editor.lang.common.validateNumberFailed );
252 return ( ( this.getValue() === '' ) || func.apply( this ) );
253 },
254 setup : function( name, element )
255 {
256 if ( name == 'select' )
257 this.setValue( element.getAttribute( 'size' ) || '' );
258 if ( CKEDITOR.env.webkit )
259 this.getInputElement().setStyle( 'width', '86px' );
260 },
261 commit : function( element )
262 {
263 if ( this.getValue() )
264 element.setAttribute( 'size', this.getValue() );
265 else
266 element.removeAttribute( 'size' );
267 }
268 },
269 {
270 type : 'html',
271 html : '<span>' + CKEDITOR.tools.htmlEncode( editor.lang.select.lines ) + '</span>'
272 }
273 ]
274 },
275 {
276 type : 'html',
277 html : '<span>' + CKEDITOR.tools.htmlEncode( editor.lang.select.opAvail ) + '</span>'
278 },
279 {
280 type : 'hbox',
281 widths : [ '115px', '115px' ,'100px' ],
282 children :
283 [
284 {
285 type : 'vbox',
286 children :
287 [
288 {
289 id : 'txtOptName',
290 type : 'text',
291 label : editor.lang.select.opText,
292 style : 'width:115px',
293 setup : function( name, element )
294 {
295 if ( name == 'clear' )
296 this.setValue( "" );
297 }
298 },
299 {
300 type : 'select',
301 id : 'cmbName',
302 label : '',
303 title : '',
304 size : 5,
305 style : 'width:115px;height:75px',
306 items : [],
307 onChange : function()
308 {
309 var dialog = this.getDialog(),
310 values = dialog.getContentElement( 'info', 'cmbValue' ),
311 optName = dialog.getContentElement( 'info', 'txtOptName' ),
312 optValue = dialog.getContentElement( 'info', 'txtOptValue' ),
313 iIndex = getSelectedIndex( this );
314
315 setSelectedIndex( values, iIndex );
316 optName.setValue( this.getValue() );
317 optValue.setValue( values.getValue() );
318 },
319 setup : function( name, element )
320 {
321 if ( name == 'clear' )
322 removeAllOptions( this );
323 else if ( name == 'option' )
324 addOption( this, element.getText(), element.getText(),
325 this.getDialog().getParentEditor().document );
326 },
327 commit : function( element )
328 {
329 var dialog = this.getDialog(),
330 optionsNames = getOptions( this ),
331 optionsValues = getOptions( dialog.getContentElement( 'info', 'cmbValue' ) ),
332 selectValue = dialog.getContentElement( 'info', 'txtValue' ).getValue();
333
334 removeAllOptions( element );
335
336 for ( var i = 0 ; i < optionsNames.count() ; i++ )
337 {
338 var oOption = addOption( element, optionsNames.getItem( i ).getValue(),
339 optionsValues.getItem( i ).getValue(), dialog.getParentEditor().document );
340 if ( optionsValues.getItem( i ).getValue() == selectValue )
341 {
342 oOption.setAttribute( 'selected', 'selected' );
343 oOption.selected = true;
344 }
345 }
346 }
347 }
348 ]
349 },
350 {
351 type : 'vbox',
352 children :
353 [
354 {
355 id : 'txtOptValue',
356 type : 'text',
357 label : editor.lang.select.opValue,
358 style : 'width:115px',
359 setup : function( name, element )
360 {
361 if ( name == 'clear' )
362 this.setValue( "" );
363 }
364 },
365 {
366 type : 'select',
367 id : 'cmbValue',
368 label : '',
369 size : 5,
370 style : 'width:115px;height:75px',
371 items : [],
372 onChange : function()
373 {
374 var dialog = this.getDialog(),
375 names = dialog.getContentElement( 'info', 'cmbName' ),
376 optName = dialog.getContentElement( 'info', 'txtOptName' ),
377 optValue = dialog.getContentElement( 'info', 'txtOptValue' ),
378 iIndex = getSelectedIndex( this );
379
380 setSelectedIndex( names, iIndex );
381 optName.setValue( names.getValue() );
382 optValue.setValue( this.getValue() );
383 },
384 setup : function( name, element )
385 {
386 if ( name == 'clear' )
387 removeAllOptions( this );
388 else if ( name == 'option' )
389 {
390 var oValue = element.getValue();
391 addOption( this, oValue, oValue,
392 this.getDialog().getParentEditor().document );
393 if ( element.getAttribute( 'selected' ) == 'selected' )
394 this.getDialog().getContentElement( 'info', 'txtValue' ).setValue( oValue );
395 }
396 }
397 }
398 ]
399 },
400 {
401 type : 'vbox',
402 padding : 5,
403 children :
404 [
405 {
406 type : 'button',
407 id : 'btnAdd',
408 style : '',
409 label : editor.lang.select.btnAdd,
410 title : editor.lang.select.btnAdd,
411 style : 'width:100%;',
412 onClick : function()
413 {
414 //Add new option.
415 var dialog = this.getDialog(),
416 parentEditor = dialog.getParentEditor(),
417 optName = dialog.getContentElement( 'info', 'txtOptName' ),
418 optValue = dialog.getContentElement( 'info', 'txtOptValue' ),
419 names = dialog.getContentElement( 'info', 'cmbName' ),
420 values = dialog.getContentElement( 'info', 'cmbValue' );
421
422 addOption(names, optName.getValue(), optName.getValue(), dialog.getParentEditor().document );
423 addOption(values, optValue.getValue(), optValue.getValue(), dialog.getParentEditor().document );
424
425 optName.setValue( "" );
426 optValue.setValue( "" );
427 }
428 },
429 {
430 type : 'button',
431 id : 'btnModify',
432 label : editor.lang.select.btnModify,
433 title : editor.lang.select.btnModify,
434 style : 'width:100%;',
435 onClick : function()
436 {
437 //Modify selected option.
438 var dialog = this.getDialog(),
439 optName = dialog.getContentElement( 'info', 'txtOptName' ),
440 optValue = dialog.getContentElement( 'info', 'txtOptValue' ),
441 names = dialog.getContentElement( 'info', 'cmbName' ),
442 values = dialog.getContentElement( 'info', 'cmbValue' ),
443 iIndex = getSelectedIndex( names );
444
445 if ( iIndex >= 0 )
446 {
447 modifyOption( names, iIndex, optName.getValue(), optName.getValue() );
448 modifyOption( values, iIndex, optValue.getValue(), optValue.getValue() );
449 }
450 }
451 },
452 {
453 type : 'button',
454 id : 'btnUp',
455 style : 'width:100%;',
456 label : editor.lang.select.btnUp,
457 title : editor.lang.select.btnUp,
458 onClick : function()
459 {
460 //Move up.
461 var dialog = this.getDialog(),
462 names = dialog.getContentElement( 'info', 'cmbName' ),
463 values = dialog.getContentElement( 'info', 'cmbValue' );
464
465 changeOptionPosition( names, -1, dialog.getParentEditor().document );
466 changeOptionPosition( values, -1, dialog.getParentEditor().document );
467 }
468 },
469 {
470 type : 'button',
471 id : 'btnDown',
472 style : 'width:100%;',
473 label : editor.lang.select.btnDown,
474 title : editor.lang.select.btnDown,
475 onClick : function()
476 {
477 //Move down.
478 var dialog = this.getDialog(),
479 names = dialog.getContentElement( 'info', 'cmbName' ),
480 values = dialog.getContentElement( 'info', 'cmbValue' );
481
482 changeOptionPosition( names, 1, dialog.getParentEditor().document );
483 changeOptionPosition( values, 1, dialog.getParentEditor().document );
484 }
485 }
486 ]
487 }
488 ]
489 },
490 {
491 type : 'hbox',
492 widths : [ '40%', '20%', '40%' ],
493 children :
494 [
495 {
496 type : 'button',
497 id : 'btnSetValue',
498 label : editor.lang.select.btnSetValue,
499 title : editor.lang.select.btnSetValue,
500 onClick : function()
501 {
502 //Set as default value.
503 var dialog = this.getDialog(),
504 values = dialog.getContentElement( 'info', 'cmbValue' ),
505 txtValue = dialog.getContentElement( 'info', 'txtValue' );
506 txtValue.setValue( values.getValue() );
507 }
508 },
509 {
510 type : 'button',
511 id : 'btnDelete',
512 label : editor.lang.select.btnDelete,
513 title : editor.lang.select.btnDelete,
514 onClick : function()
515 {
516 // Delete option.
517 var dialog = this.getDialog(),
518 names = dialog.getContentElement( 'info', 'cmbName' ),
519 values = dialog.getContentElement( 'info', 'cmbValue' ),
520 optName = dialog.getContentElement( 'info', 'txtOptName' ),
521 optValue = dialog.getContentElement( 'info', 'txtOptValue' );
522
523 removeSelectedOptions( names );
524 removeSelectedOptions( values );
525
526 optName.setValue( "" );
527 optValue.setValue( "" );
528 }
529 },
530 {
531 id : 'chkMulti',
532 type : 'checkbox',
533 label : editor.lang.select.chkMulti,
534 'default' : '',
535 accessKey : 'M',
536 value : "checked",
537 setup : function( name, element )
538 {
539 if ( name == 'select' )
540 this.setValue( element.getAttribute( 'multiple' ) );
541 if ( CKEDITOR.env.webkit )
542 this.getElement().getParent().setStyle( 'vertical-align', 'middle' );
543 },
544 commit : function( element )
545 {
546 if ( this.getValue() )
547 element.setAttribute( 'multiple', this.getValue() );
548 else
549 element.removeAttribute( 'multiple' );
550 }
551 }
552 ]
553 }
554 ]
555 }
556 ]
557 };
558});
Note: See TracBrowser for help on using the repository browser.