1538 lines
49 KiB
JavaScript
1538 lines
49 KiB
JavaScript
|
/*
|
|||
|
|
Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
|
|||
|
|
For licensing, see LICENSE.html or http://ckeditor.com/license
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/** @fileoverview The "dialogui" plugin. */
|
|||
|
|
|
|||
|
|
CKEDITOR.plugins.add( 'dialogui' );
|
|||
|
|
|
|||
|
|
(function()
|
|||
|
|
{
|
|||
|
|
var initPrivateObject = function( elementDefinition )
|
|||
|
|
{
|
|||
|
|
this._ || ( this._ = {} );
|
|||
|
|
this._['default'] = this._.initValue = elementDefinition['default'] || '';
|
|||
|
|
this._.required = elementDefinition[ 'required' ] || false;
|
|||
|
|
var args = [ this._ ];
|
|||
|
|
for ( var i = 1 ; i < arguments.length ; i++ )
|
|||
|
|
args.push( arguments[i] );
|
|||
|
|
args.push( true );
|
|||
|
|
CKEDITOR.tools.extend.apply( CKEDITOR.tools, args );
|
|||
|
|
return this._;
|
|||
|
|
},
|
|||
|
|
textBuilder =
|
|||
|
|
{
|
|||
|
|
build : function( dialog, elementDefinition, output )
|
|||
|
|
{
|
|||
|
|
return new CKEDITOR.ui.dialog.textInput( dialog, elementDefinition, output );
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
commonBuilder =
|
|||
|
|
{
|
|||
|
|
build : function( dialog, elementDefinition, output )
|
|||
|
|
{
|
|||
|
|
return new CKEDITOR.ui.dialog[elementDefinition.type]( dialog, elementDefinition, output );
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
containerBuilder =
|
|||
|
|
{
|
|||
|
|
build : function( dialog, elementDefinition, output )
|
|||
|
|
{
|
|||
|
|
var children = elementDefinition.children,
|
|||
|
|
child,
|
|||
|
|
childHtmlList = [],
|
|||
|
|
childObjList = [];
|
|||
|
|
for ( var i = 0 ; ( i < children.length && ( child = children[i] ) ) ; i++ )
|
|||
|
|
{
|
|||
|
|
var childHtml = [];
|
|||
|
|
childHtmlList.push( childHtml );
|
|||
|
|
childObjList.push( CKEDITOR.dialog._.uiElementBuilders[ child.type ].build( dialog, child, childHtml ) );
|
|||
|
|
}
|
|||
|
|
return new CKEDITOR.ui.dialog[ elementDefinition.type ]( dialog, childObjList, childHtmlList, output, elementDefinition );
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
commonPrototype =
|
|||
|
|
{
|
|||
|
|
isChanged : function()
|
|||
|
|
{
|
|||
|
|
return this.getValue() != this.getInitValue();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
reset : function( noChangeEvent )
|
|||
|
|
{
|
|||
|
|
this.setValue( this.getInitValue(), noChangeEvent );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
setInitValue : function()
|
|||
|
|
{
|
|||
|
|
this._.initValue = this.getValue();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
resetInitValue : function()
|
|||
|
|
{
|
|||
|
|
this._.initValue = this._['default'];
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
getInitValue : function()
|
|||
|
|
{
|
|||
|
|
return this._.initValue;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
commonEventProcessors = CKEDITOR.tools.extend( {}, CKEDITOR.ui.dialog.uiElement.prototype.eventProcessors,
|
|||
|
|
{
|
|||
|
|
onChange : function( dialog, func )
|
|||
|
|
{
|
|||
|
|
if ( !this._.domOnChangeRegistered )
|
|||
|
|
{
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
this.getInputElement().on( 'change', function()
|
|||
|
|
{
|
|||
|
|
// Make sure 'onchange' doesn't get fired after dialog closed. (#5719)
|
|||
|
|
if ( !dialog.parts.dialog.isVisible() )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
this.fire( 'change', { value : this.getValue() } );
|
|||
|
|
}, this );
|
|||
|
|
}, this );
|
|||
|
|
this._.domOnChangeRegistered = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.on( 'change', func );
|
|||
|
|
}
|
|||
|
|
}, true ),
|
|||
|
|
eventRegex = /^on([A-Z]\w+)/,
|
|||
|
|
cleanInnerDefinition = function( def )
|
|||
|
|
{
|
|||
|
|
// An inner UI element should not have the parent's type, title or events.
|
|||
|
|
for ( var i in def )
|
|||
|
|
{
|
|||
|
|
if ( eventRegex.test( i ) || i == 'title' || i == 'type' )
|
|||
|
|
delete def[i];
|
|||
|
|
}
|
|||
|
|
return def;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
CKEDITOR.tools.extend( CKEDITOR.ui.dialog,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Base class for all dialog elements with a textual label on the left.
|
|||
|
|
* @constructor
|
|||
|
|
* @example
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>label</strong> (Required) The label string.</li>
|
|||
|
|
* <li><strong>labelLayout</strong> (Optional) Put 'horizontal' here if the
|
|||
|
|
* label element is to be layed out horizontally. Otherwise a vertical
|
|||
|
|
* layout will be used.</li>
|
|||
|
|
* <li><strong>widths</strong> (Optional) This applies only for horizontal
|
|||
|
|
* layouts - an 2-element array of lengths to specify the widths of the
|
|||
|
|
* label and the content element.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
* @param {Function} contentHtml
|
|||
|
|
* A function returning the HTML code string to be added inside the content
|
|||
|
|
* cell.
|
|||
|
|
*/
|
|||
|
|
labeledElement : function( dialog, elementDefinition, htmlList, contentHtml )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 4 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
var _ = initPrivateObject.call( this, elementDefinition );
|
|||
|
|
_.labelId = CKEDITOR.tools.getNextId() + '_label';
|
|||
|
|
var children = this._.children = [];
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
var html = [],
|
|||
|
|
requiredClass = elementDefinition.required ? ' cke_required' : '' ;
|
|||
|
|
if ( elementDefinition.labelLayout != 'horizontal' )
|
|||
|
|
html.push( '<label class="cke_dialog_ui_labeled_label' + requiredClass + '" ',
|
|||
|
|
' id="'+ _.labelId + '"',
|
|||
|
|
' for="' + _.inputId + '"',
|
|||
|
|
' style="' + elementDefinition.labelStyle + '">',
|
|||
|
|
elementDefinition.label,
|
|||
|
|
'</label>',
|
|||
|
|
'<div class="cke_dialog_ui_labeled_content" role="presentation">',
|
|||
|
|
contentHtml.call( this, dialog, elementDefinition ),
|
|||
|
|
'</div>' );
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
var hboxDefinition = {
|
|||
|
|
type : 'hbox',
|
|||
|
|
widths : elementDefinition.widths,
|
|||
|
|
padding : 0,
|
|||
|
|
children :
|
|||
|
|
[
|
|||
|
|
{
|
|||
|
|
type : 'html',
|
|||
|
|
html : '<label class="cke_dialog_ui_labeled_label' + requiredClass + '"' +
|
|||
|
|
' id="' + _.labelId + '"' +
|
|||
|
|
' for="' + _.inputId + '"' +
|
|||
|
|
' style="' + elementDefinition.labelStyle + '">' +
|
|||
|
|
CKEDITOR.tools.htmlEncode( elementDefinition.label ) +
|
|||
|
|
'</span>'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
type : 'html',
|
|||
|
|
html : '<span class="cke_dialog_ui_labeled_content">' +
|
|||
|
|
contentHtml.call( this, dialog, elementDefinition ) +
|
|||
|
|
'</span>'
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
CKEDITOR.dialog._.uiElementBuilders.hbox.build( dialog, hboxDefinition, html );
|
|||
|
|
}
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
CKEDITOR.ui.dialog.uiElement.call( this, dialog, elementDefinition, htmlList, 'div', null, { role : 'presentation' }, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A text input with a label. This UI element class represents both the
|
|||
|
|
* single-line text inputs and password inputs in dialog boxes.
|
|||
|
|
* @constructor
|
|||
|
|
* @example
|
|||
|
|
* @extends CKEDITOR.ui.dialog.labeledElement
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>default</strong> (Optional) The default value.</li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function. </li>
|
|||
|
|
* <li><strong>maxLength</strong> (Optional) The maximum length of text box
|
|||
|
|
* contents.</li>
|
|||
|
|
* <li><strong>size</strong> (Optional) The size of the text box. This is
|
|||
|
|
* usually overridden by the size defined by the skin, however.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
textInput : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
initPrivateObject.call( this, elementDefinition );
|
|||
|
|
var domId = this._.inputId = CKEDITOR.tools.getNextId() + '_textInput',
|
|||
|
|
attributes = { 'class' : 'cke_dialog_ui_input_' + elementDefinition.type, id : domId, type : 'text' },
|
|||
|
|
i;
|
|||
|
|
|
|||
|
|
// Set the validator, if any.
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
// Set the max length and size.
|
|||
|
|
if ( elementDefinition.maxLength )
|
|||
|
|
attributes.maxlength = elementDefinition.maxLength;
|
|||
|
|
if ( elementDefinition.size )
|
|||
|
|
attributes.size = elementDefinition.size;
|
|||
|
|
|
|||
|
|
if ( elementDefinition.controlStyle )
|
|||
|
|
attributes.style = elementDefinition.controlStyle;
|
|||
|
|
|
|||
|
|
// If user presses Enter in a text box, it implies clicking OK for the dialog.
|
|||
|
|
var me = this, keyPressedOnMe = false;
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
me.getInputElement().on( 'keydown', function( evt )
|
|||
|
|
{
|
|||
|
|
if ( evt.data.getKeystroke() == 13 )
|
|||
|
|
keyPressedOnMe = true;
|
|||
|
|
} );
|
|||
|
|
|
|||
|
|
// Lower the priority this 'keyup' since 'ok' will close the dialog.(#3749)
|
|||
|
|
me.getInputElement().on( 'keyup', function( evt )
|
|||
|
|
{
|
|||
|
|
if ( evt.data.getKeystroke() == 13 && keyPressedOnMe )
|
|||
|
|
{
|
|||
|
|
dialog.getButton( 'ok' ) && setTimeout( function ()
|
|||
|
|
{
|
|||
|
|
dialog.getButton( 'ok' ).click();
|
|||
|
|
}, 0 );
|
|||
|
|
keyPressedOnMe = false;
|
|||
|
|
}
|
|||
|
|
}, null, null, 1000 );
|
|||
|
|
} );
|
|||
|
|
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
// IE BUG: Text input fields in IE at 100% would exceed a <td> or inline
|
|||
|
|
// container's width, so need to wrap it inside a <div>.
|
|||
|
|
var html = [ '<div class="cke_dialog_ui_input_', elementDefinition.type, '" role="presentation"' ];
|
|||
|
|
|
|||
|
|
if ( elementDefinition.width )
|
|||
|
|
html.push( 'style="width:'+ elementDefinition.width +'" ' );
|
|||
|
|
|
|||
|
|
html.push( '><input ' );
|
|||
|
|
|
|||
|
|
attributes[ 'aria-labelledby' ] = this._.labelId;
|
|||
|
|
this._.required && ( attributes[ 'aria-required' ] = this._.required );
|
|||
|
|
for ( var i in attributes )
|
|||
|
|
html.push( i + '="' + attributes[i] + '" ' );
|
|||
|
|
html.push( ' /></div>' );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.call( this, dialog, elementDefinition, htmlList, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A text area with a label on the top or left.
|
|||
|
|
* @constructor
|
|||
|
|
* @extends CKEDITOR.ui.dialog.labeledElement
|
|||
|
|
* @example
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>rows</strong> (Optional) The number of rows displayed.
|
|||
|
|
* Defaults to 5 if not defined.</li>
|
|||
|
|
* <li><strong>cols</strong> (Optional) The number of cols displayed.
|
|||
|
|
* Defaults to 20 if not defined. Usually overridden by skins.</li>
|
|||
|
|
* <li><strong>default</strong> (Optional) The default value.</li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function. </li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
textarea : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
initPrivateObject.call( this, elementDefinition );
|
|||
|
|
var me = this,
|
|||
|
|
domId = this._.inputId = CKEDITOR.tools.getNextId() + '_textarea',
|
|||
|
|
attributes = {};
|
|||
|
|
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
// Generates the essential attributes for the textarea tag.
|
|||
|
|
attributes.rows = elementDefinition.rows || 5;
|
|||
|
|
attributes.cols = elementDefinition.cols || 20;
|
|||
|
|
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
attributes[ 'aria-labelledby' ] = this._.labelId;
|
|||
|
|
this._.required && ( attributes[ 'aria-required' ] = this._.required );
|
|||
|
|
var html = [ '<div class="cke_dialog_ui_input_textarea" role="presentation"><textarea class="cke_dialog_ui_input_textarea" id="', domId, '" ' ];
|
|||
|
|
for ( var i in attributes )
|
|||
|
|
html.push( i + '="' + CKEDITOR.tools.htmlEncode( attributes[i] ) + '" ' );
|
|||
|
|
html.push( '>', CKEDITOR.tools.htmlEncode( me._['default'] ), '</textarea></div>' );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.call( this, dialog, elementDefinition, htmlList, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A single checkbox with a label on the right.
|
|||
|
|
* @constructor
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @example
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>checked</strong> (Optional) Whether the checkbox is checked
|
|||
|
|
* on instantiation. Defaults to false.</li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function.</li>
|
|||
|
|
* <li><strong>label</strong> (Optional) The checkbox label.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
checkbox : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
var _ = initPrivateObject.call( this, elementDefinition, { 'default' : !!elementDefinition[ 'default' ] } );
|
|||
|
|
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
var myDefinition = CKEDITOR.tools.extend( {}, elementDefinition,
|
|||
|
|
{
|
|||
|
|
id : elementDefinition.id ? elementDefinition.id + '_checkbox' : CKEDITOR.tools.getNextId() + '_checkbox'
|
|||
|
|
}, true ),
|
|||
|
|
html = [];
|
|||
|
|
|
|||
|
|
var labelId = CKEDITOR.tools.getNextId() + '_label';
|
|||
|
|
var attributes = { 'class' : 'cke_dialog_ui_checkbox_input', type : 'checkbox', 'aria-labelledby' : labelId };
|
|||
|
|
cleanInnerDefinition( myDefinition );
|
|||
|
|
if ( elementDefinition[ 'default' ] )
|
|||
|
|
attributes.checked = 'checked';
|
|||
|
|
|
|||
|
|
if ( typeof myDefinition.controlStyle != 'undefined' )
|
|||
|
|
myDefinition.style = myDefinition.controlStyle;
|
|||
|
|
|
|||
|
|
_.checkbox = new CKEDITOR.ui.dialog.uiElement( dialog, myDefinition, html, 'input', null, attributes );
|
|||
|
|
html.push( ' <label id="', labelId, '" for="', attributes.id, '">',
|
|||
|
|
CKEDITOR.tools.htmlEncode( elementDefinition.label ),
|
|||
|
|
'</label>' );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.uiElement.call( this, dialog, elementDefinition, htmlList, 'span', null, null, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A group of radio buttons.
|
|||
|
|
* @constructor
|
|||
|
|
* @example
|
|||
|
|
* @extends CKEDITOR.ui.dialog.labeledElement
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>default</strong> (Required) The default value.</li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function.</li>
|
|||
|
|
* <li><strong>items</strong> (Required) An array of options. Each option
|
|||
|
|
* is a 1- or 2-item array of format [ 'Description', 'Value' ]. If 'Value'
|
|||
|
|
* is missing, then the value would be assumed to be the same as the
|
|||
|
|
* description.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
radio : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3)
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
initPrivateObject.call( this, elementDefinition );
|
|||
|
|
if ( !this._['default'] )
|
|||
|
|
this._['default'] = this._.initValue = elementDefinition.items[0][1];
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.valdiate;
|
|||
|
|
var children = [], me = this;
|
|||
|
|
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
var inputHtmlList = [], html = [],
|
|||
|
|
commonAttributes = { 'class' : 'cke_dialog_ui_radio_item', 'aria-labelledby' : this._.labelId },
|
|||
|
|
commonName = elementDefinition.id ? elementDefinition.id + '_radio' : CKEDITOR.tools.getNextId() + '_radio';
|
|||
|
|
for ( var i = 0 ; i < elementDefinition.items.length ; i++ )
|
|||
|
|
{
|
|||
|
|
var item = elementDefinition.items[i],
|
|||
|
|
title = item[2] !== undefined ? item[2] : item[0],
|
|||
|
|
value = item[1] !== undefined ? item[1] : item[0],
|
|||
|
|
inputId = CKEDITOR.tools.getNextId() + '_radio_input',
|
|||
|
|
labelId = inputId + '_label',
|
|||
|
|
inputDefinition = CKEDITOR.tools.extend( {}, elementDefinition,
|
|||
|
|
{
|
|||
|
|
id : inputId,
|
|||
|
|
title : null,
|
|||
|
|
type : null
|
|||
|
|
}, true ),
|
|||
|
|
labelDefinition = CKEDITOR.tools.extend( {}, inputDefinition,
|
|||
|
|
{
|
|||
|
|
title : title
|
|||
|
|
}, true ),
|
|||
|
|
inputAttributes =
|
|||
|
|
{
|
|||
|
|
type : 'radio',
|
|||
|
|
'class' : 'cke_dialog_ui_radio_input',
|
|||
|
|
name : commonName,
|
|||
|
|
value : value,
|
|||
|
|
'aria-labelledby' : labelId
|
|||
|
|
},
|
|||
|
|
inputHtml = [];
|
|||
|
|
if ( me._['default'] == value )
|
|||
|
|
inputAttributes.checked = 'checked';
|
|||
|
|
cleanInnerDefinition( inputDefinition );
|
|||
|
|
cleanInnerDefinition( labelDefinition );
|
|||
|
|
|
|||
|
|
if ( typeof inputDefinition.controlStyle != 'undefined' )
|
|||
|
|
inputDefinition.style = inputDefinition.controlStyle;
|
|||
|
|
|
|||
|
|
children.push( new CKEDITOR.ui.dialog.uiElement( dialog, inputDefinition, inputHtml, 'input', null, inputAttributes ) );
|
|||
|
|
inputHtml.push( ' ' );
|
|||
|
|
new CKEDITOR.ui.dialog.uiElement( dialog, labelDefinition, inputHtml, 'label', null, { id : labelId, 'for' : inputAttributes.id },
|
|||
|
|
item[0] );
|
|||
|
|
inputHtmlList.push( inputHtml.join( '' ) );
|
|||
|
|
}
|
|||
|
|
new CKEDITOR.ui.dialog.hbox( dialog, [], inputHtmlList, html );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.call( this, dialog, elementDefinition, htmlList, innerHTML );
|
|||
|
|
this._.children = children;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A button with a label inside.
|
|||
|
|
* @constructor
|
|||
|
|
* @example
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>label</strong> (Required) The button label.</li>
|
|||
|
|
* <li><strong>disabled</strong> (Optional) Set to true if you want the
|
|||
|
|
* button to appear in disabled state.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
button : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( !arguments.length )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
if ( typeof elementDefinition == 'function' )
|
|||
|
|
elementDefinition = elementDefinition( dialog.getParentEditor() );
|
|||
|
|
|
|||
|
|
initPrivateObject.call( this, elementDefinition, { disabled : elementDefinition.disabled || false } );
|
|||
|
|
|
|||
|
|
// Add OnClick event to this input.
|
|||
|
|
CKEDITOR.event.implementOn( this );
|
|||
|
|
|
|||
|
|
var me = this;
|
|||
|
|
|
|||
|
|
// Register an event handler for processing button clicks.
|
|||
|
|
dialog.on( 'load', function( eventInfo )
|
|||
|
|
{
|
|||
|
|
var element = this.getElement();
|
|||
|
|
|
|||
|
|
(function()
|
|||
|
|
{
|
|||
|
|
element.on( 'click', function( evt )
|
|||
|
|
{
|
|||
|
|
me.fire( 'click', { dialog : me.getDialog() } );
|
|||
|
|
evt.data.preventDefault();
|
|||
|
|
} );
|
|||
|
|
|
|||
|
|
element.on( 'keydown', function( evt )
|
|||
|
|
{
|
|||
|
|
if ( evt.data.getKeystroke() in { 32:1 } )
|
|||
|
|
{
|
|||
|
|
me.click();
|
|||
|
|
evt.data.preventDefault();
|
|||
|
|
}
|
|||
|
|
} );
|
|||
|
|
})();
|
|||
|
|
|
|||
|
|
element.unselectable();
|
|||
|
|
}, this );
|
|||
|
|
|
|||
|
|
var outerDefinition = CKEDITOR.tools.extend( {}, elementDefinition );
|
|||
|
|
delete outerDefinition.style;
|
|||
|
|
|
|||
|
|
var labelId = CKEDITOR.tools.getNextId() + '_label';
|
|||
|
|
CKEDITOR.ui.dialog.uiElement.call(
|
|||
|
|
this,
|
|||
|
|
dialog,
|
|||
|
|
outerDefinition,
|
|||
|
|
htmlList,
|
|||
|
|
'a',
|
|||
|
|
null,
|
|||
|
|
{
|
|||
|
|
style : elementDefinition.style,
|
|||
|
|
href : 'javascript:void(0)',
|
|||
|
|
title : elementDefinition.label,
|
|||
|
|
hidefocus : 'true',
|
|||
|
|
'class' : elementDefinition['class'],
|
|||
|
|
role : 'button',
|
|||
|
|
'aria-labelledby' : labelId
|
|||
|
|
},
|
|||
|
|
'<span id="' + labelId + '" class="cke_dialog_ui_button">' +
|
|||
|
|
CKEDITOR.tools.htmlEncode( elementDefinition.label ) +
|
|||
|
|
'</span>' );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A select box.
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @example
|
|||
|
|
* @constructor
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>default</strong> (Required) The default value.</li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function.</li>
|
|||
|
|
* <li><strong>items</strong> (Required) An array of options. Each option
|
|||
|
|
* is a 1- or 2-item array of format [ 'Description', 'Value' ]. If 'Value'
|
|||
|
|
* is missing, then the value would be assumed to be the same as the
|
|||
|
|
* description.</li>
|
|||
|
|
* <li><strong>multiple</strong> (Optional) Set this to true if you'd like
|
|||
|
|
* to have a multiple-choice select box.</li>
|
|||
|
|
* <li><strong>size</strong> (Optional) The number of items to display in
|
|||
|
|
* the select box.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
select : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
var _ = initPrivateObject.call( this, elementDefinition );
|
|||
|
|
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
_.inputId = CKEDITOR.tools.getNextId() + '_select';
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
var myDefinition = CKEDITOR.tools.extend( {}, elementDefinition,
|
|||
|
|
{
|
|||
|
|
id : elementDefinition.id ? elementDefinition.id + '_select' : CKEDITOR.tools.getNextId() + '_select'
|
|||
|
|
}, true ),
|
|||
|
|
html = [],
|
|||
|
|
innerHTML = [],
|
|||
|
|
attributes = { 'id' : _.inputId, 'class' : 'cke_dialog_ui_input_select', 'aria-labelledby' : this._.labelId };
|
|||
|
|
|
|||
|
|
// Add multiple and size attributes from element definition.
|
|||
|
|
if ( elementDefinition.size != undefined )
|
|||
|
|
attributes.size = elementDefinition.size;
|
|||
|
|
if ( elementDefinition.multiple != undefined )
|
|||
|
|
attributes.multiple = elementDefinition.multiple;
|
|||
|
|
|
|||
|
|
cleanInnerDefinition( myDefinition );
|
|||
|
|
for ( var i = 0, item ; i < elementDefinition.items.length && ( item = elementDefinition.items[i] ) ; i++ )
|
|||
|
|
{
|
|||
|
|
innerHTML.push( '<option value="',
|
|||
|
|
CKEDITOR.tools.htmlEncode( item[1] !== undefined ? item[1] : item[0] ), '" /> ',
|
|||
|
|
CKEDITOR.tools.htmlEncode( item[0] ) );
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if ( typeof myDefinition.controlStyle != 'undefined' )
|
|||
|
|
myDefinition.style = myDefinition.controlStyle;
|
|||
|
|
|
|||
|
|
_.select = new CKEDITOR.ui.dialog.uiElement( dialog, myDefinition, html, 'select', null, attributes, innerHTML.join( '' ) );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.call( this, dialog, elementDefinition, htmlList, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A file upload input.
|
|||
|
|
* @extends CKEDITOR.ui.dialog.labeledElement
|
|||
|
|
* @example
|
|||
|
|
* @constructor
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
file : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
if ( elementDefinition['default'] === undefined )
|
|||
|
|
elementDefinition['default'] = '';
|
|||
|
|
|
|||
|
|
var _ = CKEDITOR.tools.extend( initPrivateObject.call( this, elementDefinition ), { definition : elementDefinition, buttons : [] } );
|
|||
|
|
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
_.frameId = CKEDITOR.tools.getNextId() + '_fileInput';
|
|||
|
|
|
|||
|
|
// Support for custom document.domain in IE.
|
|||
|
|
var isCustomDomain = CKEDITOR.env.isCustomDomain();
|
|||
|
|
|
|||
|
|
var html = [
|
|||
|
|
'<iframe' +
|
|||
|
|
' frameborder="0"' +
|
|||
|
|
' allowtransparency="0"' +
|
|||
|
|
' class="cke_dialog_ui_input_file"' +
|
|||
|
|
' id="', _.frameId, '"' +
|
|||
|
|
' title="', elementDefinition.label, '"' +
|
|||
|
|
' src="javascript:void(' ];
|
|||
|
|
|
|||
|
|
html.push(
|
|||
|
|
isCustomDomain ?
|
|||
|
|
'(function(){' +
|
|||
|
|
'document.open();' +
|
|||
|
|
'document.domain=\'' + document.domain + '\';' +
|
|||
|
|
'document.close();' +
|
|||
|
|
'})()'
|
|||
|
|
:
|
|||
|
|
'0' );
|
|||
|
|
|
|||
|
|
html.push(
|
|||
|
|
')">' +
|
|||
|
|
'</iframe>' );
|
|||
|
|
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// IE BUG: Parent container does not resize to contain the iframe automatically.
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
var iframe = CKEDITOR.document.getById( _.frameId ),
|
|||
|
|
contentDiv = iframe.getParent();
|
|||
|
|
contentDiv.addClass( 'cke_dialog_ui_input_file' );
|
|||
|
|
} );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.call( this, dialog, elementDefinition, htmlList, innerHTML );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* A button for submitting the file in a file upload input.
|
|||
|
|
* @extends CKEDITOR.ui.dialog.button
|
|||
|
|
* @example
|
|||
|
|
* @constructor
|
|||
|
|
* @param {CKEDITOR.dialog} dialog
|
|||
|
|
* Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>for</strong> (Required) The file input's page and element Id
|
|||
|
|
* to associate to, in a 2-item array format: [ 'page_id', 'element_id' ].
|
|||
|
|
* </li>
|
|||
|
|
* <li><strong>validate</strong> (Optional) The validation function.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* List of HTML code to output to.
|
|||
|
|
*/
|
|||
|
|
fileButton : function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
var _ = initPrivateObject.call( this, elementDefinition ),
|
|||
|
|
me = this;
|
|||
|
|
|
|||
|
|
if ( elementDefinition.validate )
|
|||
|
|
this.validate = elementDefinition.validate;
|
|||
|
|
|
|||
|
|
var myDefinition = CKEDITOR.tools.extend( {}, elementDefinition );
|
|||
|
|
var onClick = myDefinition.onClick;
|
|||
|
|
myDefinition.className = ( myDefinition.className ? myDefinition.className + ' ' : '' ) + 'cke_dialog_ui_button';
|
|||
|
|
myDefinition.onClick = function( evt )
|
|||
|
|
{
|
|||
|
|
var target = elementDefinition[ 'for' ]; // [ pageId, elementId ]
|
|||
|
|
if ( !onClick || onClick.call( this, evt ) !== false )
|
|||
|
|
{
|
|||
|
|
dialog.getContentElement( target[0], target[1] ).submit();
|
|||
|
|
this.disable();
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
dialog.getContentElement( elementDefinition[ 'for' ][0], elementDefinition[ 'for' ][1] )._.buttons.push( me );
|
|||
|
|
} );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.button.call( this, dialog, myDefinition, htmlList );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
html : (function()
|
|||
|
|
{
|
|||
|
|
var myHtmlRe = /^\s*<[\w:]+\s+([^>]*)?>/,
|
|||
|
|
theirHtmlRe = /^(\s*<[\w:]+(?:\s+[^>]*)?)((?:.|\r|\n)+)$/,
|
|||
|
|
emptyTagRe = /\/$/;
|
|||
|
|
/**
|
|||
|
|
* A dialog element made from raw HTML code.
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @name CKEDITOR.ui.dialog.html
|
|||
|
|
* @param {CKEDITOR.dialog} dialog Parent dialog object.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition Element definition.
|
|||
|
|
* Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>html</strong> (Required) HTML code of this element.</li>
|
|||
|
|
* </ul>
|
|||
|
|
* @param {Array} htmlList List of HTML code to be added to the dialog's content area.
|
|||
|
|
* @example
|
|||
|
|
* @constructor
|
|||
|
|
*/
|
|||
|
|
return function( dialog, elementDefinition, htmlList )
|
|||
|
|
{
|
|||
|
|
if ( arguments.length < 3 )
|
|||
|
|
return;
|
|||
|
|
|
|||
|
|
var myHtmlList = [],
|
|||
|
|
myHtml,
|
|||
|
|
theirHtml = elementDefinition.html,
|
|||
|
|
myMatch, theirMatch;
|
|||
|
|
|
|||
|
|
// If the HTML input doesn't contain any tags at the beginning, add a <span> tag around it.
|
|||
|
|
if ( theirHtml.charAt( 0 ) != '<' )
|
|||
|
|
theirHtml = '<span>' + theirHtml + '</span>';
|
|||
|
|
|
|||
|
|
// Look for focus function in definition.
|
|||
|
|
var focus = elementDefinition.focus;
|
|||
|
|
if ( focus )
|
|||
|
|
{
|
|||
|
|
var oldFocus = this.focus;
|
|||
|
|
this.focus = function()
|
|||
|
|
{
|
|||
|
|
oldFocus.call( this );
|
|||
|
|
typeof focus == 'function' && focus.call( this );
|
|||
|
|
this.fire( 'focus' );
|
|||
|
|
};
|
|||
|
|
if ( elementDefinition.isFocusable )
|
|||
|
|
{
|
|||
|
|
var oldIsFocusable = this.isFocusable;
|
|||
|
|
this.isFocusable = oldIsFocusable;
|
|||
|
|
}
|
|||
|
|
this.keyboardFocusable = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.uiElement.call( this, dialog, elementDefinition, myHtmlList, 'span', null, null, '' );
|
|||
|
|
|
|||
|
|
// Append the attributes created by the uiElement call to the real HTML.
|
|||
|
|
myHtml = myHtmlList.join( '' );
|
|||
|
|
myMatch = myHtml.match( myHtmlRe );
|
|||
|
|
theirMatch = theirHtml.match( theirHtmlRe ) || [ '', '', '' ];
|
|||
|
|
|
|||
|
|
if ( emptyTagRe.test( theirMatch[1] ) )
|
|||
|
|
{
|
|||
|
|
theirMatch[1] = theirMatch[1].slice( 0, -1 );
|
|||
|
|
theirMatch[2] = '/' + theirMatch[2];
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
htmlList.push( [ theirMatch[1], ' ', myMatch[1] || '', theirMatch[2] ].join( '' ) );
|
|||
|
|
};
|
|||
|
|
})(),
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Form fieldset for grouping dialog UI elements.
|
|||
|
|
* @constructor
|
|||
|
|
* @extends CKEDITOR.ui.dialog.uiElement
|
|||
|
|
* @param {CKEDITOR.dialog} dialog Parent dialog object.
|
|||
|
|
* @param {Array} childObjList
|
|||
|
|
* Array of {@link CKEDITOR.ui.dialog.uiElement} objects inside this
|
|||
|
|
* container.
|
|||
|
|
* @param {Array} childHtmlList
|
|||
|
|
* Array of HTML code that correspond to the HTML output of all the
|
|||
|
|
* objects in childObjList.
|
|||
|
|
* @param {Array} htmlList
|
|||
|
|
* Array of HTML code that this element will output to.
|
|||
|
|
* @param {CKEDITOR.dialog.definition.uiElement} elementDefinition
|
|||
|
|
* The element definition. Accepted fields:
|
|||
|
|
* <ul>
|
|||
|
|
* <li><strong>label</strong> (Optional) The legend of the this fieldset.</li>
|
|||
|
|
* <li><strong>children</strong> (Required) An array of dialog field definitions which will be grouped inside this fieldset. </li>
|
|||
|
|
* </ul>
|
|||
|
|
*/
|
|||
|
|
fieldset : function( dialog, childObjList, childHtmlList, htmlList, elementDefinition )
|
|||
|
|
{
|
|||
|
|
var legendLabel = elementDefinition.label;
|
|||
|
|
/** @ignore */
|
|||
|
|
var innerHTML = function()
|
|||
|
|
{
|
|||
|
|
var html = [];
|
|||
|
|
legendLabel && html.push( '<legend>' + legendLabel + '</legend>' );
|
|||
|
|
for ( var i = 0; i < childHtmlList.length; i++ )
|
|||
|
|
html.push( childHtmlList[ i ] );
|
|||
|
|
return html.join( '' );
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
this._ = { children : childObjList };
|
|||
|
|
CKEDITOR.ui.dialog.uiElement.call( this, dialog, elementDefinition, htmlList, 'fieldset', null, null, innerHTML );
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.html.prototype = new CKEDITOR.ui.dialog.uiElement;
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.labeledElement.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.uiElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.labeledElement.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Sets the label text of the element.
|
|||
|
|
* @param {String} label The new label text.
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.labeledElement} The current labeled element.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
setLabel : function( label )
|
|||
|
|
{
|
|||
|
|
var node = CKEDITOR.document.getById( this._.labelId );
|
|||
|
|
if ( node.getChildCount() < 1 )
|
|||
|
|
( new CKEDITOR.dom.text( label, CKEDITOR.document ) ).appendTo( node );
|
|||
|
|
else
|
|||
|
|
node.getChild( 0 ).$.nodeValue = label;
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Retrieves the current label text of the elment.
|
|||
|
|
* @returns {String} The current label text.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
getLabel : function()
|
|||
|
|
{
|
|||
|
|
var node = CKEDITOR.document.getById( this._.labelId );
|
|||
|
|
if ( !node || node.getChildCount() < 1 )
|
|||
|
|
return '';
|
|||
|
|
else
|
|||
|
|
return node.getChild( 0 ).getText();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Defines the onChange event for UI element definitions.
|
|||
|
|
* @field
|
|||
|
|
* @type Object
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
eventProcessors : commonEventProcessors
|
|||
|
|
}, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.button.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.uiElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.button.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Simulates a click to the button.
|
|||
|
|
* @example
|
|||
|
|
* @returns {Object} Return value of the 'click' event.
|
|||
|
|
*/
|
|||
|
|
click : function()
|
|||
|
|
{
|
|||
|
|
if ( !this._.disabled )
|
|||
|
|
return this.fire( 'click', { dialog : this._.dialog } );
|
|||
|
|
this.getElement().$.blur();
|
|||
|
|
return false;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Enables the button.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
enable : function()
|
|||
|
|
{
|
|||
|
|
this._.disabled = false;
|
|||
|
|
var element = this.getElement();
|
|||
|
|
element && element.removeClass( 'cke_disabled' );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Disables the button.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
disable : function()
|
|||
|
|
{
|
|||
|
|
this._.disabled = true;
|
|||
|
|
this.getElement().addClass( 'cke_disabled' );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
isVisible : function()
|
|||
|
|
{
|
|||
|
|
return this.getElement().getFirst().isVisible();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
isEnabled : function()
|
|||
|
|
{
|
|||
|
|
return !this._.disabled;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Defines the onChange event and onClick for button element definitions.
|
|||
|
|
* @field
|
|||
|
|
* @type Object
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
eventProcessors : CKEDITOR.tools.extend( {}, CKEDITOR.ui.dialog.uiElement.prototype.eventProcessors,
|
|||
|
|
{
|
|||
|
|
/** @ignore */
|
|||
|
|
onClick : function( dialog, func )
|
|||
|
|
{
|
|||
|
|
this.on( 'click', func );
|
|||
|
|
}
|
|||
|
|
}, true ),
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Handler for the element's access key up event. Simulates a click to
|
|||
|
|
* the button.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
accessKeyUp : function()
|
|||
|
|
{
|
|||
|
|
this.click();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Handler for the element's access key down event. Simulates a mouse
|
|||
|
|
* down to the button.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
accessKeyDown : function()
|
|||
|
|
{
|
|||
|
|
this.focus();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.textInput.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.labeledElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.textInput.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Gets the text input DOM element under this UI object.
|
|||
|
|
* @example
|
|||
|
|
* @returns {CKEDITOR.dom.element} The DOM element of the text input.
|
|||
|
|
*/
|
|||
|
|
getInputElement : function()
|
|||
|
|
{
|
|||
|
|
return CKEDITOR.document.getById( this._.inputId );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Puts focus into the text input.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
focus : function()
|
|||
|
|
{
|
|||
|
|
var me = this.selectParentTab();
|
|||
|
|
|
|||
|
|
// GECKO BUG: setTimeout() is needed to workaround invisible selections.
|
|||
|
|
setTimeout( function()
|
|||
|
|
{
|
|||
|
|
var element = me.getInputElement();
|
|||
|
|
element && element.$.focus();
|
|||
|
|
}, 0 );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Selects all the text in the text input.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
select : function()
|
|||
|
|
{
|
|||
|
|
var me = this.selectParentTab();
|
|||
|
|
|
|||
|
|
// GECKO BUG: setTimeout() is needed to workaround invisible selections.
|
|||
|
|
setTimeout( function()
|
|||
|
|
{
|
|||
|
|
var e = me.getInputElement();
|
|||
|
|
if ( e )
|
|||
|
|
{
|
|||
|
|
e.$.focus();
|
|||
|
|
e.$.select();
|
|||
|
|
}
|
|||
|
|
}, 0 );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Handler for the text input's access key up event. Makes a select()
|
|||
|
|
* call to the text input.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
accessKeyUp : function()
|
|||
|
|
{
|
|||
|
|
this.select();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Sets the value of this text input object.
|
|||
|
|
* @param {Object} value The new value.
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.textInput} The current UI element.
|
|||
|
|
* @example
|
|||
|
|
* uiElement.setValue( 'Blamo' );
|
|||
|
|
*/
|
|||
|
|
setValue : function( value )
|
|||
|
|
{
|
|||
|
|
!value && ( value = '' );
|
|||
|
|
return CKEDITOR.ui.dialog.uiElement.prototype.setValue.apply( this, arguments );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, commonPrototype, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.textarea.prototype = new CKEDITOR.ui.dialog.textInput();
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.select.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.labeledElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.select.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Gets the DOM element of the select box.
|
|||
|
|
* @returns {CKEDITOR.dom.element} The <select> element of this UI
|
|||
|
|
* element.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
getInputElement : function()
|
|||
|
|
{
|
|||
|
|
return this._.select.getElement();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Adds an option to the select box.
|
|||
|
|
* @param {String} label Option label.
|
|||
|
|
* @param {String} value (Optional) Option value, if not defined it'll be
|
|||
|
|
* assumed to be the same as the label.
|
|||
|
|
* @param {Number} index (Optional) Position of the option to be inserted
|
|||
|
|
* to. If not defined the new option will be inserted to the end of list.
|
|||
|
|
* @example
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.select} The current select UI element.
|
|||
|
|
*/
|
|||
|
|
add : function( label, value, index )
|
|||
|
|
{
|
|||
|
|
var option = new CKEDITOR.dom.element( 'option', this.getDialog().getParentEditor().document ),
|
|||
|
|
selectElement = this.getInputElement().$;
|
|||
|
|
option.$.text = label;
|
|||
|
|
option.$.value = ( value === undefined || value === null ) ? label : value;
|
|||
|
|
if ( index === undefined || index === null )
|
|||
|
|
{
|
|||
|
|
if ( CKEDITOR.env.ie )
|
|||
|
|
selectElement.add( option.$ );
|
|||
|
|
else
|
|||
|
|
selectElement.add( option.$, null );
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
selectElement.add( option.$, index );
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Removes an option from the selection list.
|
|||
|
|
* @param {Number} index Index of the option to be removed.
|
|||
|
|
* @example
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.select} The current select UI element.
|
|||
|
|
*/
|
|||
|
|
remove : function( index )
|
|||
|
|
{
|
|||
|
|
var selectElement = this.getInputElement().$;
|
|||
|
|
selectElement.remove( index );
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Clears all options out of the selection list.
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.select} The current select UI element.
|
|||
|
|
*/
|
|||
|
|
clear : function()
|
|||
|
|
{
|
|||
|
|
var selectElement = this.getInputElement().$;
|
|||
|
|
while ( selectElement.length > 0 )
|
|||
|
|
selectElement.remove( 0 );
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, commonPrototype, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.checkbox.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.uiElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.checkbox.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Gets the checkbox DOM element.
|
|||
|
|
* @example
|
|||
|
|
* @returns {CKEDITOR.dom.element} The DOM element of the checkbox.
|
|||
|
|
*/
|
|||
|
|
getInputElement : function()
|
|||
|
|
{
|
|||
|
|
return this._.checkbox.getElement();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Sets the state of the checkbox.
|
|||
|
|
* @example
|
|||
|
|
* @param {Boolean} true to tick the checkbox, false to untick it.
|
|||
|
|
* @param {Boolean} noChangeEvent Internal commit, to supress 'change' event on this element.
|
|||
|
|
*/
|
|||
|
|
setValue : function( checked, noChangeEvent )
|
|||
|
|
{
|
|||
|
|
this.getInputElement().$.checked = checked;
|
|||
|
|
!noChangeEvent && this.fire( 'change', { value : checked } );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Gets the state of the checkbox.
|
|||
|
|
* @example
|
|||
|
|
* @returns {Boolean} true means the checkbox is ticked, false means it's not ticked.
|
|||
|
|
*/
|
|||
|
|
getValue : function()
|
|||
|
|
{
|
|||
|
|
return this.getInputElement().$.checked;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Handler for the access key up event. Toggles the checkbox.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
accessKeyUp : function()
|
|||
|
|
{
|
|||
|
|
this.setValue( !this.getValue() );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Defines the onChange event for UI element definitions.
|
|||
|
|
* @field
|
|||
|
|
* @type Object
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
eventProcessors :
|
|||
|
|
{
|
|||
|
|
onChange : function( dialog, func )
|
|||
|
|
{
|
|||
|
|
if ( !CKEDITOR.env.ie )
|
|||
|
|
return commonEventProcessors.onChange.apply( this, arguments );
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
var element = this._.checkbox.getElement();
|
|||
|
|
element.on( 'propertychange', function( evt )
|
|||
|
|
{
|
|||
|
|
evt = evt.data.$;
|
|||
|
|
if ( evt.propertyName == 'checked' )
|
|||
|
|
this.fire( 'change', { value : element.$.checked } );
|
|||
|
|
}, this );
|
|||
|
|
}, this );
|
|||
|
|
this.on( 'change', func );
|
|||
|
|
}
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, commonPrototype, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.radio.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.uiElement,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.radio.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Checks one of the radio buttons in this button group.
|
|||
|
|
* @example
|
|||
|
|
* @param {String} value The value of the button to be chcked.
|
|||
|
|
* @param {Boolean} noChangeEvent Internal commit, to supress 'change' event on this element.
|
|||
|
|
*/
|
|||
|
|
setValue : function( value, noChangeEvent )
|
|||
|
|
{
|
|||
|
|
var children = this._.children,
|
|||
|
|
item;
|
|||
|
|
for ( var i = 0 ; ( i < children.length ) && ( item = children[i] ) ; i++ )
|
|||
|
|
item.getElement().$.checked = ( item.getValue() == value );
|
|||
|
|
!noChangeEvent && this.fire( 'change', { value : value } );
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Gets the value of the currently checked radio button.
|
|||
|
|
* @example
|
|||
|
|
* @returns {String} The currently checked button's value.
|
|||
|
|
*/
|
|||
|
|
getValue : function()
|
|||
|
|
{
|
|||
|
|
var children = this._.children;
|
|||
|
|
for ( var i = 0 ; i < children.length ; i++ )
|
|||
|
|
{
|
|||
|
|
if ( children[i].getElement().$.checked )
|
|||
|
|
return children[i].getValue();
|
|||
|
|
}
|
|||
|
|
return null;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Handler for the access key up event. Focuses the currently
|
|||
|
|
* selected radio button, or the first radio button if none is
|
|||
|
|
* selected.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
accessKeyUp : function()
|
|||
|
|
{
|
|||
|
|
var children = this._.children, i;
|
|||
|
|
for ( i = 0 ; i < children.length ; i++ )
|
|||
|
|
{
|
|||
|
|
if ( children[i].getElement().$.checked )
|
|||
|
|
{
|
|||
|
|
children[i].getElement().focus();
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
children[0].getElement().focus();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Defines the onChange event for UI element definitions.
|
|||
|
|
* @field
|
|||
|
|
* @type Object
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
eventProcessors :
|
|||
|
|
{
|
|||
|
|
onChange : function( dialog, func )
|
|||
|
|
{
|
|||
|
|
if ( !CKEDITOR.env.ie )
|
|||
|
|
return commonEventProcessors.onChange.apply( this, arguments );
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
dialog.on( 'load', function()
|
|||
|
|
{
|
|||
|
|
var children = this._.children, me = this;
|
|||
|
|
for ( var i = 0 ; i < children.length ; i++ )
|
|||
|
|
{
|
|||
|
|
var element = children[i].getElement();
|
|||
|
|
element.on( 'propertychange', function( evt )
|
|||
|
|
{
|
|||
|
|
evt = evt.data.$;
|
|||
|
|
if ( evt.propertyName == 'checked' && this.$.checked )
|
|||
|
|
me.fire( 'change', { value : this.getAttribute( 'value' ) } );
|
|||
|
|
} );
|
|||
|
|
}
|
|||
|
|
}, this );
|
|||
|
|
this.on( 'change', func );
|
|||
|
|
}
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, commonPrototype, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.file.prototype = CKEDITOR.tools.extend( new CKEDITOR.ui.dialog.labeledElement,
|
|||
|
|
commonPrototype,
|
|||
|
|
/** @lends CKEDITOR.ui.dialog.file.prototype */
|
|||
|
|
{
|
|||
|
|
/**
|
|||
|
|
* Gets the <input> element of this file input.
|
|||
|
|
* @returns {CKEDITOR.dom.element} The file input element.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
getInputElement : function()
|
|||
|
|
{
|
|||
|
|
var frameDocument = CKEDITOR.document.getById( this._.frameId ).getFrameDocument();
|
|||
|
|
return frameDocument.$.forms.length > 0 ?
|
|||
|
|
new CKEDITOR.dom.element( frameDocument.$.forms[0].elements[0] ) :
|
|||
|
|
this.getElement();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Uploads the file in the file input.
|
|||
|
|
* @returns {CKEDITOR.ui.dialog.file} This object.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
submit : function()
|
|||
|
|
{
|
|||
|
|
this.getInputElement().getParent().$.submit();
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Get the action assigned to the form.
|
|||
|
|
* @returns {String} The value of the action.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
getAction : function()
|
|||
|
|
{
|
|||
|
|
return this.getInputElement().getParent().$.action;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* The events must be applied on the inner input element, and
|
|||
|
|
* that must be done when the iframe & form has been loaded
|
|||
|
|
*/
|
|||
|
|
registerEvents : function( definition )
|
|||
|
|
{
|
|||
|
|
var regex = /^on([A-Z]\w+)/,
|
|||
|
|
match;
|
|||
|
|
|
|||
|
|
var registerDomEvent = function( uiElement, dialog, eventName, func )
|
|||
|
|
{
|
|||
|
|
uiElement.on( 'formLoaded', function()
|
|||
|
|
{
|
|||
|
|
uiElement.getInputElement().on( eventName, func, uiElement );
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
for ( var i in definition )
|
|||
|
|
{
|
|||
|
|
if ( !( match = i.match( regex ) ) )
|
|||
|
|
continue;
|
|||
|
|
|
|||
|
|
if ( this.eventProcessors[i] )
|
|||
|
|
this.eventProcessors[i].call( this, this._.dialog, definition[i] );
|
|||
|
|
else
|
|||
|
|
registerDomEvent( this, this._.dialog, match[1].toLowerCase(), definition[i] );
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return this;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Redraws the file input and resets the file path in the file input.
|
|||
|
|
* The redraw logic is necessary because non-IE browsers tend to clear
|
|||
|
|
* the <iframe> containing the file input after closing the dialog.
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
reset : function()
|
|||
|
|
{
|
|||
|
|
var _ = this._,
|
|||
|
|
frameElement = CKEDITOR.document.getById( _.frameId ),
|
|||
|
|
frameDocument = frameElement.getFrameDocument(),
|
|||
|
|
elementDefinition = _.definition,
|
|||
|
|
buttons = _.buttons,
|
|||
|
|
callNumber = this.formLoadedNumber,
|
|||
|
|
unloadNumber = this.formUnloadNumber,
|
|||
|
|
langDir = _.dialog._.editor.lang.dir,
|
|||
|
|
langCode = _.dialog._.editor.langCode;
|
|||
|
|
|
|||
|
|
// The callback function for the iframe, but we must call tools.addFunction only once
|
|||
|
|
// so we store the function number in this.formLoadedNumber
|
|||
|
|
if ( !callNumber )
|
|||
|
|
{
|
|||
|
|
callNumber = this.formLoadedNumber = CKEDITOR.tools.addFunction(
|
|||
|
|
function()
|
|||
|
|
{
|
|||
|
|
// Now we can apply the events to the input type=file
|
|||
|
|
this.fire( 'formLoaded' ) ;
|
|||
|
|
}, this ) ;
|
|||
|
|
|
|||
|
|
// Remove listeners attached to the content of the iframe (the file input)
|
|||
|
|
unloadNumber = this.formUnloadNumber = CKEDITOR.tools.addFunction(
|
|||
|
|
function()
|
|||
|
|
{
|
|||
|
|
this.getInputElement().clearCustomData();
|
|||
|
|
}, this ) ;
|
|||
|
|
|
|||
|
|
this.getDialog()._.editor.on( 'destroy', function()
|
|||
|
|
{
|
|||
|
|
CKEDITOR.tools.removeFunction( callNumber );
|
|||
|
|
CKEDITOR.tools.removeFunction( unloadNumber );
|
|||
|
|
} );
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function generateFormField()
|
|||
|
|
{
|
|||
|
|
frameDocument.$.open();
|
|||
|
|
|
|||
|
|
// Support for custom document.domain in IE.
|
|||
|
|
if ( CKEDITOR.env.isCustomDomain() )
|
|||
|
|
frameDocument.$.domain = document.domain;
|
|||
|
|
|
|||
|
|
var size = '';
|
|||
|
|
if ( elementDefinition.size )
|
|||
|
|
size = elementDefinition.size - ( CKEDITOR.env.ie ? 7 : 0 ); // "Browse" button is bigger in IE.
|
|||
|
|
|
|||
|
|
frameDocument.$.write( [ '<html dir="' + langDir + '" lang="' + langCode + '"><head><title></title></head><body style="margin: 0; overflow: hidden; background: transparent;">',
|
|||
|
|
'<form enctype="multipart/form-data" method="POST" dir="' + langDir + '" lang="' + langCode + '" action="',
|
|||
|
|
CKEDITOR.tools.htmlEncode( elementDefinition.action ),
|
|||
|
|
'">',
|
|||
|
|
'<input type="file" name="',
|
|||
|
|
CKEDITOR.tools.htmlEncode( elementDefinition.id || 'cke_upload' ),
|
|||
|
|
'" size="',
|
|||
|
|
CKEDITOR.tools.htmlEncode( size > 0 ? size : "" ),
|
|||
|
|
'" />',
|
|||
|
|
'</form>',
|
|||
|
|
'</body></html>',
|
|||
|
|
'<script>window.parent.CKEDITOR.tools.callFunction(' + callNumber + ');',
|
|||
|
|
'window.onbeforeunload = function() {window.parent.CKEDITOR.tools.callFunction(' + unloadNumber + ')}</script>' ].join( '' ) );
|
|||
|
|
|
|||
|
|
frameDocument.$.close();
|
|||
|
|
|
|||
|
|
for ( var i = 0 ; i < buttons.length ; i++ )
|
|||
|
|
buttons[i].enable();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// #3465: Wait for the browser to finish rendering the dialog first.
|
|||
|
|
if ( CKEDITOR.env.gecko )
|
|||
|
|
setTimeout( generateFormField, 500 );
|
|||
|
|
else
|
|||
|
|
generateFormField();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
getValue : function()
|
|||
|
|
{
|
|||
|
|
return this.getInputElement().$.value || '';
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/***
|
|||
|
|
* The default value of input type="file" is an empty string, but during initialization
|
|||
|
|
* of this UI element, the iframe still isn't ready so it can't be read from that object
|
|||
|
|
* Setting it manually prevents later issues about the current value ("") being different
|
|||
|
|
* of the initial value (undefined as it asked for .value of a div)
|
|||
|
|
*/
|
|||
|
|
setInitValue : function()
|
|||
|
|
{
|
|||
|
|
this._.initValue = '';
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Defines the onChange event for UI element definitions.
|
|||
|
|
* @field
|
|||
|
|
* @type Object
|
|||
|
|
* @example
|
|||
|
|
*/
|
|||
|
|
eventProcessors :
|
|||
|
|
{
|
|||
|
|
onChange : function( dialog, func )
|
|||
|
|
{
|
|||
|
|
// If this method is called several times (I'm not sure about how this can happen but the default
|
|||
|
|
// onChange processor includes this protection)
|
|||
|
|
// In order to reapply to the new element, the property is deleted at the beggining of the registerEvents method
|
|||
|
|
if ( !this._.domOnChangeRegistered )
|
|||
|
|
{
|
|||
|
|
// By listening for the formLoaded event, this handler will get reapplied when a new
|
|||
|
|
// form is created
|
|||
|
|
this.on( 'formLoaded', function()
|
|||
|
|
{
|
|||
|
|
this.getInputElement().on( 'change', function(){ this.fire( 'change', { value : this.getValue() } ); }, this );
|
|||
|
|
}, this );
|
|||
|
|
this._.domOnChangeRegistered = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.on( 'change', func );
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
keyboardFocusable : true
|
|||
|
|
}, true );
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.fileButton.prototype = new CKEDITOR.ui.dialog.button;
|
|||
|
|
|
|||
|
|
CKEDITOR.ui.dialog.fieldset.prototype = CKEDITOR.tools.clone( CKEDITOR.ui.dialog.hbox.prototype );
|
|||
|
|
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'text', textBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'password', textBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'textarea', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'checkbox', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'radio', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'button', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'select', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'file', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'fileButton', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'html', commonBuilder );
|
|||
|
|
CKEDITOR.dialog.addUIElement( 'fieldset', containerBuilder );
|
|||
|
|
})();
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Fired when the value of the uiElement is changed
|
|||
|
|
* @name CKEDITOR.ui.dialog.uiElement#change
|
|||
|
|
* @event
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Fired when the inner frame created by the element is ready.
|
|||
|
|
* Each time the button is used or the dialog is loaded a new
|
|||
|
|
* form might be created.
|
|||
|
|
* @name CKEDITOR.ui.dialog.fileButton#formLoaded
|
|||
|
|
* @event
|
|||
|
|
*/
|