70% OFF : CLICK HERE TO BUY IT TODAY FOR ONLY $44.70 OR GET IT FREE VIA TRIALPAY  

PHP Demo Application - Source Code

/Framework/Model/Vendor/CkEditor/_source/plugins/colordialog/dialogs/colordialog.js



/*
Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/
CKEDITOR.dialog.add'colordialog', function( editor )
    {
	        // Define some shorthands.
	        var $el CKEDITOR.dom.element,
	            $doc CKEDITOR.document,
	            $tools CKEDITOR.tools,
	            lang editor.lang.colordialog;
	        // Reference the dialog.
	        var dialog;
	        function spacer()
	        {
		            return {
			                type 'html',
			                html ' 
			'
			            };
		        }
	        function clearSelected()
	        {
		            $doc.getByIdselHiColorId ).removeStyle'background-color' );
		            dialog.getContentElement'picker''selectedColor' ).setValue'' );
		        }
	        function updateSelectedevt )
	        {
		            if ( ! (evt instanceof CKEDITOR.dom.event ) )
		                evt = new CKEDITOR.dom.eventevt );
		            var target evt.getTarget(),
		                    color;
		            if ( target.getName() == 'a' && ( color target.getChild).getHtml() ) )
		                dialog.getContentElement'picker''selectedColor' ).setValuecolor );
		        }
	        function updateHighlightevent )
	        {
		            if ( ! (event instanceof CKEDITOR.dom.event ) )
		                event event.data;
		            var target event.getTarget(),
		                    color;
		            if ( target.getName() == 'a' && ( color target.getChild).getHtml() ) )
		            {
			                $doc.getByIdhicolorId ).setStyle'background-color'color );
			                $doc.getByIdhicolorTextId ).setHtmlcolor );
			            }
		        }
	        function clearHighlight()
	        {
		            $doc.getByIdhicolorId ).removeStyle'background-color' );
		            $doc.getByIdhicolorTextId ).setHtml' 
		' );
		        }
	        var onMouseout $tools.addFunctionclearHighlight );
	        var onClick updateSelected,
	                onClickHandler CKEDITOR.tools.addFunctiononClick );
	        var onFocus updateHighlight,
	                onBlur clearHighlight;
	        var onKeydownHandler CKEDITOR.tools.addFunction( function( ev )
	        {
		            ev = new CKEDITOR.dom.eventev );
		            var element ev.getTarget();
		            var relativenodeToMove;
		            var keystroke ev.getKeystroke();
		            var rtl editor.lang.dir == 'rtl';
		            switch ( keystroke )
		            {
			                // UP-ARROW
			                case 38 :
			                    // relative is TR
			                    if ( ( relative element.getParent().getParent().getPrevious() ) )
			                    {
				                        nodeToMove relative.getChild( [element.getParent().getIndex(), 0] );
				                        nodeToMove.focus();
				                        onBlurevelement );
				                        onFocusevnodeToMove );
				                    }
			                    ev.preventDefault();
			                    break;
			                // DOWN-ARROW
			                case 40 :
			                    // relative is TR
			                    if ( ( relative element.getParent().getParent().getNext() ) )
			                    {
				                        nodeToMove relative.getChild( [ element.getParent().getIndex(), ] );
				                        if ( nodeToMove && nodeToMove.type == )
				                        {
					                            nodeToMove.focus();
					                            onBlurevelement );
					                            onFocusevnodeToMove );
					                        }
				                    }
			                    ev.preventDefault();
			                    break;
			                // SPACE
			                // ENTER is already handled as onClick
			                case 32 :
			                    onClickev );
			                    ev.preventDefault();
			                    break;
			                // RIGHT-ARROW
			                case rtl 37 39 :
			                    // relative is TD
			                    if ( ( relative element.getParent().getNext() ) )
			                    {
				                        nodeToMove relative.getChild);
				                        if ( nodeToMove.type == )
				                        {
					                            nodeToMove.focus();
					                            onBlurevelement );
					                            onFocusevnodeToMove );
					                            ev.preventDefaulttrue );
					                        }
				                        else
				                            onBlurnullelement );
				                    }
			                    // relative is TR
			                    else if ( ( relative element.getParent().getParent().getNext() ) )
			                    {
				                        nodeToMove relative.getChild( [ 0] );
				                        if ( nodeToMove && nodeToMove.type == )
				                        {
					                            nodeToMove.focus();
					                            onBlurevelement );
					                            onFocusevnodeToMove );
					                            ev.preventDefaulttrue );
					                        }
				                        else
				                            onBlurnullelement );
				                    }
			                    break;
			                // LEFT-ARROW
			                case rtl 39 37 :
			                    // relative is TD
			                    if ( ( relative element.getParent().getPrevious() ) )
			                    {
				                        nodeToMove relative.getChild);
				                        nodeToMove.focus();
				                        onBlurevelement );
				                        onFocusevnodeToMove );
				                        ev.preventDefaulttrue );
				                    }
			                    // relative is TR
			                    else if ( ( relative element.getParent().getParent().getPrevious() ) )
			                    {
				                        nodeToMove relative.getLast().getChild);
				                        nodeToMove.focus();
				                        onBlurevelement );
				                        onFocusevnodeToMove );
				                        ev.preventDefaulttrue );
				                    }
			                    else
			                        onBlurnullelement );
			                    break;
			                default :
			                    // Do not stop not handled events.
			                    return;
			            }
		        });
	        function createColorTable()
	        {
		            // Create the base colors array.
		            var aColors = ['00','33','66','99','cc','ff'];
		            // This function combines two ranges of three values from the color array into a row.
		            function appendColorRowrangeArangeB )
		            {
			                for ( var rangeA ;
			 rangeA ;
			 i++ )
			                {
				                    var row table.$.insertRow(-1);
				                    for ( var rangeB ;
				 rangeB ;
				 j++ )
				                    {
					                        for ( var ;
					 ;
					 n++ )
					                        {
						                            appendColorCellrow'#' aColors[j] + aColors[n] + aColors[i] );
						                        }
					                    }
				                }
			            }
		            // This function create a single color cell in the color table.
		            function appendColorCelltargetRowcolor )
		            {
			                var cell = new $eltargetRow.insertCell( -) );
			                cell.setAttribute'class''ColorCell' );
			                cell.setStyle'background-color'color );
			                cell.setStyle'width''15px' );
			                cell.setStyle'height''15px' );
			                var index cell.$.cellIndex 18 targetRow.rowIndex;
			                cell.appendCKEDITOR.dom.element.createFromHtml(
			                        '<a href="javascript: void(0);
			" role="option"' +
			                        ' aria-posinset="' index '"' +
			                        ' aria-setsize="' 13 18 '"' +
			                        ' style="cursor: pointer;
			display:block;
			width:100%;
			height:100% " title="'CKEDITOR.tools.htmlEncodecolor )+ '"' +
			                        ' onkeydown="CKEDITOR.tools.callFunction( ' onKeydownHandler ', event, this )"' +
			                        ' onclick="CKEDITOR.tools.callFunction(' onClickHandler ', event, this );
			 return false;
			"' +
			                        ' tabindex="-1"><span class="cke_voice_label">' color '</span>&nbsp;
			</a>'CKEDITOR.document ) );
			            }
		            appendColorRow0);
		            appendColorRow3);
		            appendColorRow0);
		            appendColorRow3);
		            // Create the last row.
		            var oRow table.$.insertRow(-1) ;
		            // Create the gray scale colors cells.
		            for ( var ;
		 ;
		 n++ )
		            {
			                appendColorCelloRow'#' aColors[n] + aColors[n] + aColors[n] ) ;
			            }
		            // Fill the row with black cells.
		            for ( var ;
		 12 ;
		 i++ )
		            {
			                appendColorCelloRow'#000000' ) ;
			            }
		        }
	        var table = new $el'table' );
	        createColorTable();
	        var numbering = function( id )
	            {
		                return CKEDITOR.tools.getNextId() + '_' id;
		            },
	            hicolorId numbering'hicolor' ),
	            hicolorTextId numbering'hicolortext' ),
	            selHiColorId numbering'selhicolor' ),
	            tableLabelId numbering'color_table_label' );
	        return {
		            title lang.title,
		            minWidth 360,
		            minHeight 220,
		            onLoad : function()
		            {
			                // Update reference.
			                dialog this;
			            },
		            contents : [
		                {
			                    id 'picker',
			                    label lang.title,
			                    accessKey 'I',
			                    elements :
			                    [
			                        {
				                            type 'hbox',
				                            padding 0,
				                            widths : [ '70%''10%''30%' ],
				                            children :
				                            [
				                                {
					                                    type 'html',
					                                    html '<table role="listbox" aria-labelledby="' tableLabelId '" onmouseout="CKEDITOR.tools.callFunction( ' onMouseout ' );
					">' table.getHtml() + '</table>' +
					                                                '<span id="' tableLabelId '" class="cke_voice_label">' lang.options +'</span>',
					                                    onLoad : function()
					                                    {
						                                        var table CKEDITOR.document.getByIdthis.domId );
						                                        table.on'mouseover'updateHighlight );
						                                    },
					                                    focus: function()
					                                    {
						                                        var firstColor this.getElement().getElementsByTag'a' ).getItem);
						                                        firstColor.focus();
						                                    }
					                                },
				                                spacer(),
				                                {
					                                    type 'vbox',
					                                    padding 0,
					                                    widths : [ '70%''5%''25%' ],
					                                    children :
					                                    [
					                                        {
						                                            type 'html',
						                                            html '<span>' lang.highlight +'</span>\
						                                                <div id="' hicolorId '" style="border: 1px solid;
						 height: 74px;
						 width: 74px;
						"></div>\
						                                                <div id="' hicolorTextId '">&nbsp;
						</div><span>' lang.selected '</span>\
						                                                <div id="' selHiColorId '" style="border: 1px solid;
						 height: 20px;
						 width: 74px;
						"></div>'
						                                        },
					                                        {
						                                            type 'text',
						                                            label lang.selected,
						                                            labelStyle'display:none',
						                                            id 'selectedColor',
						                                            style 'width: 74px',
						                                            onChange : function()
						                                            {
							                                                // Try to update color preview with new value. If fails, then set it no none.
							                                                try
							                                                {
								                                                    $doc.getByIdselHiColorId ).setStyle'background-color'this.getValue() );
								                                                }
							                                                catch ( )
							                                                {
								                                                    clearSelected();
								                                                }
							                                            }
						                                        },
					                                        spacer(),
					                                        {
						                                            type 'button',
						                                            id 'clear',
						                                            style 'margin-top: 5px',
						                                            label lang.clear,
						                                            onClick clearSelected
						                                        }
					                                    ]
					                                }
				                            ]
				                        }
			                    ]
			                }
		            ]
		        };
	    }
    );





PHP Demo Source Code Index