]>
git.immae.eu Git - perso/Immae/Projets/packagist/connexionswing-ckeditor-component.git/blob - sources/plugins/templates/dialogs/templates.js
93dca0a8b5f1ddf9537136d8ff92228284698f8a
2 * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
3 * For licensing, see LICENSE.md or http://ckeditor.com/license
8 CKEDITOR
.dialog
.add( 'templates', function( editor
) {
9 // Constructs the HTML view of the specified templates data.
10 function renderTemplatesList( container
, templatesDefinitions
) {
11 // clear loading wait text.
12 container
.setHtml( '' );
14 for ( var i
= 0, totalDefs
= templatesDefinitions
.length
; i
< totalDefs
; i
++ ) {
15 var definition
= CKEDITOR
.getTemplates( templatesDefinitions
[ i
] ),
16 imagesPath
= definition
.imagesPath
,
17 templates
= definition
.templates
,
18 count
= templates
.length
;
20 for ( var j
= 0; j
< count
; j
++ ) {
21 var template
= templates
[ j
],
22 item
= createTemplateItem( template
, imagesPath
);
23 item
.setAttribute( 'aria-posinset', j
+ 1 );
24 item
.setAttribute( 'aria-setsize', count
);
25 container
.append( item
);
30 function createTemplateItem( template
, imagesPath
) {
31 var item
= CKEDITOR
.dom
.element
.createFromHtml( '<a href="javascript:void(0)" tabIndex="-1" role="option" >' +
32 '<div class="cke_tpl_item"></div>' +
35 // Build the inner HTML of our new item DIV.
36 var html
= '<table style="width:350px;" class="cke_tpl_preview" role="presentation"><tr>';
38 if ( template
.image
&& imagesPath
) {
39 html
+= '<td class="cke_tpl_preview_img"><img src="' +
40 CKEDITOR
.getUrl( imagesPath
+ template
.image
) + '"' +
41 ( CKEDITOR
.env
.ie6Compat
? ' onload="this.width=this.width"' : '' ) + ' alt="" title=""></td>';
44 html
+= '<td style="white-space:normal;"><span class="cke_tpl_title">' + template
.title
+ '</span><br/>';
46 if ( template
.description
)
47 html
+= '<span>' + template
.description
+ '</span>';
49 html
+= '</td></tr></table>';
51 item
.getFirst().setHtml( html
);
53 item
.on( 'click', function() {
54 insertTemplate( template
.html
);
60 // Insert the specified template content into editor.
61 // @param {Number} index
62 function insertTemplate( html
) {
63 var dialog
= CKEDITOR
.dialog
.getCurrent(),
64 isReplace
= dialog
.getValueOf( 'selectTpl', 'chkInsertOpt' );
67 editor
.fire( 'saveSnapshot' );
68 // Everything should happen after the document is loaded (#4073).
69 editor
.setData( html
, function() {
72 // Place the cursor at the first editable place.
73 var range
= editor
.createRange();
74 range
.moveToElementEditStart( editor
.editable() );
76 setTimeout( function() {
77 editor
.fire( 'saveSnapshot' );
82 editor
.insertHtml( html
);
87 function keyNavigation( evt
) {
88 var target
= evt
.data
.getTarget(),
89 onList
= listContainer
.equals( target
);
91 // Keyboard navigation for template list.
92 if ( onList
|| listContainer
.contains( target
) ) {
93 var keystroke
= evt
.data
.getKeystroke(),
94 items
= listContainer
.getElementsByTag( 'a' ),
98 // Focus not yet onto list items?
100 focusItem
= items
.getItem( 0 );
102 switch ( keystroke
) {
103 case 40: // ARROW-DOWN
104 focusItem
= target
.getNext();
108 focusItem
= target
.getPrevious();
113 target
.fire( 'click' );
119 evt
.data
.preventDefault();
125 // Load skin at first.
126 var plugin
= CKEDITOR
.plugins
.get( 'templates' );
127 CKEDITOR
.document
.appendStyleSheet( CKEDITOR
.getUrl( plugin
.path
+ 'dialogs/templates.css' ) );
132 var templateListLabelId
= 'cke_tpl_list_label_' + CKEDITOR
.tools
.getNextNumber(),
133 lang
= editor
.lang
.templates
,
134 config
= editor
.config
;
136 title: editor
.lang
.templates
.title
,
138 minWidth: CKEDITOR
.env
.ie
? 440 : 400,
151 lang
.selectPromptMsg
+
158 html: '<div class="cke_tpl_list" tabIndex="-1" role="listbox" aria-labelledby="' + templateListLabelId
+ '">' +
159 '<div class="cke_tpl_loading"><span></span></div>' +
161 '<span class="cke_voice_label" id="' + templateListLabelId
+ '">' + lang
.options
+ '</span>'
166 label: lang
.insertOption
,
167 'default': config
.templates_replaceContent
172 buttons: [ CKEDITOR
.dialog
.cancelButton
],
175 var templatesListField
= this.getContentElement( 'selectTpl', 'templatesList' );
176 listContainer
= templatesListField
.getElement();
178 CKEDITOR
.loadTemplates( config
.templates_files
, function() {
179 var templates
= ( config
.templates
|| 'default' ).split( ',' );
181 if ( templates
.length
) {
182 renderTemplatesList( listContainer
, templates
);
183 templatesListField
.focus();
185 listContainer
.setHtml( '<div class="cke_tpl_empty">' +
186 '<span>' + lang
.emptyListMsg
+ '</span>' +
191 this._
.element
.on( 'keydown', keyNavigation
);
195 this._
.element
.removeListener( 'keydown', keyNavigation
);