On repasse à js.
[ckeditor.git] / skins / ckeditor / _source / plugins / scayt / dialogs / options.js
1 /*
2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
3 For licensing, see LICENSE.html or http://ckeditor.com/license
4 */
5
6 CKEDITOR.dialog.add( 'scaytcheck', function( editor )
7 {
8 var firstLoad = true,
9 captions,
10 doc = CKEDITOR.document,
11 editorName = editor.name,
12 tags = CKEDITOR.plugins.scayt.getUiTabs( editor ),
13 i,
14 contents = [],
15 userDicActive = 0,
16 dic_buttons = [
17 // [0] contains buttons for creating
18 "dic_create_" + editorName + ",dic_restore_" + editorName,
19 // [1] contains buton for manipulation
20 "dic_rename_" + editorName + ",dic_delete_" + editorName
21 ],
22 optionsIds = [ 'mixedCase', 'mixedWithDigits', 'allCaps', 'ignoreDomainNames' ];
23
24 // common operations
25
26 function getBOMAllOptions()
27 {
28 if (typeof document.forms["optionsbar_" + editorName] != "undefined")
29 return document.forms["optionsbar_" + editorName]["options"];
30 return [];
31 }
32 function getBOMAllLangs()
33 {
34 if (typeof document.forms["languagesbar_" + editorName] != "undefined")
35 return document.forms["languagesbar_" + editorName]["scayt_lang"];
36 return [];
37 }
38
39 function setCheckedValue( radioObj, newValue )
40 {
41 if ( !radioObj )
42 return;
43 var radioLength = radioObj.length;
44 if ( radioLength == undefined )
45 {
46 radioObj.checked = radioObj.value == newValue.toString();
47 return;
48 }
49 for ( var i = 0; i < radioLength; i++ )
50 {
51 radioObj[i].checked = false;
52 if ( radioObj[i].value == newValue.toString() )
53 radioObj[i].checked = true;
54 }
55 }
56
57 var lang = editor.lang.scayt;
58 var tags_contents = [
59 {
60 id : 'options',
61 label : lang.optionsTab,
62 elements : [
63 {
64 type : 'html',
65 id : 'options',
66 html : '<form name="optionsbar_' + editorName + '"><div class="inner_options">' +
67 ' <div class="messagebox"></div>' +
68 ' <div style="display:none;">' +
69 ' <input type="checkbox" name="options" id="allCaps_' + editorName + '" />' +
70 ' <label for="allCaps" id="label_allCaps_' + editorName + '"></label>' +
71 ' </div>' +
72 ' <div style="display:none;">' +
73 ' <input name="options" type="checkbox" id="ignoreDomainNames_' + editorName + '" />' +
74 ' <label for="ignoreDomainNames" id="label_ignoreDomainNames_' + editorName + '"></label>' +
75 ' </div>' +
76 ' <div style="display:none;">' +
77 ' <input name="options" type="checkbox" id="mixedCase_' + editorName + '" />' +
78 ' <label for="mixedCase" id="label_mixedCase_' + editorName + '"></label>' +
79 ' </div>' +
80 ' <div style="display:none;">' +
81 ' <input name="options" type="checkbox" id="mixedWithDigits_' + editorName + '" />' +
82 ' <label for="mixedWithDigits" id="label_mixedWithDigits_' + editorName + '"></label>' +
83 ' </div>' +
84 '</div></form>'
85 }
86 ]
87 },
88 {
89 id : 'langs',
90 label : lang.languagesTab,
91 elements : [
92 {
93 type : 'html',
94 id : 'langs',
95 html : '<form name="languagesbar_' + editorName + '"><div class="inner_langs">' +
96 ' <div class="messagebox"></div> ' +
97 ' <div style="float:left;width:45%;margin-left:5px;" id="scayt_lcol_' + editorName + '" ></div>' +
98 ' <div style="float:left;width:45%;margin-left:15px;" id="scayt_rcol_' + editorName + '"></div>' +
99 '</div></form>'
100 }
101 ]
102 },
103 {
104 id : 'dictionaries',
105 label : lang.dictionariesTab,
106 elements : [
107 {
108 type : 'html',
109 style: '',
110 id : 'dictionaries',
111 html : '<form name="dictionarybar_' + editorName + '"><div class="inner_dictionary" style="text-align:left; white-space:normal; width:320px; overflow: hidden;">' +
112 ' <div style="margin:5px auto; width:80%;white-space:normal; overflow:hidden;" id="dic_message_' + editorName + '"> </div>' +
113 ' <div style="margin:5px auto; width:80%;white-space:normal;"> ' +
114 ' <span class="cke_dialog_ui_labeled_label" >Dictionary name</span><br>'+
115 ' <span class="cke_dialog_ui_labeled_content" >'+
116 ' <div class="cke_dialog_ui_input_text">'+
117 ' <input id="dic_name_' + editorName + '" type="text" class="cke_dialog_ui_input_text"/>'+
118 ' </div></span></div>'+
119 ' <div style="margin:5px auto; width:80%;white-space:normal;">'+
120 ' <a style="display:none;" class="cke_dialog_ui_button" href="javascript:void(0)" id="dic_create_' + editorName + '">'+
121 ' </a>' +
122 ' <a style="display:none;" class="cke_dialog_ui_button" href="javascript:void(0)" id="dic_delete_' + editorName + '">'+
123 ' </a>' +
124 ' <a style="display:none;" class="cke_dialog_ui_button" href="javascript:void(0)" id="dic_rename_' + editorName + '">'+
125 ' </a>' +
126 ' <a style="display:none;" class="cke_dialog_ui_button" href="javascript:void(0)" id="dic_restore_' + editorName + '">'+
127 ' </a>' +
128 ' </div>' +
129 ' <div style="margin:5px auto; width:95%;white-space:normal;" id="dic_info_' + editorName + '"></div>' +
130 '</div></form>'
131 }
132 ]
133 },
134 {
135 id : 'about',
136 label : lang.aboutTab,
137 elements : [
138 {
139 type : 'html',
140 id : 'about',
141 style : 'margin: 5px 5px;',
142 html : '<div id="scayt_about_' + editorName + '"></div>'
143 }
144 ]
145 }
146 ];
147
148 var dialogDefiniton = {
149 title : lang.title,
150 minWidth : 360,
151 minHeight : 220,
152 onShow : function()
153 {
154 var dialog = this;
155 dialog.data = editor.fire( 'scaytDialog', {} );
156 dialog.options = dialog.data.scayt_control.option();
157 dialog.chosed_lang = dialog.sLang = dialog.data.scayt_control.sLang;
158
159 if ( !dialog.data || !dialog.data.scayt || !dialog.data.scayt_control )
160 {
161 alert( 'Error loading application service' );
162 dialog.hide();
163 return;
164 }
165
166 var stop = 0;
167 if ( firstLoad )
168 {
169 dialog.data.scayt.getCaption( editor.langCode || 'en', function( caps )
170 {
171 if ( stop++ > 0 ) // Once only
172 return;
173 captions = caps;
174 init_with_captions.apply( dialog );
175 reload.apply( dialog );
176 firstLoad = false;
177 });
178 }
179 else
180 reload.apply( dialog );
181
182 dialog.selectPage( dialog.data.tab );
183 },
184 onOk : function()
185 {
186 var scayt_control = this.data.scayt_control;
187 scayt_control.option( this.options );
188 // Setup language if it was changed.
189 var csLang = this.chosed_lang;
190 scayt_control.setLang( csLang );
191 scayt_control.refresh();
192 },
193 onCancel: function()
194 {
195 var o = getBOMAllOptions();
196 for ( var i in o )
197 o[i].checked = false;
198
199 setCheckedValue( getBOMAllLangs(), "" );
200 },
201 contents : contents
202 };
203
204 var scayt_control = CKEDITOR.plugins.scayt.getScayt( editor );
205
206 for ( i = 0; i < tags.length; i++ )
207 {
208 if ( tags[ i ] == 1 )
209 contents[ contents.length ] = tags_contents[ i ];
210 }
211 if ( tags[2] == 1 )
212 userDicActive = 1;
213
214 var init_with_captions = function()
215 {
216 var dialog = this,
217 lang_list = dialog.data.scayt.getLangList(),
218 buttonCaptions = [ 'dic_create', 'dic_delete', 'dic_rename', 'dic_restore' ],
219 buttonIds = [],
220 langList = [],
221 labels = optionsIds,
222 i;
223
224 // Add buttons titles
225 if ( userDicActive )
226 {
227 for ( i = 0; i < buttonCaptions.length; i++ )
228 {
229 buttonIds[ i ] = buttonCaptions[ i ] + "_" + editorName;
230 doc.getById( buttonIds[ i ] ).setHtml( '<span class="cke_dialog_ui_button">' + captions[ 'button_' + buttonCaptions[ i ]] +'</span>' );
231 }
232 doc.getById( 'dic_info_' + editorName ).setHtml( captions[ 'dic_info' ] );
233 }
234
235 // Fill options and dictionary labels.
236 if ( tags[0] == 1 )
237 {
238 for ( i in labels )
239 {
240 var labelCaption = 'label_' + labels[ i ],
241 labelId = labelCaption + '_' + editorName,
242 labelElement = doc.getById( labelId );
243
244 if ( 'undefined' != typeof labelElement
245 && 'undefined' != typeof captions[ labelCaption ]
246 && 'undefined' != typeof dialog.options[labels[ i ]] )
247 {
248 labelElement.setHtml( captions[ labelCaption ] );
249 var labelParent = labelElement.getParent();
250 labelParent.$.style.display = "block";
251 }
252 }
253 }
254
255 var about = '<p><img src="' + window.scayt.getAboutInfo().logoURL + '" /></p>' +
256 '<p>' + captions[ 'version' ] + window.scayt.getAboutInfo().version.toString() + '</p>' +
257 '<p>' + captions[ 'about_throwt_copy' ] + '</p>';
258
259 doc.getById( 'scayt_about_' + editorName ).setHtml( about );
260
261 // Create languages tab.
262 var createOption = function( option, list )
263 {
264 var label = doc.createElement( 'label' );
265 label.setAttribute( 'for', 'cke_option' + option );
266 label.setHtml( list[ option ] );
267
268 if ( dialog.sLang == option ) // Current.
269 dialog.chosed_lang = option;
270
271 var div = doc.createElement( 'div' );
272 var radio = CKEDITOR.dom.element.createFromHtml( '<input id="cke_option' +
273 option + '" type="radio" ' +
274 ( dialog.sLang == option ? 'checked="checked"' : '' ) +
275 ' value="' + option + '" name="scayt_lang" />' );
276
277 radio.on( 'click', function()
278 {
279 this.$.checked = true;
280 dialog.chosed_lang = option;
281 });
282
283 div.append( radio );
284 div.append( label );
285
286 return {
287 lang : list[ option ],
288 code : option,
289 radio : div
290 };
291 };
292
293 if ( tags[1] ==1 )
294 {
295 for ( i in lang_list.rtl )
296 langList[ langList.length ] = createOption( i, lang_list.ltr );
297
298 for ( i in lang_list.ltr )
299 langList[ langList.length ] = createOption( i, lang_list.ltr );
300
301 langList.sort( function( lang1, lang2 )
302 {
303 return ( lang2.lang > lang1.lang ) ? -1 : 1 ;
304 });
305
306 var fieldL = doc.getById( 'scayt_lcol_' + editorName ),
307 fieldR = doc.getById( 'scayt_rcol_' + editorName );
308 for ( i=0; i < langList.length; i++ )
309 {
310 var field = ( i < langList.length / 2 ) ? fieldL : fieldR;
311 field.append( langList[ i ].radio );
312 }
313 }
314
315 // user dictionary handlers
316 var dic = {};
317 dic.dic_create = function( el, dic_name , dic_buttons )
318 {
319 // comma separated button's ids include repeats if exists
320 var all_buttons = dic_buttons[0] + ',' + dic_buttons[1];
321
322 var err_massage = captions["err_dic_create"];
323 var suc_massage = captions["succ_dic_create"];
324
325 window.scayt.createUserDictionary( dic_name,
326 function( arg )
327 {
328 hide_dic_buttons ( all_buttons );
329 display_dic_buttons ( dic_buttons[1] );
330 suc_massage = suc_massage.replace("%s" , arg.dname );
331 dic_success_message (suc_massage);
332 },
333 function( arg )
334 {
335 err_massage = err_massage.replace("%s" ,arg.dname );
336 dic_error_message ( err_massage + "( "+ (arg.message || "") +")");
337 });
338
339 };
340
341 dic.dic_rename = function( el, dic_name )
342 {
343 //
344 // try to rename dictionary
345 var err_massage = captions["err_dic_rename"] || "";
346 var suc_massage = captions["succ_dic_rename"] || "";
347 window.scayt.renameUserDictionary( dic_name,
348 function( arg )
349 {
350 suc_massage = suc_massage.replace("%s" , arg.dname );
351 set_dic_name( dic_name );
352 dic_success_message ( suc_massage );
353 },
354 function( arg )
355 {
356 err_massage = err_massage.replace("%s" , arg.dname );
357 set_dic_name( dic_name );
358 dic_error_message( err_massage + "( " + ( arg.message || "" ) + " )" );
359 });
360 };
361
362 dic.dic_delete = function( el, dic_name , dic_buttons )
363 {
364 var all_buttons = dic_buttons[0] + ',' + dic_buttons[1];
365 var err_massage = captions["err_dic_delete"];
366 var suc_massage = captions["succ_dic_delete"];
367
368 // try to delete dictionary
369 window.scayt.deleteUserDictionary(
370 function( arg )
371 {
372 suc_massage = suc_massage.replace("%s" , arg.dname );
373 hide_dic_buttons ( all_buttons );
374 display_dic_buttons ( dic_buttons[0] );
375 set_dic_name( "" ); // empty input field
376 dic_success_message( suc_massage );
377 },
378 function( arg )
379 {
380 err_massage = err_massage.replace("%s" , arg.dname );
381 dic_error_message(err_massage);
382 });
383 };
384
385 dic.dic_restore = dialog.dic_restore || function( el, dic_name , dic_buttons )
386 {
387 // try to restore existing dictionary
388 var all_buttons = dic_buttons[0] + ',' + dic_buttons[1];
389 var err_massage = captions["err_dic_restore"];
390 var suc_massage = captions["succ_dic_restore"];
391
392 window.scayt.restoreUserDictionary(dic_name,
393 function( arg )
394 {
395 suc_massage = suc_massage.replace("%s" , arg.dname );
396 hide_dic_buttons ( all_buttons );
397 display_dic_buttons(dic_buttons[1]);
398 dic_success_message( suc_massage );
399 },
400 function( arg )
401 {
402 err_massage = err_massage.replace("%s" , arg.dname );
403 dic_error_message( err_massage );
404 });
405 };
406
407 function onDicButtonClick( ev )
408 {
409 var dic_name = doc.getById('dic_name_' + editorName).getValue();
410 if ( !dic_name )
411 {
412 dic_error_message(" Dictionary name should not be empty. ");
413 return false;
414 }
415 try{
416 var el = ev.data.getTarget().getParent();
417 var id = /(dic_\w+)_[\w\d]+/.exec(el.getId())[1];
418 dic[ id ].apply( null, [ el, dic_name, dic_buttons ] );
419 }
420 catch(err)
421 {
422 dic_error_message(" Dictionary error. ");
423 }
424
425 return true;
426 }
427
428 // ** bind event listeners
429 var arr_buttons = ( dic_buttons[0] + ',' + dic_buttons[1] ).split( ',' ),
430 l;
431
432 for ( i = 0, l = arr_buttons.length ; i < l ; i += 1 )
433 {
434 var dic_button = doc.getById(arr_buttons[i]);
435 if ( dic_button )
436 dic_button.on( 'click', onDicButtonClick, this );
437 }
438 };
439
440 var reload = function()
441 {
442 var dialog = this;
443 // for enabled options tab
444 if ( tags[0] == 1 ){
445 var opto = getBOMAllOptions();
446
447 // Animate options.
448 for ( var k=0,l = opto.length; k<l;k++ )
449 {
450
451 var i = opto[k].id;
452 var checkbox = doc.getById( i );
453
454 if ( checkbox )
455 {
456 opto[k].checked = false;
457 //alert (opto[k].removeAttribute)
458 if ( dialog.options[ i.split("_")[0] ] == 1 )
459 {
460 opto[k].checked = true;
461 }
462
463
464 // Bind events. Do it only once.
465 if ( firstLoad )
466 {
467 checkbox.on( 'click', function()
468 {
469 dialog.options[ this.getId().split("_")[0] ] = this.$.checked ? 1 : 0 ;
470 });
471 }
472 }
473 }
474 }
475
476 //for enabled languages tab
477 if ( tags[1] == 1 )
478 {
479 var domLang = doc.getById("cke_option" + dialog.sLang);
480 setCheckedValue( domLang.$,dialog.sLang );
481 }
482
483 // * user dictionary
484 if ( userDicActive )
485 {
486 window.scayt.getNameUserDictionary(
487 function( o )
488 {
489 var dic_name = o.dname;
490 hide_dic_buttons( dic_buttons[0] + ',' + dic_buttons[1] );
491 if ( dic_name )
492 {
493 doc.getById( 'dic_name_' + editorName ).setValue(dic_name);
494 display_dic_buttons( dic_buttons[1] );
495 }
496 else
497 display_dic_buttons( dic_buttons[0] );
498
499 },
500 function()
501 {
502 doc.getById( 'dic_name_' + editorName ).setValue("");
503 });
504 dic_success_message("");
505 }
506
507 };
508
509 function dic_error_message( m )
510 {
511 doc.getById('dic_message_' + editorName).setHtml('<span style="color:red;">' + m + '</span>' );
512 }
513 function dic_success_message( m )
514 {
515 doc.getById('dic_message_' + editorName).setHtml('<span style="color:blue;">' + m + '</span>') ;
516 }
517 function display_dic_buttons( sIds )
518 {
519 sIds = String( sIds );
520 var aIds = sIds.split(',');
521 for ( var i=0, l = aIds.length; i < l ; i+=1)
522 doc.getById( aIds[i] ).$.style.display = "inline";
523 }
524 function hide_dic_buttons( sIds )
525 {
526 sIds = String( sIds );
527 var aIds = sIds.split(',');
528 for ( var i = 0, l = aIds.length; i < l ; i += 1 )
529 doc.getById( aIds[i] ).$.style.display = "none";
530 }
531 function set_dic_name( dic_name )
532 {
533 doc.getById('dic_name_' + editorName).$.value= dic_name;
534 }
535
536 return dialogDefiniton;
537 });