Module abstract (#226)

* Abstract Module class

Now all modules inherits from `Module` class. You don’t need more to
write

```js
constructor({ config }) {
        this.Editor = null;
        this.config = config;
}
```
and

```js
    /**
     * @param Editor
     * @param Editor.modules {@link CodexEditor#moduleInstances}
     * @param Editor.config {@link CodexEditor#configuration}
     */
    set state(Editor) {

        this.Editor = Editor;

    }
```

## Default exports improved

Now you don’t need more to write `.default` on module requiring

```js
let module = require(‘module’).default;
```

* Update docs

.eslintrc

@@ -73,6 +73,7 @@
         "XMLHttpRequest": true,
         "ActiveXObject": true,
         "RegExp": true,
+        "Module": true,
         "Node": true,
         "Proxy": true,
         "$": true,

.gitignore

@@ -11,6 +11,4 @@ node_modules/*
 
 plugins/personality/
 
-npm-debug.log
+npm-debug.log
-
-build/__tmp_babel_helpers.js

.jshintrc

@@ -15,7 +15,8 @@
     "codex",
     "_",
     "$",
-    "editorModules"
+    "editorModules",
+    "Module"
   ],
 
   // Allow ES6.

package.json

@@ -11,8 +11,8 @@
   "devDependencies": {
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.2",
+    "babel-plugin-add-module-exports": "^0.2.1",
     "babel-plugin-class-display-name": "^2.1.0",
-    "babel-plugin-transform-helper": "0.0.6",
     "babel-polyfill": "^6.26.0",
     "babel-preset-es2015": "^6.24.1",
     "babel-runtime": "^6.26.0",

src/components/__module.js

@@ -0,0 +1,43 @@
+/**
+ * @abstract
+ * @class      Module
+ * @classdesc  All modules inherites from this class.
+ *
+ * @typedef {Module} Module
+ * @property {Object} config - Editor user settings
+ * @property {Object} Editor - List of Editor modules
+ */
+export default class Module {
+
+    /**
+     * @constructor
+     *
+     * @param  {EditorConfig} config
+     */
+    constructor(config) {
+
+        if (new.target === Module) {
+
+            throw new TypeError('Constructors for abstract class Module are not allowed.');
+
+        }
+
+        this.config = config;
+        this.Editor = null;
+
+    }
+
+    /**
+     * Editor modules setter
+     *
+     * @param Editor
+     * @param Editor.modules {@link CodexEditor#moduleInstances}
+     * @param Editor.config {@link CodexEditor#configuration}
+     */
+    set state(Editor) {
+
+        this.Editor = Editor;
+
+    }
+
+}

src/components/core.js

@@ -4,7 +4,7 @@
  * @author Codex Team
  * @version 2.0.0
  */
-module.exports = class Core {
+export default class Core {
 
     /**
      * Module key name

src/components/dom.js

@@ -1,7 +1,7 @@
 /**
  * DOM manupulations helper
  */
-module.exports = class Dom {
+export default class Dom {
 
     /**
      * Helper for making Elements with classname and attributes

src/components/draw.js

@@ -5,7 +5,7 @@
  * @version 1.0.
  */
 
-module.exports = (function (draw) {
+export default (function (draw) {
 
     draw.ceBlock = function () {
 

src/components/modules/events.js

@@ -6,29 +6,20 @@
  *    - {Function} emit - fires all subscribers with data
  *
  * @version 1.0.0
+ *
+ * @typedef {Events} Events
+ * @property {Object} subscribers - all subscribers grouped by event name
  */
-class Events {
+export default class Events extends Module {
-
-    /**
-     * @param Editor
-     * @param Editor.modules {@link CodexEditor#moduleInstances}
-     * @param Editor.config {@link CodexEditor#configuration}
-     */
-    set state(Editor) {
-
-        this.Editor = Editor;
-
-    }
 
     /**
      * @constructor
-     *
-     * @property {Object} subscribers - all subscribers grouped by event name
      */
     constructor() {
 
+        super();
+
         this.subscribers = {};
-        this.Editor = null;
 
     }
 
@@ -75,6 +66,4 @@ class Events {
 
     }
 
-}
+}
-
-module.exports = Events;

src/components/modules/toolbar.js

@@ -36,6 +36,7 @@
  * @class
  * @classdesc Toolbar module
  *
+ * @typedef {Toolbar} Toolbar
  * @property {Object} nodes
  * @property {Element} nodes.wrapper        - Toolbar main element
  * @property {Element} nodes.content        - Zone with Plus button and toolbox.
@@ -48,14 +49,14 @@
  * @property {Element} nodes.pluginSettings    - Plugin Settings section of Settings Panel
  * @property {Element} nodes.defaultSettings   - Default Settings section of Settings Panel
  */
-class Toolbar {
+export default class Toolbar extends Module {
 
     /**
      * @constructor
      */
-    constructor() {
+    constructor(config) {
 
-        this.Editor = null;
+        super(config);
 
         this.nodes = {
             wrapper : null,
@@ -97,16 +98,6 @@ class Toolbar {
 
     }
 
-    /**
-     * Editor modules setter
-     * @param {object} Editor - available editor modules
-     */
-    set state(Editor) {
-
-        this.Editor = Editor;
-
-    }
-
     /**
      * Makes toolbar
      */
@@ -191,6 +182,4 @@ class Toolbar {
 
     }
 
-}
+}
-
-module.exports = Toolbar;

src/components/modules/tools.js

@@ -27,6 +27,7 @@
 /**
  * Class properties:
  *
+ * @typedef {Tool} Tool
  * @property {String} name - name of this module
  * @property {Object[]} toolInstances - list of tool instances
  * @property {Tools[]} available - available Tools
@@ -35,7 +36,7 @@
  * @property {EditorConfig} config - Editor config
  */
 
-class Tools {
+export default class Tools extends Module {
 
     /**
      * Returns available Tools
@@ -57,17 +58,6 @@ class Tools {
 
     }
 
-    /**
-     * @param Editor
-     * @param Editor.modules {@link CodexEditor#moduleInstances}
-     * @param Editor.config {@link CodexEditor#configuration}
-     */
-    set state(Editor) {
-
-        this.Editor = Editor;
-
-    }
-
     /**
      * If config wasn't passed by user
      * @return {ToolsConfig}
@@ -89,7 +79,7 @@ class Tools {
      */
     constructor({ config }) {
 
-        this.config = config;
+        super(config);
 
         this.toolClasses = {};
         this.toolsAvailable = {};
@@ -221,6 +211,4 @@ class Tools {
 
     }
 
-}
+}
-
-module.exports = Tools;

src/components/modules/ui.js

@@ -46,6 +46,7 @@ let CSS = {
  *                    <ce-inline-toolbar />
  *                </codex-editor>
  *
+ * @typedef {UI} UI
  * @property {EditorConfig} config   - editor configuration {@link CodexEditor#configuration}
  * @property {Object} Editor         - available editor modules {@link CodexEditor#moduleInstances}
  * @property {Object} nodes          -
@@ -53,7 +54,8 @@ let CSS = {
  * @property {Element} nodes.wrapper  - <codex-editor>
  * @property {Element} nodes.redactor - <ce-redactor>
  */
-class UI {
+
+export default class UI extends Module {
 
     /**
      * @constructor
@@ -62,8 +64,7 @@ class UI {
      */
     constructor({ config }) {
 
-        this.config = config;
+        super(config);
-        this.Editor = null;
 
         this.nodes = {
             holder: null,
@@ -73,17 +74,6 @@ class UI {
 
     }
 
-
-    /**
-     * Editor modules setter
-     * @param {object} Editor - available editor modules
-     */
-    set state(Editor) {
-
-        this.Editor = Editor;
-
-    }
-
     /**
      * @protected
      *
@@ -177,9 +167,6 @@ class UI {
 
 }
 
-module.exports = UI;
-
-
 // /**
 //  * Codex Editor UI module
 //  *

src/components/utils.js

@@ -1,7 +1,7 @@
 /**
  * Codex Editor Util
  */
-module.exports = class Util {
+export default class Util {
 
     /**
      * @typedef {Object} ChainData

webpack.config.js

@@ -21,8 +21,10 @@ const VERSION  = process.env.VERSION || pkg.version;
  * @type {webpack}
  */
 var webpack              = require('webpack');
-var ExtractTextPlugin    = require('extract-text-webpack-plugin');
 
+/**
+ * File system
+ */
 var fs = require('fs');
 
 /**
@@ -85,15 +87,6 @@ module.exports = {
             editorModules: JSON.stringify(editorModules)
         }),
 
-        /**
-         * Automatically load global visible modules
-         * instead of having to import/require them everywhere.
-         */
-        new webpack.ProvidePlugin({
-          '_': 'utils',
-          '$': 'dom'
-        }),
-
         /**
          * Setting up a dynamic requires that we use to autoload Editor Modules from 'components/modules' dir
          * {@link https://webpack.js.org/plugins/context-replacement-plugin/}
@@ -108,6 +101,16 @@ module.exports = {
             )
         ),
 
+        /**
+         * Automatically load global visible modules
+         * instead of having to import/require them everywhere.
+         */
+        new webpack.ProvidePlugin({
+          '_': 'utils',
+          '$': 'dom',
+          'Module': './../__module',
+        }),
+
 
         /** Минифицируем CSS и JS */
         // new webpack.optimize.UglifyJsPlugin({
@@ -132,15 +135,21 @@ module.exports = {
                     options: {
                         presets: [ __dirname + '/node_modules/babel-preset-es2015' ],
                         plugins: [
+                            /**
+                             * Dont need to use «.default» after «export default Class Ui {}»
+                             * @see  {@link https://github.com/59naga/babel-plugin-add-module-exports}
+                             */
+                            'add-module-exports',
                             /**
                              * Babel transforms some awesome ES6 features to ES5 with extra code, such as Class, JSX.
                              * This plugin makes all generated extra codes to one module which significantly reduces the bundle code size.
                              *
                              * {@link https://github.com/brianZeng/babel-plugin-transform-helper}
+                             * @since 11 dec 2017 - removed due to plugin does not supports class inheritance
                              */
-                            ['babel-plugin-transform-helper', {
+                            // ['babel-plugin-transform-helper', {
-                                helperFilename:'build/__tmp_babel_helpers.js'
+                            //     helperFilename:'build/__tmp_babel_helpers.js'
-                            }],
+                            // }],
                             'class-display-name',
                         ]
                     }
@@ -164,16 +173,6 @@ module.exports = {
                     },
                     'postcss-loader'
                 ]
-                // use: ExtractTextPlugin.extract([
-                //     {
-                //         loader: 'css-loader',
-                //         options: {
-                //             // minimize: 1,
-                //             importLoaders: 1
-                //         }
-                //     },
-                //     'postcss-loader'
-                // ])
             }
         ]
     }