[3.0.x, 3.1.1] ux.ManagedIFrame 2.x

[zombeerose]

I am trying to make the background of the MIF transparent in IE. Based on my search, I have to set the background-color of the body to transparent AND set the ALLOWTRANSPARENCY property of the frame to true. I tried using frameConfig but no luck.

Secondly, I have a MIFP that is the center region in a border layout. The content I am loading into the frame goes past the viewable area. I set autoScroll to true but I'm still not getting any scroll bars.

Any suggestions?

[zombeerose]

On a separate note, I updated to the RC2.1 file and now I'm getting this error.

b is undefined
http://www/includes/library/extjs/ext/examples/mif/ext-all.js
Line 7

I have packaged and attached my test. Just drop into examples.

[decker.net]

Now it fails on Ext.getDoc() function call.

[cherbert]

Well now things are even worse. (RC2.1) My app won't load at all now and fails in firebug with..

ct is undefined
[Break on this error] ct.dom.insertBefore(this.el.dom, position);\n

ext-all-debug.js (Line 14639)


These are my first includes...

<script type="text/javascript" src="./ext3/adapter/ext/ext-base-debug.js"></script>
<script type="text/javascript" src="./ext3/ext-all-debug.js"></script>
<script type="text/javascript" src="./js/miframe/multidom.js"></script>
<script type="text/javascript" src="./js/miframe/miframe-debug.js"></script>

[hendricd]

@zomberose, @cherbert, @decker.net -- FOr the moment remove lines

