CKEDITOR.plugins.add( 'gasida',
{
	init: function( editor )
	{
		editor.addCommand( 'gasidaCommand', new CKEDITOR.dialogCommand( 'gasidaDialog' ) );
		editor.ui.addButton( 'gasida',
			{
				label: 'تنسيق قصيدة شعرية',
				command: 'gasidaCommand',
				icon: this.path + 'gasida.gif'
			}
		);
		function getDialogValue( dialogName, callback )
		{
			var onOk = function()
			{
				releaseHandlers( this );
				callback( this, this._.parentDialog );
				this._.parentDialog.changeFocus( true );
			};
			var onCancel = function()
			{
				releaseHandlers( this );
				this._.parentDialog.changeFocus();
			};
			var releaseHandlers = function( dialog )
			{
				dialog.removeListener( 'ok', onOk );
				dialog.removeListener( 'cancel', onCancel );
			};
			var bindToDialog = function( dialog )
			{
				dialog.on( 'ok', onOk );
				dialog.on( 'cancel', onCancel );
			};
			editor.execCommand( dialogName );
			if ( editor._.storedDialogs.colordialog )
				bindToDialog( editor._.storedDialogs.colordialog );
			else
			{
				CKEDITOR.on( 'dialogDefinition', function( e )
				{
					if ( e.data.name != dialogName )
						return;

					var definition = e.data.definition;

					e.removeListener();
					definition.onLoad = CKEDITOR.tools.override( definition.onLoad, function( orginal )
					{
						return function()
						{
							bindToDialog( this );
							definition.onLoad = orginal;
							if ( typeof orginal == 'function' )
								orginal.call( this );
						};
					} );
				});
			}
		}
		CKEDITOR.dialog.add( 'gasidaDialog', function( editor )
		{
			var fonts = [];
			var fonts_data = editor.config.font_names.split(';');
			for (i = 0; i < fonts_data.length; i++) {
				fonts.push([fonts_data[i],[fonts_data[i]]]);
			}
			var bkimageItems = [['بلا','none']];
			var imageCount = 335;
			for (var i=1; i<=imageCount; i++) {
				bkimageItems.push( ['صورة ' + i , i] );
			}
			return {
				title : 'تنسيق قصيدة شعرية',
				width : 400,
				height : 'auto',
				contents :
				[
					{
						id : 'gasida',
						label : 'القصيدة',
						elements :
						[
							{
								type : 'html',
								html : '<center>ناسف لعدم توفر ميزة المعاينة المباشرة فى هذا الاصدار</center>'
							},
							{
							
								type : 'select',
								id : 'tablewidth',
								label : 'عرض القصييدة',
								default : '100',
								style: 'width:100px;float:right',
								items :
								[
									[ '50 %', '50' ],
									[ '60 %', '60' ],
									[ '70 %', '70' ],
									[ '80 %', '80' ],
									[ '90 %', '90' ],
									[ '95 %', '95' ],
									[ '100 %', '100' ]
								],
								commit : function( me )
								{
									me.tablewidth = this.getValue();
								}
								
							},{
								type : 'text',
								id : 'title',
								style: 'width:200px;',
								label : 'عنوان القصدية - اختيارى',
								required : false,
								commit : function( me )
								{
									me.title = this.getValue();
								}
							},
							{
								type : 'text',
								id : 'bgColor',
								label : 'لون الخلفية',
								default:'#6666cc',
								style: 'width:100px;',
								required : false,
								onClick : function()
								{
									var self = this;
									getDialogValue( 'colordialog', function( colorDialog )
									{
										self.getDialog().getContentElement( 'gasida', 'bgColor' ).setValue(
											colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue()
										);
									} );
								},
								commit : function( me )
								{
									me.bgColor = this.getValue();
								}
							},{
							
								type : 'select',
								id : 'gasidaStyle',
								label : 'طريقة تنسيق القصيدة',
								default : '1',
								style: 'width:100px;float:right',
								items :
								[
									[ 'تجانب', '0' ],
									[ 'تداخل', '1' ],
									[ 'تقاطع', '2' ],
									[ 'تتالي', '3' ]
								],
								commit : function( me )
								{
									me.gasidaStyle = this.getValue();
								}
								
							},{
							
								type : 'select',
								id : 'bgimage',
								label : 'صورة الخلفية',
								'default' : 'none',
								style: 'width:100px;float:right',
								items : bkimageItems,
								commit : function( me )
								{
									me.bgimage = this.getValue();
								}
								
							}
							
							
						]
					},
					{
						id : 'font',
						label : 'الخط - الكتابة',
						elements :
						[
							{
								type : 'text',
								id : 'fontColor',
								label : 'لون الكتابة',
								default:'black',
								style: 'width:100px;float:right',
								required : false,
								onClick : function()
								{
									var self = this;
									getDialogValue( 'colordialog', function( colorDialog )
									{
										self.getDialog().getContentElement( 'font', 'fontColor' ).setValue(
											colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue()
										);
									} );
								},
								commit : function( me )
								{
									me.fontColor = this.getValue();
								}
							},
							{
							
								type : 'select',
								id : 'fontType',
								label : 'نوع الخط',
								'default' : 'Tahoma',
								style: 'width:100px;float:right',
								items : fonts,
								commit : function( me )
								{
									me.fontType = this.getValue();
								}
								
							},
							{
							
								type : 'select',
								id : 'fontSize',
								label : 'حجم الخط',
								default : 'large',
								style: 'width:100px;float:right',
								items :
								[
									[ 'صغير جدا جدا', 'xx-small' ],
									[ 'صغير جدا', 'x-small' ],
									[ 'صغير ', 'small' ],
									[ 'متوسط', 'medium' ],
									[ 'متوسط', 'large' ],
									[ 'كبير جدا', 'x-large' ],
									[ 'كبير جدا جدا', 'xx-large' ]
									
								],
								commit : function( me )
								{
									me.fontSize = this.getValue();
								}
								
							},
							{
							
								type : 'checkbox',
								id : 'fontBold',
								label : 'خط غامق',
								'default' : 'checked',
								style: 'width:100px;float:right',
								
								commit : function( me )
								{
									me.fontBold = this.getValue();
								}
								
							}
						]
					},
					{
						id : 'border',
						label : 'الإطار',
						elements :
						[
							{
							
								type : 'select',
								id : 'borderType',
								label : 'نوع الإطار',
								default : 'dashed',
								style: 'width:100px;float:right',
								items :
								[
									[ 'مصمت', 'solid' ],
									[ 'مخفى', 'hidden' ],
									[ 'منقط', 'dotted' ],
									[ 'متقطع', 'dashed' ],
									[ 'مزدوج', 'double' ],
									[ 'أخدود', 'groove' ],
									[ 'تل', 'ridge' ],
									[ 'مغروز', 'inset' ],
									[ 'مرتفع', 'outset' ],
									[ 'بدون', 'none' ]
								],
								commit : function( me )
								{
									me.borderType = this.getValue();
								}
								
							},
							{
								type : 'text',
								id : 'borderColor',
								label : 'لون الإطار',
								default:'black',
								style: 'width:100px;',
								required : false,
								onClick : function()
								{
									var self = this;
									getDialogValue( 'colordialog', function( colorDialog )
									{
										self.getDialog().getContentElement( 'border', 'borderColor' ).setValue(
											colorDialog.getContentElement( 'picker', 'selectedColor' ).getValue()
										);
									} );
								},
								commit : function( me )
								{
									me.borderColor = this.getValue();
								}
							},
							{
							
								type : 'select',
								id : 'borderSize',
								label : 'عرض الإطار',
								'default' : '2',
								style: 'width:100px;float:right',
								items :
								[
									[ '1 px', '1' ],
									[ '2 px', '2' ],
									[ '3 px', '3' ],
									[ '4 px', '4' ],
									[ '5 px', '5' ],
									[ '6 px', '6' ],
									[ '7 px', '7' ],
									[ '8 px', '8' ],
									[ '9 px', '9' ]
								],
								commit : function( me )
								{
									me.borderSize = this.getValue();
								}
								
							}
						]
					},{
						id:'about',
						label: 'شرح',
						elements:[
							{
								type : 'html',
								style: 'width:650px;overflow: auto;',
								html : '<div style="text-align: right;font-size:18px;" lang="ar-sa">ليتم تنسيق القصيدة بشكلٍ صحيح, <br />احرص على أن تضع كل شطر بسطر مستقل<br />&nbsp; أو افصل بين شطري كل بيت بنجمة <span lang="ar-sa">&nbsp;</span><br />&nbsp;أو خمس مسافات أو علامة المساواة =<br />&nbsp;مع تأكدك من تحديدك لكامل القصيدة قبيل دخولك إلى هذه الصفحة.<br />&nbsp;كمثال على تنسيق قصيدة:<br />ولقد ثبتت لكم في القلب مودة=كما ثبتت في الراحتين الأصابع</div>'
							}
						]
					}
				],
				onOk : function(me)
				{
					this.commitContent( me );
					var selected  = 'ولقد ثبتت لكم في القلب مودة=كما ثبتت في الراحتين الأصابع ';
					selected = editor.getSelection().getSelectedText();
					if (me.fontBold) {
						me.fontBold = 'bold';
					} else {
						me.fontBold = 'normal';
					}
					var code = '[GASIDA="type=' + me.gasidaStyle + ' title="' + me.title + '" bkcolor=' + me.bgColor + ' color=' + me.fontColor + ' width="' + me.tablewidth + '%" border="' + me.borderSize + 'px ' + me.borderType + ' ' + me.borderColor + '" font="' + me.fontBold + ' ' + me.fontSize + ' ' + me.fontType + '"';
					if (me.bgimage != 'none') {
						code += ' bkimage="mwaextraedit6/backgrounds/' + me.bgimage + '.gif"';
					}
					code +=  ' "]';
					editor.insertHtml(code + selected + '[/GASIDA]');
					
				}
			};
		});
	}
});