FRONTEND_MVC/web/components/admin/ckeditor/plugins/figure/dialogs/figure.js

CKEDITOR.dialog.add( 'figureDialog', function( editor ) {
		function createDiv( editor ) {
            var dialog = this;
            var containers = [];
			var database = {};
			var containedBlocks = [],
				block;
			var selection = editor.getSelection(),
				ranges = selection.getRanges();
			var bookmarks = selection.createBookmarks();
			var i, iterator;
            console.log(selection);
            console.log(bookmarks);
           
            var figure = editor.document.createElement( 'span' );
            figure.setAttribute('class', 'infoblock');
			figure.setAttribute( 'type', dialog.getValueOf('tab-basic', 'orientation')  );
		    figure.setAttribute( 'data-info', dialog.getValueOf( 'tab-basic', 'data-info' ) );
			var selection = editor.getSelection(),
				ranges = selection.getRanges();
			var bookmarks = selection.createBookmarks();
			var i, iterator;
            var txt = selection.getSelectedText();
            figure.appendHtml(txt);
			editor.insertElement( figure );
            containers.push( divElement );
			return containers;
		}
    
    return {
        title: 'Вставка информационный блок',
        minWidth: 400,
        minHeight: 200,
        contents: [
            {
                id: 'tab-basic',
                label: 'Базовые',
                elements: [
					
                    {
                        type: 'text',
                        id: 'data-title',
                        rows: 4,
                        controlStyle: 'height:100%',
                        inputStyle: 'height:100%',
                        label: 'Заголовок',
                        validate: CKEDITOR.dialog.validate.notEmpty( "Поле не должно быть пустым" ),
						
						setup: function( element ) {
                            this.setValue( element.getAttribute( "data-title" ) );
                        },

                        commit: function( element ) {
                            element.setText( this.getValue() );
                        }
                    },
                    {
                        type: 'textarea',
                        id: 'data-info',
                        rows: 4,
                        controlStyle: 'height:100%',
                        inputStyle: 'height:100%',
                        label: 'Текст',
                        validate: CKEDITOR.dialog.validate.notEmpty( "Поле не должно быть пустым" ),
						
						setup: function( element ) {
                            this.setValue( element.getAttribute( "data-info" ) );
                        },

                        commit: function( element ) {
                            element.setText( this.getValue() );
                        }
                    },
					
					{
						type: 'radio',
						id: 'orientation',
						label: 'Выбрать',
						items: [ [ 'тип 1', '1' ], [ 'тип 2', '2' ] ],
						
						'default': '1',
						
						setup: function( element ) {
                            this.setValue( element.getAttribute( "type" ) );
                        },

                        commit: function( element ) {
                            element.setAttribute( "orientation", this.getValue() );
                        }
						
					}
					
						]
            },
           
        ],
		
		onShow: function() {
            var selection = editor.getSelection();
            var element = selection.getStartElement();
            if ( !element || $(element).attr('class') != 'infoblock' ) {
                element = editor.document.createElement( 'span' );
                this.insertMode = true;
            }
            else
                this.insertMode = false;

            this.element = element;
            if ( !this.insertMode )
                this.setupContent( this.element );
        },
		
        onOk: function() {
            var dialog = this;
            var fitem = this.element;
			var selection = editor.getSelection();
 //           console.log(selection);
           
            if ( this.insertMode ){
                var figure = editor.document.createElement( 'span' );
                figure.setAttribute('class', 'infoblock');
                figure.setAttribute( 'type', dialog.getValueOf('tab-basic', 'orientation')  );
                figure.setAttribute( 'data-info', dialog.getValueOf( 'tab-basic', 'data-info' ) );
                figure.setAttribute( 'data-title', dialog.getValueOf( 'tab-basic', 'data-title' ) );
                var selection = editor.getSelection();
                var txt = selection.getSelectedText();
                figure.appendHtml( txt );
//                editor.insertElement( figure );
                //console.log(figure.getOuterHtml());
                editor.insertHtml( ' '+figure.getOuterHtml()+' ','text');
            }else{
                fitem.setAttribute( 'data-info', dialog.getValueOf( 'tab-basic', 'data-info' ) );
                fitem.setAttribute( 'data-title', dialog.getValueOf( 'tab-basic', 'data-title' ) );
                fitem.setAttribute( 'type', dialog.getValueOf('tab-basic', 'orientation')  );
                //dialog.commitContent( fitem );
            }
 /*
            containers.push( figure );

				var size = containers.length;
				for ( var i = 0; i < size; i++ ) {
					this.commitContent( containers[ i ] );
					!containers[ i ].getAttribute( 'style' ) && containers[ i ].removeAttribute( 'style' );
				}*/
				this.hide();

        }
    }
}
);