trumbowyg.fontsize.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. (function ($) {
  2. 'use strict';
  3. $.extend(true, $.trumbowyg, {
  4. langs: {
  5. // jshint camelcase:false
  6. en: {
  7. fontsize: 'Font size',
  8. fontsizes: {
  9. 'x-small': 'Extra small',
  10. 'small': 'Small',
  11. 'medium': 'Regular',
  12. 'large': 'Large',
  13. 'x-large': 'Extra large',
  14. 'custom': 'Custom'
  15. },
  16. fontCustomSize: {
  17. title: 'Custom Font Size',
  18. label: 'Font Size',
  19. value: '48px'
  20. }
  21. },
  22. da: {
  23. fontsize: 'Skriftstørrelse',
  24. fontsizes: {
  25. 'x-small': 'Ekstra lille',
  26. 'small': 'Lille',
  27. 'medium': 'Normal',
  28. 'large': 'Stor',
  29. 'x-large': 'Ekstra stor',
  30. 'custom': 'Brugerdefineret'
  31. }
  32. },
  33. de: {
  34. fontsize: 'Schriftgröße',
  35. fontsizes: {
  36. 'x-small': 'Sehr klein',
  37. 'small': 'Klein',
  38. 'medium': 'Normal',
  39. 'large': 'Groß',
  40. 'x-large': 'Sehr groß',
  41. 'custom': 'Benutzerdefiniert'
  42. },
  43. fontCustomSize: {
  44. title: 'Benutzerdefinierte Schriftgröße',
  45. label: 'Schriftgröße',
  46. value: '48px'
  47. }
  48. },
  49. es: {
  50. fontsize: 'Tamaño de Fuente',
  51. fontsizes: {
  52. 'x-small': 'Extra pequeña',
  53. 'small': 'Pegueña',
  54. 'medium': 'Regular',
  55. 'large': 'Grande',
  56. 'x-large': 'Extra Grande',
  57. 'custom': 'Customizada'
  58. },
  59. fontCustomSize: {
  60. title: 'Tamaño de Fuente Customizada',
  61. label: 'Tamaño de Fuente',
  62. value: '48px'
  63. }
  64. },
  65. fr: {
  66. fontsize: 'Taille de la police',
  67. fontsizes: {
  68. 'x-small': 'Très petit',
  69. 'small': 'Petit',
  70. 'medium': 'Normal',
  71. 'large': 'Grand',
  72. 'x-large': 'Très grand',
  73. 'custom': 'Taille personnalisée'
  74. },
  75. fontCustomSize: {
  76. title: 'Taille de police personnalisée',
  77. label: 'Taille de la police',
  78. value: '48px'
  79. }
  80. },
  81. hu: {
  82. fontsize: 'Betű méret',
  83. fontsizes: {
  84. 'x-small': 'Extra kicsi',
  85. 'small': 'Kicsi',
  86. 'medium': 'Normális',
  87. 'large': 'Nagy',
  88. 'x-large': 'Extra nagy',
  89. 'custom': 'Egyedi'
  90. },
  91. fontCustomSize: {
  92. title: 'Egyedi betű méret',
  93. label: 'Betű méret',
  94. value: '48px'
  95. }
  96. },
  97. it: {
  98. fontsize: 'Dimensioni del testo',
  99. fontsizes: {
  100. 'x-small': 'Molto piccolo',
  101. 'small': 'piccolo',
  102. 'regular': 'normale',
  103. 'large': 'grande',
  104. 'x-large': 'Molto grande',
  105. 'custom': 'Personalizzato'
  106. },
  107. fontCustomSize: {
  108. title: 'Dimensioni del testo personalizzato',
  109. label: 'Dimensioni del testo',
  110. value: '48px'
  111. }
  112. },
  113. ko: {
  114. fontsize: '글꼴 크기',
  115. fontsizes: {
  116. 'x-small': '아주 작게',
  117. 'small': '작게',
  118. 'medium': '보통',
  119. 'large': '크게',
  120. 'x-large': '아주 크게',
  121. 'custom': '사용자 지정'
  122. },
  123. fontCustomSize: {
  124. title: '사용자 지정 글꼴 크기',
  125. label: '글꼴 크기',
  126. value: '48px'
  127. }
  128. },
  129. nl: {
  130. fontsize: 'Lettergrootte',
  131. fontsizes: {
  132. 'x-small': 'Extra klein',
  133. 'small': 'Klein',
  134. 'medium': 'Normaal',
  135. 'large': 'Groot',
  136. 'x-large': 'Extra groot',
  137. 'custom': 'Tilpasset'
  138. }
  139. },
  140. pt_br: {
  141. fontsize: 'Tamanho da fonte',
  142. fontsizes: {
  143. 'x-small': 'Extra pequeno',
  144. 'small': 'Pequeno',
  145. 'regular': 'Médio',
  146. 'large': 'Grande',
  147. 'x-large': 'Extra grande',
  148. 'custom': 'Personalizado'
  149. },
  150. fontCustomSize: {
  151. title: 'Tamanho de Fonte Personalizado',
  152. label: 'Tamanho de Fonte',
  153. value: '48px'
  154. }
  155. },
  156. tr: {
  157. fontsize: 'Yazı Boyutu',
  158. fontsizes: {
  159. 'x-small': 'Çok Küçük',
  160. 'small': 'Küçük',
  161. 'medium': 'Normal',
  162. 'large': 'Büyük',
  163. 'x-large': 'Çok Büyük',
  164. 'custom': 'Görenek'
  165. }
  166. },
  167. zh_tw: {
  168. fontsize: '字體大小',
  169. fontsizes: {
  170. 'x-small': '最小',
  171. 'small': '小',
  172. 'medium': '中',
  173. 'large': '大',
  174. 'x-large': '最大',
  175. 'custom': '自訂大小',
  176. },
  177. fontCustomSize: {
  178. title: '自訂義字體大小',
  179. label: '字體大小',
  180. value: '48px'
  181. }
  182. },
  183. }
  184. });
  185. // jshint camelcase:true
  186. var defaultOptions = {
  187. sizeList: [
  188. 'x-small',
  189. 'small',
  190. 'medium',
  191. 'large',
  192. 'x-large'
  193. ],
  194. allowCustomSize: true
  195. };
  196. // Add dropdown with font sizes
  197. $.extend(true, $.trumbowyg, {
  198. plugins: {
  199. fontsize: {
  200. init: function (trumbowyg) {
  201. trumbowyg.o.plugins.fontsize = $.extend({},
  202. defaultOptions,
  203. trumbowyg.o.plugins.fontsize || {}
  204. );
  205. trumbowyg.addBtnDef('fontsize', {
  206. dropdown: buildDropdown(trumbowyg)
  207. });
  208. }
  209. }
  210. }
  211. });
  212. function setFontSize(trumbowyg, size) {
  213. trumbowyg.$ed.focus();
  214. trumbowyg.saveRange();
  215. // Temporary size
  216. trumbowyg.execCmd('fontSize', '1');
  217. // Find <font> elements that were added and change to <span> with chosen size
  218. trumbowyg.$ed.find('font[size="1"]').replaceWith(function() {
  219. return $('<span/>', {
  220. css: { 'font-size': size },
  221. html: this.innerHTML,
  222. });
  223. });
  224. // Remove and leftover <span> elements
  225. $(trumbowyg.range.startContainer.parentElement).find('span[style=""]').contents().unwrap();
  226. trumbowyg.restoreRange();
  227. trumbowyg.syncCode();
  228. trumbowyg.$c.trigger('tbwchange');
  229. }
  230. function buildDropdown(trumbowyg) {
  231. var dropdown = [];
  232. $.each(trumbowyg.o.plugins.fontsize.sizeList, function (index, size) {
  233. trumbowyg.addBtnDef('fontsize_' + size, {
  234. text: '<span style="font-size: ' + size + ';">' + (trumbowyg.lang.fontsizes[size] || size) + '</span>',
  235. hasIcon: false,
  236. fn: function () {
  237. setFontSize(trumbowyg, size);
  238. }
  239. });
  240. dropdown.push('fontsize_' + size);
  241. });
  242. if (trumbowyg.o.plugins.fontsize.allowCustomSize) {
  243. var customSizeButtonName = 'fontsize_custom';
  244. var customSizeBtnDef = {
  245. fn: function () {
  246. trumbowyg.openModalInsert(trumbowyg.lang.fontCustomSize.title,
  247. {
  248. size: {
  249. label: trumbowyg.lang.fontCustomSize.label,
  250. value: trumbowyg.lang.fontCustomSize.value
  251. }
  252. },
  253. function (form) {
  254. setFontSize(trumbowyg, form.size);
  255. return true;
  256. }
  257. );
  258. },
  259. text: '<span style="font-size: medium;">' + trumbowyg.lang.fontsizes.custom + '</span>',
  260. hasIcon: false
  261. };
  262. trumbowyg.addBtnDef(customSizeButtonName, customSizeBtnDef);
  263. dropdown.push(customSizeButtonName);
  264. }
  265. return dropdown;
  266. }
  267. })(jQuery);