PDA

View Full Version : Can't resize frames when flash objects are loaded



nrevelle
9 Nov 2006, 10:01 AM
If I leave the flash object off the page I can resize, but as soon as I load one I can no longer resize the frames.

jack.slocum
9 Nov 2006, 3:57 PM
If you put up and example page you will have a better chance of getting help with something like this. Otherwise, I would have to spend a bunch of time setting up an environment to duplicate the problem.

nrevelle
10 Nov 2006, 4:54 AM
If you put up and example page you will have a better chance of getting help with something like this. Otherwise, I would have to spend a bunch of time setting up an environment to duplicate the problem.

I understand. The app I'm working on is on a intranet, I'll see if I can isolate and post to a public site this weekend. My hope was that someone would say "oh yeah, I know how to stop that".

Thanks for all the hard work.

jack.slocum
10 Nov 2006, 5:35 AM
Did you set useShim:true on the regions? That may help.

jkleinsc
20 Dec 2006, 7:26 AM
I have a similar issue with resizing a BasicDialog over flash and I believe it has to do with the fact that the resizer doesn't use a shim even if the dialog or region uses a shim. The following example consists of a BasicDialog and an IFRAME that contains a flash object.

The BasicDialog is placed just above the flash object. You will notice that when it is resized, the portion above the flash object disappears until the mouse button is released. In this example, its not a big deal because you can see part of the dialog, but when the dialog is completely over the flash object, the resizer controls are completely invisible.



<html>
<head>
<script type="text/javascript" src="http://us.js2.yimg.com/us.js.yimg.com/lib/common/utils/2/utilities_2.1.0.js"></script>
<script type="text/javascript" src="http://www.yui-ext.com/deploy/yui-ext/yui-ext.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.yui-ext.com/deploy/yui-ext/resources/css/yui-ext.css" />
<script type="text/javascript">
var HelloWorld = function(){
var dialog;
return {
init : function(){
if(!dialog){ // lazy initialize the dialog and only create it once
dialog = new YAHOO.ext.BasicDialog("hello-dlg", {
x: 70,
y: 400,
width: 100,
height: 100,
proxyDrag: false,
shim: true
});
}
dialog.show();
dialog.resizer.dynamic=true;

}
};
}();
YAHOO.ext.EventManager.onDocumentReady(HelloWorld.init, HelloWorld, true);
</script>
</head>
<body>
<div id="hello-dlg" style="visibility:hidden;position:absolute;top:0px;">
<div class="ydlg-hd">Hello</div>
<div class="ydlg-bd">Hello World</div>
</div>
<iframe id="contentframe" style="height: 800px; width: 800px;" src="http://www.adobe.com/devnet/flash/sample_files/html/color_picker.html"></iframe>
</body>
</html>


My fix to this issue was to make the dialog's resizer dynamic and to make the following change to the Resizable.js file (from the 0.33 source);
starting at line 484, the code was:


if(this.dynamic){
this.resizeElement();
}

and I changed it to:


if(this.dynamic){
var size = this.resizeElement();
this.fireEvent('resize', this, size.width, size.height, null);
}


Making this change fires the resize event on the BasicDialog which in turn resizes its' iframe shim.

jack.slocum
20 Dec 2006, 2:16 PM
Sounds like you have it figured out. One thing to note, dynamic resize + the event can be a very expensive (slow) operation.