Dec 25 2008

Implement autorun for shadowbox via URL parameter

As you probably already realized I used the javascript lightbox engine called ShadowBox to show my media content. I really love this engine and I think it belongs to one of the best lightbox javascript engines around. One drawback of such engines is though - that they are normally launched when the visitor actively pressed a relative link. I thought it would be nice if you could spread a link url that directly links to the activated shadowbox content.

After reading the doc page of shadowbox - I realized that it is possible while adding the appropiate Shadowbox.open method to the windows onload event. That’s why I implement the following hacky code that I added to the header.php file of my wordpress installation. With this code I check for the existance of a sbx_run parameter in the get request which should contain the filename of the flash file to load. I also check for height/width values. (Note: You could easily add more flexibility to it - like setting the various shadoxbox player types et cetera).

<?php
  // Quick hack to implement direct shadowbox autorun via URL parameter
  // benny!weltenkonstrukteur.de
  // Disclaimer: Use code at your own risk!
  if ( isset( $_GET['sbx_run'] ) )
  {
     // Construct url of swf content to play
     $sbx_content = "http://www.weltenkonstrukteur.de/wp-content/uploads/" . urldecode((string)$_GET['sbx_run']) . ".swf";
 
     // Retrieve width/height parameter
     ( isset($_GET['sbx_width']) ) ? $sbx_width = (int)$_GET['sbx_width'] : $sbx_width = 520;
     ( isset($_GET['sbx_height'])) ? $sbx_height= (int)$_GET['sbx_height']: $sbx_height= 390;
 
     echo '<script>
           window.onload = function()
           {
              Shadowbox.init(shadowbox_conf);
              Shadowbox.open({
              player:     "swf",
              content:    "' . $sbx_content . '",
              height:     ' . $sbx_height . ',
              width:      ' . $sbx_width .'
             });
           }
         </script>
        ';
  }
?>

So, using this techinque I could directly start the rotozoomer of the previous post with the following URL:

http://www.weltenkonstrukteur.de/2008/12/rotozoomer-in-actionscript30/?sbx_run=2008%2F12%2Frotozoom

Important:
Use this code at your own risk. Including content in the way I did is very open for cross-site-scripting (XSS) and therefor makes your website vulnerable. Please keep this in mind.