Log in

View Full Version : Switching between plugin and flash


corbo950
04-22-2010, 03:52 AM
so im switching back and forth between a flex app for making menus and a game using a plugin called panda3d. I biased the switching off a page on this site on switching content here (http://www.dynamicdrive.com/dynamicindex17/switchcontent.htm). When i had both the plugin and the flex in as content in that example i was able to switch between them and the content would remain loaded. Yet for some reason when i wrote my own script for it(included below) when i switch back to the plugin it reloads... just trying to figure out how i keep it loaded so that somebody can pause the game and go back to the flex menu.



<htm<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript" type="text/javascript">
function switchToGame()
{
document.getElementById("flexHolder").style.display="none";
document.getElementById("P3DHolder").style.display="inline";
}
function switchToFlex()
{
document.getElementById("P3DHolder").style.display="none";
document.getElementById("flexHolder").style.display="inline";
}
</script>
<script src="RunPanda3D.js" language="javascript"></script>
</head>
<body>
<div id="P3DHolder" class="omega13switch">
<script language="JavaScript" type="text/javascript">
function loadP3D(source)
{
P3D_RunContent('data', source, 'id', 'P3DFile', 'width', 680, 'height', 480, 'auto_start', '1');
}
</script>
</div>
<div id="flexHolder" class="omega13switch">
<iframe id="flexFrame"
frameborder="0" vspace="0" hspace="0" marginwidth="0"
marginheight="0" width="680" scrolling="no" height="480"
src="Omega13Packager.html">
</iframe>
</div>
</body>
</html>
BLiZZaRD
04-22-2010, 09:39 PM
Although it really isn't a Flash problem, the only thing I can see is that you aren't toggling, between the too as in the example script. Instead you are disabling and re-enabling, which is basically like doing a page refresh, everything will be loaded again.

Instead of doing it that way, follow the JS in the switchcontent.js on the script page to see how it is toggled back and forth.
corbo950
04-22-2010, 11:13 PM
Thank you very much for your response... and sorry i debated on where to put the thread....
I'm not sure what you mean by toggling instead of enabling and dialing

Here is what I was looking at in the switchcontent.js:


...
var innercontent=document.getElementById(header.id.replace("-title", ""))
...
innercontent.style.display="block"
...


.... how is that code diffrent from my:


document.getElementById("P3DHolder").style.display="none";


Or am I looking at the wrong thing in the switchcontent doc?
BLiZZaRD
04-22-2010, 11:22 PM
I am thinking it is more of a JavaScript thread post, but no matter.

I am not a JS guy, so there isn't a whole lot I know about it. I try, but it doesn't always work :)

I was looking at the toggle codes for the .js file from the example. There are 2 functions (probably more) that deal with showing and not showing the content:



switchcontent.prototype.sweepToggle=function(setting){ //PUBLIC: Expand/ contract all contents method. (Values: "contract"|"expand")
if (typeof this.headers!="undefined" && this.headers.length>0){ //if there are switch contents defined on the page
for (var i=0; i<this.headers.length; i++){
if (setting=="expand")
this.expandcontent(this.headers[i]) //expand each content
else if (setting=="contract")
this.contractcontent(this.headers[i]) //contract each content
}
}
}


switchcontent.prototype.defaultExpanded=function(){ //PUBLIC: Set contents that should be expanded by default when the page loads (ie: defaultExpanded(0,2,3)). Persistence if enabled overrides this setting.
var expandedindices=[] //Array to hold indices (position) of content to be expanded by default
//Loop through function arguments, and store each one within array
//Two test conditions: 1) End of Arguments array, or 2) If "collapsePrev" is enabled, only the first entered index (as only 1 content can be expanded at any time)
for (var i=0; (!this.collapsePrev && i<arguments.length) || (this.collapsePrev && i==0); i++)
expandedindices[expandedindices.length]=arguments[i]
this.expandedindices=expandedindices.join(",") //convert array into a string of the format: "0,2,3" for later parsing by script
}


