New version 3.0.22. Read more https://github.com/xdan/jodit/releases/…

…tag/3.0.22
xdan · Aug 25, 2017 · 9a3f304 · 9a3f304
1 parent 94d7091
commit 9a3f304
Show file tree

Hide file tree

Showing 10 changed files with 54 additions and 16 deletions.
diff --git a/build/jodit.min.css b/build/jodit.min.css
diff --git a/build/jodit.min.js b/build/jodit.min.js
diff --git a/index.html b/index.html
@@ -76,6 +76,7 @@
 //        textIcons: true,
 //        iframe: true,
 //        height: 300,
+        defaultMode: Jodit.MODE_SPLIT,
         observer: {
             timeout: 0
         },

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "jodit",
-  "version": "3.0.21",
+  "version": "3.0.22",
   "description": "Jodit is awesome and usefully wysiwyg editor with filebrowser",
   "main": "index.js",
   "scripts": {

diff --git a/src/Jodit.ts b/src/Jodit.ts
@@ -581,7 +581,7 @@ export default class Jodit extends Component{
      * ```
      */
     getRealMode(): number {
-        return this.getMode() !== consts.MODE_SPLIT ? this.getMode() : Dom.isOrContains(this.editor, document.activeElement) ? consts.MODE_WYSIWYG : consts.MODE_SOURCE;
+        return this.getMode() !== consts.MODE_SPLIT ? this.getMode() : (Dom.isOrContains(this.editor, document.activeElement) || Dom.isOrContains(this.toolbar.container, document.activeElement)) ? consts.MODE_WYSIWYG : consts.MODE_SOURCE;
     }
 
     /**
@@ -591,7 +591,7 @@ export default class Jodit extends Component{
      * @fired afterSetMode
      */
     setMode(mode: number) {
-        let data = {
+        const data = {
                 mode
             },
             modeClasses = ['jodit_wysiwyg_mode', 'jodit_source_mode', 'jodit_split_mode'];

diff --git a/src/modules/Toolbar.ts b/src/modules/Toolbar.ts
@@ -84,6 +84,7 @@ export type ControlType = {
      * This function will be executed when the button is pressed.
      */
     exec?: (editor: Jodit, current: Node|false, control: ControlType, originalEvent: Event,  btn: HTMLLIElement) => void;
+
     args?: any[];
     cols?: number;
 
@@ -322,12 +323,13 @@ export default class Toolbar extends Component{
                     '<div class="jodit_tooltip"></div>' +
                 '</li>'),
             name: string = typeof item === 'string' ? item : (item.name || 'empty'),
+            icon: string = typeof item === 'string' ? item : (item.icon || item.name || 'empty'),
             a: HTMLAnchorElement = btn.querySelector('a');
 
         let iconSVG: string|false;
 
         if (!this.jodit.options.textIcons) {
-            iconSVG = Toolbar.getIcon(name, false);
+            iconSVG = Toolbar.getIcon(icon, false);
 
             if (iconSVG === false) {
                 iconSVG = Toolbar.getIcon(typeof control.name === 'string' ? control.name : 'empty');
@@ -349,13 +351,13 @@ export default class Toolbar extends Component{
             Toolbar.__toggleButton(btn, enable);
         });
 
-        let icon =  dom(<string>iconSVG);
+        let iconElement =  dom(<string>iconSVG);
 
-        if (icon && icon.nodeType !== Node.TEXT_NODE) {
-            icon.classList.add('jodit_icon', 'jodit_icon_' + clearName);
+        if (iconElement && iconElement.nodeType !== Node.TEXT_NODE) {
+            iconElement.classList.add('jodit_icon', 'jodit_icon_' + clearName);
         }
 
-        a.appendChild(icon);
+        a.appendChild(iconElement);
 
         if (control === undefined || typeof(control) !== 'object') {
             control = {command: name};
@@ -521,7 +523,7 @@ export default class Toolbar extends Component{
                 }
             });
 
-        this.jodit.events.on('mousedown mouseup keydown change afterSetMode focus', () => {
+        this.jodit.events.on('mousedown mouseup keydown change afterSetMode focus', (e) => {
             const callback = () => {
                 if (this.jodit.selection) {
                     this.checkActiveButtons(this.jodit.selection.current())

diff --git a/src/plugins/inlinePopup.ts b/src/plugins/inlinePopup.ts
@@ -56,6 +56,10 @@ declare module "../Config" {
  * });
  */
 Config.prototype.popup = {
+    a: [
+        'link',
+        'unlink'
+    ],
     img: [
         {
             name: 'bin',
@@ -330,8 +334,8 @@ Jodit.plugins.Popup = function (editor: Jodit) {
             });
             let clickOnImage: boolean = false;
             editor.__on(editor.editor, 'mousedown', (event: MouseEvent) => {
-                if ((<HTMLImageElement>event.target).tagName === 'IMG' || Dom.closest(<Node>event.target, 'table', editor.editor)) {
-                    const target: HTMLImageElement|HTMLTableElement = (<HTMLImageElement>event.target).tagName === 'IMG' ? <HTMLImageElement>event.target :  <HTMLTableElement>Dom.closest(<Node>event.target, 'table', editor.editor);
+                if ((<HTMLImageElement>event.target).tagName === 'IMG' || Dom.closest(<Node>event.target, 'table|a', editor.editor)) {
+                    const target: HTMLImageElement|HTMLTableElement = (<HTMLImageElement>event.target).tagName === 'IMG' ? <HTMLImageElement>event.target :  <HTMLTableElement>Dom.closest(<Node>event.target, 'table|a', editor.editor);
                     const pos = offset(target, editor);
                     delayShowPopup(target, Math.round(pos.left + (target.offsetWidth / 2)), Math.round(pos.top + target.offsetHeight));
                     clickOnImage = true;

diff --git a/src/plugins/link.ts b/src/plugins/link.ts
@@ -34,6 +34,14 @@ Config.prototype.link = {
 };
 
 
+Config.prototype.controls.unlink = {
+    exec: (editor, current: Node) => {
+        let anchor: HTMLAnchorElement|false = <HTMLAnchorElement>Dom.closest(current, 'A', editor.editor);
+        if (anchor) {
+            Dom.unwrap(anchor);
+        }
+    }
+};
 Config.prototype.controls.link = {
     popup: (editor: Jodit, current: HTMLElement|false, self: ControlType, close: Function) => {
         const sel: Selection = editor.win.getSelection(),

diff --git a/src/plugins/resizer.ts b/src/plugins/resizer.ts
@@ -295,7 +295,7 @@ Jodit.plugins.Resizer = function (editor: Jodit) {
             }
 
             $$('img, table, iframe', editor.editor).forEach((elm: HTMLElement) => {
-                if (editor.getRealMode() !== consts.MODE_WYSIWYG) {
+                if (editor.getMode() !== consts.MODE_SOURCE) {
                     return;
                 }
                 if (!elm['__jodit_resizer_binded'] && ((elm.tagName === 'IFRAME' && editor.options.useIframeResizer) || (elm.tagName === 'IMG' && editor.options.useImageResizer) || (elm.tagName === 'TABLE' && editor.options.useTableResizer))) {

diff --git a/src/plugins/source.ts b/src/plugins/source.ts
@@ -9,6 +9,7 @@ declare module "../Config" {
     interface Config {
         useAceEditor: boolean;
         sourceEditorNativeOptions: {
+            showGutter: boolean;
             theme: string;
             mode: string;
             wrap: string,
@@ -30,9 +31,27 @@ Config.prototype.useAceEditor = true;
 * @memberof Jodit.defaultOptions
 */
 Config.prototype.sourceEditorNativeOptions = {
+    /**
+     * Show gutter
+     */
+    showGutter: false,
+    /**
+     * Default theme
+     */
     theme: 'ace/theme/idle_fingers',
+    /**
+     * Default mode
+     */
     mode: 'ace/mode/html',
+
+    /**
+     * Wrap lines. Possible values - off, 80-100, free
+     */
     wrap: 'free',
+
+    /**
+     * Highlight active line
+     */
     highlightActiveLine: true,
 };
 
@@ -76,6 +95,7 @@ Jodit.plugins.source = class extends Component {
     private loadNext = (i: number, urls: string[], eventOnFinalize: false|string = 'aceReady', className: string = this.className) => {
         if (eventOnFinalize && urls[i] === undefined && this.jodit && this.jodit.events) {
             this.jodit.events.fire(eventOnFinalize);
+            this.__fire(window, eventOnFinalize);
             return;
         }
         if (urls[i] !== undefined) {
@@ -137,6 +157,7 @@ Jodit.plugins.source = class extends Component {
 
         editor.__on(this.mirror, 'mousedown keydown touchstart input', debounce(this.toWYSIWYG, editor.options.observer.timeout));
         editor.__on(this.mirror, 'change keydown mousedown touchstart input', debounce(this.autosize, editor.options.observer.timeout));
+
         editor.__on(this.mirror, 'mousedown focus', (e: Event) => {
             editor.events.fire(e.type, [e]);
         });
@@ -148,6 +169,7 @@ Jodit.plugins.source = class extends Component {
             .on('afterInit', () => {
                 this.mirrorContainer.appendChild(this.mirror);
                 editor.workplace.appendChild(this.mirrorContainer);
+                this.autosize();
 
                 const className = 'beutyfy_html_jodit_helper';
                 if (window['html_beautify'] === undefined && !$$('script.' + className, document.body).length) {
@@ -346,6 +368,7 @@ Jodit.plugins.source = class extends Component {
                     aceEditor = (<AceAjax.Ace>window['ace']).edit(fakeMirror);
 
                     aceEditor.setTheme(editor.options.sourceEditorNativeOptions.theme);
+                    aceEditor.renderer.setShowGutter(editor.options.sourceEditorNativeOptions.showGutter);
                     aceEditor.getSession().setMode(editor.options.sourceEditorNativeOptions.mode);
                     aceEditor.setHighlightActiveLine(editor.options.sourceEditorNativeOptions.highlightActiveLine);
                     aceEditor.setOption('wrap', editor.options.sourceEditorNativeOptions.wrap);
@@ -403,7 +426,7 @@ Jodit.plugins.source = class extends Component {
             };
 
         editor.events
-            .on('aceReady', tryInitAceEditor)
+            .__on(window, 'aceReady', tryInitAceEditor) // work in global scope
             .on('afterSetMode', () => {
                 if (editor.getRealMode() !== consts.MODE_SOURCE && editor.getMode() !== consts.MODE_SPLIT) {
                     return;