[pve-devel] [PATCH 1/2] ExtJS: backport Ext.ux.IFrame from ExtJS 4.2

[Alexandre Derumier]

Signed-off-by: Alexandre Derumier <aderumier at odiso.com>
---
 www/manager/Utils.js | 150 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 150 insertions(+)

diff --git a/www/manager/Utils.js b/www/manager/Utils.js
index 7632822..b82b0a5 100644
--- a/www/manager/Utils.js
+++ b/www/manager/Utils.js
@@ -48,6 +48,156 @@ var IP6_bracket_match = new RegExp("^\\[(" + IPV6_REGEXP + ")\\]");
 
 var IP64_match = new RegExp("^(?:" + IPV6_REGEXP + "|" + IPV4_REGEXP + ")$");
 
+Ext.define('Ext.ux.IFrame', {
+    extend: 'Ext.Component',
+
+    alias: 'widget.uxiframe',
+
+    loadMask: 'Loading...',
+
+    src: 'about:blank',
+
+    renderTpl: [
+        '<iframe src="{src}" name="{frameName}" width="100%" height="100%" frameborder="0"></iframe>'
+    ],
+
+    initComponent: function () {
+        this.callParent();
+
+       this.frameName = this.frameName || this.id + '-frame';
+
+        this.addEvents(
+            'beforeload',
+            'load'
+        );
+
+        Ext.apply(this.renderSelectors, {
+            iframeEl: 'iframe'
+        });
+    },
+
+    initEvents : function() {
+        var me = this;
+        me.callParent();
+        me.iframeEl.on('load', me.onLoad, me);
+    },
+
+    initRenderData: function() {
+        return Ext.apply(this.callParent(), {
+            src: this.src,
+            frameName: this.frameName
+        });
+    },
+
+    getBody: function() {
+        var doc = this.getDoc();
+        return doc.body || doc.documentElement;
+    },
+
+    getDoc: function() {
+        try {
+            return this.getWin().document;
+        } catch (ex) {
+            return null;
+        }
+    },
+
+    getWin: function() {
+        var me = this,
+            name = me.frameName,
+            win = Ext.isIE
+                ? me.iframeEl.dom.contentWindow
+                : window.frames[name];
+        return win;
+    },
+
+    getFrame: function() {
+        var me = this;
+        return me.iframeEl.dom;
+    },
+
+    beforeDestroy: function () {
+        this.cleanupListeners(true);
+        this.callParent();
+    },
+    
+    cleanupListeners: function(destroying){
+        var doc, prop;
+
+        if (this.rendered) {
+            try {
+               doc = this.getDoc();
+                if (doc) {
+                    Ext.EventManager.removeAll(doc);
+                    if (destroying) {
+                        for (prop in doc) {
+                            if (doc.hasOwnProperty && doc.hasOwnProperty(prop)) {
+                                delete doc[prop];
+                            }
+                        }
+                    }
+                }
+            } catch(e) { }
+        }
+    },
+
+    onLoad: function() {
+        var me = this,
+            doc = me.getDoc(),
+            fn = me.onRelayedEvent;
+
+        if (doc) {
+            try {
+                Ext.EventManager.removeAll(doc);
+
+                // These events need to be relayed from the inner document (where they stop
+                // bubbling) up to the outer document. This has to be done at the DOM level so
+                // the event reaches listeners on elements like the document body. The effected
+                // mechanisms that depend on this bubbling behavior are listed to the right
+                // of the event.
+                Ext.EventManager.on(doc, {
+                    mousedown: fn, // menu dismisal (MenuManager) and Window onMouseDown (toFront)
+                    mousemove: fn, // window resize drag detection
+                    mouseup: fn,   // window resize termination
+                    click: fn,     // not sure, but just to be safe
+                    dblclick: fn,  // not sure again
+                    scope: me
+                });
+            } catch(e) {
+                // cannot do this xss
+            }
+
+            // We need to be sure we remove all our events from the iframe on unload or we're going to LEAK!
+            Ext.EventManager.on(this.getWin(), 'beforeunload', me.cleanupListeners, me);
+
+            this.el.unmask();
+            this.fireEvent('load', this);
+
+        } else if(me.src && me.src != '') {
+
+            this.el.unmask();
+            this.fireEvent('error', this);
+        }
+
+
+    },
+
+    load: function (src) {
+        var me = this,
+            text = me.loadMask,
+            frame = me.getFrame();
+
+        if (me.fireEvent('beforeload', me, src) !== false) {
+            if (text && me.el) {
+                me.el.mask(text);
+            }
+
+            frame.src = me.src = (src || me.src);
+        }
+    }
+});
+
+
 Ext.define('PVE.Utils', { statics: {
 
     // this class only contains static functions
-- 
2.1.4