github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/root/js/bootstrap-wysihtml5.js (about) 1 !function($, wysi) { 2 "use strict"; 3 4 var tpl = { 5 "font-styles": function(locale, options) { 6 var size = (options && options.size) ? ' btn-'+options.size : ''; 7 return "<li class='dropdown'>" + 8 "<a class='btn dropdown-toggle" + size + "' data-toggle='dropdown' href='#'>" + 9 "<i class='icon-font'></i> <span class='current-font'>" + locale.font_styles.normal + "</span> <b class='caret'></b>" + 10 "</a>" + 11 "<ul class='dropdown-menu'>" + 12 "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='div'>" + locale.font_styles.normal + "</a></li>" + 13 "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='h1'>" + locale.font_styles.h1 + "</a></li>" + 14 "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='h2'>" + locale.font_styles.h2 + "</a></li>" + 15 "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='h3'>" + locale.font_styles.h3 + "</a></li>" + 16 "</ul>" + 17 "</li>"; 18 }, 19 20 "emphasis": function(locale, options) { 21 var size = (options && options.size) ? ' btn-'+options.size : ''; 22 return "<li>" + 23 "<div class='btn-group'>" + 24 "<a class='btn" + size + "' data-wysihtml5-command='bold' title='CTRL+B'>" + locale.emphasis.bold + "</a>" + 25 "<a class='btn" + size + "' data-wysihtml5-command='italic' title='CTRL+I'>" + locale.emphasis.italic + "</a>" + 26 "<a class='btn" + size + "' data-wysihtml5-command='underline' title='CTRL+U'>" + locale.emphasis.underline + "</a>" + 27 "</div>" + 28 "</li>"; 29 }, 30 31 "lists": function(locale, options) { 32 var size = (options && options.size) ? ' btn-'+options.size : ''; 33 return "<li>" + 34 "<div class='btn-group'>" + 35 "<a class='btn" + size + "' data-wysihtml5-command='insertUnorderedList' title='" + locale.lists.unordered + "'><i class='icon-list'></i></a>" + 36 "<a class='btn" + size + "' data-wysihtml5-command='insertOrderedList' title='" + locale.lists.ordered + "'><i class='icon-th-list'></i></a>" + 37 "<a class='btn" + size + "' data-wysihtml5-command='Outdent' title='" + locale.lists.outdent + "'><i class='icon-indent-right'></i></a>" + 38 "<a class='btn" + size + "' data-wysihtml5-command='Indent' title='" + locale.lists.indent + "'><i class='icon-indent-left'></i></a>" + 39 "</div>" + 40 "</li>"; 41 }, 42 43 "link": function(locale, options) { 44 var size = (options && options.size) ? ' btn-'+options.size : ''; 45 return "<li>" + 46 "<div class='bootstrap-wysihtml5-insert-link-modal modal hide fade'>" + 47 "<div class='modal-header'>" + 48 "<a class='close' data-dismiss='modal'></a>" + 49 "<h3>" + locale.link.insert + "</h3>" + 50 "</div>" + 51 "<div class='modal-body'>" + 52 "<input value='http://' class='bootstrap-wysihtml5-insert-link-url m-wrap large' type='text'>" + 53 "</div>" + 54 "<div class='modal-footer'>" + 55 "<a href='#' class='btn' data-dismiss='modal'>" + locale.link.cancel + "</a>" + 56 "<a href='#' class='btn green btn-primary' data-dismiss='modal'>" + locale.link.insert + "</a>" + 57 "</div>" + 58 "</div>" + 59 "<a class='btn" + size + "' data-wysihtml5-command='createLink' title='" + locale.link.insert + "'><i class='icon-share'></i></a>" + 60 "</li>"; 61 }, 62 63 "image": function(locale, options) { 64 var size = (options && options.size) ? ' btn-'+options.size : ''; 65 return "<li>" + 66 "<div class='bootstrap-wysihtml5-insert-image-modal modal hide fade'>" + 67 "<div class='modal-header'>" + 68 "<a class='close' data-dismiss='modal'></a>" + 69 "<h3>" + locale.image.insert + "</h3>" + 70 "</div>" + 71 "<div class='modal-body'>" + 72 "<input value='http://' class='bootstrap-wysihtml5-insert-image-url m-wrap large' type='text'>" + 73 "</div>" + 74 "<div class='modal-footer'>" + 75 "<a href='#' class='btn' data-dismiss='modal'>" + locale.image.cancel + "</a>" + 76 "<a href='#' class='btn green btn-primary' data-dismiss='modal'>" + locale.image.insert + "</a>" + 77 "</div>" + 78 "</div>" + 79 "<a class='btn" + size + "' data-wysihtml5-command='insertImage' title='" + locale.image.insert + "'><i class='icon-picture'></i></a>" + 80 "</li>"; 81 }, 82 83 "html": function(locale, options) { 84 var size = (options && options.size) ? ' btn-'+options.size : ''; 85 return "<li>" + 86 "<div class='btn-group'>" + 87 "<a class='btn" + size + "' data-wysihtml5-action='change_view' title='" + locale.html.edit + "'><i class='icon-pencil'></i></a>" + 88 "</div>" + 89 "</li>"; 90 }, 91 92 "color": function(locale, options) { 93 var size = (options && options.size) ? ' btn-'+options.size : ''; 94 return "<li class='dropdown'>" + 95 "<a class='btn dropdown-toggle" + size + "' data-toggle='dropdown' href='#'>" + 96 "<span class='current-color'>" + locale.colours.black + "</span> <b class='caret'></b>" + 97 "</a>" + 98 "<ul class='dropdown-menu'>" + 99 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='black'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='black'>" + locale.colours.black + "</a></li>" + 100 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='silver'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='silver'>" + locale.colours.silver + "</a></li>" + 101 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='gray'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='gray'>" + locale.colours.gray + "</a></li>" + 102 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='maroon'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='maroon'>" + locale.colours.maroon + "</a></li>" + 103 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='red'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='red'>" + locale.colours.red + "</a></li>" + 104 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='purple'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='purple'>" + locale.colours.purple + "</a></li>" + 105 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='green'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='green'>" + locale.colours.green + "</a></li>" + 106 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='olive'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='olive'>" + locale.colours.olive + "</a></li>" + 107 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='navy'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='navy'>" + locale.colours.navy + "</a></li>" + 108 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='blue'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='blue'>" + locale.colours.blue + "</a></li>" + 109 "<li><div class='wysihtml5-colors' data-wysihtml5-command-value='orange'></div><a class='wysihtml5-colors-title' data-wysihtml5-command='foreColor' data-wysihtml5-command-value='orange'>" + locale.colours.orange + "</a></li>" + 110 "</ul>" + 111 "</li>"; 112 } 113 }; 114 115 var templates = function(key, locale, options) { 116 return tpl[key](locale, options); 117 }; 118 119 120 var Wysihtml5 = function(el, options) { 121 this.el = el; 122 var toolbarOpts = options || defaultOptions; 123 for(var t in toolbarOpts.customTemplates) { 124 tpl[t] = toolbarOpts.customTemplates[t]; 125 } 126 this.toolbar = this.createToolbar(el, toolbarOpts); 127 this.editor = this.createEditor(options); 128 129 window.editor = this.editor; 130 131 $('iframe.wysihtml5-sandbox').each(function(i, el){ 132 $(el.contentWindow).off('focus.wysihtml5').on({ 133 'focus.wysihtml5' : function(){ 134 $('li.dropdown').removeClass('open'); 135 } 136 }); 137 }); 138 }; 139 140 Wysihtml5.prototype = { 141 142 constructor: Wysihtml5, 143 144 createEditor: function(options) { 145 options = options || {}; 146 options.toolbar = this.toolbar[0]; 147 148 var editor = new wysi.Editor(this.el[0], options); 149 150 if(options && options.events) { 151 for(var eventName in options.events) { 152 editor.on(eventName, options.events[eventName]); 153 } 154 } 155 return editor; 156 }, 157 158 createToolbar: function(el, options) { 159 var self = this; 160 var toolbar = $("<ul/>", { 161 'class' : "wysihtml5-toolbar", 162 'style': "display:none" 163 }); 164 var culture = options.locale || defaultOptions.locale || "en"; 165 for(var key in defaultOptions) { 166 var value = false; 167 168 if(options[key] !== undefined) { 169 if(options[key] === true) { 170 value = true; 171 } 172 } else { 173 value = defaultOptions[key]; 174 } 175 176 if(value === true) { 177 toolbar.append(templates(key, locale[culture], options)); 178 179 if(key === "html") { 180 this.initHtml(toolbar); 181 } 182 183 if(key === "link") { 184 this.initInsertLink(toolbar); 185 } 186 187 if(key === "image") { 188 this.initInsertImage(toolbar); 189 } 190 } 191 } 192 193 if(options.toolbar) { 194 for(key in options.toolbar) { 195 toolbar.append(options.toolbar[key]); 196 } 197 } 198 199 toolbar.find("a[data-wysihtml5-command='formatBlock']").click(function(e) { 200 var target = e.target || e.srcElement; 201 var el = $(target); 202 self.toolbar.find('.current-font').text(el.html()); 203 }); 204 205 toolbar.find("a[data-wysihtml5-command='foreColor']").click(function(e) { 206 var target = e.target || e.srcElement; 207 var el = $(target); 208 self.toolbar.find('.current-color').text(el.html()); 209 }); 210 211 this.el.before(toolbar); 212 213 return toolbar; 214 }, 215 216 initHtml: function(toolbar) { 217 var changeViewSelector = "a[data-wysihtml5-action='change_view']"; 218 toolbar.find(changeViewSelector).click(function(e) { 219 toolbar.find('a.btn').not(changeViewSelector).toggleClass('disabled'); 220 }); 221 }, 222 223 initInsertImage: function(toolbar) { 224 var self = this; 225 var insertImageModal = toolbar.find('.bootstrap-wysihtml5-insert-image-modal'); 226 var urlInput = insertImageModal.find('.bootstrap-wysihtml5-insert-image-url'); 227 var insertButton = insertImageModal.find('a.btn-primary'); 228 var initialValue = urlInput.val(); 229 230 var insertImage = function() { 231 var url = urlInput.val(); 232 urlInput.val(initialValue); 233 self.editor.currentView.element.focus(); 234 self.editor.composer.commands.exec("insertImage", url); 235 }; 236 237 urlInput.keypress(function(e) { 238 if(e.which == 13) { 239 insertImage(); 240 insertImageModal.modal('hide'); 241 } 242 }); 243 244 insertButton.click(insertImage); 245 246 insertImageModal.on('shown', function() { 247 urlInput.focus(); 248 }); 249 250 insertImageModal.on('hide', function() { 251 self.editor.currentView.element.focus(); 252 }); 253 254 toolbar.find('a[data-wysihtml5-command=insertImage]').click(function() { 255 var activeButton = $(this).hasClass("wysihtml5-command-active"); 256 257 if (!activeButton) { 258 insertImageModal.modal('show'); 259 insertImageModal.on('click.dismiss.modal', '[data-dismiss="modal"]', function(e) { 260 e.stopPropagation(); 261 }); 262 return false; 263 } 264 else { 265 return true; 266 } 267 }); 268 }, 269 270 initInsertLink: function(toolbar) { 271 var self = this; 272 var insertLinkModal = toolbar.find('.bootstrap-wysihtml5-insert-link-modal'); 273 var urlInput = insertLinkModal.find('.bootstrap-wysihtml5-insert-link-url'); 274 var insertButton = insertLinkModal.find('a.btn-primary'); 275 var initialValue = urlInput.val(); 276 277 var insertLink = function() { 278 var url = urlInput.val(); 279 urlInput.val(initialValue); 280 self.editor.currentView.element.focus(); 281 self.editor.composer.commands.exec("createLink", { 282 href: url, 283 target: "_blank", 284 rel: "nofollow" 285 }); 286 }; 287 var pressedEnter = false; 288 289 urlInput.keypress(function(e) { 290 if(e.which == 13) { 291 insertLink(); 292 insertLinkModal.modal('hide'); 293 } 294 }); 295 296 insertButton.click(insertLink); 297 298 insertLinkModal.on('shown', function() { 299 urlInput.focus(); 300 }); 301 302 insertLinkModal.on('hide', function() { 303 self.editor.currentView.element.focus(); 304 }); 305 306 toolbar.find('a[data-wysihtml5-command=createLink]').click(function() { 307 var activeButton = $(this).hasClass("wysihtml5-command-active"); 308 309 if (!activeButton) { 310 insertLinkModal.appendTo('body').modal('show'); 311 insertLinkModal.on('click.dismiss.modal', '[data-dismiss="modal"]', function(e) { 312 e.stopPropagation(); 313 }); 314 return false; 315 } 316 else { 317 return true; 318 } 319 }); 320 } 321 }; 322 323 // these define our public api 324 var methods = { 325 resetDefaults: function() { 326 $.fn.wysihtml5.defaultOptions = $.extend(true, {}, $.fn.wysihtml5.defaultOptionsCache); 327 }, 328 bypassDefaults: function(options) { 329 return this.each(function () { 330 var $this = $(this); 331 $this.data('wysihtml5', new Wysihtml5($this, options)); 332 }); 333 }, 334 shallowExtend: function (options) { 335 var settings = $.extend({}, $.fn.wysihtml5.defaultOptions, options || {}); 336 var that = this; 337 return methods.bypassDefaults.apply(that, [settings]); 338 }, 339 deepExtend: function(options) { 340 var settings = $.extend(true, {}, $.fn.wysihtml5.defaultOptions, options || {}); 341 var that = this; 342 return methods.bypassDefaults.apply(that, [settings]); 343 }, 344 init: function(options) { 345 var that = this; 346 return methods.shallowExtend.apply(that, [options]); 347 } 348 }; 349 350 $.fn.wysihtml5 = function ( method ) { 351 if ( methods[method] ) { 352 return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 )); 353 } else if ( typeof method === 'object' || ! method ) { 354 return methods.init.apply( this, arguments ); 355 } else { 356 $.error( 'Method ' + method + ' does not exist on jQuery.wysihtml5' ); 357 } 358 }; 359 360 $.fn.wysihtml5.Constructor = Wysihtml5; 361 362 var defaultOptions = $.fn.wysihtml5.defaultOptions = { 363 "font-styles": true, 364 "color": false, 365 "emphasis": true, 366 "lists": true, 367 "html": false, 368 "link": true, 369 "image": true, 370 events: {}, 371 parserRules: { 372 classes: { 373 // (path_to_project/lib/css/wysiwyg-color.css) 374 "wysiwyg-color-silver" : 1, 375 "wysiwyg-color-gray" : 1, 376 "wysiwyg-color-white" : 1, 377 "wysiwyg-color-maroon" : 1, 378 "wysiwyg-color-red" : 1, 379 "wysiwyg-color-purple" : 1, 380 "wysiwyg-color-fuchsia" : 1, 381 "wysiwyg-color-green" : 1, 382 "wysiwyg-color-lime" : 1, 383 "wysiwyg-color-olive" : 1, 384 "wysiwyg-color-yellow" : 1, 385 "wysiwyg-color-navy" : 1, 386 "wysiwyg-color-blue" : 1, 387 "wysiwyg-color-teal" : 1, 388 "wysiwyg-color-aqua" : 1, 389 "wysiwyg-color-orange" : 1 390 }, 391 tags: { 392 "b": {}, 393 "i": {}, 394 "br": {}, 395 "ol": {}, 396 "ul": {}, 397 "li": {}, 398 "h1": {}, 399 "h2": {}, 400 "h3": {}, 401 "blockquote": {}, 402 "u": 1, 403 "img": { 404 "check_attributes": { 405 "width": "numbers", 406 "alt": "alt", 407 "src": "url", 408 "height": "numbers" 409 } 410 }, 411 "a": { 412 set_attributes: { 413 target: "_blank", 414 rel: "nofollow" 415 }, 416 check_attributes: { 417 href: "url" // important to avoid XSS 418 } 419 }, 420 "span": 1, 421 "div": 1 422 } 423 }, 424 stylesheets: ["./lib/css/wysiwyg-color.css"], // (path_to_project/lib/css/wysiwyg-color.css) 425 locale: "en" 426 }; 427 428 if (typeof $.fn.wysihtml5.defaultOptionsCache === 'undefined') { 429 $.fn.wysihtml5.defaultOptionsCache = $.extend(true, {}, $.fn.wysihtml5.defaultOptions); 430 } 431 432 var locale = $.fn.wysihtml5.locale = { 433 en: { 434 font_styles: { 435 normal: "Normal text", 436 h1: "Heading 1", 437 h2: "Heading 2", 438 h3: "Heading 3" 439 }, 440 emphasis: { 441 bold: "Bold", 442 italic: "Italic", 443 underline: "Underline" 444 }, 445 lists: { 446 unordered: "Unordered list", 447 ordered: "Ordered list", 448 outdent: "Outdent", 449 indent: "Indent" 450 }, 451 link: { 452 insert: "Insert link", 453 cancel: "Cancel" 454 }, 455 image: { 456 insert: "Insert image", 457 cancel: "Cancel" 458 }, 459 html: { 460 edit: "Edit HTML" 461 }, 462 colours: { 463 black: "Black", 464 silver: "Silver", 465 gray: "Grey", 466 maroon: "Maroon", 467 red: "Red", 468 purple: "Purple", 469 green: "Green", 470 olive: "Olive", 471 navy: "Navy", 472 blue: "Blue", 473 orange: "Orange" 474 } 475 } 476 }; 477 478 }(window.jQuery, window.wysihtml5);