Refactor to change targetElementId dynamically

Author: Nazar65

lib/web/mage/adminhtml/browser.js

@@ -20,6 +20,7 @@ define([
     window.MediabrowserUtility = {
         windowId: 'modal_dialog_message',
         modalLoaded: false,
+        targetElementId: false,
 
         /**
          * @return {Number}
@@ -60,26 +61,21 @@ define([
                 }
 
                 this.modal.modal('openModal');
+                self.setTargetElementId(options, url);
                 $(window).trigger('reload.MediaGallery');
 
                 return;
             }
 
-            if (this.modal) {
-                this.modal.html($(content).html());
+            this.modal = $(content).modal($.extend({
+                title:  title || 'Insert File...',
+                modalClass: 'magento',
+                type: 'slide',
+                buttons: []
+            }, options));
 
-                if (options && typeof options.closed !== 'undefined') {
-                    this.modal.modal('option', 'closed', options.closed);
-                }
-            } else {
-                this.modal = $(content).modal($.extend({
-                    title:  title || 'Insert File...',
-                    modalClass: 'magento',
-                    type: 'slide',
-                    buttons: []
-                }, options));
-            }
             this.modal.modal('openModal');
+
             $.ajax({
                 url: url,
                 type: 'get',
@@ -89,10 +85,23 @@ define([
             }).done(function (data) {
                 self.modal.html(data).trigger('contentUpdated');
                 self.modalLoaded = true;
+                self.setTargetElementId(options, url);
             });
 
         },
 
+        /**
+         * Setter for targetElementId property
+         *
+         * @param {Object} options
+         * @param {String} url
+         */
+        setTargetElementId: function (options, url) {
+            this.targetElementId = options && options.targetElementId ?
+                options.targetElementId
+                : url.match(/\/target_element_id\/([\s\S].*?)\//)[1];
+        },
+
         /**
          * Close dialog.
          */
@@ -104,7 +113,6 @@ define([
     $.widget('mage.mediabrowser', {
         eventPrefix: 'mediabrowser',
         options: {
-            targetElementId: null,
             contentsUrl: null,
             onInsertUrl: null,
             newFolderUrl: null,
@@ -316,14 +324,14 @@ define([
         getTargetElement: function () {
             var opener, targetElementId;
 
-            if (typeof wysiwyg != 'undefined' && wysiwyg.get(this.options.targetElementId)) {
+            if (!_.isUndefined(wysiwyg) && wysiwyg.get(window.MediabrowserUtility.targetElementId)) {
                 opener = this.getMediaBrowserOpener() || window;
-                targetElementId = tinyMceEditors.get(this.options.targetElementId).getMediaBrowserTargetElementId();
+                targetElementId = tinyMceEditors.get(window.MediabrowserUtility.targetElementId).getMediaBrowserTargetElementId();
 
                 return $(opener.document.getElementById(targetElementId));
             }
 
-            return $('#' + this.options.targetElementId);
+            return $('#' + window.MediabrowserUtility.targetElementId);
         },
 
         /**
@@ -332,12 +340,12 @@ define([
          * return {Object|null}
          */
         getMediaBrowserOpener: function () {
-            if (typeof wysiwyg != 'undefined' &&
-                wysiwyg.get(this.options.targetElementId) &&
-                typeof tinyMceEditors != 'undefined' &&
-                !tinyMceEditors.get(this.options.targetElementId).getMediaBrowserOpener().closed
+            var targetElementId = window.MediabrowserUtility.targetElementId;
+
+            if (!_.isUndefined(wysiwyg) && wysiwyg.get(targetElementId) && !_.isUndefined(tinyMceEditors) &&
+                !tinyMceEditors.get(targetElementId).getMediaBrowserOpener().closed
             ) {
-                return tinyMceEditors.get(this.options.targetElementId).getMediaBrowserOpener();
+                return tinyMceEditors.get(targetElementId).getMediaBrowserOpener();
             }
 
             return null;