LaravelTest
291 строка · 8.0 Кб
1(function(factory) {2if (typeof define === 'function' && define.amd) {3// AMD. Register as an anonymous module.4define(['jquery'], factory);5} else if (typeof module === 'object' && module.exports) {6// Node/CommonJS7module.exports = factory(require('jquery'));8} else {9// Browser globals10factory(window.jQuery);11}12}(function($) {13// pull in some summernote core functions14var ui = $.summernote.ui;15var dom = $.summernote.dom;16
17// define the popover plugin18var DataBasicPlugin = function(context) {19var self = this;20var options = context.options;21var lang = options.langInfo;22
23self.icon = '<i class="fa fa-object-group"></i>';24
25// add context menu button for dialog26context.memo('button.databasic', function() {27return ui.button({28contents: self.icon,29tooltip: lang.databasic.insert,30click: context.createInvokeHandler('databasic.showDialog'),31}).render();32});33
34// add popover edit button35context.memo('button.databasicDialog', function() {36return ui.button({37contents: self.icon,38tooltip: lang.databasic.edit,39click: context.createInvokeHandler('databasic.showDialog'),40}).render();41});42
43// add popover size buttons44context.memo('button.databasicSize100', function() {45return ui.button({46contents: '<span class="note-fontsize-10">100%</span>',47tooltip: lang.image.resizeFull,48click: context.createInvokeHandler('editor.resize', '1'),49}).render();50});51context.memo('button.databasicSize50', function() {52return ui.button({53contents: '<span class="note-fontsize-10">50%</span>',54tooltip: lang.image.resizeHalf,55click: context.createInvokeHandler('editor.resize', '0.5'),56}).render();57});58context.memo('button.databasicSize25', function() {59return ui.button({60contents: '<span class="note-fontsize-10">25%</span>',61tooltip: lang.image.resizeQuarter,62click: context.createInvokeHandler('editor.resize', '0.25'),63}).render();64});65
66self.events = {67'summernote.init': function(we, e) {68// update existing containers69$('data.ext-databasic', e.editable).each(function() { self.setContent($(this)); });70// TODO: make this an undo snapshot...71},72'summernote.keyup summernote.mouseup summernote.change summernote.scroll': function() {73self.update();74},75'summernote.dialog.shown': function() {76self.hidePopover();77},78};79
80self.initialize = function() {81// create dialog markup82var $container = options.dialogsInBody ? $(document.body) : context.layoutInfo.editor;83
84var body = '<div class="form-group row-fluid">' +85'<label>' + lang.databasic.testLabel + '</label>' +86'<input class="ext-databasic-test form-control" type="text" />' +87'</div>';88var footer = '<button href="#" class="btn btn-primary ext-databasic-save">' + lang.databasic.insert + '</button>';89
90self.$dialog = ui.dialog({91title: lang.databasic.name,92fade: options.dialogsFade,93body: body,94footer: footer,95}).render().appendTo($container);96
97// create popover98self.$popover = ui.popover({99className: 'ext-databasic-popover',100}).render().appendTo('body');101var $content = self.$popover.find('.popover-content');102
103context.invoke('buttons.build', $content, options.popover.databasic);104};105
106self.destroy = function() {107self.$popover.remove();108self.$popover = null;109self.$dialog.remove();110self.$dialog = null;111};112
113self.update = function() {114// Prevent focusing on editable when invoke('code') is executed115if (!context.invoke('editor.hasFocus')) {116self.hidePopover();117return;118}119
120var rng = context.invoke('editor.createRange');121var visible = false;122
123if (rng.isOnData()) {124var $data = $(rng.sc).closest('data.ext-databasic');125
126if ($data.length) {127var pos = dom.posFromPlaceholder($data[0]);128
129self.$popover.css({130display: 'block',131left: pos.left,132top: pos.top,133});134
135// save editor target to let size buttons resize the container136context.invoke('editor.saveTarget', $data[0]);137
138visible = true;139}140}141
142// hide if not visible143if (!visible) {144self.hidePopover();145}146};147
148self.hidePopover = function() {149self.$popover.hide();150};151
152// define plugin dialog153self.getInfo = function() {154var rng = context.invoke('editor.createRange');155
156if (rng.isOnData()) {157var $data = $(rng.sc).closest('data.ext-databasic');158
159if ($data.length) {160// Get the first node on range(for edit).161return {162node: $data,163test: $data.attr('data-test'),164};165}166}167
168return {};169};170
171self.setContent = function($node) {172$node.html('<p contenteditable="false">' + self.icon + ' ' + lang.databasic.name + ': ' +173$node.attr('data-test') + '</p>');174};175
176self.updateNode = function(info) {177self.setContent(info.node178.attr('data-test', info.test));179};180
181self.createNode = function(info) {182var $node = $('<data class="ext-databasic"></data>');183
184if ($node) {185// save node to info structure186info.node = $node;187// insert node into editor dom188context.invoke('editor.insertNode', $node[0]);189}190
191return $node;192};193
194self.showDialog = function() {195var info = self.getInfo();196var newNode = !info.node;197context.invoke('editor.saveRange');198
199self
200.openDialog(info)201.then(function(dialogInfo) {202// [workaround] hide dialog before restore range for IE range focus203ui.hideDialog(self.$dialog);204context.invoke('editor.restoreRange');205
206// insert a new node207if (newNode) {208self.createNode(info);209}210
211// update info with dialog info212$.extend(info, dialogInfo);213
214self.updateNode(info);215})216.fail(function() {217context.invoke('editor.restoreRange');218});219};220
221self.openDialog = function(info) {222return $.Deferred(function(deferred) {223var $inpTest = self.$dialog.find('.ext-databasic-test');224var $saveBtn = self.$dialog.find('.ext-databasic-save');225var onKeyup = function(event) {226if (event.keyCode === 13) {227$saveBtn.trigger('click');228}229};230
231ui.onDialogShown(self.$dialog, function() {232context.triggerEvent('dialog.shown');233
234$inpTest.val(info.test).on('input', function() {235ui.toggleBtn($saveBtn, $inpTest.val());236}).trigger('focus').on('keyup', onKeyup);237
238$saveBtn
239.text(info.node ? lang.databasic.edit : lang.databasic.insert)240.click(function(event) {241event.preventDefault();242
243deferred.resolve({ test: $inpTest.val() });244});245
246// init save button247ui.toggleBtn($saveBtn, $inpTest.val());248});249
250ui.onDialogHidden(self.$dialog, function() {251$inpTest.off('input keyup');252$saveBtn.off('click');253
254if (deferred.state() === 'pending') {255deferred.reject();256}257});258
259ui.showDialog(self.$dialog);260});261};262};263
264// Extends summernote265$.extend(true, $.summernote, {266plugins: {267databasic: DataBasicPlugin,268},269
270options: {271popover: {272databasic: [273['databasic', ['databasicDialog', 'databasicSize100', 'databasicSize50', 'databasicSize25']],274],275},276},277
278// add localization texts279lang: {280'en-US': {281databasic: {282name: 'Basic Data Container',283insert: 'insert basic data container',284edit: 'edit basic data container',285testLabel: 'test input',286},287},288},289
290});291}));292