Initial commit

[perso/Immae/Projets/packagist/connexionswing-ckeditor-component.git] / sources / plugins / forms / dialogs / select.js

/**\r
 * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.\r
 * For licensing, see LICENSE.md or http://ckeditor.com/license\r
 */\r
CKEDITOR.dialog.add( 'select', function( editor ) {\r
	// Add a new option to a SELECT object (combo or list).\r
	function addOption( combo, optionText, optionValue, documentObject, index ) {\r
		combo = getSelect( combo );\r
		var oOption;\r
		if ( documentObject )\r
			oOption = documentObject.createElement( 'OPTION' );\r
		else\r
			oOption = document.createElement( 'OPTION' );\r
\r
		if ( combo && oOption && oOption.getName() == 'option' ) {\r
			if ( CKEDITOR.env.ie ) {\r
				if ( !isNaN( parseInt( index, 10 ) ) )\r
					combo.$.options.add( oOption.$, index );\r
				else\r
					combo.$.options.add( oOption.$ );\r
\r
				oOption.$.innerHTML = optionText.length > 0 ? optionText : '';\r
				oOption.$.value = optionValue;\r
			} else {\r
				if ( index !== null && index < combo.getChildCount() )\r
					combo.getChild( index < 0 ? 0 : index ).insertBeforeMe( oOption );\r
				else\r
					combo.append( oOption );\r
\r
				oOption.setText( optionText.length > 0 ? optionText : '' );\r
				oOption.setValue( optionValue );\r
			}\r
		} else {\r
			return false;\r
		}\r
\r
		return oOption;\r
	}\r
	// Remove all selected options from a SELECT object.\r
	function removeSelectedOptions( combo ) {\r
		combo = getSelect( combo );\r
\r
		// Save the selected index\r
		var iSelectedIndex = getSelectedIndex( combo );\r
\r
		// Remove all selected options.\r
		for ( var i = combo.getChildren().count() - 1; i >= 0; i-- ) {\r
			if ( combo.getChild( i ).$.selected )\r
				combo.getChild( i ).remove();\r
		}\r
\r
		// Reset the selection based on the original selected index.\r
		setSelectedIndex( combo, iSelectedIndex );\r
	}\r
	//Modify option  from a SELECT object.\r
	function modifyOption( combo, index, title, value ) {\r
		combo = getSelect( combo );\r
		if ( index < 0 )\r
			return false;\r
		var child = combo.getChild( index );\r
		child.setText( title );\r
		child.setValue( value );\r
		return child;\r
	}\r
\r
	function removeAllOptions( combo ) {\r
		combo = getSelect( combo );\r
		while ( combo.getChild( 0 ) && combo.getChild( 0 ).remove() ) {\r
\r
		}\r
	}\r
	// Moves the selected option by a number of steps (also negative).\r
	function changeOptionPosition( combo, steps, documentObject ) {\r
		combo = getSelect( combo );\r
		var iActualIndex = getSelectedIndex( combo );\r
		if ( iActualIndex < 0 )\r
			return false;\r
\r
		var iFinalIndex = iActualIndex + steps;\r
		iFinalIndex = ( iFinalIndex < 0 ) ? 0 : iFinalIndex;\r
		iFinalIndex = ( iFinalIndex >= combo.getChildCount() ) ? combo.getChildCount() - 1 : iFinalIndex;\r
\r
		if ( iActualIndex == iFinalIndex )\r
			return false;\r
\r
		var oOption = combo.getChild( iActualIndex ),\r
			sText = oOption.getText(),\r
			sValue = oOption.getValue();\r
\r
		oOption.remove();\r
\r
		oOption = addOption( combo, sText, sValue, ( !documentObject ) ? null : documentObject, iFinalIndex );\r
		setSelectedIndex( combo, iFinalIndex );\r
		return oOption;\r
	}\r
\r
	function getSelectedIndex( combo ) {\r
		combo = getSelect( combo );\r
		return combo ? combo.$.selectedIndex : -1;\r
	}\r
\r
	function setSelectedIndex( combo, index ) {\r
		combo = getSelect( combo );\r
		if ( index < 0 )\r
			return null;\r
		var count = combo.getChildren().count();\r
		combo.$.selectedIndex = ( index >= count ) ? ( count - 1 ) : index;\r
		return combo;\r
	}\r
\r
	function getOptions( combo ) {\r
		combo = getSelect( combo );\r
		return combo ? combo.getChildren() : false;\r
	}\r
\r
	function getSelect( obj ) {\r
		if ( obj && obj.domId && obj.getInputElement().$ ) // Dialog element.\r
		return obj.getInputElement();\r
		else if ( obj && obj.$ )\r
			return obj;\r
		return false;\r
	}\r
\r
	return {\r
		title: editor.lang.forms.select.title,\r
		minWidth: CKEDITOR.env.ie ? 460 : 395,\r
		minHeight: CKEDITOR.env.ie ? 320 : 300,\r
		onShow: function() {\r
			delete this.selectBox;\r
			this.setupContent( 'clear' );\r
			var element = this.getParentEditor().getSelection().getSelectedElement();\r
			if ( element && element.getName() == 'select' ) {\r
				this.selectBox = element;\r
				this.setupContent( element.getName(), element );\r
\r
				// Load Options into dialog.\r
				var objOptions = getOptions( element );\r
				for ( var i = 0; i < objOptions.count(); i++ )\r
					this.setupContent( 'option', objOptions.getItem( i ) );\r
			}\r
		},\r
		onOk: function() {\r
			var editor = this.getParentEditor(),\r
				element = this.selectBox,\r
				isInsertMode = !element;\r
\r
			if ( isInsertMode )\r
				element = editor.document.createElement( 'select' );\r
			this.commitContent( element );\r
\r
			if ( isInsertMode ) {\r
				editor.insertElement( element );\r
				if ( CKEDITOR.env.ie ) {\r
					var sel = editor.getSelection(),\r
						bms = sel.createBookmarks();\r
					setTimeout( function() {\r
						sel.selectBookmarks( bms );\r
					}, 0 );\r
				}\r
			}\r
		},\r
		contents: [ {\r
			id: 'info',\r
			label: editor.lang.forms.select.selectInfo,\r
			title: editor.lang.forms.select.selectInfo,\r
			accessKey: '',\r
			elements: [ {\r
				id: 'txtName',\r
				type: 'text',\r
				widths: [ '25%', '75%' ],\r
				labelLayout: 'horizontal',\r
				label: editor.lang.common.name,\r
				'default': '',\r
				accessKey: 'N',\r
				style: 'width:350px',\r
				setup: function( name, element ) {\r
					if ( name == 'clear' )\r
						this.setValue( this[ 'default' ] || '' );\r
					else if ( name == 'select' )\r
						this.setValue( element.data( 'cke-saved-name' ) || element.getAttribute( 'name' ) || '' );\r
\r
				},\r
				commit: function( element ) {\r
					if ( this.getValue() )\r
						element.data( 'cke-saved-name', this.getValue() );\r
					else {\r
						element.data( 'cke-saved-name', false );\r
						element.removeAttribute( 'name' );\r
					}\r
				}\r
			},\r
			{\r
				id: 'txtValue',\r
				type: 'text',\r
				widths: [ '25%', '75%' ],\r
				labelLayout: 'horizontal',\r
				label: editor.lang.forms.select.value,\r
				style: 'width:350px',\r
				'default': '',\r
				className: 'cke_disabled',\r
				onLoad: function() {\r
					this.getInputElement().setAttribute( 'readOnly', true );\r
				},\r
				setup: function( name, element ) {\r
					if ( name == 'clear' )\r
						this.setValue( '' );\r
					else if ( name == 'option' && element.getAttribute( 'selected' ) )\r
						this.setValue( element.$.value );\r
				}\r
			},\r
			{\r
				type: 'hbox',\r
				widths: [ '175px', '170px' ],\r
				children: [ {\r
					id: 'txtSize',\r
					type: 'text',\r
					labelLayout: 'horizontal',\r
					label: editor.lang.forms.select.size,\r
					'default': '',\r
					accessKey: 'S',\r
					style: 'width:175px',\r
					validate: function() {\r
						var func = CKEDITOR.dialog.validate.integer( editor.lang.common.validateNumberFailed );\r
						return ( ( this.getValue() === '' ) || func.apply( this ) );\r
					},\r
					setup: function( name, element ) {\r
						if ( name == 'select' )\r
							this.setValue( element.getAttribute( 'size' ) || '' );\r
						if ( CKEDITOR.env.webkit )\r
							this.getInputElement().setStyle( 'width', '86px' );\r
					},\r
					commit: function( element ) {\r
						if ( this.getValue() )\r
							element.setAttribute( 'size', this.getValue() );\r
						else\r
							element.removeAttribute( 'size' );\r
					}\r
				},\r
				{\r
					type: 'html',\r
					html: '<span>' + CKEDITOR.tools.htmlEncode( editor.lang.forms.select.lines ) + '</span>'\r
				} ]\r
			},\r
			{\r
				type: 'html',\r
				html: '<span>' + CKEDITOR.tools.htmlEncode( editor.lang.forms.select.opAvail ) + '</span>'\r
			},\r
			{\r
				type: 'hbox',\r
				widths: [ '115px', '115px', '100px' ],\r
				children: [ {\r
					type: 'vbox',\r
					children: [ {\r
						id: 'txtOptName',\r
						type: 'text',\r
						label: editor.lang.forms.select.opText,\r
						style: 'width:115px',\r
						setup: function( name ) {\r
							if ( name == 'clear' )\r
								this.setValue( '' );\r
						}\r
					},\r
					{\r
						type: 'select',\r
						id: 'cmbName',\r
						label: '',\r
						title: '',\r
						size: 5,\r
						style: 'width:115px;height:75px',\r
						items: [],\r
						onChange: function() {\r
							var dialog = this.getDialog(),\r
								values = dialog.getContentElement( 'info', 'cmbValue' ),\r
								optName = dialog.getContentElement( 'info', 'txtOptName' ),\r
								optValue = dialog.getContentElement( 'info', 'txtOptValue' ),\r
								iIndex = getSelectedIndex( this );\r
\r
							setSelectedIndex( values, iIndex );\r
							optName.setValue( this.getValue() );\r
							optValue.setValue( values.getValue() );\r
						},\r
						setup: function( name, element ) {\r
							if ( name == 'clear' )\r
								removeAllOptions( this );\r
							else if ( name == 'option' )\r
								addOption( this, element.getText(), element.getText(), this.getDialog().getParentEditor().document );\r
						},\r
						commit: function( element ) {\r
							var dialog = this.getDialog(),\r
								optionsNames = getOptions( this ),\r
								optionsValues = getOptions( dialog.getContentElement( 'info', 'cmbValue' ) ),\r
								selectValue = dialog.getContentElement( 'info', 'txtValue' ).getValue();\r
\r
							removeAllOptions( element );\r
\r
							for ( var i = 0; i < optionsNames.count(); i++ ) {\r
								var oOption = addOption( element, optionsNames.getItem( i ).getValue(), optionsValues.getItem( i ).getValue(), dialog.getParentEditor().document );\r
								if ( optionsValues.getItem( i ).getValue() == selectValue ) {\r
									oOption.setAttribute( 'selected', 'selected' );\r
									oOption.selected = true;\r
								}\r
							}\r
						}\r
					} ]\r
				},\r
				{\r
					type: 'vbox',\r
					children: [ {\r
						id: 'txtOptValue',\r
						type: 'text',\r
						label: editor.lang.forms.select.opValue,\r
						style: 'width:115px',\r
						setup: function( name ) {\r
							if ( name == 'clear' )\r
								this.setValue( '' );\r
						}\r
					},\r
					{\r
						type: 'select',\r
						id: 'cmbValue',\r
						label: '',\r
						size: 5,\r
						style: 'width:115px;height:75px',\r
						items: [],\r
						onChange: function() {\r
							var dialog = this.getDialog(),\r
								names = dialog.getContentElement( 'info', 'cmbName' ),\r
								optName = dialog.getContentElement( 'info', 'txtOptName' ),\r
								optValue = dialog.getContentElement( 'info', 'txtOptValue' ),\r
								iIndex = getSelectedIndex( this );\r
\r
							setSelectedIndex( names, iIndex );\r
							optName.setValue( names.getValue() );\r
							optValue.setValue( this.getValue() );\r
						},\r
						setup: function( name, element ) {\r
							if ( name == 'clear' )\r
								removeAllOptions( this );\r
							else if ( name == 'option' ) {\r
								var oValue = element.getValue();\r
								addOption( this, oValue, oValue, this.getDialog().getParentEditor().document );\r
								if ( element.getAttribute( 'selected' ) == 'selected' )\r
									this.getDialog().getContentElement( 'info', 'txtValue' ).setValue( oValue );\r
							}\r
						}\r
					} ]\r
				},\r
				{\r
					type: 'vbox',\r
					padding: 5,\r
					children: [ {\r
						type: 'button',\r
						id: 'btnAdd',\r
						label: editor.lang.forms.select.btnAdd,\r
						title: editor.lang.forms.select.btnAdd,\r
						style: 'width:100%;',\r
						onClick: function() {\r
							//Add new option.\r
							var dialog = this.getDialog(),\r
								optName = dialog.getContentElement( 'info', 'txtOptName' ),\r
								optValue = dialog.getContentElement( 'info', 'txtOptValue' ),\r
								names = dialog.getContentElement( 'info', 'cmbName' ),\r
								values = dialog.getContentElement( 'info', 'cmbValue' );\r
\r
							addOption( names, optName.getValue(), optName.getValue(), dialog.getParentEditor().document );\r
							addOption( values, optValue.getValue(), optValue.getValue(), dialog.getParentEditor().document );\r
\r
							optName.setValue( '' );\r
							optValue.setValue( '' );\r
						}\r
					},\r
					{\r
						type: 'button',\r
						id: 'btnModify',\r
						label: editor.lang.forms.select.btnModify,\r
						title: editor.lang.forms.select.btnModify,\r
						style: 'width:100%;',\r
						onClick: function() {\r
							//Modify selected option.\r
							var dialog = this.getDialog(),\r
								optName = dialog.getContentElement( 'info', 'txtOptName' ),\r
								optValue = dialog.getContentElement( 'info', 'txtOptValue' ),\r
								names = dialog.getContentElement( 'info', 'cmbName' ),\r
								values = dialog.getContentElement( 'info', 'cmbValue' ),\r
								iIndex = getSelectedIndex( names );\r
\r
							if ( iIndex >= 0 ) {\r
								modifyOption( names, iIndex, optName.getValue(), optName.getValue() );\r
								modifyOption( values, iIndex, optValue.getValue(), optValue.getValue() );\r
							}\r
						}\r
					},\r
					{\r
						type: 'button',\r
						id: 'btnUp',\r
						style: 'width:100%;',\r
						label: editor.lang.forms.select.btnUp,\r
						title: editor.lang.forms.select.btnUp,\r
						onClick: function() {\r
							//Move up.\r
							var dialog = this.getDialog(),\r
								names = dialog.getContentElement( 'info', 'cmbName' ),\r
								values = dialog.getContentElement( 'info', 'cmbValue' );\r
\r
							changeOptionPosition( names, -1, dialog.getParentEditor().document );\r
							changeOptionPosition( values, -1, dialog.getParentEditor().document );\r
						}\r
					},\r
					{\r
						type: 'button',\r
						id: 'btnDown',\r
						style: 'width:100%;',\r
						label: editor.lang.forms.select.btnDown,\r
						title: editor.lang.forms.select.btnDown,\r
						onClick: function() {\r
							//Move down.\r
							var dialog = this.getDialog(),\r
								names = dialog.getContentElement( 'info', 'cmbName' ),\r
								values = dialog.getContentElement( 'info', 'cmbValue' );\r
\r
							changeOptionPosition( names, 1, dialog.getParentEditor().document );\r
							changeOptionPosition( values, 1, dialog.getParentEditor().document );\r
						}\r
					} ]\r
				} ]\r
			},\r
			{\r
				type: 'hbox',\r
				widths: [ '40%', '20%', '40%' ],\r
				children: [ {\r
					type: 'button',\r
					id: 'btnSetValue',\r
					label: editor.lang.forms.select.btnSetValue,\r
					title: editor.lang.forms.select.btnSetValue,\r
					onClick: function() {\r
						//Set as default value.\r
						var dialog = this.getDialog(),\r
							values = dialog.getContentElement( 'info', 'cmbValue' ),\r
							txtValue = dialog.getContentElement( 'info', 'txtValue' );\r
						txtValue.setValue( values.getValue() );\r
					}\r
				},\r
				{\r
					type: 'button',\r
					id: 'btnDelete',\r
					label: editor.lang.forms.select.btnDelete,\r
					title: editor.lang.forms.select.btnDelete,\r
					onClick: function() {\r
						// Delete option.\r
						var dialog = this.getDialog(),\r
							names = dialog.getContentElement( 'info', 'cmbName' ),\r
							values = dialog.getContentElement( 'info', 'cmbValue' ),\r
							optName = dialog.getContentElement( 'info', 'txtOptName' ),\r
							optValue = dialog.getContentElement( 'info', 'txtOptValue' );\r
\r
						removeSelectedOptions( names );\r
						removeSelectedOptions( values );\r
\r
						optName.setValue( '' );\r
						optValue.setValue( '' );\r
					}\r
				},\r
				{\r
					type: 'vbox',\r
					children: [ {\r
						id: 'chkMulti',\r
						type: 'checkbox',\r
						label: editor.lang.forms.select.chkMulti,\r
						'default': '',\r
						accessKey: 'M',\r
						value: 'checked',\r
						setup: function( name, element ) {\r
							if ( name == 'select' )\r
								this.setValue( element.getAttribute( 'multiple' ) );\r
						},\r
						commit: function( element ) {\r
							if ( this.getValue() )\r
								element.setAttribute( 'multiple', this.getValue() );\r
							else\r
								element.removeAttribute( 'multiple' );\r
						}\r
					},\r
					{\r
						id: 'required',\r
						type: 'checkbox',\r
						label: editor.lang.forms.select.required,\r
						'default': '',\r
						accessKey: 'Q',\r
						value: 'checked',\r
						setup: function( name, element ) {\r
							if ( name == 'select' )\r
								this.setValue( element.getAttribute( 'required' ) );\r
						},\r
						commit: function( element ) {\r
							if ( this.getValue() )\r
								element.setAttribute( 'required', 'required' );\r
							else\r
								element.removeAttribute( 'required' );\r
						}\r
					} ]\r
				} ]\r
			} ]\r
		} ]\r
	};\r
} );\r