├── .gitignore ├── README.md ├── LICENSE ├── example └── index.html └── src └── summernote-ext-highlight.js /.gitignore: -------------------------------------------------------------------------------- 1 | # phpstorm project files 2 | .idea -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # summernote-ext-highlight 2 | Based on [Google code-prettify](https://github.com/google/code-prettify) the [summernote](https://github.com/summernote/summernote) code highlighting plugin 3 | 4 | ## Setup 5 | * Include summernote project script 6 | * Include [Font Awesome](http://fontawesome.io/) 7 | * Include the script tag below in your document 8 | ```HTML 9 | 10 | ``` 11 | 12 | ## Usage 13 | * Configuration summernote toolbar 14 | ```javascript 15 | $('.summernote').summernote({ 16 | height: 200, 17 | tabsize: 2, 18 | // close prettify Html 19 | prettifyHtml:false, 20 | toolbar:[ 21 | // Add highlight plugin 22 | ['highlight', ['highlight']], 23 | ], 24 | lang:'zh-CN' 25 | }); 26 | ``` 27 | ## Contacts 28 | * Email: yanlong.hee#gmail.com 29 | * Twitter: https://twitter.com/YanlongHe 30 | * Website: https://notes.yanlong.me/ 31 | 32 | ## License 33 | summernote-ext-highlight may be freely distributed under the MIT license. 34 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 何延龙 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /example/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | summernote 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 45 | 46 | 47 |
48 |

1 check insert code button

49 |

2 enter the code fragment to editor

50 |

3 check preview button

51 | 55 |
56 | 57 |
58 |
59 | 60 |
61 |
62 | 63 | 64 | -------------------------------------------------------------------------------- /src/summernote-ext-highlight.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * summernote highlight plugin 3 | * http://www.hyl.pw/ 4 | * 5 | * Released under the MIT license 6 | */ 7 | (function (factory) { 8 | /* global define */ 9 | if (typeof define === 'function' && define.amd) { 10 | // AMD. Register as an anonymous module. 11 | define(['jquery'], factory); 12 | } else if (typeof module === 'object' && module.exports) { 13 | // Node/CommonJS 14 | module.exports = factory(require('jquery')); 15 | } else { 16 | // Browser globals: jQuery 17 | factory(window.jQuery); 18 | } 19 | }(function ($) { 20 | 21 | // Extends plugins for adding highlight. 22 | // - plugin is external module for customizing. 23 | $.extend($.summernote.plugins, { 24 | 25 | /** 26 | * @param {Object} context - context object has status of editor. 27 | */ 28 | 'highlight': function (context) { 29 | 30 | var self = this; 31 | 32 | var ui = $.summernote.ui; 33 | var $editor = context.layoutInfo.editor; 34 | var options = context.options; 35 | var lang = options.langInfo; 36 | 37 | // add button 38 | 39 | context.memo('button.highlight', function () { 40 | // create button 41 | var button = ui.button({ 42 | contents: '', 43 | tooltip: 'highlight', 44 | click: function () { 45 | self.show() 46 | } 47 | }); 48 | 49 | // create jQuery object from button instance. 50 | var $highlight = button.render(); 51 | return $highlight; 52 | }); 53 | 54 | this.createDialog = function () { 55 | 56 | var $box = $('
'); 57 | var $selectGroup = $('
'); 58 | var $textGroup = $('
'); 59 | var $select = $('