_source/plugins/scayt/dialogs/options.js

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