BxBaseEditorTinyMCE.php 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. <?php defined('BX_DOL') or die('hack attempt');
  2. /**
  3. * Copyright (c) UNA, Inc - https://una.io
  4. * MIT License - https://opensource.org/licenses/MIT
  5. *
  6. * @defgroup UnaBaseView UNA Base Representation Classes
  7. * @{
  8. */
  9. /**
  10. * TinyMCE editor representation.
  11. * @see BxDolEditor
  12. */
  13. class BxBaseEditorTinyMCE extends BxDolEditor
  14. {
  15. /**
  16. * Common initialization params
  17. */
  18. protected static $CONF_COMMON = <<<EOS
  19. jQuery('{bx_var_selector}').tinymce({
  20. {bx_var_custom_init}
  21. {bx_var_custom_conf}
  22. document_base_url: '{bx_url_root}',
  23. theme_url: '{bx_url_tinymce}themes/modern/theme.min.js',
  24. skin_url: '{bx_url_tinymce}skins/{bx_var_skin}/',
  25. language_url: '{bx_url_tinymce}langs/{bx_var_lang}.js',
  26. content_css: '{bx_var_css_path}',
  27. entity_encoding: 'raw',
  28. browser_spellcheck: true,
  29. branding: false,
  30. link_assume_external_targets: true,
  31. body_class: 'bx-def-color-bg-block',
  32. codesample_languages: [
  33. {text: 'HTML/XML', value: 'markup'},
  34. {text: 'JavaScript', value: 'javascript'},
  35. {text: 'CSS', value: 'css'},
  36. {text: 'PHP', value: 'php'},
  37. ],
  38. init_instance_callback: function(editor) {
  39. $(editor.contentDocument.activeElement).atwho({
  40. searchKey: 'label',
  41. at: "@",
  42. limit: 20,
  43. displayTpl: '<li class="bx-mention-row" data-value="\${value}"><span>\${label}</span> <img class="bx-def-round-corners" src="\${thumb}" /></li>',
  44. insertTpl: '<a class="bx-mention" data-profile-id="\${value}" href="\${url}">\${label}</a>',
  45. callbacks: {
  46. remoteFilter: function(query, callback) {
  47. $.getJSON("{bx_url_root}searchExtended.php?action=get_authors", {term: query}, function(data) {
  48. callback(data);
  49. });
  50. }
  51. },
  52. });
  53. bx_editor_on_init('{bx_var_selector}');
  54. },
  55. setup: function(editor) {
  56. editor.on('keydown', function(e) {
  57. if (e.keyCode == 13 && $(editor.contentDocument.activeElement).atwho('isSelecting'))
  58. return false;
  59. });
  60. }
  61. });
  62. EOS;
  63. /**
  64. * Standard view initialization params
  65. */
  66. protected static $CONF_STANDARD = "
  67. external_plugins: {plugins},
  68. width: '100%',
  69. height: '270',
  70. toolbar: {toolbar},
  71. statusbar: true,
  72. resize: true,
  73. ";
  74. /**
  75. * Minimal view initialization params
  76. */
  77. protected static $CONF_MINI = "
  78. menubar: false,
  79. external_plugins: {plugins},
  80. width: '100%',
  81. height: '150',
  82. toolbar: {toolbar},
  83. statusbar: true,
  84. resize: true,
  85. ";
  86. /**
  87. * Full view initialization params
  88. */
  89. protected static $CONF_FULL = "
  90. external_plugins: {plugins},
  91. width: '100%',
  92. height: '320',
  93. toolbar: {toolbar},
  94. statusbar: true,
  95. resize: true,
  96. image_advtab: true,
  97. ";
  98. /**
  99. * Available editor languages
  100. */
  101. protected static $CONF_LANGS = array('af_ZA' => 1, 'ar' => 1, 'be' => 1, 'bg_BG' => 1, 'ca' => 1, 'cs' => 1, 'cy' => 1, 'da' => 1, 'de' => 1, 'de_AT' => 1, 'dv' => 1, 'el' => 1, 'en' => 1, 'en_CA' => 1, 'en_GB' => 1, 'es' => 1, 'es_MX' => 1, 'et' => 1, 'fa_IR' => 1, 'fr_FR' => 1, 'ga' => 1, 'gl' => 1, 'he_IL' => 1, 'hr' => 1, 'hu_HU' => 1, 'it' => 1, 'ja' => 1, 'ka_GE' => 1, 'kab' => 1, 'kk' => 1, 'km_KH' => 1, 'ko_KR' => 1, 'lv' => 1, 'nb_NO' => 1, 'nl' => 1, 'pl' => 1, 'pt_BR' => 1, 'pt_PT' => 1, 'ro' => 1, 'ru' => 1, 'sk' => 1, 'sl_SI' => 1, 'sv_SE' => 1, 'ta' => 1, 'ta_IN' => 1, 'th_TH' => 1, 'tr' => 1, 'tr_TR' => 1, 'uk' => 1, 'uk_UA' => 1, 'uz' => 1, 'vi_VN' => 1, 'zh_CN' => 1, 'zh_TW' => 1);
  102. protected $_oTemplate;
  103. protected $_bJsCssAdded = false;
  104. public function __construct ($aObject, $oTemplate)
  105. {
  106. parent::__construct ($aObject);
  107. if ($oTemplate)
  108. $this->_oTemplate = $oTemplate;
  109. else
  110. $this->_oTemplate = BxDolTemplate::getInstance();
  111. }
  112. /**
  113. * Attach editor to HTML element, in most cases - textarea.
  114. * @param $sSelector - jQuery selector to attach editor to.
  115. * @param $iViewMode - editor view mode: BX_EDITOR_STANDARD, BX_EDITOR_MINI, BX_EDITOR_FULL
  116. * @param $bDynamicMode - is AJAX mode or not, the HTML with editor area is loaded dynamically.
  117. */
  118. public function attachEditor ($sSelector, $iViewMode = BX_EDITOR_STANDARD, $bDynamicMode = false)
  119. {
  120. // set visual mode
  121. switch ($iViewMode) {
  122. case BX_EDITOR_MINI:
  123. $sToolbarItems = getParam('sys_tinymce_toolbar_mini');
  124. $sPlugins = getParam('sys_tinymce_plugins_mini');
  125. $sCustomInit = self::$CONF_MINI;
  126. break;
  127. case BX_EDITOR_FULL:
  128. $sToolbarItems = getParam('sys_tinymce_toolbar_full');
  129. $sPlugins = getParam('sys_tinymce_plugins_full');
  130. $sCustomInit = self::$CONF_FULL;
  131. break;
  132. case BX_EDITOR_STANDARD:
  133. default:
  134. $sToolbarItems = getParam('sys_tinymce_toolbar_standard');
  135. $sPlugins = getParam('sys_tinymce_plugins_standard');
  136. $sCustomInit = self::$CONF_STANDARD;
  137. }
  138. if ($this->_sButtonsCustom !== false) {
  139. $sToolbarItems = $this->_sButtonsCustom;
  140. }
  141. else {
  142. $sToolbarItems = json_encode(explode(',', $sToolbarItems));
  143. }
  144. if ($this->_sPluginsCustom !== false) {
  145. $sPlugins = $this->_sPluginsCustom;
  146. }
  147. else {
  148. $a = explode(',', $sPlugins);
  149. foreach ($a as $sPlugin)
  150. $aPlugins[$sPlugin] = "{bx_url_tinymce}plugins/$sPlugin/plugin.min.js";
  151. $sPlugins = json_encode($aPlugins);
  152. }
  153. $sCustomInit = str_replace('{toolbar}', $sToolbarItems ? $sToolbarItems : "[]", $sCustomInit);
  154. $sCustomInit = str_replace('{plugins}', $sPlugins, $sCustomInit);
  155. // detect language
  156. $sLang = BxDolLanguages::getInstance()->detectLanguageFromArray (self::$CONF_LANGS);
  157. $sCss = 'editor.less';
  158. $aCss = BxDolTemplate::getInstance()->_lessCss(array(
  159. 'path' => $this->_oTemplate->getCssPath($sCss),
  160. 'url' => $this->_oTemplate->getCssUrl($sCss)
  161. ));
  162. // initialize editor
  163. $sInitEditor = $this->_replaceMarkers(self::$CONF_COMMON, array(
  164. 'bx_var_custom_init' => $sCustomInit,
  165. 'bx_var_custom_conf' => $this->_sConfCustom,
  166. 'bx_var_plugins_path' => bx_js_string(BX_DOL_URL_PLUGINS_PUBLIC, BX_ESCAPE_STR_APOS),
  167. 'bx_var_css_path' => bx_js_string($aCss['url'], BX_ESCAPE_STR_APOS),
  168. 'bx_var_skin' => bx_js_string($this->_aObject['skin'], BX_ESCAPE_STR_APOS),
  169. 'bx_var_lang' => bx_js_string($sLang, BX_ESCAPE_STR_APOS),
  170. 'bx_var_selector' => bx_js_string($sSelector, BX_ESCAPE_STR_APOS),
  171. 'bx_url_root' => bx_js_string(BX_DOL_URL_ROOT, BX_ESCAPE_STR_APOS),
  172. 'bx_url_tinymce' => bx_js_string(BX_DOL_URL_PLUGINS_PUBLIC . 'tinymce/', BX_ESCAPE_STR_APOS),
  173. ));
  174. if ($bDynamicMode) {
  175. $sScript = "<script>
  176. if ('undefined' == typeof(jQuery(document).tinymce)) {
  177. window.tinyMCEPreInit = {base : '" . bx_js_string(BX_DOL_URL_PLUGINS_PUBLIC . 'tinymce', BX_ESCAPE_STR_APOS) . "', suffix : '.min', query : ''};
  178. $.getScript('" . bx_js_string(BX_DOL_URL_ROOT . 'inc/js/editor.tinymce.js', BX_ESCAPE_STR_APOS) . "');
  179. $.getScript('" . bx_js_string(BX_DOL_URL_PLUGINS_PUBLIC . 'tinymce/tinymce.min.js', BX_ESCAPE_STR_APOS) . "', function(data, textStatus, jqxhr) {
  180. $.getScript('" . bx_js_string(BX_DOL_URL_PLUGINS_PUBLIC . 'tinymce/jquery.tinymce.min.js', BX_ESCAPE_STR_APOS) . "', function(data, textStatus, jqxhr) {
  181. $sInitEditor
  182. });
  183. });
  184. } else {
  185. setTimeout(function () {
  186. $sInitEditor
  187. }, 10); // wait while html is rendered in case of dynamic adding html with tinymce
  188. }
  189. </script>";
  190. } else {
  191. $sScript = "
  192. <script>
  193. $(document).ready(function () {
  194. $sInitEditor
  195. });
  196. </script>";
  197. }
  198. return $this->_addJsCss($bDynamicMode) . $sScript;
  199. }
  200. /**
  201. * Add css/js files which are needed for editor display and functionality.
  202. */
  203. protected function _addJsCss($bDynamicMode = false, $sInitEditor = '')
  204. {
  205. if ($bDynamicMode)
  206. return '';
  207. if ($this->_bJsCssAdded)
  208. return '';
  209. $this->_oTemplate->addJs(array('tinymce/tinymce.min.js', 'tinymce/jquery.tinymce.min.js', 'editor.tinymce.js'));
  210. $this->_bJsCssAdded = true;
  211. return '';
  212. }
  213. }
  214. /** @} */