295 from miframe-debug.js,
and/or
123 from multidom.js

    var overload = function(pfn, fn ){
          // fn = typeof fn == 'function' ? fn : function t(){};

I'll look a bit more into the issue of overloading functions that don't exist.

@cherbert:
The new MIF builds should be used one of two ways:

Either just use the miframe[-debug].js (which contains all the package components)

or include each part of the package:

<script type="text/javascript" src="./js/miframe/uxvismode.js"></script>
<script type="text/javascript" src="./js/miframe/multidom.js"></script>
<script type="text/javascript" src="./js/miframe/mif.js"></script>

but never both.

[cherbert]

ok we are getting somewhere.

I have no errors now and my application loads. However..

It would appear that all divs on my index page with class='x-hidden' are now showing up as the application is loading. I can see non-related hidden divs that I have created for elsewhere in my application and also I can see the contents of the iframepanels as Ext is loading.

Once the application loads Ext takes over and the page looks fine.

So basically fully functioning except for the hidden divs showing? Looks to me like the class x-hidden is being ignored now?

UPDATE This only appears to be happening in Firefox. Safari/Chrome doesn't do it.

[armagedon]

Dear Doug,
I was using MIFRAME in the prev. version of EXT JS very intensive. Now I have migrated and nothing works anymore for me(RC1, RC2 1 - are producing errors. RC2 has no errors but don't works). You made a perfect work but this is not useful for us, if you don`t write a simple tutorial how to bind this component in and how to use it. The new features seems to be perfect, but they are useless, if the basics are not working. In your demos - and this is for all developers- please dont combine several comoponents together. Write it so simple as you can, so the dependencies can be seen. The elegance of the code is not the purpose in demos. With this i mean using JIT in your demos is absolutly on wrong position. MIFRAME is complex enough.
Maybe you can update some tutorials. E.g. I didnt know, which JS-Files I have to bind in, just from your last post. Alsp no readme in the zip files.
I am looking forward, to hear from you and using your MIFRAME again :-)

[extjs3user]

Am using miframe2_RC2-1 with extjs3.0
i have included mif.js, miframe.js, multidom.js, uxvisdom.js files.

var northPanel = {....};

var centerPanel = new Ext.Panel({
       region: 'center',
       id: 'centerPanelId'
}); //End of Center panel
 
 
var newFrame = centerPanel.add({
        xtype : 'iframepanel',
        id : 'SORiframe',
        frame: false,
        loadMask : true,
        defaultSrc: '<%= ViewData.Model.SetReportName %>'
});
 
var masterViewport = new Ext.Viewport({
         id: 'sorViewPort',
         renderTo: Ext.getBody(),
         layout: "border",
         margins: '0 0 0 0',
         floatable: false,
         titleCollapse: false,
         items: [
           centerPanel, northPanel]//EO item Array
});

am getting an error this.el is undefined
please help me.

[hendricd]

Am using miframe2_RC2-1 with extjs3.0
i have included mif.js, miframe.js, multidom.js, uxvisdom.js files.

var northPanel = {....};

var centerPanel = new Ext.Panel({
       region: 'center',
       id: 'centerPanelId'
}); //End of Center panel
 
 
var newFrame = centerPanel.add({
        xtype : 'iframepanel',
        id : 'SORiframe',
        frame: false,
        loadMask : true,
        defaultSrc: '<%= ViewData.Model.SetReportName %>'
});
 
var masterViewport = new Ext.Viewport({
         id: 'sorViewPort',
         renderTo: Ext.getBody(),
         layout: "border",
         margins: '0 0 0 0',
         floatable: false,
         titleCollapse: false,
         items: [
           centerPanel, northPanel]//EO item Array
});

am getting an error this.el is undefined
please help me.

@extjs3user -- The new MIF builds should be used one of two ways:

Either just use the miframe[-debug].js (which contains all the package components)

 <script type="text/javascript" src="./js/miframe/miframe[-debug].js"></script>

or include each part of the package:

<script type="text/javascript" src="./js/miframe/uxvismode.js"></script>
<script type="text/javascript" src="./js/miframe/multidom.js"></script>
<script type="text/javascript" src="./js/miframe/mif.js"></script>

but never both.

Are you wrapping your Layout code in Ext.onReady()?

[hendricd]

Dear Doug,
I was using MIFRAME in the prev. version of EXT JS very intensive. Now I have migrated and nothing works anymore for me(RC1, RC2 1 - are producing errors. RC2 has no errors but don't works). You made a perfect work but this is not useful for us, if you don`t write a simple tutorial how to bind this component in and how to use it. The new features seems to be perfect, but they are useless, if the basics are not working. In your demos - and this is for all developers- please dont combine several comoponents together. Write it so simple as you can, so the dependencies can be seen. The elegance of the code is not the purpose in demos. With this i mean using JIT in your demos is absolutly on wrong position. MIFRAME is complex enough.
Maybe you can update some tutorials. E.g. I didnt know, which JS-Files I have to bind in, just from your last post. Alsp no readme in the zip files.
I am looking forward, to hear from you and using your MIFRAME again :-)

@armagedon -- I hear your words. And your point is well-taken, MIF 2.0 needs updated documentation to describe setup, builds, and deployment. I'll be adding those shortly.

But, understand that the Demo site is not built to teach the beginner the Ext framework. The Demo source panels are there for a reason. They show how to setup the MIF Components in a basic layout and demonstrate commonly requested tasks (eg. link interception, adding IFRAMEs to tabPanels (driven by 'west-side' trees, see it here). The focus is on component usage, not how to build a full Ext project (that's what Ext /examples are for). MIF does many things, and creating seperate full demo pages on how to do everything one of them is not practical using the traditional (per page) approach. I welcome ideas/solutions to that, however.

The use of $JIT on the demo site simplifies maintenance and deployment of Components and related examples. Without it, there probably would not be a demo site offered at all.

Regarding MIF complexity: One of the fundamental motives for changes in MIF's architecture is (an attempt) to reduce the size of MIF to suite functional needs. 90% of you don't do anything but stick an IFRAME in a Layout somewhere, so you don't need the extra baggage. And there are new features coming in the next release that made this structure necessary for maintenance purposes:

- ManagedIFrame Element for Ext Core (MIT)
- multidom Support for Core and ExtJs (the ability to safely access-the-DOM/render- components of/to multiple documents from a single Ext instance).
- cross FRAME drag-drop
- cross FRAME messaging.

And finally, regarding Ext 3 compatibility: Ext's late release changes (post-Ext 3RC2) with little notice, required significant modification to MIF internals to safely support existing DOM-access features that were provided by MIF 1.x. Ext 3 was essentially a Core rewrite, which has created a variety of ux.Compatibility issues with several extensions (MIF included).

MIF will remain in RC status until it performs as well (or better) as the older 1.x release.

I appreciate your patience (and keep on eye on SVN/trunk).