feat: Added QUI Font-Awesome Plugin

bin/Editor.js

@@ -219,6 +219,10 @@ define('package/quiqqer/ckeditor4/bin/Editor', [
                 URL_OPT_DIR + 'quiqqer/ckeditor4/bin/defaultWysiwyg.css'
             );
 
+            data.cssFiles.push(
+                URL_OPT_DIR + 'quiqqer/quiqqer/bin/css/fonts/font-awesome.min.css'
+            );
+
 
             Settings.getConfig().then(function (config) {
                 var plugins = config.plugins;

bin/backend/controls/UploadWindow.js

@@ -43,7 +43,7 @@ define('package/quiqqer/ckeditor4/bin/backend/controls/UploadWindow', [
 
             this.addEvents({
                 onOpen: this.$onOpen,
-                submit: this.$onSubmit
+                onSubmit: this.$onSubmit
             });
 
         },
@@ -52,8 +52,6 @@ define('package/quiqqer/ckeditor4/bin/backend/controls/UploadWindow', [
          * Calls the ajax function to get the labels from gitlab and sets up its controls.
          */
         $onOpen: function () {
-            var self = this;
-
             var Content = this.getContent();
 
             this.$Upload = new UploadForm({
@@ -61,7 +59,7 @@ define('package/quiqqer/ckeditor4/bin/backend/controls/UploadWindow', [
                 sendbutton  : false,
                 cancelbutton: false,
                 events      : {
-                    onComplete: self.$onComplete
+                    onComplete: this.$onComplete
                 },
                 styles      : {
                     height: '80%'

plugins/quiqqer/qui-font-awesome/lang/de.js

+CKEDITOR.plugins.setLang('qui-font-awesome', 'de', {
+    button: 'Font-Awesome'
+
+});

plugins/quiqqer/qui-font-awesome/plugin.js

+(function () {
+    "use strict";
+    console.log(CKEDITOR);
+
+
+    CKEDITOR.plugins.add('qui-font-awesome', {
+        icons: "icon",
+        lang : ['en', 'de'],
+        init : function (editor) {
+            console.log("Init");
+
+            this.$Editor = editor;
+            var self     = this;
+
+            editor.ui.addButton('FontAwesome', {
+                label  : "Font-Awesome",
+                toolbar: 'insert',
+                command: 'insert-fa',
+                icon   : this.path + 'images/button.png'
+            });
+
+
+            editor.addCommand('insert-fa', {
+                exec: function (editor) {
+
+                    require(["controls/icons/Confirm"], function (FontAwesomeDialog) {
+                        var window = new FontAwesomeDialog({});
+
+                        window.addEvent("submit", function (dialog, selected) {
+                            console.log("Submit");
+                            if (selected.length === 0) {
+                                return;
+                            }
+                            console.log("Insert");
+                            self.insertIcon(selected[0]);
+
+                        });
+
+                        window.open();
+                    });
+
+
+                }
+            });
+        },
+
+        insertIcon: function (classname) {
+            this.$Editor.insertHtml('<span class="' + classname + '">&nbsp;</span>');
+        }
+    });
+})();
+