      1 /*
      2 Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.
      3 For licensing, see LICENSE.html or http://ckeditor.com/license
      4 */
      5
      6 (function()
      7 {
      8 	var doc = CKEDITOR.document;
      9
     10 	var listId = 'cke' + CKEDITOR.tools.getNextNumber();
     11
     12 	// Constructs the HTML view of the specified templates data.
     13 	function renderTemplatesList( editor, templatesDefinitions )
     14 	{
     15 		var listDiv = doc.getById( listId );
     16
     17 		// clear loading wait text.
     18 		listDiv.setHtml( '' );
     19
     20 		for ( var i = 0 ; i < templatesDefinitions.length ; i++ )
     21 		{
     22 			var definition = CKEDITOR.getTemplates( templatesDefinitions[ i ] ),
     23 				imagesPath = definition.imagesPath,
     24 				templates = definition.templates;
     25
     26 			for ( var j = 0 ; j < templates.length ; j++ )
     27 			{
     28 				var template = templates[ j ];
     29 				listDiv.append( createTemplateItem( editor, template, imagesPath ) );
     30 			}
     31 		}
     32 	}
     33
     34 	function createTemplateItem( editor, template, imagesPath )
     35 	{
     36 		var div = doc.createElement( 'div' );
     37 		div.setAttribute( 'class', 'cke_tpl_item' );
     38
     39 		// Build the inner HTML of our new item DIV.
     40 		var html = '<table style="width:350px;" class="cke_tpl_preview"><tr>';
     41
     42 		if( template.image && imagesPath )
     43 			html += '<td class="cke_tpl_preview_img"><img src="' + CKEDITOR.getUrl( imagesPath + template.image ) + '"></td>';
     44
     45 		html += '<td style="white-space:normal;"><span class="cke_tpl_title">' + template.title + '</span><br/>';
     46
     47 		if( template.description )
     48 			html += '<span>' + template.description + '</span>';
     49
     50 		html += '</td></tr></table>';
     51
     52 		div.setHtml( html );
     53
     54 		div.on( 'mouseover', function()
     55 			{
     56 				div.addClass( 'cke_tpl_hover' );
     57 			});
     58
     59 		div.on( 'mouseout', function()
     60 			{
     61 				div.removeClass( 'cke_tpl_hover' );
     62 			});
     63
     64 		div.on( 'click', function()
     65 			{
     66 				insertTemplate( editor, template.html );
     67 			});
     68
     69 		return div;
     70 	}
     71
     72 	/**
     73 	 * Insert the specified template content
     74 	 * to document.
     75 	 * @param {Number} index
     76 	 */
     77 	function insertTemplate( editor, html )
     78 	{
     79 		var dialog = CKEDITOR.dialog.getCurrent(),
     80 			isInsert = dialog.getValueOf( 'selectTpl', 'chkInsertOpt' );
     81
     82 		if( isInsert )
     83 		{
     84 			editor.setData( html );
     85 		}
     86 		else
     87 		{
     88 			editor.insertHtml( html );
     89 		}
     90
     91 		dialog.hide();
     92 	}
     93
     94 	CKEDITOR.dialog.add( 'templates', function( editor )
     95 		{
     96 			// Load skin at first.
     97 			CKEDITOR.skins.load( editor, 'templates' );
     98
     99 			/**
    100 			 * Load templates once.
    101 			 */
    102 			var isLoaded = false;
    103
    104 			return {
    105 				title :editor.lang.templates.title,
    106
    107 				minWidth : CKEDITOR.env.ie ? 440 : 400,
    108 				minHeight : 340,
    109
    110 				contents :
    111 				[
    112 					{
    113 						id :'selectTpl',
    114 						label : editor.lang.templates.title,
    115 						elements :
    116 						[
    117 							{
    118 								type : 'vbox',
    119 								padding : 5,
    120 								children :
    121 								[
    122 									{
    123 										type : 'html',
    124 										html :
    125 											'<span>'  +
    126 												editor.lang.templates.selectPromptMsg +
    127 											'</span>'
    128 									},
    129 									{
    130 										type : 'html',
    131 										html :
    132 											'<div id="' + listId + '" class="cke_tpl_list">' +
    133 												'<div class="cke_tpl_loading"><span></span></div>' +
    134 											'</div>'
    135 									},
    136 									{
    137 										id : 'chkInsertOpt',
    138 										type : 'checkbox',
    139 										label : editor.lang.templates.insertOption,
    140 										'default' : editor.config.templates_replaceContent
    141 									}
    142 								]
    143 							}
    144 						]
    145 					}
    146 				],
    147
    148 				buttons : [ CKEDITOR.dialog.cancelButton ],
    149
    150 				onShow : function()
    151 				{
    152 					CKEDITOR.loadTemplates( editor.config.templates_files, function()
    153 						{
    154 							var templates = editor.config.templates.split( ',' );
    155
    156 							if ( templates.length )
    157 								renderTemplatesList( editor, templates );
    158 							else
    159 							{
    160 								var listCtEl = doc.getById( listId );
    161 								listCtEl.setHtml(
    162 									'<div class="cke_tpl_empty">' +
    163 										'<span>' + editor.lang.templates.emptyListMsg + '</span>' +
    164 									'</div>' );
    165 							}
    166 						});
    167 				}
    168 			};
    169 		});
    170 })();
    171