wcfsetup/install/files/acp/templates/wysiwyg.tpl

   1 <script data-relocate="true">
   2         head.load([
   3                 {if ENABLE_DEBUG_MODE}
   4                         {* Imperavi *}
   5                         '{@$__wcf->getPath()}js/3rdParty/redactor2/redactor.js?v={@LAST_UPDATE_TIME}',
   6                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/alignment.js?v={@LAST_UPDATE_TIME}',
   7                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/source.js?v={@LAST_UPDATE_TIME}',
   8                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/table.js?v={@LAST_UPDATE_TIME}',
   9
  10                         {* WoltLab *}
  11                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabAlignment.js?v={@LAST_UPDATE_TIME}',
  12                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabAttachment.js?v={@LAST_UPDATE_TIME}',
  13                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabAutosave.js?v={@LAST_UPDATE_TIME}',
  14                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabBlock.js?v={@LAST_UPDATE_TIME}',
  15                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabButton.js?v={@LAST_UPDATE_TIME}',
  16                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabCaret.js?v={@LAST_UPDATE_TIME}',
  17                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabClean.js?v={@LAST_UPDATE_TIME}',
  18                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabCode.js?v={@LAST_UPDATE_TIME}',
  19                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabColor.js?v={@LAST_UPDATE_TIME}',
  20                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabDropdown.js?v={@LAST_UPDATE_TIME}',
  21                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabEvent.js?v={@LAST_UPDATE_TIME}',
  22                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabImage.js?v={@LAST_UPDATE_TIME}',
  23                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabInlineCode.js?v={@LAST_UPDATE_TIME}',
  24                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabInsert.js?v={@LAST_UPDATE_TIME}',
  25                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabKeydown.js?v={@LAST_UPDATE_TIME}',
  26                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabLink.js?v={@LAST_UPDATE_TIME}',
  27                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabList.js?v={@LAST_UPDATE_TIME}',
  28                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabMedia.js?v={@LAST_UPDATE_TIME}',
  29                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabMention.js?v={@LAST_UPDATE_TIME}',
  30                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabModal.js?v={@LAST_UPDATE_TIME}',
  31                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabPaste.js?v={@LAST_UPDATE_TIME}',
  32                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabQuote.js?v={@LAST_UPDATE_TIME}',
  33                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabReply.js?v={@LAST_UPDATE_TIME}',
  34                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSize.js?v={@LAST_UPDATE_TIME}',
  35                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSmiley.js?v={@LAST_UPDATE_TIME}',
  36                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSource.js?v={@LAST_UPDATE_TIME}',
  37                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabSpoiler.js?v={@LAST_UPDATE_TIME}',
  38                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/WoltLabUtils.js?v={@LAST_UPDATE_TIME}'
  39                 {else}
  40                         '{@$__wcf->getPath()}js/3rdParty/redactor2/redactor.min.js?v={@LAST_UPDATE_TIME}',
  41                         '{@$__wcf->getPath()}js/3rdParty/redactor2/plugins/combined.min.js?v={@LAST_UPDATE_TIME}'
  42                 {/if}
  43
  44                 {if $__redactorJavaScript|isset}{@$__redactorJavaScript}{/if}
  45                 {assign var=__redactorJavaScript value=''}
  46
  47                 {event name='redactorJavaScript'}
  48         ], function () {
  49                 require(['Language', 'WoltLabSuite/Core/Ui/Redactor/Autosave', 'WoltLabSuite/Core/Ui/Redactor/Metacode'], function(Language, UiRedactorAutosave, UiRedactorMetacode) {
  50                         Language.addObject({
  51                                 'wcf.editor.code.edit': '{lang}wcf.editor.code.edit{/lang}',
  52                                 'wcf.editor.code.file': '{lang}wcf.editor.code.file{/lang}',
  53                                 'wcf.editor.code.file.description': '{lang}wcf.editor.code.file.description{/lang}',
  54                                 'wcf.editor.code.highlighter': '{lang}wcf.editor.code.highlighter{/lang}',
  55                                 'wcf.editor.code.highlighter.description': '{lang}wcf.editor.code.highlighter.description{/lang}',
  56                                 'wcf.editor.code.highlighter.detect': '{lang}wcf.editor.code.highlighter.detect{/lang}',
  57                                 'wcf.editor.code.line': '{lang}wcf.editor.code.line{/lang}',
  58                                 'wcf.editor.code.line.description': '{lang}wcf.editor.code.line.description{/lang}',
  59                                 'wcf.editor.code.title': '{lang __literal=true}wcf.editor.code.title{/lang}',
  60
  61                                 'wcf.editor.image.edit': '{lang}wcf.editor.image.edit{/lang}',
  62                                 'wcf.editor.image.insert': '{lang}wcf.editor.image.insert{/lang}',
  63                                 'wcf.editor.image.link': '{lang}wcf.editor.image.link{/lang}',
  64                                 'wcf.editor.image.link.error.invalid': '{lang}wcf.editor.image.link.error.invalid{/lang}',
  65                                 'wcf.editor.image.float': '{lang}wcf.editor.image.float{/lang}',
  66                                 'wcf.editor.image.float.left': '{lang}wcf.editor.image.float.left{/lang}',
  67                                 'wcf.editor.image.float.right': '{lang}wcf.editor.image.float.right{/lang}',
  68                                 'wcf.editor.image.source': '{lang}wcf.editor.image.source{/lang}',
  69                                 'wcf.editor.image.source.error.invalid': '{lang}wcf.editor.image.source.error.invalid{/lang}',
  70
  71                                 'wcf.editor.link.add': '{lang}wcf.editor.link.add{/lang}',
  72                                 'wcf.editor.link.edit': '{lang}wcf.editor.link.edit{/lang}',
  73                                 'wcf.editor.link.url': '{lang}wcf.editor.link.url{/lang}',
  74                                 'wcf.editor.link.text': '{lang}wcf.editor.link.text{/lang}',
  75
  76                                 'wcf.editor.quote.author': '{lang}wcf.editor.quote.author{/lang}',
  77                                 'wcf.editor.quote.edit': '{lang}wcf.editor.quote.edit{/lang}',
  78                                 'wcf.editor.quote.title': '{lang __literal=true}wcf.editor.quote.title{/lang}',
  79                                 'wcf.editor.quote.url': '{lang}wcf.editor.quote.url{/lang}',
  80                                 'wcf.editor.quote.url.description': '{lang}wcf.editor.quote.url.description{/lang}',
  81                                 'wcf.editor.quote.url.error.invalid': '{lang}wcf.editor.quote.url.error.invalid{/lang}',
  82
  83                                 'wcf.editor.spoiler.label': '{lang}wcf.editor.spoiler.label{/lang}',
  84                                 'wcf.editor.spoiler.label.description': '{lang}wcf.editor.spoiler.label.description{/lang}',
  85                                 'wcf.editor.spoiler.edit': '{lang}wcf.editor.spoiler.edit{/lang}',
  86                                 'wcf.editor.spoiler.title': '{lang __literal=true}wcf.editor.spoiler.title{/lang}'
  87                         });
  88
  89                         var buttons = [], buttonMobile = [], buttonOptions = [], customButtons = [];
  90                         {include file='wysiwygToolbar'}
  91
  92                         var highlighters = { {implode from=$__wcf->getBBCodeHandler()->getHighlighters() item=__highlighter}'{$__highlighter}': '{lang}wcf.bbcode.code.{@$__highlighter}.title{/lang}'{/implode} };
  93
  94                         {include file='mediaJavaScript'}
  95
  96                         var element = elById('{if $wysiwygSelector|isset}{$wysiwygSelector|encodeJS}{else}text{/if}');
  97                         UiRedactorMetacode.convert(element);
  98
  99                         var autosave = elData(element, 'autosave') || null;
 100                         if (autosave) {
 101                                 autosave = new UiRedactorAutosave(element);
 102                                 element.value = autosave.getInitialValue();
 103                         }
 104
 105                         var config = {
 106                                 buttons: buttons,
 107                                 formatting: ['p', 'h2', 'h3', 'h4'],
 108                                 imageCaption: false,
 109                                 lang: 'wsc', // fake language to offload phrases
 110                                 langs: {
 111                                         wsc: {
 112                                                 // general
 113                                                 edit: '{lang}wcf.global.button.edit{/lang}',
 114
 115                                                 // formatting dropdown
 116                                                 heading2: '{lang}wcf.editor.format.heading2{/lang}',
 117                                                 heading3: '{lang}wcf.editor.format.heading3{/lang}',
 118                                                 heading4: '{lang}wcf.editor.format.heading4{/lang}',
 119                                                 paragraph: '{lang}wcf.editor.format.paragraph{/lang}',
 120
 121                                                 // links
 122                                                 'link-edit': '{lang}wcf.editor.link.edit{/lang}',
 123                                                 'link-insert': '{lang}wcf.editor.link.add{/lang}',
 124                                                 unlink: '{lang}wcf.editor.link.unlink{/lang}',
 125
 126                                                 // text alignment
 127                                                 'align-center': '{lang}wcf.editor.alignment.center{/lang}',
 128                                                 'align-justify': '{lang}wcf.editor.alignment.justify{/lang}',
 129                                                 'align-left': '{lang}wcf.editor.alignment.left{/lang}',
 130                                                 'align-right': '{lang}wcf.editor.alignment.right{/lang}',
 131
 132                                                 // table plugin
 133                                                 'add-head': '{lang}wcf.editor.table.addHead{/lang}',
 134                                                 'delete-column': '{lang}wcf.editor.table.deleteColumn{/lang}',
 135                                                 'delete-head': '{lang}wcf.editor.table.deleteHead{/lang}',
 136                                                 'delete-row': '{lang}wcf.editor.table.deleteRow{/lang}',
 137                                                 'delete-table': '{lang}wcf.editor.table.deleteTable{/lang}',
 138                                                 'insert-table': '{lang}wcf.editor.table.insertTable{/lang}',
 139                                                 'insert-column-left': '{lang}wcf.editor.table.insertColumnLeft{/lang}',
 140                                                 'insert-column-right': '{lang}wcf.editor.table.insertColumnRight{/lang}',
 141                                                 'insert-row-above': '{lang}wcf.editor.table.insertRowAbove{/lang}',
 142                                                 'insert-row-below': '{lang}wcf.editor.table.insertRowBelow{/lang}',
 143
 144                                                 // size
 145                                                 'remove-size': '{lang}wcf.editor.button.size.removeSize{/lang}',
 146
 147                                                 // color
 148                                                 'remove-color': '{lang}wcf.editor.button.color.removeColor{/lang}'
 149                                         }
 150                                 },
 151                                 linkify: false,
 152                                 linkSize: 0xBADC0DED, // some random value to disable truncating
 153                                 minHeight: 200,
 154                                 //placeholder: elData(element, 'placeholder') || '',
 155                                 plugins: [
 156                                         // Imperavi
 157                                         'alignment',
 158                                         'source',
 159                                         'table',
 160
 161                                         // WoltLab specials
 162                                         'WoltLabBlock',
 163                                         'WoltLabEvent',
 164                                         'WoltLabKeydown',
 165
 166                                         // WoltLab core
 167                                         'WoltLabAlignment',
 168                                         'WoltLabAttachment',
 169                                         'WoltLabAutosave',
 170                                         'WoltLabCaret',
 171                                         'WoltLabClean',
 172                                         'WoltLabCode',
 173                                         'WoltLabColor',
 174                                         'WoltLabDropdown',
 175                                         'WoltLabImage',
 176                                         'WoltLabInlineCode',
 177                                         'WoltLabInsert',
 178                                         'WoltLabLink',
 179                                         'WoltLabList',
 180                                         'WoltLabModal',
 181                                         'WoltLabPaste',
 182                                         'WoltLabQuote',
 183                                         'WoltLabReply',
 184                                         'WoltLabSize',
 185                                         'WoltLabSmiley',
 186                                         'WoltLabSource',
 187                                         'WoltLabSpoiler',
 188                                         'WoltLabUtils'
 189                                 ],
 190                                 toolbarFixed: false,
 191                                 woltlab: {
 192                                         autosave: autosave,
 193                                         buttons: buttonOptions,
 194                                         buttonMobile: buttonMobile,
 195                                         customButtons: customButtons,
 196                                         highlighters: highlighters
 197                                 }
 198                         };
 199
 200                         // user mentions
 201                         if (elDataBool(element, 'support-mention')) {
 202                                 config.plugins.push('WoltLabMention');
 203                         }
 204
 205                         // media
 206                         {if $__wcf->session->getPermission('admin.content.cms.canUseMedia')}
 207                                 config.plugins.push('WoltLabMedia');
 208                         {/if}
 209
 210                         {if $__redactorConfig|isset}{@$__redactorConfig}{/if}
 211                         {assign var=__redactorConfig value=''}
 212
 213                         {event name='redactorConfig'}
 214
 215                         // load the button plugin last to ensure all buttons have been initialized
 216                         // already and we can safely add all icons
 217                         config.plugins.push('WoltLabButton');
 218
 219                         var content = element.value;
 220                         element.value = '';
 221
 222                         config.callbacks = config.callbacks || { };
 223                         config.callbacks.init = function() {
 224                                 // slight delay to allow Redactor to initialize itself
 225                                 window.setTimeout(function() {
 226                                         $(element).redactor('code.set', content);
 227                                 }, 10);
 228                         };
 229
 230                         $(element).redactor(config);
 231                 });
 232         });
 233 </script>