com.woltlab.wcf/templates/wysiwyg.tpl

   1 <style>
   2         woltlab-mention {
   3                 background-color: rgb(240, 248, 255);
   4                 border: 1px solid rgb(52, 152, 219);
   5                 display: inline-block;
   6                 margin: 0 3px;
   7                 padding: 0 2px;
   8         }
   9 </style>
  10 <script data-relocate="true">
  11 (function() {
  12         var buttons = ['format', 'wcfSeparator', 'bold', 'italic', 'underline', 'deleted', 'wcfSeparator', 'lists', 'image', 'link'];
  13
  14         var elementId = '{if $wysiwygSelector|isset}{$wysiwygSelector|encodeJS}{else}text{/if}';
  15         var callbackIdentifier = 'Redactor2_' + elementId;
  16
  17         WCF.System.Dependency.Manager.setup(callbackIdentifier, function() {
  18                 // TODO: Should the media stuff be here?
  19                 {include file='mediaJavaScript'}
  20
  21                 var element = elById(elementId);
  22                 var autosave = elData(element, 'autosave') || '';
  23                 if (autosave) {
  24                         element.removeAttribute('data-autosave');
  25                 }
  26
  27                 var config = {
  28                         buttons: buttons,
  29                         minHeight: 200,
  30                         plugins: ['WoltLabButton', 'WoltLabColor', 'WoltLabDropdown', 'WoltLabEvent', 'WoltLabLink', 'WoltLabQuote'],
  31                         woltlab: {
  32                                 autosave: autosave
  33                         }
  34                 };
  35
  36                 // user mentions
  37                 if (elDataBool(element, 'support-mention')) {
  38                         config.plugins.push('WoltLabMention');
  39                 }
  40
  41                 // media
  42                 {if $__wcf->session->getPermission('admin.content.cms.canUseMedia')}
  43                         config.plugins.push('WoltLabMedia');
  44                 {/if}
  45
  46                 $(element).redactor(config);
  47         });
  48
  49         head.load([
  50                 '{@$__wcf->getPath()}js/3rdParty/redactor2/redactor.js?v={@LAST_UPDATE_TIME}',
  51
  52                 {* WoltLab *}
  53                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabButton.js?v={@LAST_UPDATE_TIME}',
  54                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabColor.js?v={@LAST_UPDATE_TIME}',
  55                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabDropdown.js?v={@LAST_UPDATE_TIME}',
  56                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabEvent.js?v={@LAST_UPDATE_TIME}',
  57                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabLink.js?v={@LAST_UPDATE_TIME}',
  58                 {if $__wcf->session->getPermission('admin.content.cms.canUseMedia')}'{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabMedia.js?v={@LAST_UPDATE_TIME}',{/if}
  59                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabMention.js?v={@LAST_UPDATE_TIME}',
  60                 '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabQuote.js?v={@LAST_UPDATE_TIME}'
  61
  62                 ], function() {
  63                         WCF.System.Dependency.Manager.invoke(callbackIdentifier);
  64                 }
  65         );
  66 })();
  67 </script>
  68
  69 {*
  70 <script data-relocate="true">
  71 var __REDACTOR_ICON_PATH = '{@$__wcf->getPath()}icon/';
  72 var __REDACTOR_BUTTONS = [ {implode from=$__wcf->getBBCodeHandler()->getButtonBBCodes() item=__bbcode}{ icon: '{$__bbcode->wysiwygIcon}', label: '{$__bbcode->buttonLabel|language}', name: '{$__bbcode->bbcodeTag}' }{/implode} ];
  73 var __REDACTOR_SMILIES = { {implode from=$__wcf->getSmileyCache()->getCategorySmilies() item=smiley}'{@$smiley->smileyCode|encodeJS}': '{@$smiley->getURL()|encodeJS}'{/implode} };
  74 var __REDACTOR_BBCODES = [ {implode from=$__wcf->getBBCodeHandler()->getBBCodes() item=__bbcode}'{@$__bbcode->bbcodeTag}'{/implode} ];
  75 var __REDACTOR_SOURCE_BBCODES = [ {implode from=$__wcf->getBBCodeHandler()->getSourceBBCodes() item=__bbcode}'{@$__bbcode->bbcodeTag}'{/implode} ];
  76 var __REDACTOR_CODE_HIGHLIGHTERS = { {implode from=$__wcf->getBBCodeHandler()->getHighlighters() item=__highlighter}'{@$__highlighter}': '{lang}wcf.bbcode.code.{@$__highlighter}.title{/lang}'{/implode} };
  77 var __REDACTOR_AMD_DEPENDENCIES = { };
  78
  79 require(['Language', 'WoltLab/WCF/Bbcode/FromHtml', 'WoltLab/WCF/Bbcode/ToHtml'], function(Language, BbcodeFromHTML, BbcodeToHTML) {
  80 __REDACTOR_AMD_DEPENDENCIES = {
  81 BbcodeFromHTML: BbcodeFromHTML,
  82 BbcodeToHTML: BbcodeToHTML
  83 };
  84
  85 Language.addObject({
  86 'wcf.attachment.dragAndDrop.dropHere': '{lang}wcf.attachment.dragAndDrop.dropHere{/lang}',
  87 'wcf.attachment.dragAndDrop.dropNow': '{lang}wcf.attachment.dragAndDrop.dropNow{/lang}',
  88 'wcf.bbcode.button.fontColor': '{lang}wcf.bbcode.button.fontColor{/lang}',
  89 'wcf.bbcode.button.fontFamily': '{lang}wcf.bbcode.button.fontFamily{/lang}',
  90 'wcf.bbcode.button.fontSize': '{lang}wcf.bbcode.button.fontSize{/lang}',
  91 'wcf.bbcode.button.image': '{lang}wcf.bbcode.button.image{/lang}',
  92 'wcf.bbcode.button.redo': '{lang}wcf.bbcode.button.redo{/lang}',
  93 'wcf.bbcode.button.subscript': '{lang}wcf.bbcode.button.subscript{/lang}',
  94 'wcf.bbcode.button.superscript': '{lang}wcf.bbcode.button.superscript{/lang}',
  95 'wcf.bbcode.button.toggleBBCode': '{lang}wcf.bbcode.button.toggleBBCode{/lang}',
  96 'wcf.bbcode.button.toggleHTML': '{lang}wcf.bbcode.button.toggleHTML{/lang}',
  97 'wcf.bbcode.button.undo': '{lang}wcf.bbcode.button.undo{/lang}',
  98 'wcf.bbcode.code': '{lang}wcf.bbcode.code{/lang}',
  99 'wcf.bbcode.code.edit': '{lang}wcf.bbcode.code.edit{/lang}',
 100 'wcf.bbcode.code.filename': '{lang}wcf.bbcode.code.filename{/lang}',
 101 'wcf.bbcode.code.filename.description': '{lang}wcf.bbcode.code.filename.description{/lang}',
 102 'wcf.bbcode.code.highlighter': '{lang}wcf.bbcode.code.highlighter{/lang}',
 103 'wcf.bbcode.code.highlighter.description': '{lang}wcf.bbcode.code.highlighter.description{/lang}',
 104 'wcf.bbcode.code.highlighter.none': '{lang}wcf.bbcode.code.highlighter.none{/lang}',
 105 'wcf.bbcode.code.insert': '{lang}wcf.bbcode.code.insert{/lang}',
 106 'wcf.bbcode.code.lineNumber': '{lang}wcf.bbcode.code.lineNumber{/lang}',
 107 'wcf.bbcode.code.lineNumber.description': '{lang}wcf.bbcode.code.lineNumber.description{/lang}',
 108 'wcf.bbcode.code.settings': '{lang}wcf.bbcode.code.settings{/lang}',
 109 'wcf.bbcode.image.source': '{lang}wcf.bbcode.image.source{/lang}',
 110 'wcf.bbcode.quote.edit': '{lang}wcf.bbcode.quote.edit{/lang}',
 111 'wcf.bbcode.quote.edit.author': '{lang}wcf.bbcode.quote.edit.author{/lang}',
 112 'wcf.bbcode.quote.edit.link': '{lang}wcf.bbcode.quote.edit.link{/lang}',
 113 'wcf.bbcode.quote.insert': '{lang}wcf.bbcode.quote.insert{/lang}',
 114 'wcf.bbcode.quote.title.clickToSet': '{lang}wcf.bbcode.quote.title.clickToSet{/lang}',
 115 'wcf.bbcode.quote.title.javascript': '{lang}wcf.bbcode.quote.title.javascript{/lang}',
 116 'wcf.global.noSelection': '{lang}wcf.global.noSelection{/lang}',
 117 'wcf.message.autosave.prompt': '{lang}wcf.message.autosave.prompt{/lang}',
 118 'wcf.message.autosave.prompt.confirm': '{lang}wcf.message.autosave.prompt.confirm{/lang}',
 119 'wcf.message.autosave.prompt.discard': '{lang}wcf.message.autosave.prompt.discard{/lang}',
 120 'wcf.message.autosave.restored': '{lang}wcf.message.autosave.restored{/lang}',
 121 'wcf.message.autosave.restored.confirm': '{lang}wcf.message.autosave.restored.confirm{/lang}',
 122 'wcf.message.autosave.restored.revert': '{lang}wcf.message.autosave.restored.revert{/lang}',
 123 'wcf.message.autosave.restored.revert.confirmMessage': '{lang}wcf.message.autosave.restored.revert.confirmMessage{/lang}',
 124 'wcf.message.autosave.restored.version': '{lang __literal=true}wcf.message.autosave.restored.version{/lang}',
 125 'wcf.message.autosave.saved': '{lang}wcf.message.autosave.saved{/lang}'
 126 });
 127
 128 var $editorName = '{if $wysiwygSelector|isset}{$wysiwygSelector|encodeJS}{else}text{/if}';
 129 var $callbackIdentifier = 'Redactor_' + $editorName;
 130
 131 WCF.System.Dependency.Manager.setup($callbackIdentifier, function() {
 132 var $textarea = $('#' + $editorName);
 133 var $buttons = [ ];
 134
 135 {include file='wysiwygToolbar'}
 136
 137 var $autosave = $textarea.data('autosave');
 138 var $autosaveLastEditTime = ($autosave && $textarea.data('autosaveLastEditTime')) ? (parseInt($textarea.data('autosaveLastEditTime')) || 0) : 0;
 139 var $autosavePrompt = ($autosave && $textarea.data('autosavePrompt')) ? true : false;
 140 var $config = {
 141         autosave: false,
 142         buttons: $buttons,
 143         convertImageLinks: false,
 144         convertUrlLinks: false,
 145         convertVideoLinks: false,
 146         direction: '{lang}wcf.global.pageDirection{/lang}',
 147         lang: '{@$__wcf->getLanguage()->getFixedLanguageCode()}',
 148         linebreaks: true,
 149         maxHeight: 500,
 150         minHeight: 200,
 151         plugins: [ 'wutil', 'wautosave', 'wmonkeypatch', 'wbutton', 'wbbcode', 'wfontcolor', 'wfontfamily', 'wfontsize' ],
 152         removeEmpty: false,
 153         replaceDivs: false,
 154         source: true,
 155         tabifier: false,
 156         toolbarFixed: false,
 157         woltlab: {
 158                 autosave: {
 159                         active: ($autosave) ? true : false,
 160                         key: ($autosave) ? '{@$__wcf->getAutosavePrefix()}_' + $autosave : '',
 161                         lastEditTime: $autosaveLastEditTime,
 162                         prefix: '{@$__wcf->getAutosavePrefix()}',
 163                         prompt: $autosavePrompt,
 164                         saveOnInit: {if !$errorField|empty}true{else}false{/if}
 165                 },
 166                 originalValue: $textarea.val()
 167         }
 168 };
 169
 170 {if $__wcf->getBBCodeHandler()->isAvailableBBCode('table')}
 171         $config.plugins.splice(2, 0, 'table');
 172 {/if}
 173
 174 // TODO: is this still required?
 175 if ($.browser.iOS) {
 176         // using a zero-width space breaks iOS' detection of the start of a sentence, causing the first word to be lowercased
 177         $config.emptyHtml = '<p><br></p>';
 178 }
 179
 180 {if MODULE_ATTACHMENT && !$attachmentHandler|empty && $attachmentHandler->canUpload()}
 181         $config.plugins.push('wupload');
 182         $config.woltlab.attachmentUrl = '{link controller='Attachment' id=987654321}{/link}';
 183         $config.woltlab.attachmentThumbnailUrl = '{link controller='Attachment' id=987654321}thumbnail=1{/link}';
 184 {/if}
 185
 186 {event name='javascriptInit'}
 187
 188 // clear textarea before init
 189 $textarea.val('');
 190
 191 $textarea.redactor($config);
 192 });
 193
 194 head.load([
 195 '{@$__wcf->getPath()}js/3rdParty/redactor/redactor{if !ENABLE_DEBUG_MODE}.min{/if}.js?v={@LAST_UPDATE_TIME}',
 196 {if $__wcf->getLanguage()->getFixedLanguageCode() != 'en'}'{@$__wcf->getPath()}js/3rdParty/redactor/languages/{@$__wcf->getLanguage()->getFixedLanguageCode()}.js?v={@LAST_UPDATE_TIME}',{/if}
 197 {if !ENABLE_DEBUG_MODE}
 198         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wcombined.min.js?v={@LAST_UPDATE_TIME}'
 199 {else}
 200         {* official *}{*
 201         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/table.js?v={@LAST_UPDATE_TIME}',
 202
 203         {* WoltLab *}{*
 204         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wautosave.js?v={@LAST_UPDATE_TIME}',
 205         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wbbcode.js?v={@LAST_UPDATE_TIME}',
 206         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wbutton.js?v={@LAST_UPDATE_TIME}',
 207         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wfontcolor.js?v={@LAST_UPDATE_TIME}',
 208         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wfontfamily.js?v={@LAST_UPDATE_TIME}',
 209         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wfontsize.js?v={@LAST_UPDATE_TIME}',
 210         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wmonkeypatch.js?v={@LAST_UPDATE_TIME}',
 211         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wutil.js?v={@LAST_UPDATE_TIME}',
 212         '{@$__wcf->getPath()}js/3rdParty/redactor/plugins/wupload.js?v={@LAST_UPDATE_TIME}'
 213 {/if}
 214 {event name='javascriptFiles'}
 215 ], function() {
 216 WCF.System.Dependency.Manager.invoke($callbackIdentifier);
 217 });
 218 });
 219 </script>
 220 *}