Then there is also the persistence settings, and if enabled, is probably where the content stays loaded. I will see if we can track down a JS expert to look at this for you.
corbo950
04-22-2010, 11:29 PM
That is ok im thankful for any help i can get... I read through those functions as well the code im talking about is the "switchcontent.prototype.contractcontent" function and the "switchcontent.prototype.expandcontent"

The functions you referenced do toggle the content but they call the functions im talking about to do so... when it calls "this.expandcontent" and "this.contractcontent"


switchcontent.prototype.sweepToggle=function(setting){ //PUBLIC: Expand/ contract all contents method. (Values: "contract"|"expand")
if (typeof this.headers!="undefined" && this.headers.length>0){ //if there are switch contents defined on the page
for (var i=0; i<this.headers.length; i++){
if (setting=="expand")
this.expandcontent(this.headers[i]) //expand each content
else if (setting=="contract")
this.contractcontent(this.headers[i]) //contract each content
}
}
}


Now you see my confusion on why it works in switchcontent.js but not in my code....
BLiZZaRD
04-22-2010, 11:32 PM
Yes, but that is what I meant. Your code only hides or shows them, the JS file has many functions that go into the hiding and showing, not just a simple display or don't display.

I have sent John a message and he should have more insight when he logs in.
corbo950
04-22-2010, 11:35 PM
ok thank you very much

