Moved image and oembed controls from inline to media module.

olivier-m · Jun 2, 2014 · e0efd05 · e0efd05
1 parent 442559b
commit e0efd05
Show file tree

Hide file tree

Showing 3 changed files with 116 additions and 104 deletions.
diff --git a/src/lib/controls/inline.js b/src/lib/controls/inline.js
@@ -243,104 +243,3 @@ exports.Link = Class(Button, {
         return node;
     }
 });
-
-
-var ImageDialog = Class(Dialog, {
-    show: function(node) {
-        var control = this.control,
-            editor = this.toolbar.editor,
-            selection = rangy.saveSelection();
-
-        editor.showDialog(function() {
-            input.focus();
-        });
-
-        var input = this.addTextField('URL: ', {
-            escape: function() {
-                editor.restoreSelection(selection);
-            },
-            enter: function(evt) {
-                editor.restoreSelection(selection);
-                control.saveImage(node, evt.target.value);
-            }
-        });
-
-        this.addButton('Save', {
-            fontAwesomeID: 'check',
-            click: function(evt) {
-                evt.stopImmediatePropagation();
-                editor.restoreSelection(selection);
-                control.saveImage(node, input.value);
-            }
-        });
-
-        if (node) {
-            input.value = node.getAttribute('src');
-        }
-    }
-});
-
-exports.Image = Class(Button, {
-    defaults: extend({}, Button.prototype.defaults, {
-        label: 'IMG',
-        title: 'Image',
-        fontAwesomeID: 'picture-o'
-    }),
-
-    init: function() {
-        Button.prototype.init.apply(this, arguments);
-
-        // Select image when clicked
-        var editor = this.toolbar.editor;
-        editor.on('click', function(evt) {
-            if (evt.target.tagName.toLowerCase() === 'img') {
-                editor.setRange(evt.target);
-                editor.showToolbar();
-            }
-        });
-    },
-
-    isHighlighted: function() {
-        return this.toolbar.editor.filterTopNodeNames('img').length > 0;
-    },
-
-    click: function() {
-        var editor = this.toolbar.editor,
-            node = editor.filterTopNodeNames('img');
-
-        node = node.length === 0 ? null : node[0];
-        (new ImageDialog(this)).show(node);
-    },
-
-    saveImage: function(node, url) {
-        var editor = this.toolbar.editor,
-            range = editor.getRange();
-
-        if (node && url) {
-            node.setAttribute('src', url);
-            editor.setRange(node);
-        } else if (url) {
-            node = document.createElement('img');
-            node.setAttribute('src', url);
-            range.deleteContents();
-            range.insertNode(node);
-            editor.cleanBlock(node.parentNode);
-            editor.setRange(node);
-        }
-        editor.showToolbar();
-        return node;
-    }
-});
-
-
-exports.Oembed = Class(Button, {
-    defaults: extend({}, Button.prototype.defaults, {
-        label: 'Embeded',
-        title: 'Embeded content',
-        fontAwesomeID: 'youtube-play'
-    }),
-
-    click: function() {
-        window.alert('No implemented yet :)');
-    }
-});
diff --git a/src/lib/controls/media.js b/src/lib/controls/media.js
@@ -0,0 +1,112 @@
+/* jshint newcap:false */
+/* global exports, require */
+
+var _util = require('../util'),
+    _controls = require('../controls'),
+    rangy = require('../../vendor/rangy/core').api,
+
+    Class = _util.Class,
+    extend = _util.extend,
+    Button = _controls.Button,
+    Dialog = _controls.Dialog;
+
+
+var ImageDialog = Class(Dialog, {
+    show: function(node) {
+        var control = this.control,
+            editor = this.toolbar.editor,
+            selection = rangy.saveSelection();
+
+        editor.showDialog(function() {
+            input.focus();
+        });
+
+        var input = this.addTextField('URL: ', {
+            escape: function() {
+                editor.restoreSelection(selection);
+            },
+            enter: function(evt) {
+                editor.restoreSelection(selection);
+                control.saveImage(node, evt.target.value);
+            }
+        });
+
+        this.addButton('Save', {
+            fontAwesomeID: 'check',
+            click: function(evt) {
+                evt.stopImmediatePropagation();
+                editor.restoreSelection(selection);
+                control.saveImage(node, input.value);
+            }
+        });
+
+        if (node) {
+            input.value = node.getAttribute('src');
+        }
+    }
+});
+
+exports.Image = Class(Button, {
+    defaults: extend({}, Button.prototype.defaults, {
+        label: 'IMG',
+        title: 'Image',
+        fontAwesomeID: 'picture-o'
+    }),
+
+    init: function() {
+        Button.prototype.init.apply(this, arguments);
+
+        // Select image when clicked
+        var editor = this.toolbar.editor;
+        editor.on('click', function(evt) {
+            if (evt.target.tagName.toLowerCase() === 'img') {
+                editor.setRange(evt.target);
+                editor.showToolbar();
+            }
+        });
+    },
+
+    isHighlighted: function() {
+        return this.toolbar.editor.filterTopNodeNames('img').length > 0;
+    },
+
+    click: function() {
+        var editor = this.toolbar.editor,
+            node = editor.filterTopNodeNames('img');
+
+        node = node.length === 0 ? null : node[0];
+        (new ImageDialog(this)).show(node);
+    },
+
+    saveImage: function(node, url) {
+        var editor = this.toolbar.editor,
+            range = editor.getRange();
+
+        if (node && url) {
+            node.setAttribute('src', url);
+            editor.setRange(node);
+        } else if (url) {
+            node = document.createElement('img');
+            node.setAttribute('src', url);
+            range.deleteContents();
+            range.insertNode(node);
+            editor.cleanBlock(node.parentNode);
+            editor.setRange(node);
+        }
+        editor.showToolbar();
+        return node;
+    }
+});
+
+
+exports.Oembed = Class(Button, {
+    defaults: extend({}, Button.prototype.defaults, {
+        label: 'Embeded',
+        title: 'Embeded content',
+        fontAwesomeID: 'youtube-play'
+    }),
+
+    click: function() {
+        window.alert('No implemented yet :)');
+    }
+});
diff --git a/src/lib/editor.js b/src/lib/editor.js
@@ -361,7 +361,8 @@ exports.Editor = Editor;
 var controls = {
     Menu: require('./controls').Menu,
     inline: require('./controls/inline'),
-    block: require('./controls/block')
+    block: require('./controls/block'),
+    media: require('./controls/media')
 };
 
 exports.simpleEditor = Class(Editor, {
@@ -394,7 +395,7 @@ exports.simpleEditor = Class(Editor, {
         this.toolbar.addControl(controls.inline.Underline, 'underline');
         this.toolbar.addControl(controls.inline.StrikeThrough, 'strike');
         this.toolbar.addControl(controls.inline.Link, 'link');
-        this.toolbar.addControl(controls.inline.Image, 'image');
-        this.toolbar.addControl(controls.inline.Oembed, 'oembed');
+        this.toolbar.addControl(controls.media.Image, 'image');
+        this.toolbar.addControl(controls.media.Oembed, 'oembed');
     }
 });