options.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573
  1. /*
  2. Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
  3. For licensing, see LICENSE.html or http://ckeditor.com/license
  4. */
  5. CKEDITOR.dialog.add( 'scaytDialog', function( editor ) {
  6. var scayt_instance = editor.scayt;
  7. var aboutTabDefinition = '<p><img src="' + scayt_instance.getLogo() + '" /></p>' +
  8. '<p>' + scayt_instance.getLocal('version') + scayt_instance.getVersion() + '</p>' +
  9. '<p>' + scayt_instance.getLocal('text_copyrights') + '</p>';
  10. var doc = CKEDITOR.document;
  11. var optionGenerator = function() {
  12. var scayt_instance_ = editor.scayt,
  13. applicationConfig = scayt_instance.getApplicationConfig(),
  14. optionArrayUiCheckboxes = [],
  15. optionLocalizationList = {
  16. "ignore-all-caps-words" : "label_allCaps",
  17. "ignore-domain-names" : "label_ignoreDomainNames",
  18. "ignore-words-with-mixed-cases" : "label_mixedCase",
  19. "ignore-words-with-numbers" : "label_mixedWithDigits"
  20. };
  21. for(var option in applicationConfig) {
  22. var checkboxConfig = {
  23. type: "checkbox"
  24. };
  25. checkboxConfig.id = option;
  26. checkboxConfig.label = scayt_instance.getLocal(optionLocalizationList[option]);
  27. optionArrayUiCheckboxes.push(checkboxConfig);
  28. }
  29. return optionArrayUiCheckboxes;
  30. };
  31. var languageModelState = {
  32. isChanged : function() {
  33. return (this.newLang === null || this.currentLang === this.newLang) ? false : true;
  34. },
  35. currentLang: scayt_instance.getLang(),
  36. newLang: null,
  37. reset: function() {
  38. this.currentLang = scayt_instance.getLang();
  39. this.newLang = null;
  40. },
  41. id: 'lang'
  42. };
  43. var generateDialogTabs = function(tabsList, editor) {
  44. var tabs = [],
  45. uiTabs = editor.config.scayt_uiTabs;
  46. if(!uiTabs) {
  47. return tabsList;
  48. } else {
  49. for(var i in uiTabs) {
  50. (uiTabs[i] == 1) && tabs.push(tabsList[i]);
  51. }
  52. tabs.push(tabsList[tabsList.length - 1]);
  53. }
  54. return tabs;
  55. };
  56. var dialogTabs = [{
  57. id : 'options',
  58. label : scayt_instance.getLocal('tab_options'),
  59. onShow: function() {
  60. // console.log("tab show");
  61. },
  62. elements : [
  63. {
  64. type: 'vbox',
  65. id: 'scaytOptions',
  66. children: optionGenerator(),
  67. onShow: function() {
  68. var optionsTab = this.getChild(),
  69. scayt_instance = editor.scayt;
  70. for(var i = 0; i < this.getChild().length; i++) {
  71. this.getChild()[i].setValue(scayt_instance.getApplicationConfig()[this.getChild()[i].id]);
  72. }
  73. }
  74. }
  75. ]
  76. },
  77. {
  78. id : 'langs',
  79. label : scayt_instance.getLocal('tab_languages'),
  80. elements : [
  81. {
  82. id: "leftLangColumn",
  83. type: 'vbox',
  84. align: 'left',
  85. widths: ['100'],
  86. children: [
  87. {
  88. type: 'html',
  89. id: 'langBox',
  90. style: 'overflow: hidden; white-space: normal;margin-bottom:15px;',
  91. html: '<div><div style="float:left;width:45%;margin-left:5px;" id="left-col-' + editor.name + '"></div><div style="float:left;width:45%;margin-left:15px;" id="right-col-' + editor.name + '"></div></div>',
  92. onShow: function() {
  93. var scayt_instance = editor.scayt;
  94. var lang = scayt_instance.getLang(),
  95. prefix_id = "scaytLang_",
  96. radio = doc.getById(prefix_id + editor.name + '_' + lang);
  97. radio.$.checked = true;
  98. }
  99. },
  100. {
  101. type: 'html',
  102. id: 'graytLanguagesHint',
  103. html: '<div style="margin:5px auto; width:95%;white-space:normal;" id="' + editor.name + 'graytLanguagesHint"><span style="width:10px;height:10px;display: inline-block; background:#02b620;vertical-align:top;margin-top:2px;"></span> - This languages are supported by Grammar As You Type(GRAYT).</div>',
  104. onShow: function() {
  105. var graytLanguagesHint = doc.getById(editor.name + 'graytLanguagesHint');
  106. if (!editor.config.grayt_autoStartup) {
  107. graytLanguagesHint.$.style.display = 'none';
  108. }
  109. }
  110. }
  111. ]
  112. }
  113. ]
  114. },
  115. {
  116. id : 'dictionaries',
  117. label : scayt_instance.getLocal('tab_dictionaries'),
  118. elements : [
  119. {
  120. type: 'vbox',
  121. id: 'rightCol_col__left',
  122. children: [
  123. {
  124. type: 'html',
  125. id: 'dictionaryNote',
  126. html: ''
  127. },
  128. {
  129. type: 'text',
  130. id: 'dictionaryName',
  131. label: scayt_instance.getLocal('label_fieldNameDic') || 'Dictionary name',
  132. onShow: function(data) {
  133. var dialog = data.sender,
  134. scayt_instance = editor.scayt;
  135. // IE7 specific fix
  136. setTimeout(function() {
  137. // clear dictionaryNote field
  138. dialog.getContentElement("dictionaries", "dictionaryNote").getElement().setText('');
  139. // restore/clear dictionaryName field
  140. if(scayt_instance.getUserDictionaryName() != null && scayt_instance.getUserDictionaryName() != '') {
  141. dialog.getContentElement("dictionaries", "dictionaryName").setValue(scayt_instance.getUserDictionaryName());
  142. }
  143. }, 0);
  144. }
  145. },
  146. {
  147. type: 'hbox',
  148. id: 'notExistDic',
  149. align: 'left',
  150. style: 'width:auto;',
  151. widths: [ '50%', '50%' ],
  152. children: [
  153. {
  154. type: 'button',
  155. id: 'createDic',
  156. label: scayt_instance.getLocal('btn_createDic'),
  157. title: scayt_instance.getLocal('btn_createDic'),
  158. onClick: function() {
  159. var dialog = this.getDialog(),
  160. self = dialogDefinition,
  161. scayt_instance = editor.scayt,
  162. name = dialog.getContentElement("dictionaries", "dictionaryName").getValue();
  163. scayt_instance.createUserDictionary(name, function(response) {
  164. if(!response.error) {
  165. self.toggleDictionaryButtons.call(dialog, true);
  166. }
  167. response.dialog = dialog;
  168. response.command = "create";
  169. response.name = name;
  170. editor.fire("scaytUserDictionaryAction", response);
  171. }, function(error) {
  172. error.dialog = dialog;
  173. error.command = "create";
  174. error.name = name;
  175. editor.fire("scaytUserDictionaryActionError", error);
  176. });
  177. }
  178. },
  179. {
  180. type: 'button',
  181. id: 'restoreDic',
  182. label: scayt_instance.getLocal('btn_restoreDic'),
  183. title: scayt_instance.getLocal('btn_restoreDic'),
  184. onClick: function() {
  185. var dialog = this.getDialog(),
  186. scayt_instance = editor.scayt,
  187. self = dialogDefinition,
  188. name = dialog.getContentElement("dictionaries", "dictionaryName").getValue();
  189. scayt_instance.restoreUserDictionary(name, function(response) {
  190. response.dialog = dialog;
  191. if(!response.error) {
  192. self.toggleDictionaryButtons.call(dialog, true);
  193. }
  194. response.command = "restore";
  195. response.name = name;
  196. editor.fire("scaytUserDictionaryAction", response);
  197. }, function(error) {
  198. error.dialog = dialog;
  199. error.command = "restore";
  200. error.name = name;
  201. editor.fire("scaytUserDictionaryActionError", error);
  202. });
  203. }
  204. }
  205. ]
  206. },
  207. {
  208. type: 'hbox',
  209. id: 'existDic',
  210. align: 'left',
  211. style: 'width:auto;',
  212. widths: [ '50%', '50%' ],
  213. children: [
  214. {
  215. type: 'button',
  216. id: 'removeDic',
  217. label: scayt_instance.getLocal('btn_deleteDic'),
  218. title: scayt_instance.getLocal('btn_deleteDic'),
  219. onClick: function() {
  220. var dialog = this.getDialog(),
  221. scayt_instance = editor.scayt,
  222. self = dialogDefinition,
  223. dictionaryNameField = dialog.getContentElement("dictionaries", "dictionaryName"),
  224. name = dictionaryNameField.getValue();
  225. scayt_instance.removeUserDictionary(name, function(response) {
  226. dictionaryNameField.setValue("");
  227. if(!response.error) {
  228. self.toggleDictionaryButtons.call(dialog, false);
  229. }
  230. response.dialog = dialog;
  231. response.command = "remove";
  232. response.name = name;
  233. editor.fire("scaytUserDictionaryAction", response);
  234. }, function(error) {
  235. error.dialog = dialog;
  236. error.command = "remove";
  237. error.name = name;
  238. editor.fire("scaytUserDictionaryActionError", error);
  239. });
  240. }
  241. },
  242. {
  243. type: 'button',
  244. id: 'renameDic',
  245. label: scayt_instance.getLocal('btn_renameDic'),
  246. title: scayt_instance.getLocal('btn_renameDic'),
  247. onClick: function() {
  248. var dialog = this.getDialog(),
  249. scayt_instance = editor.scayt,
  250. name = dialog.getContentElement("dictionaries", "dictionaryName").getValue();
  251. scayt_instance.renameUserDictionary(name, function(response) {
  252. response.dialog = dialog;
  253. response.command = "rename";
  254. response.name = name;
  255. editor.fire("scaytUserDictionaryAction", response);
  256. }, function(error) {
  257. error.dialog = dialog;
  258. error.command = "rename";
  259. error.name = name;
  260. editor.fire("scaytUserDictionaryActionError", error);
  261. });
  262. }
  263. }
  264. ]
  265. },
  266. {
  267. type: 'html',
  268. id: 'dicInfo',
  269. html: '<div id="dic_info_editor1" style="margin:5px auto; width:95%;white-space:normal;">' + scayt_instance.getLocal('text_descriptionDic') + '</div>'
  270. }
  271. ]
  272. }
  273. ]
  274. },
  275. {
  276. id : 'about',
  277. label : scayt_instance.getLocal('tab_about'),
  278. elements : [
  279. {
  280. type : 'html',
  281. id : 'about',
  282. style : 'margin: 5px 5px;',
  283. html : '<div><div id="scayt_about_">' +
  284. aboutTabDefinition +
  285. '</div></div>'
  286. }
  287. ]
  288. }];
  289. editor.on("scaytUserDictionaryAction", function(event) {
  290. var UILib = SCAYT.prototype.UILib,
  291. dialog = event.data.dialog,
  292. dictionaryNote = dialog.getContentElement("dictionaries", "dictionaryNote").getElement(),
  293. scayt_instance = event.editor.scayt,
  294. messageTemplate;
  295. if(event.data.error === undefined) {
  296. // success message
  297. messageTemplate = scayt_instance.getLocal("message_success_" + event.data.command + "Dic");
  298. messageTemplate = messageTemplate.replace('%s', event.data.name);
  299. dictionaryNote.setText(messageTemplate);
  300. UILib.css(dictionaryNote.$, {color: 'blue'});
  301. } else {
  302. // error message
  303. if(event.data.name === '') {
  304. // empty dictionary name
  305. dictionaryNote.setText(scayt_instance.getLocal('message_info_emptyDic'));
  306. } else {
  307. messageTemplate = scayt_instance.getLocal("message_error_" + event.data.command + "Dic");
  308. messageTemplate = messageTemplate.replace('%s', event.data.name);
  309. dictionaryNote.setText(messageTemplate);
  310. }
  311. UILib.css(dictionaryNote.$, {color: 'red'});
  312. if(scayt_instance.getUserDictionaryName() != null && scayt_instance.getUserDictionaryName() != '') {
  313. dialog.getContentElement("dictionaries", "dictionaryName").setValue(scayt_instance.getUserDictionaryName());
  314. } else {
  315. dialog.getContentElement("dictionaries", "dictionaryName").setValue("");
  316. }
  317. }
  318. });
  319. editor.on("scaytUserDictionaryActionError", function(event) {
  320. var UILib = SCAYT.prototype.UILib,
  321. dialog = event.data.dialog,
  322. dictionaryNote = dialog.getContentElement("dictionaries", "dictionaryNote").getElement(),
  323. scayt_instance = event.editor.scayt,
  324. messageTemplate;
  325. if(event.data.name === '') {
  326. // empty dictionary name
  327. dictionaryNote.setText(scayt_instance.getLocal('message_info_emptyDic'));
  328. } else {
  329. messageTemplate = scayt_instance.getLocal("message_error_" + event.data.command + "Dic");
  330. messageTemplate = messageTemplate.replace('%s', event.data.name);
  331. dictionaryNote.setText(messageTemplate);
  332. }
  333. UILib.css(dictionaryNote.$, {color: 'red'});
  334. if(scayt_instance.getUserDictionaryName() != null && scayt_instance.getUserDictionaryName() != '') {
  335. dialog.getContentElement("dictionaries", "dictionaryName").setValue(scayt_instance.getUserDictionaryName());
  336. } else {
  337. dialog.getContentElement("dictionaries", "dictionaryName").setValue("");
  338. }
  339. });
  340. var plugin = CKEDITOR.plugins.scayt;
  341. var dialogDefinition = {
  342. title: scayt_instance.getLocal('text_title'),
  343. resizable: CKEDITOR.DIALOG_RESIZE_BOTH,
  344. minWidth: 340,
  345. minHeight: 260,
  346. onLoad: function() {
  347. if(editor.config.scayt_uiTabs[1] == 0) {
  348. return;
  349. }
  350. var dialog = this,
  351. self = dialogDefinition,
  352. langBoxes = self.getLangBoxes.call(dialog);
  353. langBoxes.getParent().setStyle("white-space", "normal");
  354. //dialog.data = editor.fire( 'scaytDialog', {} );
  355. self.renderLangList(langBoxes);
  356. var scayt_instance = editor.scayt;
  357. this.definition.minWidth = this.getSize().width;
  358. this.resize(this.definition.minWidth, this.definition.minHeight);
  359. },
  360. onCancel: function() {
  361. languageModelState.reset();
  362. },
  363. onHide: function() {
  364. editor.unlockSelection();
  365. },
  366. onShow: function() {
  367. editor.fire("scaytDialogShown", this);
  368. if(editor.config.scayt_uiTabs[2] == 0) {
  369. return;
  370. }
  371. var scayt_instance = editor.scayt,
  372. self = dialogDefinition,
  373. dialog = this,
  374. dictionaryNameField = dialog.getContentElement("dictionaries", "dictionaryName"),
  375. existance = dialog.getContentElement("dictionaries", "existDic").getElement().getParent(),
  376. notExistance = dialog.getContentElement("dictionaries", "notExistDic").getElement().getParent();
  377. existance.hide();
  378. notExistance.hide();
  379. if(scayt_instance.getUserDictionaryName() != null && scayt_instance.getUserDictionaryName() != '') {
  380. dialog.getContentElement("dictionaries", "dictionaryName").setValue(scayt_instance.getUserDictionaryName());
  381. existance.show();
  382. } else {
  383. dictionaryNameField.setValue("");
  384. notExistance.show();
  385. }
  386. },
  387. onOk: function() {
  388. var dialog = this,
  389. self = dialogDefinition,
  390. scayt_instance = editor.scayt,
  391. scaytOptions = dialog.getContentElement("options", "scaytOptions"),
  392. changedOptions = self.getChangedOption.call(dialog);
  393. scayt_instance.commitOption({ changedOptions: changedOptions });
  394. },
  395. toggleDictionaryButtons: function(exist) {
  396. var existance = this.getContentElement("dictionaries", "existDic").getElement().getParent(),
  397. notExistance = this.getContentElement("dictionaries", "notExistDic").getElement().getParent();
  398. if(exist) {
  399. existance.show();
  400. notExistance.hide();
  401. } else {
  402. existance.hide();
  403. notExistance.show();
  404. }
  405. },
  406. getChangedOption: function() {
  407. var changedOption = {};
  408. if(editor.config.scayt_uiTabs[0] == 1) {
  409. var dialog = this,
  410. scaytOptions = dialog.getContentElement("options", "scaytOptions").getChild();
  411. for(var i = 0; i < scaytOptions.length; i++) {
  412. if(scaytOptions[i].isChanged()) {
  413. changedOption[scaytOptions[i].id] = scaytOptions[i].getValue();
  414. }
  415. }
  416. }
  417. if(languageModelState.isChanged()) {
  418. changedOption[languageModelState.id] = editor.config.scayt_sLang = languageModelState.currentLang = languageModelState.newLang;
  419. }
  420. return changedOption;
  421. },
  422. buildRadioInputs: function(key, value, isSupportedByGrayt) {
  423. var divContainer = new CKEDITOR.dom.element( 'div' ),
  424. doc = CKEDITOR.document,
  425. id = "scaytLang_" + editor.name + '_' + value,
  426. radio = CKEDITOR.dom.element.createFromHtml( '<input id="' +
  427. id + '" type="radio" ' +
  428. ' value="' + value + '" name="scayt_lang" />' ),
  429. radioLabel = new CKEDITOR.dom.element( 'label' ),
  430. scayt_instance = editor.scayt;
  431. divContainer.setStyles({
  432. "white-space": "normal",
  433. 'position': 'relative',
  434. 'padding-bottom': '2px'
  435. });
  436. radio.on( 'click', function(data) {
  437. languageModelState.newLang = data.sender.getValue();
  438. });
  439. radioLabel.appendText(key);
  440. radioLabel.setAttribute("for", id);
  441. if(isSupportedByGrayt && editor.config.grayt_autoStartup) {
  442. radioLabel.setStyles({
  443. 'color': '#02b620'
  444. });
  445. }
  446. divContainer.append(radio);
  447. divContainer.append(radioLabel);
  448. if(value === scayt_instance.getLang()) {
  449. radio.setAttribute("checked", true);
  450. radio.setAttribute('defaultChecked', 'defaultChecked');
  451. }
  452. return divContainer;
  453. },
  454. renderLangList: function(langBoxes) {
  455. var dialog = this,
  456. leftCol = langBoxes.find('#left-col-' + editor.name).getItem(0),
  457. rightCol = langBoxes.find('#right-col-' + editor.name).getItem(0),
  458. scaytLangList = scayt_instance.getScaytLangList(),
  459. graytLangList = scayt_instance.getGraytLangList(),
  460. mergedLangList = {},
  461. sortable = [],
  462. counter = 0,
  463. isSupportedByGrayt = false,
  464. half, lang;
  465. for(lang in scaytLangList.ltr) {
  466. mergedLangList[lang] = scaytLangList.ltr[lang];
  467. }
  468. for(lang in scaytLangList.rtl) {
  469. mergedLangList[lang] = scaytLangList.rtl[lang];
  470. }
  471. // sort alphabetically lang list
  472. for(lang in mergedLangList) {
  473. sortable.push([lang, mergedLangList[lang]]);
  474. }
  475. sortable.sort(function(a, b) {
  476. var result = 0;
  477. if(a[1] > b[1]) {
  478. result = 1;
  479. } else if(a[1] < b[1]) {
  480. result = -1;
  481. }
  482. return result;
  483. });
  484. mergedLangList = {};
  485. for(var i = 0; i < sortable.length; i++) {
  486. mergedLangList[sortable[i][0]] = sortable[i][1];
  487. }
  488. half = Math.round(sortable.length / 2);
  489. for(lang in mergedLangList) {
  490. counter++;
  491. isSupportedByGrayt = (lang in graytLangList.ltr) || (lang in graytLangList.rtl);
  492. dialog.buildRadioInputs(mergedLangList[lang], lang, isSupportedByGrayt).appendTo(counter <= half ? leftCol : rightCol);
  493. }
  494. },
  495. getLangBoxes: function() {
  496. var dialog = this,
  497. langboxes = dialog.getContentElement("langs", "langBox").getElement();
  498. return langboxes;
  499. },
  500. contents: generateDialogTabs(dialogTabs, editor)
  501. };
  502. return dialogDefinition;
  503. });