in reply to Re^5: TinyMCE javascript toolbar ( tinymce/js/tinymce/plugins/perlmonks/plugin.js )
in thread TinyMCE javascript toolbar
the plugin tinymce/js/tinymce/plugins/perlmonks/plugin.js
/** * tinymce/js/tinymce/plugins/perlmonks/plugin.js * 2014-12-14-16:41:12 * based on * tinymce/js/tinymce/plugins/bbcode/plugin.js * tinymce/js/tinymce/plugins/example/plugin.js * * Copyright, Anonymous Monk * Released under the same terms as perl itself */ /*global tinymce:true */ (function() { tinymce.create('tinymce.plugins.PerlMonksPlugin', { init : function(ed) { var self = this; // dialect = ed.getParam('bbcode_dialect', 'punbb').toLower +Case(); ed.on('beforeSetContent', function(e) { e.content = self['_pm2html'](e.content); }); ed.on('postProcess', function(e) { if (e.set) { e.content = self['_pm2html'](e.content); } else if (e.get) { e.content = self['_html2pm'](e.content); } }); ed.addMenuItem('perlmonkscodetags', { text: '<code></code>', icon: false, context: 'format', /* file menu, views, tools ... */ onclick: function() { // something // ed.windowManager.open({ // TODO toggle add/remove code tags around selecti +on or at cursor } }); ed.addButton('perlmonkscodetags', { text: '<code></code>', icon: false, onclick: function() { // something // ed.windowManager.open({ // TODO toggle add/remove code tags around selecti +on or at cursor } }); }, getInfo: function() { return { longname: 'PerlMonks Plugin', author: 'Anonymous Monk', authorurl: 'http://www.perlmonks.org/?node_id=961', infourl: 'http://www.perlmonks.org/?node=PerlMonks+FAQ +' }; }, _html2pm : function(s) { var codeReplacer = function(match,precode,code, c){ /* function(match, p1, p2, p3, offset, string) */ var repsFun = function(chr){ return { "<" : "<", ">" : ">", "&" : "&", " " : " ", "<br>" : "\n", "[" : "[", "]" : "]" }[chr]; }; /* repsFun */ if( precode ){ s = precode.replace( /(\&\#91;|\&\#93;|\ |\&l +t;|\>|\&|<br>)/gi, repsFun ); s = "<pre><code>"+s+"</code></pre>"; } else if( code ){ s = code.replace( /(\&\#91;|\&\#93;|\ |\<| +\>|\&|<br>)/gi, repsFun ); s = "<code>"+s+"</code>"; } else { s = c.replace( /(\&\#91;|\&\#93;|\ |\<|\&g +t;|\&|<br>)/gi, repsFun ); s = "<code>"+s+"</code>"; } if( s.match(/\n/) ){ s = "<pre>" + s + "</pre>"; } return s; }; /* end of codeReplacer */ s = s.replace(/<pre><code>([\w\W]*?)<\/code><\/pre>|<code> +([\w\W]*?)<\/code>|<c>([\w\W]*?)<\/c>/gi, codeReplacer ); return s; }, _pm2html : function(s) { /* function(match, p1, p2, p3, offset, string) */ var codeReplacer = function(match, precode, code, c ){ var repsFun = function(chr){ return { "<" : "<", ">" : ">", "&" : "&", " " : " ", "\n" : "<br>", "[" : "[", "]" : "]" }[ chr ]; }; /* repsFun */ if( precode ){ s = precode.replace( /([\n <>&])/gi, repsFun ); } else if( code ){ s = code.replace( /([\n <>&])/gi, repsFun ); } else { s = c.replace( /([\n <>&])/gi, repsFun ); } s = "<code>" + s + "</code>"; if( s.match(/\n/) ){ s = "<pre>" + s + "</pre>"; } return s; }; /* end of codeReplacer */ s = s.replace(/<pre><code>([\w\W]*?)<\/code><\/pre>|<code> +([\w\W]*?)<\/code>|<c>([\w\W]*?)<\/c>/gi, codeReplacer ); return s; } }); // Register plugin tinymce.PluginManager.add('perlmonks', tinymce.plugins.PerlMonksPl +ugin); })();
the offline test html
<html lang="en-US" charset="UTF-8"> <head> <title> tinymce perlmonks local editor </title> <meta charset="utf-8"> </head> <body> <textarea> <p> <b> not code </b> then <pre><code> <> one line </code></pre> <p> <b> not code </b> then <pre><code> <> two <> line </code></pre></textarea> <hr> <a href="#" onclick="tinymce.execCommand('mceToggleEditor',false,'cont +ent');">[Toggle WYSIWYG]</a> <hr> <form method="post" onsubmit='return false'> <textarea id="content" name="content" style="width:100%; height:82 +%"> </textarea> </form> <script type="text/javascript" src="tinymce/js/tinymce/tinymce.dev.js" +></script> <script type="text/javascript"> tinymce.init({ selector: 'textarea#content', remove_linebreaks: false, forced_root_block : 'p', convert_newlines_to_brs : true, force_p_newlines : false, remove_redundant_brs: false, preformatted : true, plugins: [ 'legacyoutput', /* let <b> <i> and <u> remain not turn into <e +m>/<strong>/<span> */ 'perlmonks', ], statusbar : true, cleanup: false, /* fake html */ element_format : "html", toolbar : "perlmonkscodetags | undo redo | table | bold italic | a +lignleft aligncenter alignright alignjustify | bullist numlist outden +t indent | link | print preview | forecolor backcolor emoticons charm +ap code | hr paste searchreplace spellchecker template visualblocks i +nsertdatetime', // insertfile styleselect save media image fullpage p +agebreak" }); </script> </body> </html>
|
|---|
| Replies are listed 'Best First'. | |
|---|---|
|
Re^7: TinyMCE javascript toolbar ( perlmonks/plugin.js v1 )
by Steve_BZ (Chaplain) on Dec 15, 2014 at 18:45 UTC |