API tools faq
paste
Advertisement
Guest User

JW Image Rotator Dynamic Playlist DEMO

a guest
May 16th, 2012
190
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.40 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  3. <head>
  4.   <title>JW Image Rotator Dynamic Playlist DEMO</title>
  5.  
  6.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  7.  
  8.   <!-- Version 3.18 is available. Version 3.17 which contains no watermark and ALL source files is available here: http://developer.longtailvideo.com/trac/browser/tags/imagerotator-3.17  -->
  9.   <!-- All the flashVars, params, API useage is available here:  http://developer.longtailvideo.com/trac/wiki/ImageRotatorOverview  -->
  10.  
  11.   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  12.   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
  13.  
  14.   <style type="text/css">
  15.  
  16.     /* This is the only style required which specifies the dimensions for the Image Rotator when it Reloads. */
  17.     .iRotatorWrapper320x180 {
  18.       width: 320px;
  19.       height: 180px;
  20.       background-color: #000000;
  21.     }
  22.  
  23.   </style>
  24.  
  25.   <script type="text/javascript">
  26.  
  27.     // This variable will define the default playlist.
  28.     // When the webpage admin updates the contents of this file, it's then available for the currently loaded player during a Reload event.
  29.     //
  30.     // Remember to replaced hot linked files with your own... shown on jsFiddle for DEMO only.
  31.     // Original non-jsFiddle filename would be:  playlist.xml
  32.     //
  33.     var iRotatorXML01 = "http://www.longtailvideo.com/jw/embed/images.php";
  34.  
  35.     // This function defines the first Image Rotator Object which is initalized using name iRotatorInit01
  36.     function iRotatorInit01(){
  37.  
  38.         // This section defines the SWFobject flashVars Options for the Image Rotator Object defined above.
  39.         var flashVars = {
  40.             'file': iRotatorXML01,
  41.             'shownavigation': 'true',
  42.             'shuffle': 'false',
  43.             'repeat': 'true',
  44.             'rotatetime': '2'
  45.         };
  46.  
  47.         // This section defines the SWFobject params Options for the Image Rotator Object defined above.
  48.         var params = {
  49.             "allowfullscreen": "true",
  50.             "allowscriptaccess": "always",
  51.             "wmode": "transparent"
  52.         };
  53.  
  54.         // This section defines the SWFobject attributes Options for the Image Rotator Object defined above.
  55.         // The id and name must match, and these should match the div name for best performance.
  56.         var attributes ={
  57.             "id": "iRotatorEmbed01",
  58.             "name": "iRotatorEmbed01",
  59.             "align": "middle"
  60.         };
  61.  
  62.         // The SWFobject handles the cross-browser embedding.
  63.         // The main imagerotator.swf file is used with handler of iRotatorEmbed01 which must match the DIV along with name/id in attributes.
  64.         // The width and height are both 100% since the DIV #iRotatorWrapper defines the dimensions.
  65.         // Min flash version 9 specified while false skips alternate flash content to be shown when required.
  66.         // Finally, the three variables flashVars, params, and attributes will load the relivant data supplied from these variables.
  67.         //
  68.         // Remember to replaced hot linked files with your own... shown on jsFiddle for DEMO only.
  69.         // Original non-jsFiddle filename would be:  imagerotator.swf
  70.         //
  71.         swfobject.embedSWF("http://www.longtailvideo.com/jw/embed/imagerotator.swf", "iRotatorEmbed01", "100%", "100%", "9", "false", flashVars, params, attributes);
  72.  
  73.     }
  74.  
  75.     // This function will see that the current iRotator01 Object is reloaded.
  76.     function iRotatorReload01(){
  77.  
  78.         // Optionally change the playlist filename to some other one by redefining this variable.
  79.         // If filename is left as original or this variable is commented out, then the latest **revision** is used during this Reload event.
  80.         // While only the 'file' flashVars is changed, this process can be applied to other flashVars, params, or attributes as required.
  81.         // Also, related content can be handles during this reloading process, such as changing the title for the wrapper div.
  82.         //
  83.         // Remember to replaced hot linked files with your own... shown on jsFiddle for DEMO only.
  84.         // Original non-jsFiddle filename would be:  playlist2.xml
  85.         //
  86.         iRotatorXML01 = 'http://www.longtailvideo.com/jw/embed/images.php';
  87.  
  88.         // The contents of the iRotator01 DIV is emptied since it's about to be reinitialized.
  89.         $('#iRotator01').empty();
  90.  
  91.         // This will reinitialize the iRotator01 DIV, thus re-loading the xml file which is either a new revision or new filename.
  92.         iRotatorInit01();
  93.  
  94.         // Status message to indicate the iRotator01 Object was reloaded.
  95.         console.log('The iRotatorEmbed01 was reloaded.');
  96.         console.log('This DEMO has completed!');
  97.  
  98.     }
  99.  
  100.  
  101.     window.onload=function(){
  102.  
  103.         // This will initialize the iRotator01 for the first time.
  104.         iRotatorInit01();
  105.  
  106.         // Reload the SWF in 7 seconds. The value is in milliseconds, so 1000 = 1 second.
  107.         // Optionally, use a simple Cookie Script that can auto-fire this function at desired times, useful when different playlist's should be loaded at different times.
  108.         setTimeout("iRotatorReload01();", 7000);
  109.  
  110.         // Status message that it has been initalized for the first time along with presenting the Object.
  111.         console.log('The iRotatorEmbed01 was just initialized during page load.'); console.log( $('#iRotatorEmbed01') );
  112.  
  113.     }
  114.  
  115.   </script>
  116.  
  117. </head>
  118. <body>
  119.  
  120.   <p>JW Image Rotator with Dynamic Data DEMO<br />
  121.   Enable the console to view messages.</p>
  122.  
  123.   <!-- This Class Name can be reused for other iRotatorEmbed's that are on the webpage, or new styles can be made.-->
  124.   <div class="iRotatorWrapper320x180">
  125.  
  126.       <!-- This div is the first embed of the Image Rotator Object. -->
  127.       <div id="iRotatorEmbed01"></div>
  128.  
  129.   </div>
  130.  
  131.   <!-- Simple text to occupy space to show that elements don't move around since the iRotatorWrapper is used. -->
  132.   <p>The above flash item is embedded with SWFObject v2.2<br /><br />
  133.   Both playlists are the same and they have 13 images.<br />
  134.   Playlist is shown for 7 seconds which shows up to the 3rd image.<br />
  135.   Playlist is reloaded, thus resetting the image count.</p>
  136.  
  137. </body>
  138. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!