CKEDITOR.plugins.add( 'moduleISA',
{
	init: function( editor )
	{
		var iconPath = this.path + 'images/icon.gif';
		var insertMode;
 
		editor.addCommand( 'abbrDialog',new CKEDITOR.dialogCommand( 'abbrDialog' ) );
 
		editor.ui.addButton( 'ModuleISA',
		{
			label: 'Insert Abbreviation',
			command: 'abbrDialog',
			icon: iconPath
		} );
 
		if ( editor.contextMenu )
		{
			editor.addMenuGroup( 'myGroup' );
			editor.addMenuItem( 'abbrItem',
			{
				label : 'Edit Abbreviation',
				icon : iconPath,
				command : 'abbrDialog',
				group : 'myGroup'
			});
			editor.contextMenu.addListener( function( element )
			{
				if ( element )
					element = element.getAscendant( 'module', true );
				if ( element && !element.isReadOnly() && !element.data( 'cke-realelement' ) )
 					return { abbrItem : CKEDITOR.TRISTATE_OFF };
				return null;
			});
		}
 
		CKEDITOR.dialog.add( 'abbrDialog', function( editor )
		{
			return {
				title : 'Abbreviation Properties',
				minWidth : 400,
				minHeight : 200,
				contents :
				[
					{
						id : 'tab1',
						label : 'Basic Settings',
						elements :
						[
							{
								
								type : 'select',
								id : 'abbr',
								label : 'Type',
								validate : CKEDITOR.dialog.validate.notEmpty( "Type cannot be empty" ),
								items : 
									[
										['Choose a Module Type', ''],
										['Slideshow', 'slideshow'],
										['Assessment', 'assessment']
									],
								setup : function( element )
								{
									
									if ( element.getChild(0) != null ) {
										
										this.setValue( element.getChild(0).getText() );
									}
								},
								commit : function( element )
								{
									//element.setText( this.getValue() );
									
									console.log("insertMode: " + insertMode);
									
									if ( insertMode ) {
										
										var sub_element = editor.document.createElement( 'span' );
										sub_element.setText(this.getValue() );
										element.append(sub_element);
									} else {
										
										element.getChild(0).setText( this.getValue() );
									}
								}
							},
							{
								type : 'text',
								id : 'title',
								label : 'Explanation',
								validate : CKEDITOR.dialog.validate.notEmpty( "Explanation field cannot be empty" ),
								setup : function( element )
								{
									if ( element.getChild(1) != null ) {
										
										this.setValue( element.getChild(1).getText() );
									}
								},
								commit : function( element )
								{
									
									console.log("insertMode 2: " + insertMode);
									
									if ( insertMode ) {
										var sub_element = editor.document.createElement( 'span' );
										sub_element.setText( this.getValue() );
										sub_element.setAttribute("rel", "data-source");
										element.append(sub_element);
										//element.setAttribute( "title", this.getValue() );
									} else {
										
										element.getChild(1).setText( this.getValue() );
									}
								}
							}	 
						]
					},
					{
						id : 'tab2',
						label : 'Advanced Settings',
						elements :
						[
							{
								type : 'text',
								id : 'id',
								label : 'Id',
								setup : function( element )
								{
									this.setValue( element.getAttribute( "id" ) );
								},
								commit : function ( element )
								{
									var id = this.getValue();
									if ( id )
										element.setAttribute( 'id', id );
									else if ( !this.insertMode )
										element.removeAttribute( 'id' );
								}
							}
						]
					}
				],
				onShow : function()
				{
					var sel = editor.getSelection(),
						element = sel.getStartElement();
					if ( element )
						element = element.getAscendant( 'module', true );
 
					if ( !element || element.getName() != 'module' || element.data( 'cke-realelement' ) ) {
						
						console.log("CREATE ELEMENT");
						element = editor.document.createElement( 'module' );
						insertMode = true;
					} else {
						
						console.log("EDIT ELEMENT");
						insertMode = false;
					}
					
					this.element = element;
					
					//alert("this.insertMode: " + this.insertMode);
 
					this.setupContent( this.element );
				},
				onOk : function(){
					
					
					
					var dialog = this;
					var span = this.element;

					if ( insertMode ) {
						
						//alert("add to editor!");
						editor.insertElement( span );
					}
					
					this.commitContent( span );
				}
			};
		} );
	}
} );