File modules/editor/trumbowyg/plugins/highlight/trumbowyg.highlight.js

Last commit: Tue Aug 28 00:33:27 2018 +0200	Jan Dankert	Editoren für Markdown (SimpleMDE) und HTML (Trumbowyg) installiert.


     1 /* globals Prism */
     2 (function ($, Prism) {
     3     'use strict';
     4 
     5     // My plugin default options
     6     var defaultOptions = {};
     7 
     8     function highlightIt(text, language) {
     9         return [
    10             '<pre class="language-' + language + '">',
    11             '<code class="language-' + language + '">' + Prism.highlight(text, Prism.languages[language]) + '</code>',
    12             '</pre>',
    13         ].join('');
    14     }
    15 
    16     // If my plugin is a button
    17     function buildButtonDef(trumbowyg) {
    18         return {
    19             fn: function () {
    20                 var $modal = trumbowyg.openModal('Code', [
    21                     '<div class="' + trumbowyg.o.prefix + 'highlight-form-group">',
    22                     '   <select class="' + trumbowyg.o.prefix + 'highlight-form-control language">',
    23                     (function () {
    24                         var options = '';
    25 
    26                         for (var lang in Prism.languages) {
    27                             if (Prism.languages[lang].comment) {
    28                                 options += '<option value="' + lang + '">' + lang + '</option>';
    29                             }
    30                         }
    31 
    32                         return options;
    33                     })(),
    34                     '   </select>',
    35                     '</div>',
    36                     '<div class="' + trumbowyg.o.prefix + 'highlight-form-group">',
    37                     '   <textarea class="' + trumbowyg.o.prefix + 'highlight-form-control code"></textarea>',
    38                     '</div>',
    39                 ].join('\n')),
    40                 $language = $modal.find('.language'),
    41                 $code = $modal.find('.code');
    42 
    43                 // Listen clicks on modal box buttons
    44                 $modal.on('tbwconfirm', function () {
    45                     trumbowyg.restoreRange();
    46                     trumbowyg.execCmd('insertHTML', highlightIt($code.val(), $language.val()));
    47                     trumbowyg.execCmd('insertHTML', '<p><br></p>');
    48 
    49                     trumbowyg.closeModal();
    50                 });
    51 
    52                 $modal.on('tbwcancel', function () {
    53                     trumbowyg.closeModal();
    54                 });
    55             }
    56         };
    57     }
    58 
    59     $.extend(true, $.trumbowyg, {
    60         // Add some translations
    61         langs: {
    62             en: {
    63                 highlight: 'Code syntax highlight'
    64             }
    65         },
    66         // Add our plugin to Trumbowyg registred plugins
    67         plugins: {
    68             highlight: {
    69                 init: function (trumbowyg) {
    70                     // Fill current Trumbowyg instance with my plugin default options
    71                     trumbowyg.o.plugins.highlight = $.extend(true, {},
    72                         defaultOptions,
    73                         trumbowyg.o.plugins.highlight || {}
    74                     );
    75 
    76                     // If my plugin is a button
    77                     trumbowyg.addBtnDef('highlight', buildButtonDef(trumbowyg));
    78                 }
    79             }
    80         }
    81     });
    82 })(jQuery, Prism);



Download modules/editor/trumbowyg/plugins/highlight/trumbowyg.highlight.js


History
Tue, 28 Aug 2018 00:33:27 +0200	Jan Dankert	Editoren für Markdown (SimpleMDE) und HTML (Trumbowyg) installiert.