header module (#119)

codex-editor.js

@@ -557,8 +557,8 @@ var codex =
 	                continue;
 	            }
 	
-	            if (typeof tool.make != 'function') {
-	                codex.core.log('make method missed. Tool %o skipped', 'warn', name);
+	            if (typeof tool.render != 'function') {
+	                codex.core.log('render method missed. Tool %o skipped', 'warn', name);
 	                continue;
 	            }
 	
@@ -1946,7 +1946,7 @@ var codex =
 	/**
 	 * Toolbar settings
 	 *
-	 * @version 1.0.3
+	 * @version 1.0.4
 	 */
 	
 	var settings = function (settings) {
@@ -1971,7 +1971,7 @@ var codex =
 	         * Append settings content
 	         * It's stored in tool.settings
 	         */
-	        if (!codex.tools[toolType] || !codex.tools[toolType].settings) {
+	        if (!codex.tools[toolType] || !codex.tools[toolType].makeSettings) {
 	
 	            codex.core.log('Plugin \xAB' + toolType + '\xBB has no settings', 'warn');
 	            // codex.nodes.pluginSettings.innerHTML = `Плагин «${toolType}» не имеет настроек`;
@@ -1980,7 +1980,7 @@ var codex =
 	            /**
 	             * Draw settings block
 	             */
-	            var settingsBlock = codex.tools[toolType].settings();
+	            var settingsBlock = codex.tools[toolType].makeSettings();
 	            codex.nodes.pluginSettings.appendChild(settingsBlock);
 	        }
 	
@@ -2826,7 +2826,7 @@ var codex =
 	            blockData;
 	
 	        /** Make block from plugin */
-	        newBlockContent = tool.make();
+	        newBlockContent = tool.render();
 	
 	        /** information about block */
 	        blockData = {

example.html

@@ -53,16 +53,21 @@
             paragraph: {
                 type: 'paragraph',
                 iconClassname: 'ce-icon-paragraph',
-                make: paragraph.make,
-                appendCallback: null,
-                settings: null,
                 render: paragraph.render,
                 validate: paragraph.validate,
                 save: paragraph.save,
-                enableLineBreaks: false,
                 allowedToPaste: true,
                 showInlineToolbar: true
-//                handleTagOnPaste : ['P']
+            },
+            heading_styled: {
+                type: 'heading_styled',
+                iconClassname: 'ce-icon-header',
+                appendCallback: header.appendCallback,
+                makeSettings: header.makeSettings,
+                render: header.render,
+                validate: header.validate,
+                save: header.save,
+                displayInToolbox: true
             },
             paste: {
                 type: 'paste',
@@ -77,18 +82,6 @@
                 callbacks: pasteTool.callbacks,
                 allowedToPaste: false
             },
-            header: {
-                type: 'header',
-                iconClassname: 'ce-icon-header',
-                make: header.make,
-                appendCallback: header.appendCallback,
-                settings: header.makeSettings,
-                render: header.render,
-                validate: header.validate,
-                save: header.save,
-                displayInToolbox: true
-//                handleTagOnPaste : ['H1', 'H2', 'H3', 'H4', 'H5', 'H6']
-            },
             code: {
                 type: 'code',
                 iconClassname: 'ce-icon-code',

modules/toolbar/settings.js

@@ -1,7 +1,7 @@
 /**
  * Toolbar settings
  *
- * @version 1.0.3
+ * @version 1.0.4
  */
 
 var settings = (function(settings) {
@@ -26,7 +26,7 @@ var settings = (function(settings) {
          * Append settings content
          * It's stored in tool.settings
          */
-        if (!codex.tools[toolType] || !codex.tools[toolType].settings ) {
+        if (!codex.tools[toolType] || !codex.tools[toolType].makeSettings ) {
 
             codex.core.log(`Plugin «${toolType}» has no settings`, 'warn');
             // codex.nodes.pluginSettings.innerHTML = `Плагин «${toolType}» не имеет настроек`;
@@ -36,7 +36,7 @@ var settings = (function(settings) {
             /**
              * Draw settings block
              */
-            var settingsBlock = codex.tools[toolType].settings();
+            var settingsBlock = codex.tools[toolType].makeSettings();
             codex.nodes.pluginSettings.appendChild(settingsBlock);
         }
 

plugins/header/header.js

@@ -5,7 +5,10 @@
 
 var header = (function(header) {
 
-    var methods = {
+    /**
+     * @private
+     */
+    var methods_ = {
 
         /**
          * Binds click event to passed button
@@ -14,7 +17,7 @@ var header = (function(header) {
 
             el.addEventListener('click', function () {
 
-                methods.selectTypeClicked(type);
+                methods_.selectTypeClicked(type);
 
             }, false);
         },
@@ -33,10 +36,10 @@ var header = (function(header) {
             /** Making new header */
             new_header = codex.draw.node(type, ['ce-header'], { innerHTML : old_header.innerHTML });
             new_header.contentEditable = true;
-            new_header.setAttribute('data-placeholder', 'Heading');
+            new_header.setAttribute('data-placeholder', 'Заголовок');
             new_header.dataset.headerData = type;
 
-            codex.content.switchBlock(old_header, new_header, 'header');
+            codex.content.switchBlock(old_header, new_header, 'heading_styled');
 
             /** Close settings after replacing */
             codex.toolbar.settings.close();
@@ -45,18 +48,20 @@ var header = (function(header) {
     };
 
     /**
+     * @private
+     *
      * Make initial header block
      * @param {object} JSON with block data
      * @return {Element} element to append
      */
-    header.make = function (data) {
+    var make_ = function (data) {
 
         var availableTypes = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6'],
             tag;
 
         if (data && data.type && availableTypes.includes(data.type)) {
 
-            tag = codex.draw.node( data.type, [], {} );
+            tag = document.createElement(data.type);
 
             /**
              * Save header type in data-attr.
@@ -66,7 +71,7 @@ var header = (function(header) {
 
         } else {
 
-            tag = codex.draw.node( 'H2', [], {} );
+            tag = document.createElement('H2');
             tag.dataset.headerData = 'H2';
 
         }
@@ -80,19 +85,23 @@ var header = (function(header) {
         }
 
         tag.classList.add('ce-header');
-        tag.setAttribute('data-placeholder', 'Heading');
+        tag.setAttribute('data-placeholder', 'Заголовок');
         tag.contentEditable = true;
 
         return tag;
 
     };
 
+    header.prepareDataForSave = function(data) {
+
+    };
+
     /**
      * Method to render HTML block from JSON
      */
     header.render = function (data) {
 
-        return this.make(data);
+        return make_(data);
 
     };
 
@@ -110,13 +119,6 @@ var header = (function(header) {
         return data;
     };
 
-    /**
-     * Block appending callback
-     */
-    header.appendCallback = function (argument) {
-        console.log('header appended...');
-    };
-
     /**
      * Settings panel content
      *  - - - - - - - - - - - - -
@@ -138,7 +140,7 @@ var header = (function(header) {
         for (var type in types){
 
             selectTypeButton = codex.draw.node('SPAN', ['ce_plugin_header--select_button'], { textContent : types[type] });
-            methods.addSelectTypeClickListener(selectTypeButton, type);
+            methods_.addSelectTypeClickListener(selectTypeButton, type);
             holder.appendChild(selectTypeButton);
 
         }