FileManager

public/js/summernote-iq-content-extension.js

@@ -0,0 +1,202 @@
+(function(factory)
+{
+    /* global define */
+    if (typeof define === 'function' && define.amd)
+    {
+        // AMD. Register as an anonymous module.
+        define(['jquery'], factory);
+    }
+    else if (typeof module === 'object' && module.exports)
+    {
+        // Node/CommonJS
+        module.exports = factory(require('jquery'));
+    }
+    else
+    {
+        // Browser globals
+        factory(window.jQuery);
+    }
+}(function($)
+{
+
+    // Extends plugins for adding gallery.
+    //  - plugin is external module for customizing.
+    $.extend($.summernote.plugins,
+    {
+        /**
+         * @param {Object} context - context object has status of editor.
+         */
+        'gallery': function(context)
+        {
+            var self = this;
+
+            // ui has renders to build ui elements.
+            //  - you can create a button with `ui.button`
+            var ui = $.summernote.ui;
+
+            // add gallery button
+            context.memo('button.gallery', function()
+            {
+                // create button
+                var button = ui.button(
+                {
+                    contents: '<i class="fa fa-image"></i>',
+                    tooltip: 'Medien',
+                    click: function()
+                    {
+                        self.fillModal();
+                        self.$modal.modal();
+                    }
+                });
+
+                // create jQuery object from button instance.
+                $gallery = button.render();
+                return $gallery;
+            });
+
+            // This events will be attached when editor is initialized.
+            this.events = {
+                // This will be called after modules are initialized.
+                'summernote.init': function(we, e)
+                {
+                    self.editable = context.layoutInfo.editable; //contentEditable element
+                    self.editor = this;
+                    // get summernote onInit set parameters
+                    self.image_dialog_images_url = $(this).data('image_dialog_images_url');
+                    self.image_dialog_images_html = $(this).data('image_dialog_images_html');
+                    self.image_dialog_title = $(this).data('image_dialog_title');
+                    self.image_dialog_close_btn_text = $(this).data('image_dialog_close_btn_text');
+                    self.image_dialog_ok_btn_text = $(this).data('image_dialog_ok_btn_text');
+
+                    self.fillModal = function()
+                    {
+                        //fill modal with images whether from url or given html
+                        if (typeof self.image_dialog_images_html !== "undefined")
+                        {
+                            self.setModalHtml(self.image_dialog_images_html)
+                            self.setEvents();
+                        }
+                        else if (typeof self.image_dialog_images_url !== "undefined")
+                        {
+                            var next = self.setEvents;
+                            self.getImagesFromUrl(next);
+                        }
+                        else
+                        {
+                            console.error("options image_dialog_images_html or image_dialog_images_url must be set");
+                        }
+
+                    };
+                    self.setModalHtml = function(html)
+                    {   // set variabl parts to modal html
+                        var title = self.image_dialog_title;
+                        var close = self.image_dialog_close_btn_text;
+                        var ok = self.image_dialog_ok_btn_text;
+
+                        if (self.image_dialog_title !== "undefined") self.$modal.find('.modal-title').html(title);
+                        if (self.image_dialog_close_btn_text !== "undefined") self.$modal.find('#modal_iq_close').html(close);
+                        if (self.image_dialog_ok_btn_text !== "undefined") self.$modal.find('#modal_iq_save').html(ok);
+
+                        self.$modal.find('.modal-body').html(html);
+                        LFileManager.initFileManager(true);
+
+                    };
+                    self.getImagesFromUrl = function(callback)
+                    {
+                        // get images html from url
+                        $.get(self.image_dialog_images_url, function(html)
+                        {
+                            self.setModalHtml(html);
+                            callback();
+
+                        }).fail(function()
+                        {
+                            console.error("error loading from "+self.image_dialog_images_url);
+                        })
+                    };
+                    self.setEvents = function()
+                    {
+                        // images click event to select image
+                        /*self.$modal.find('img').click(function(event)
+                        {
+                           // $(this).toggleClass(self.select_class);
+                        });*/
+                    };
+                    // set the focus to the last focused element in the editor
+                    self.recoverEditorFocus = function ()
+                    {
+                        var last_focused_el = $(self.editor).data('last_focused_element');
+                        if(typeof last_focused_el !== "undefined")
+                        {
+                            var editor = self.editable;
+                            var range = document.createRange();
+                            var sel = window.getSelection();
+                            var cursor_position =  last_focused_el.length;
+
+                            range.setStart(last_focused_el, cursor_position);
+                            range.collapse(true);
+                            sel.removeAllRanges();
+                            sel.addRange(range);
+                            editor.focus();
+                        }
+                    };
+                    self.saveLastFocusedElement = function()
+                    {
+                        var focused_element = window.getSelection().focusNode;
+                        var parent = $(self.editable).get(0);
+                        if ($.contains(parent, focused_element))
+                        {
+                            $(self.editor).data('last_focused_element', focused_element)
+                        };
+                    };
+                    self.editorEvents = function () {
+                        $(self.editable).on('keypress, mousemove', function()
+                        {
+                            self.saveLastFocusedElement();
+                        })
+                    };
+                    self.editorEvents();
+                    self.fillModal();
+                },
+                // This will be called when user releases a key on editable.
+                'summernote.keyup': function(we, e)
+                {
+                    self.saveLastFocusedElement();
+                }
+            };
+
+            // This method will be called when editor is initialized by $('..').summernote();
+            // You can create elements for plugin
+            this.initialize = function()
+            {
+                var $modal = this.$modal = $('#modal_iq_assets').hide();
+                // add selected images to summernote editor
+                $modal.find("button#modal_iq_save").click(function(event)
+                {
+                    var items = LFileManager.getSelectedItems();
+
+                    $modal.modal('hide');
+
+                    self.recoverEditorFocus();
+
+                    items.forEach(function (item, index) {
+                        var insert = LFileManager.insertHTML(item);
+                        if(insert){
+                            context.invoke('editor.pasteHTML', insert);
+                        }
+                    });
+                });
+
+            };
+
+            // This methods will be called when editor is destroyed by $('..').summernote('destroy');
+            // You should remove elements on `initialize`.
+            this.destroy = function()
+            {
+                console.log("destroy");
+                // this.$panel.remove();
+                // this.$panel = null;
+            };
+        }
+    });
+}));