edit: here (http://flex.openswimsoftware.com/omega13/switch-test/) is a link to the one using switchcontent.js

and here (http://flex.openswimsoftware.com/omega13/com-test/) is the one with my code

they both include a bit flex app and then a demo app from Panda3D
jscheuer1
04-23-2010, 01:06 PM
I've looked at both versions. The Omega thing is empty, and the Flex thing doesn't seem to do anything. This is in both versions. I tried in IE, Opera and Firefox. Of the three, only Firefox even hints that it might need an additional plug in, but when I say OK, it can't find any.

My advice would be though, if the one script works for you, use it.

I have Flash 10 installed in all three browsers.
corbo950
04-23-2010, 02:45 PM
The plugin wont show unless you have the plug installed ... you can find it here (http://www.panda3d.org/download.php?runtime).. the flex is just a bit of test code of proof of concept... i tired to cut down the code as much as i could to the part i was actually talking about so it would be easier to sift through. The switchcontent.js script doesn't do exactly what i want. It is for the user to click and expand/contract content on a page...What i am trying to do switches between the flex and the plugin from inside the flex and the game to allow the flex to act as an "in-game menu". If it helps you to see what i am trying to do the actual plug-in so far is here (http://flex.openswimsoftware.com/flex/omega13/packager-web/)
I just need to figure out what im missing from the switchcontent.js that causes the plugin to be held instead of refreshed...
corbo950
04-23-2010, 02:58 PM
I figured it out.... when i was using the switch JS i had the Plugin in an iframe.... dont ask me why but that makes all the diffrence
BLiZZaRD
04-23-2010, 07:03 PM
Yay! Glad we got it solved!
corbo950
04-27-2010, 05:47 AM
Ok so now i have kinda a new issue.... when i try to run the plugin from inside flex i make an ExternalInterface call(to the JS of flex's holder page) which is like "window.frames.pandaFrame.loadP3D()" which simply goes into the iframe which is supposed to hold the plugin and calls the function to run it and this works fine and great in both safari and IE but it throws firefox for a total loop.... any idea why?
jscheuer1
04-27-2010, 04:30 PM
Please post a link to a page on your site that contains the problematic code so we can check it out.
corbo950
04-27-2010, 05:45 PM
here (http://flex.openswimsoftware.com/flex/omega13/packager-web/omega13main.html)
..... it is still up from before... and it should tell you this but if not the plugin install site is here (http://www.panda3d.org/download.php?runtime)

edit: i also just turned on directory browsing in that area of my site....might take a min to take effect though.... hope it helps and thanks in advance for anything you can do
jscheuer1
04-28-2010, 12:58 AM
OK, I've installed the panda plugin. I'm still not clear on what page I should go to to see the problem, or what I should do once I get to that page.

I think I'm clear that I should do this in Firefox, do I have that much right?
corbo950
04-28-2010, 01:47 AM
It is ok I know I totally switched gears on you ..... If you follow the link then it should run the plugin... This should show a splash image and a short movie and then a menu... Hit play..... In IE or safari the game should soon after load showing it's menu... I know this is redundent i'm using a demo app from panda3d's site.... In firefox the plugin will not show when you hit play ... I belive the problem is in the call to window.frames.pandaFrame.loadP3D() which is in omega13main.html .... If you need anything else or have anymore questions just let me know ..:-) thanks again
corbo950
05-01-2010, 09:22 PM
Anybody have any ideas?
BLiZZaRD
05-05-2010, 02:02 AM
If there is no answer I will try to look at it tomorrow. I just don't have time to learn about all the programs and install all the stuff so I can test it. :)
corbo950
05-05-2010, 03:18 PM
Thanks I know it is kinda a collage of things... I have kept trying but i have no luck in figuring it out.

edit: I did just find this debugger called firebug and it came up with this:

reference to undefined property window.frames.pandaFrame
window.frames.pandaFrame.loadP3D(source);

Does firefox not support window.frames?

Or maybe does firefox save resources by not creating pandaFrame until it is displayed?
corbo950
05-05-2010, 04:18 PM
I found the answer .... thanks to everybody who tried to help.... using that firebug error i was able to find another forum where somebody had asked a similar question. it turns out that firefox doesnt like calling frames by their id... so you have to do this:


window.frames[0].loadP3D(source);
BLiZZaRD
05-05-2010, 07:40 PM
So it works good now? Thats great!
jscheuer1
05-06-2010, 04:51 AM
I found the answer .... thanks to everybody who tried to help.... using that firebug error i was able to find another forum where somebody had asked a similar question. it turns out that firefox doesnt like calling frames by their id... so you have to do this:


window.frames[0].loadP3D(source);

Yes, that's the best way. If you call an iframe by its id in Firefox and most browsers you can access its src and other attributes of it as an element on the page. But if you want to access its properties as a window, like location, or its contained document, anything that relates to it as a window, you need to reference it as a frame. It's frames[#] is the best way to do that. Another alternative to do so is by name, ex:


<iframe name="whatever" . . .


window.frames.whatever.loadP3d(source);

But that isn't as reliable as by its number because the name has to be unique, whereas the number (which relates to which frame starting at 0 that it is on the page/in the window), will always be unique.

An additional issue with names is that sometimes they can be confused with other things (like variables, functions, classes, or id's) in the document or window. And even when they are not, may not work anyway. So, when accessing the iframe as a window, the number is almost always the way to go.
corbo950
05-06-2010, 06:14 AM
window.frames.pandaFrame.loadP3D(source);

That was the way that i was referencing it that wasn't working in firefox. Doesn't matter now though this works. Thanks for all your help both of you
jscheuer1
05-06-2010, 04:45 PM
That was the way that i was referencing it that wasn't working in firefox. Doesn't matter now though this works. Thanks for all your help both of you

Well not exactly, you have:


<iframe id="pandaFrame"
frameborder="0" vspace="0" hspace="0" marginwidth="0"
marginheight="0" width="680" scrolling="no" height="480"
src="p3dwrapper.html">
</iframe>

for:


window.frames.pandaFrame

to have any chance of working, it needs to be the name of the frame:


<iframe name="pandaFrame"
frameborder="0" vspace="0" hspace="0" marginwidth="0"
marginheight="0" width="680" scrolling="no" height="480"
src="p3dwrapper.html">
</iframe>

But as you see, the number works. And as I say, the number is the best method. Sometimes it isn't possible to use the number though.