qms-angular 1.0.70 → 1.0.74

package/src/assets/qms-ckeditor-plugin/src/plugins/imagemap/imagemapediting.js

@@ -1,13 +1,15 @@
 import { Plugin } from '@ckeditor/ckeditor5-core';
-import InsertImageMapCommand from './insertimagemapcommand'; 
-import ResizeImageMapCommand from './resizeimagemapcommand'; 
-import { ImageMapAttributes, ImageMapElements, debounced, trimStart, drawMap, ImageMapCommands, HtmlAttributes, HtmlElements, findMapNodes } from './utils';
+import ImageMapCommand from './imagemapcommand';
+import ResizeImageMapCommand from './resizeimagemapcommand';
+import ImageMapDialogCommand from './imagemapdialogcommand';
+import { IMAGEMAP_ATTRIBUTES, IMAGEMAP_ELEMENTS, drawMap, IMAGEMAP_COMMANDS, HTML_ATTRIBUTES, HTML_ELEMENTS, findMapNodes } from './utils';
 import ImageLoadObserver from '@ckeditor/ckeditor5-image/src/image/imageloadobserver';
-import { downcastImageWidthAttribute, downcastImageHeightAttribute, downcastImageSavedSrcAttribute, downcastImageMapAttribute, 
-    upcastImageSavedSrcAttribute, upcastMapElement, dowcastMapNameAttribute, dowcastMapWidthAttribute, dowcastMapHeightAttribute, 
+import { downcastImageWidthAttribute, downcastImageHeightAttribute, downcastImageSavedSrcAttribute, downcastImageMapAttribute,
+    upcastImageSavedSrcAttribute, upcastMapElement, dowcastMapNameAttribute, dowcastMapWidthAttribute, dowcastMapHeightAttribute,
     dowcastMapAreaAttribute, upcastImageMapAttribute, upcastImageHeightAttribute, upcastImageWidthAttribute, downcastMapElement
 } from './converters';
 import { isWidget } from  '@ckeditor/ckeditor5-widget/src/utils';
+import { trimStart, debounced } from '../common/qmsCKEditorUtil';
 
  export default class ImageMapEditing extends Plugin {
     static get requires() {
@@ -17,33 +19,33 @@ import { isWidget } from  '@ckeditor/ckeditor5-widget/src/utils';
      static get pluginName() {
          return 'ImageMapEditing';
     }
- 
+
      init() {
         const editor = this.editor;
         const model = editor.model;
         const schema = model.schema;
         const conversion = editor.conversion;
         const editingView = editor.editing.view;
- 
+
         editingView.addObserver(ImageLoadObserver);
 
-        schema.extend(ImageMapElements.IMAGE, { 
-            allowAttributes: [ 
-                ImageMapAttributes.IMAGE_USE_MAP,  
-                ImageMapAttributes.IMAGE_WIDTH,  
-                ImageMapAttributes.IMAGE_HEIGHT, 
-                ImageMapAttributes.IMAGE_SAVED_SRC
-            ] 
+        schema.extend(IMAGEMAP_ELEMENTS.IMAGE, {
+            allowAttributes: [
+                IMAGEMAP_ATTRIBUTES.IMAGE_USE_MAP,
+                IMAGEMAP_ATTRIBUTES.IMAGE_WIDTH,
+                IMAGEMAP_ATTRIBUTES.IMAGE_HEIGHT,
+                IMAGEMAP_ATTRIBUTES.IMAGE_SAVED_SRC
+            ]
         });
 
-        schema.register(ImageMapElements.MAP, {
+        schema.register(IMAGEMAP_ELEMENTS.MAP, {
             isObject: true,
             allowWhere: '$block',
-            allowAttributes: [ 
-                ImageMapAttributes.MAP_NAME,
-                ImageMapAttributes.MAP_AREAS, 
-                ImageMapAttributes.MAP_WIDTH, 
-                ImageMapAttributes.MAP_HEIGHT
+            allowAttributes: [
+                IMAGEMAP_ATTRIBUTES.MAP_NAME,
+                IMAGEMAP_ATTRIBUTES.MAP_AREAS,
+                IMAGEMAP_ATTRIBUTES.MAP_WIDTH,
+                IMAGEMAP_ATTRIBUTES.MAP_HEIGHT
             ]
        });
 
@@ -51,48 +53,52 @@ import { isWidget } from  '@ckeditor/ckeditor5-widget/src/utils';
         conversion.for('dataDowncast').add(downcastImageHeightAttribute());
         conversion.for('dataDowncast').add(downcastImageSavedSrcAttribute(true));
         conversion.for('editingDowncast').add(downcastImageSavedSrcAttribute(false));
-         
+
         conversion.for('downcast').add(downcastImageMapAttribute());
         conversion.for('downcast').add(downcastMapElement());
- 
+
         conversion.for('downcast')
         .add(dowcastMapNameAttribute())
         .add(dowcastMapWidthAttribute())
         .add(dowcastMapHeightAttribute())
         .add(dowcastMapAreaAttribute());
-       
+
         conversion.for('upcast').add(upcastImageMapAttribute());
         conversion.for('upcast').add(upcastImageHeightAttribute());
         conversion.for('upcast').add(upcastImageWidthAttribute());
         conversion.for('upcast').add(upcastImageSavedSrcAttribute());
         conversion.for('upcast').add(upcastMapElement());
-         
+
         editor.commands.get('resizeImage').on('execute', debounced(() => {
-            editor.execute(ImageMapCommands.RESIZE);
+            editor.execute(IMAGEMAP_COMMANDS.RESIZE_IMAGEMAP);
         }, 100));
 
-        // this.listenTo(editingView.document, 'delete', ( evt, data ) => {
-        //     this.allowDeleteMap = true;
-		// }, {  context: [isWidget]  });
-
-        // this.listenTo(model.document, 'change:data', (event) => {
-        //     if(this.allowDeleteMap == true){
-        //         this.allowDeleteMap == false;
-        //         OnImageDeleted(model, event);
-        //     }
-        // });
-   
+        this.listenTo(editingView.document, 'delete', ( evt, data ) => {
+            this.allowDeleteMap = true;
+		}, { context: [isWidget] });
+
         this.listenTo(editingView.document, 'imageLoaded', (evt, domEvent) => {
             onImageLoaded(domEvent);
         });
- 
-        editor.commands.add(ImageMapCommands.INSERT, new InsertImageMapCommand(editor));
-        editor.commands.add(ImageMapCommands.RESIZE, new ResizeImageMapCommand(editor));
-    } 
-} 
- 
-function OnImageDeleted(model, event){
-    const differ = event.source.differ;
+
+        model.document.on('change:data', (evt, batch) => {
+            if(this.allowDeleteMap == true){
+                this.allowDeleteMap = false;
+                OnImageDeleted(model, batch);
+            }
+        } );
+
+        editor.commands.add(IMAGEMAP_COMMANDS.IMAGEMAP_DIALOG, new ImageMapDialogCommand(editor));
+        editor.commands.add(IMAGEMAP_COMMANDS.IMAGEMAP, new ImageMapCommand(editor));
+        editor.commands.add(IMAGEMAP_COMMANDS.RESIZE_IMAGEMAP, new ResizeImageMapCommand(editor));
+    }
+}
+
+function OnImageDeleted(model, batch){
+    if( batch.type == 'transparent'){
+        return;
+    }
+    const differ = model.document.differ;
     // if no difference
     if (differ.isEmpty) { return; }
     const changes = differ.getChanges({ includeChangesInGraveyard: true });
@@ -103,24 +109,24 @@ function OnImageDeleted(model, event){
     for (let i = 0; i < changes.length; i++){
         const change = changes[i]
         // if image remove exists
-        if (change && change.type === 'remove' && change.name === 'image') {
+        if (change && change.type === 'remove' && change.name === IMAGEMAP_ELEMENTS.IMAGE) {
             hasNoImageRemoved = false
             break
         }
     }
-   
+
     // if not image remove stop execution
     if (hasNoImageRemoved) { return; }
     // get removed nodes
-    const removedNodes = changes.filter(change => (change.type === 'insert' && change.name === 'image'))
- 
+    const removedNodes = changes.filter(change => (change.type === 'insert' && change.name === IMAGEMAP_ELEMENTS.IMAGE))
+
     // removed image nodes
     const removedMapNames = []
     removedNodes.forEach(node => {
         let nodeAfter = node.position.nodeAfter;
-        if(nodeAfter && nodeAfter.hasAttribute(ImageMapAttributes.IMAGE_USE_MAP)){
-            let mapname = nodeAfter.getAttribute(ImageMapAttributes.IMAGE_USE_MAP) || '';
-            removedMapNames.push(trimStart(mapname, '#')); 
+        if(nodeAfter && nodeAfter.hasAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_USE_MAP)){
+            let mapname = nodeAfter.getAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_USE_MAP) || '';
+            removedMapNames.push(trimStart(mapname, '#'));
         }
     });
 
@@ -129,8 +135,7 @@ function OnImageDeleted(model, event){
         const existingMapElements = findMapNodes(removedMapNames, range);
 
         if(existingMapElements && existingMapElements.length > 0){
-            const redoingBatch = model.createBatch( 'transparent' );
-            model.enqueueChange(redoingBatch, writer => {
+            model.enqueueChange(batch, writer => {
                 existingMapElements.forEach(element => {
                     writer.remove(element);
                 });
@@ -144,40 +149,40 @@ function onImageLoaded(domEvent){
     if (!domEvent.target.matches('figure.image.ck-widget > img, figure.image.ck-widget > a > img')) {
         return;
     }
-    if(domEvent.target.hasAttribute(HtmlAttributes.USE_MAP) 
-        && domEvent.target.getAttribute(HtmlAttributes.USE_MAP) 
-        && !domEvent.target.hasAttribute(HtmlAttributes.SAVED_SRC)){
- 
-        const originalSrc =  domEvent.target.getAttribute(HtmlAttributes.SRC);
-        const mapName =  trimStart(domEvent.target.getAttribute(HtmlAttributes.USE_MAP), '#');
-            const selector = `${HtmlElements.MAP}[${HtmlAttributes.NAME}='${mapName}']`;
-            const map = document.querySelector(selector);
-            if(map && map.childNodes){
-                const areas = [];
-                map.childNodes.forEach((child) =>{
-                    if(child.nodeName && child.nodeName.toLowerCase() === HtmlElements.AREA){
-                        let area = {};
-                        area[HtmlAttributes.COORDS] = child.getAttribute(HtmlAttributes.COORDS);
-                        area[HtmlAttributes.SHAPE] = child.getAttribute(HtmlAttributes.SHAPE) || '';
-                        areas.push(area);
-                    }
-                });
-                if(areas.length > 0){
-                    const width =  map.getAttribute(HtmlAttributes.WIDTH) || domEvent.target.width;
-                    const height =  map.getAttribute(HtmlAttributes.HEIGHT) || domEvent.target.height;
-                    const target = domEvent.target;
-                    drawMap(originalSrc, width, height, areas, (oldsrc, newsrc) => {
-                        if(target){
-                            target.setAttribute(HtmlAttributes.SRC, newsrc);
-                            target.setAttribute(HtmlAttributes.SAVED_SRC, oldsrc);
-                        }
-
-                        if(map){
-                            map.setAttribute(HtmlAttributes.WIDTH, width);
-                            map.setAttribute(HtmlAttributes.HEIGHT, height);
-                        } 
-                    })
+    if(domEvent.target.hasAttribute(HTML_ATTRIBUTES.USE_MAP)
+        && domEvent.target.getAttribute(HTML_ATTRIBUTES.USE_MAP)
+        && !domEvent.target.hasAttribute(HTML_ATTRIBUTES.SAVED_SRC)){
+
+        const originalSrc =  domEvent.target.getAttribute(HTML_ATTRIBUTES.SRC);
+        const mapName =  trimStart(domEvent.target.getAttribute(HTML_ATTRIBUTES.USE_MAP), '#');
+        const selector = `${HTML_ELEMENTS.MAP}[${HTML_ATTRIBUTES.NAME}='${mapName}']`;
+        const map = document.querySelector(selector);
+        if(map && map.childNodes){
+            const areas = [];
+            map.childNodes.forEach((child) =>{
+                if(child.nodeName && child.nodeName.toLowerCase() === HTML_ELEMENTS.AREA){
+                    let area = {};
+                    area[HTML_ATTRIBUTES.COORDS] = child.getAttribute(HTML_ATTRIBUTES.COORDS);
+                    area[HTML_ATTRIBUTES.SHAPE] = child.getAttribute(HTML_ATTRIBUTES.SHAPE) || '';
+                    areas.push(area);
                 }
+            });
+            if(areas.length > 0){
+                const width =  map.getAttribute(HTML_ATTRIBUTES.WIDTH) || domEvent.target.width;
+                const height =  map.getAttribute(HTML_ATTRIBUTES.HEIGHT) || domEvent.target.height;
+                const target = domEvent.target;
+                drawMap(originalSrc, width, height, areas, (oldsrc, newsrc) => {
+                    if(target){
+                        target.setAttribute(HTML_ATTRIBUTES.SRC, newsrc);
+                        target.setAttribute(HTML_ATTRIBUTES.SAVED_SRC, oldsrc);
+                    }
+
+                    if(map){
+                        map.setAttribute(HTML_ATTRIBUTES.WIDTH, width);
+                        map.setAttribute(HTML_ATTRIBUTES.HEIGHT, height);
+                    }
+                })
             }
+        }
     }
-}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/imagemap/imagemapui.js

@@ -1,49 +1,48 @@
 import { Plugin } from '@ckeditor/ckeditor5-core';
 import { ButtonView, ContextualBalloon } from '@ckeditor/ckeditor5-ui';
 import imageMapIcon from '../../themes/icons/imagemap.svg';
-import { ImageMapCommands } from './utils';
+import { IMAGEMAP_COMMANDS } from './utils';
 
  export default class ImageMapUI extends Plugin {
-   
+
      static get requires() {
          return [ ContextualBalloon];
      }
-  
+
      static get pluginName() {
          return 'ImageMapUI';
      }
-  
+
      init() {
         this._createButton();
 
      }
-  
+
      destroy() {
         super.destroy();
      }
-  
+
      _createButton() {
          const editor = this.editor;
          const t = editor.t;
- 
+
          editor.ui.componentFactory.add('imageMap', locale => {
-             const command = editor.commands.get(ImageMapCommands.INSERT);
+             const command = editor.commands.get(IMAGEMAP_COMMANDS.IMAGEMAP_DIALOG);
              const view = new ButtonView(locale);
- 
+
              view.set({
                  label: t('Image Map'),
                  icon: imageMapIcon,
                  tooltip: true
              });
- 
+
              view.bind('isEnabled').to(command, 'isEnabled');
- 
+
              this.listenTo(view, 'execute', () => {
-                editor.execute(ImageMapCommands.INSERT, {});
+                editor.execute(IMAGEMAP_COMMANDS.IMAGEMAP_DIALOG);
              });
- 
+
              return view;
          });
      }
  }
- 

package/src/assets/qms-ckeditor-plugin/src/plugins/imagemap/resizeimagemapcommand.js

@@ -1,22 +1,23 @@
 
 import { Command } from '@ckeditor/ckeditor5-core';
 import { isImage } from '@ckeditor/ckeditor5-image/src/image/utils';
-import { ImageMapAttributes, trimStart, parsePixelToFloat, findFirstMapNode, drawMap, resizeAreaWidth, resizeAreaHeight } from './utils';
+import { IMAGEMAP_ATTRIBUTES, parsePixelToFloat, findFirstMapNode, drawMap, resizeAreaWidth, resizeAreaHeight, createResizedEvent } from './utils';
 import  { getSelectedImageWidget} from '@ckeditor/ckeditor5-image/src/image/utils';
+import { trimStart } from '../common/qmsCKEditorUtil';
 
 export default class ResizeImageMapCommand extends Command {
-	 
+
 	refresh() {
 		const element = this.editor.model.document.selection.getSelectedElement();
-		this.isEnabled = isImage(element) && element.hasAttribute(ImageMapAttributes.IMAGE_USE_MAP);
+		this.isEnabled = isImage(element) && element.hasAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_USE_MAP);
 	}
- 
-	execute() {
+
+	execute( options = {}) {
         const editor = this.editor;
         const model = editor.model;
         const view = this.editor.editing.view;
         const imageElement = model.document.selection.getSelectedElement();
-        const mapName = imageElement.getAttribute(ImageMapAttributes.IMAGE_USE_MAP);
+        const mapName = imageElement.getAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_USE_MAP);
         if(mapName){
             const imageWidget = getSelectedImageWidget( view.document.selection);
             const widgetResizePlugin = editor.plugins.get('WidgetResize');
@@ -25,14 +26,14 @@ export default class ResizeImageMapCommand extends Command {
                 const resizerWrapper = resizer._viewResizerWrapper;
                 const newWidth = parsePixelToFloat(resizerWrapper.getStyle('width', 0));
                 const newHeight = parsePixelToFloat(resizerWrapper.getStyle('height', 0));
- 
+
                 const range = model.createRangeIn(model.document.getRoot());
                 const existingMapElement = findFirstMapNode(trimStart(mapName, '#'), range);
                 if(existingMapElement){
-                    const areas = JSON.parse(existingMapElement.getAttribute(ImageMapAttributes.MAP_AREAS) || []);
-                    const width = parsePixelToFloat(existingMapElement.getAttribute(ImageMapAttributes.MAP_WIDTH, 0));
-                    const height = parsePixelToFloat(existingMapElement.getAttribute(ImageMapAttributes.MAP_HEIGHT, 0));
-                   
+                    const areas = JSON.parse(existingMapElement.getAttribute(IMAGEMAP_ATTRIBUTES.MAP_AREAS) || []);
+                    const width = parsePixelToFloat(existingMapElement.getAttribute(IMAGEMAP_ATTRIBUTES.MAP_WIDTH, 0));
+                    const height = parsePixelToFloat(existingMapElement.getAttribute(IMAGEMAP_ATTRIBUTES.MAP_HEIGHT, 0));
+
                     const widthChanged = newWidth != width && width != 0 ;
                     const heightChanged = newHeight != height && height != 0 ;
 
@@ -53,23 +54,24 @@ export default class ResizeImageMapCommand extends Command {
 
                         const areasAsString  = JSON.stringify(areas);
                         model.change(writer => {
-                            let originalImageSrc = imageElement.getAttribute(ImageMapAttributes.IMAGE_SRC);
-                            if(!imageElement.hasAttribute(ImageMapAttributes.IMAGE_SAVED_SRC) || !imageElement.getAttribute(ImageMapAttributes.IMAGE_SAVED_SRC)){
-                                writer.setAttribute(ImageMapAttributes.IMAGE_SAVED_SRC, originalImageSrc, imageElement);
+                            let originalImageSrc = imageElement.getAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SRC);
+                            if(!imageElement.hasAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SAVED_SRC) || !imageElement.getAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SAVED_SRC)){
+                                writer.setAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SAVED_SRC, originalImageSrc, imageElement);
                             }
                             else{
-                                originalImageSrc = imageElement.getAttribute(ImageMapAttributes.IMAGE_SAVED_SRC);
+                                originalImageSrc = imageElement.getAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SAVED_SRC);
                             }
 
-                            writer.setAttribute(ImageMapAttributes.MAP_AREAS, areasAsString, existingMapElement);
-                            writer.setAttribute(ImageMapAttributes.MAP_WIDTH, newWidth, existingMapElement);
-                            writer.setAttribute(ImageMapAttributes.MAP_HEIGHT, newHeight, existingMapElement);
-                            writer.setAttribute(ImageMapAttributes.IMAGE_WIDTH, newWidth, imageElement);
-                            writer.setAttribute(ImageMapAttributes.IMAGE_HEIGHT, newHeight, imageElement);
+                            writer.setAttribute(IMAGEMAP_ATTRIBUTES.MAP_AREAS, areasAsString, existingMapElement);
+                            writer.setAttribute(IMAGEMAP_ATTRIBUTES.MAP_WIDTH, newWidth, existingMapElement);
+                            writer.setAttribute(IMAGEMAP_ATTRIBUTES.MAP_HEIGHT, newHeight, existingMapElement);
+                            writer.setAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_WIDTH, newWidth, imageElement);
+                            writer.setAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_HEIGHT, newHeight, imageElement);
 
                             drawMap(originalImageSrc, newWidth, newHeight, areas, (oldsrc, newsrc) =>{
-                                model.enqueueChange(writer => {
-                                    writer.setAttribute(ImageMapAttributes.IMAGE_SRC, newsrc, imageElement);
+                                model.enqueueChange(writer.batch, writer => {
+                                    writer.setAttribute(IMAGEMAP_ATTRIBUTES.IMAGE_SRC, newsrc, imageElement);
+                                    this.fire(createResizedEvent(mapName));
                                 });
                             });
                         });
@@ -77,6 +79,5 @@ export default class ResizeImageMapCommand extends Command {
                 }
             }
         }
-	} 
+	}
 }
-

package/src/assets/qms-ckeditor-plugin/src/plugins/imagemap/utils.js

@@ -1,4 +1,6 @@
-export const HtmlAttributes = {
+import { trimStart } from '../common/qmsCKEditorUtil';
+
+export const HTML_ATTRIBUTES = {
 	COORDS: 'coords',
 	HREF: 'href',
 	SHAPE: 'shape',
@@ -6,7 +8,7 @@ export const HtmlAttributes = {
 	TARGET: 'target',
 	USE_MAP: 'usemap',
 	ALT: 'alt',
-	WIDTH: 'width', 
+	WIDTH: 'width',
 	HEIGHT: 'height',
 	SRC: 'src',
 	ID: 'id',
@@ -14,44 +16,48 @@ export const HtmlAttributes = {
 }
 
 
-export const HtmlElements = {
+export const HTML_ELEMENTS = {
 	MAP: 'map',
 	IMAGE: 'img',
 	AREA: 'area'
 }
 
 
-export const ImageMapAttributes = {
+export const IMAGEMAP_ATTRIBUTES = {
 	MAP_AREAS: 'mapareas',
 	MAP_NAME: 'mapname' ,
-	MAP_WIDTH: 'mapwidth', 
+	MAP_WIDTH: 'mapwidth',
 	MAP_HEIGHT: 'mapheight',
 	IMAGE_USE_MAP: 'imageusemap',
 	IMAGE_SAVED_SRC: 'imagesavedsrc',
 	IMAGE_SRC: 'src',//It is already defined by the image plugin
-	IMAGE_WIDTH: 'imagewidth', 
+	IMAGE_WIDTH: 'imagewidth',
 	IMAGE_HEIGHT: 'imageheight',
 }
 
-export const ImageMapCommands = {
-	INSERT: 'insertImageMap',
-	RESIZE: 'resizeImageMap'
+export const IMAGEMAP_COMMANDS = {
+	IMAGEMAP_DIALOG: 'imagemapdialog',
+	IMAGEMAP: 'imagemap',
+	RESIZE_IMAGEMAP: 'resizeimagemap'
 }
 
-export const ImageMapElements = {
-	MAP: 'npmap',
+export const IMAGEMAP_ELEMENTS = {
+	MAP: 'qmsmap',
 	IMAGE: 'image'//It is already defined by the image plugin
 }
 
-export function trimStart(text, charToRemove){
-	if(text && text.length > 0){
-		if(text.charAt(0) == charToRemove){
-			return text.substring(1);
-		}
-	}
-	return text;
+export function createInsertedEvent(mapname){
+	return trimStart(mapname, '#') + '_inserted';
+}
+
+export function createRemovedEvent(mapname){
+	return trimStart(mapname, '#') + '_removed';
 }
- 
+
+export function createResizedEvent(mapname){
+	return trimStart(mapname, '#') + '_resized';
+}
+
 export function parsePixelToFloat(pixel, fractionDigits){
 	if(pixel){
 		pixel = pixel.toString().replaceAll('px', '');
@@ -67,13 +73,13 @@ export function parsePixelToFloat(pixel, fractionDigits){
 }
 
 function isMapNode(lowerCaseNameObject, node){
-	return node.is('element', ImageMapElements.MAP)
-			&& node.hasAttribute(ImageMapAttributes.MAP_NAME)
-			&& lowerCaseNameObject[getLowerCaseMapName(node)]; 
+	return node.is('element', IMAGEMAP_ELEMENTS.MAP)
+			&& node.hasAttribute(IMAGEMAP_ATTRIBUTES.MAP_NAME)
+			&& lowerCaseNameObject[getLowerCaseMapName(node)];
 }
 
 function getLowerCaseMapName(node){
-	return node.getAttribute(ImageMapAttributes.MAP_NAME).toLowerCase(); 
+	return node.getAttribute(IMAGEMAP_ATTRIBUTES.MAP_NAME).toLowerCase();
 }
 
 export function findMapNodes(names, range) {
@@ -95,7 +101,7 @@ export function findMapNodes(names, range) {
     }
     return Object.keys(nodes).map(key => nodes[key]);
 };
- 
+
 
 export function findFirstMapNode(name, range) {
 	if(!name) { return null; }
@@ -112,8 +118,6 @@ export function findFirstMapNode(name, range) {
     }
     return null;
 };
- 
-
 
 export function resizeAreaWidth(area, ratio) {
 	var coords = area.coords.split(',');
@@ -156,22 +160,9 @@ export function resizeAreaHeight(area, ratio, widthChanged) {
 			return area;
 	}
 };
-  
- export function debounced(fn, delay) {
-	let timerId;
-	return function (...args) {
-	  if (timerId) {
-		clearTimeout(timerId);
-	  }
-	  timerId = setTimeout(() => {
-		fn(...args);
-		timerId = null;
-	  }, delay);
-	}
-  }
 
 export function drawMap(imageSrc, imageWidth, imageHeight, areas, callback){
-	if(areas && areas.length > 0){	 
+	if(areas && areas.length > 0){
 		try
 		{
 			var tempImage = new Image(imageWidth, imageHeight);
@@ -179,13 +170,13 @@ export function drawMap(imageSrc, imageWidth, imageHeight, areas, callback){
 			tempImage.addEventListener("load", () =>{
 				var canvas = document.createElement('canvas');
 				var context = canvas.getContext('2d');
-	
+
 				canvas.width = imageWidth;
 				canvas.height = imageHeight;
 				context.drawImage(tempImage, 0, 0, imageWidth, imageHeight);
 				context.strokeStyle = "#FF0000";
 				context.lineWidth = 1;
-				 
+
 				for (var i = 0; i < areas.length; i++) {
 					const area = areas[i];
 					const coords = area.coords.split(',');
@@ -196,7 +187,7 @@ export function drawMap(imageSrc, imageWidth, imageHeight, areas, callback){
 							context.closePath();
 							context.stroke();
 							break;
-		
+
 						case 'poly':
 							context.beginPath();
 							context.moveTo(coords[0], coords[1]);
@@ -206,7 +197,7 @@ export function drawMap(imageSrc, imageWidth, imageHeight, areas, callback){
 							context.closePath();
 							context.stroke();
 							break;
-		
+
 						default:
 							context.strokeRect(coords[0], coords[1], coords[2] - coords[0], coords[3] - coords[1]);
 							break;
@@ -219,16 +210,16 @@ export function drawMap(imageSrc, imageWidth, imageHeight, areas, callback){
 					newSrc = canvas.toDataURL();
 				}
 				catch(err){
-					 
+
 				}
 				if(callback){
 					callback(oldSrc, newSrc);
 				}
-				 
+
 			}, false);
 		}
 		catch(err){
-			 
-		}	 
+			 console.log(err);
+		}
 	}
-}
+}