views:

516

answers:

1

ok.. heres the site with the examples..

Prototype Window Class xilinus.com

prototype-window.xilinus.com/samples.html

i want to use the third (3) example on my site on an swf content but i cant understand the code and the how to.. especialy the calling of the script (a href=# onclick=mplampla() embed .... /embed /a

A: 
//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>
nils petersohn