//if the content in the window is not empty alert something
if (contentWin != null) {
Dialog.alert("Close the window 'Test' before opening it again!",{width:200, height:130});
}
//otherwise instaciate a new window with the following options
else {
contentWin = new Window({maximizable: false, resizable: false, hideEffect:Element.hide, showEffect:Element.show, minWidth: 10, destroyOnClose: true})
//replace the content of the window with the content and the element itself of the element with the id 'test_content'
//true, true stands for: autoresize (default false), autoposition (default false)
contentWin.setContent('test_content', true, true)
contentWin.show();
/* Set up a windows observer, check ou debug window to get messages
* if the window gets closed by clicking on the red x than the element 'test_content' gets inserted into the 'container' element
* this method is used to display the content after closing the window.
* and the contentWin object gets dereferenced by calling =null;
*/
myObserver = {
onDestroy: function(eventName, win) {
if (win == contentWin) {
$('container').appendChild($('test_content'));// <----------------
contentWin = null;
Windows.removeObserver(this);
}
debug(eventName + " on " + win.getId())
}
}
Windows.addObserver(myObserver);
}
so if you a flash embedded like this:
<object id="flash" width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>
than you should replace the line where i made an arrow with this:
$('container').appendChild($('flash'));
to make things more clear here is the html of the example #3:
<p class="description">
<div id="container">
<div id="test_content" style="float:right;width:100px; height:150px;background:#DFA; color:#000; font-size:12px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit
</div>
This sample opens a window with green div on the right as content. It will keep the same size and position. Close the window to restore the div in the page.<br/>
It also uses a window observer to restore the div after closing the window.
</div>
</p>
all in all this should help:
<div id="container">
<object id="flash" width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>
</div>
<script type="javascript/text" language="javascript">
contentWin = new Window({maximizable: false, resizable: false, hideEffect:Element.hide, showEffect:Element.show, minWidth: 10, destroyOnClose: true})
contentWin.setContent('flash', true, true)
contentWin.show();
myObserver = {
onDestroy: function(eventName, win) {
if (win == contentWin) {
$('container').appendChild($('flash'));
contentWin = null;
Windows.removeObserver(this);
}
debug(eventName + " on " + win.getId())
}
}
Windows.addObserver(myObserver);
</script>