Location: PHPKode > scripts > TinyWebGallery > tinywebgallery/i_frames/i_slideshowie.php
<?php
/*************************  
  Copyright (c) 2004-2010 TinyWebGallery
  written by Michael Dempfle
 
  This program is free software; you can redistribute it and/or modify 
  it under the terms of the TinyWebGallery license (based on the GNU  
  General Public License as published by the Free Software Foundation;  
  either version 2 of the License, or (at your option) any later version. 
  See license.txt for details.
 
  TWG version: 1.8
 
  $Date: 2009-06-17 22:57:10 +0200 (Mi, 17 Jun 2009) $
  $Revision: 73 $
**********************************************/

define( '_VALID_TWG', '42' ); 
include "i_basic.inc.php";


$configphp = $basedir . "/" . $twg_album . "/config.php";
	if (file_exists($configphp)){
			include $configphp;
}
$configphp_lang = $basedir . "/" . $twg_album . "/config_".$default_language.".php";
if (file_exists($configphp_lang)){
  include $configphp_lang;
}

if ($twg_root == $install_dir . "../index.php") { // this is the default and wrong for the slideshow !
$twg_root = $install_dir . "index.php";
}

$email = ""; // only needed here ?

include "../inc/readxml.inc.php";

$image_list = get_image_list($twg_album);
$img_nr = get_image_number($twg_album, $image_enc);
$img_total = count($image_list);

require '../language/language_default.php';
require '../language/language_' . $default_language . '.php';
if (isset($charset)) {
  header("Content-Type: text/html;charset=" . $charset);
}
?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TinyWebGallery</title>
<?php
if (isset($charset)) {
  echo '<META http-equiv="Content-Type" content="text/html; charset=' . $charset . '"/>';  
}
?>
<script type="text/javaScript"> 
// Set the twg_slideshow speed (in milliseconds)
var twg_slideshowSpeed = <?php echo ($twg_slideshow_time * 1000) ?>;

var Caption = new Array(); // don't change this
var PictureName = new Array(); // don't change this
var fadeimages=new Array()

<?php

$install_dir = "../"; // for smilies !
for ($i = 0; $i < $img_total; ++$i) {
    $act_image = $image_list[$i];
    //$cacheimage =  urlencode(urlencode(str_replace("/", "_", $twg_album) . "_" . urldecode($act_image))) ;
    $cacheimage = create_thumb_image($twg_album, $act_image);
    echo "fadeimages[" . $i . "] = './" . twg_urlencode(create_cache_file($cacheimage,$extension_slideshow)) . "';\n";
    $cap = escapeHochkommaSlideshow(replacesmilies((getBeschreibung($act_image , $werte , $index))));
    $cap = str_replace("||", "&nbsp;<br />&nbsp;", $cap);
    echo "Caption[" . $i . "] = '" . $cap . "';\n";
    echo "PictureName[" . $i . "] = '" . $twg_root . "?twg_album=" . urlencode($twg_album) . "&twg_show=" . $act_image . $twg_standalonejs . "';\n";
} 

?>

var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=<?php echo $img_nr;
?>;   // TODO
var nextimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
var nrimages = fadeimages.length;
var img=0; 

start_picture_generation();

/*
This function does actally not loading an image but generating all the images
which are used in the twg_slideshow. I do this this way because than I can start with 
the twg_slideshow before all images are generatet - 1 image ~ 1 s -> 100 images
100 sec before I can start !!
*/
function start_picture_generation() 
{ 
  var picgen = 0;
  picgen=new Image(); /* neues Bild-Objekt anlegen */ 
  picgen.src= '<?php echo "../image.php?twg_type=twg_slideshowgenerate&twg_album=" . urlencode($twg_album) . "&twg_show=" . urlencode($image);

?>'; /* starting picture to generate !! */
 
} 

function load_img(srcnum) 
{ 
   if (img!=0) 
     delete img; /* altes Bild entsorgen */ 
   img=new Image(); /* neues Bild-Objekt anlegen */ 
   img.src=fadeimages[srcnum]; /* Bild laden lassen */ 
} 

</script>

<link rel="stylesheet" type="text/css" href="../style.css" />
<?php 
if (file_exists("../my_style.css")) {
  echo '<link rel="stylesheet" type="text/css" href="../my_style.css" />';
}
?>
<style type="text/css">
body.twg {
background-color:transparent;
}
</style>
</head>
<body class="twg">
<center>
<table summary="" width="100%" height="100%" border=0 cellpadding=2 cellspacing=0> 
  <tr>
    <td width="100%" align=center height=<?php echo $small_pic_size ?>>
<script language="JavaScript1.2" type="text/javascript">
/***********************************************
* Fade-in image slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var twg_slideshow_width='<?php 

if ($use_small_pic_size_as_height) { // 
  echo ceil($small_pic_size * 1.35);
} else {
  echo $small_pic_size; 
}

?>px' //SET IMAGE WIDTH
var twg_slideshow_height='<?php echo $small_pic_size; ?>px' //SET IMAGE HEIGHT
var pause=<?php echo ($twg_slideshow_time * 1000) ?> //SET PAUSE BETWEEN SLIDE (3000=3 seconds)

////NO need to edit beyond here/////////////
var ie4=document.all
var dom=document.getElementById

if (ie4||dom) {
  if (ie4) {
    var filter = "filter:alpha(opacity=10);";
  } else {
    var filter = "";
  }
  document.write('<div style="position:relative;width:'+twg_slideshow_width+';height:'+twg_slideshow_height+';overflow:hidden"><div  id="canvas0" style="position:absolute;width:'+twg_slideshow_width+';height:'+twg_slideshow_height+';top:0;left:0;' + filter + '-moz-opacity:10;"><\/div><div id="canvas1" style="position:absolute;width:'+twg_slideshow_width+';height:'+twg_slideshow_height+';top:0;left:0;' + filter + '-moz-opacity:10;visibility: hidden"><\/div><\/div>')
} else {
  document.write('<img name="defaultslide" src="'+fadeimages[0]+'">')
}

function fadepic(){
if (curpos<100){
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/101
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">'
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0
var tempobj2=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj2.style.visibility="hidden"
setTimeout("twg_rotimage()",pause)
}
}

waited = 0;
wait_safty=0;

function twg_rotimage(){
  if ((img!=0)&&(!img.complete)) /* wenn noch nicht fertig geladen */ 
     {
     // we wait until the 1st image is loaded !! after that we have a litle more time until we need the next images :).
     window.setTimeout("twg_rotimage()",1000);
     waited++;
     
     if (waited >= 30) {
        alert('It seams that you connection is not fast enough to twg_show \na smooth slideshow in the optimzed version.\n\nPlease switch to the non optimized version,\nif this message occurs frequently.'); 
        waited = 0;
     }
     wait_safty=0;
     return;
     }
waited = 0;

if (wait_safty == 0) { // we check twice if the image is loaded - I had too much troule here!
	wait_safty = 1;
  window.setTimeout("twg_rotimage()",20);
  return;
}  
wait_safty = 0;

if (ie4||dom){
		resetit(curcanvas)
		var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
		crossobj.style.zIndex++
		tempobj.style.visibility="visible"
		var temp='setInterval("fadepic()",50)'
		dropslide=eval(temp)
		curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0";
		if (document.getElementById) {
		 if (document.getElementById("CaptionBox")) {
		   document.getElementById("CaptionBox").innerHTML = Caption[curimageindex];
		 }
    }
		// if (document.getElementById) document.getElementById("NumberBox").innerHTML= (curimageindex + 1) + "/" + nrimages; 
		if (document.getElementById && parent.document.getElementById("imagecounter")) { parent.document.getElementById("imagecounter").innerHTML = curimageindex + 1; }
		if (document.getElementById) {
		   if  (parent.document.getElementById("stop_slideshow")) {
		     parent.document.getElementById("stop_slideshow").href = PictureName[curimageindex];
		   } else {
		     window.location = "index.htm"; 
		   }
        } 
}
else {
    document.images.defaultslide.src=fadeimages[curimageindex]
}
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
// we are preloading the next image - we don't to this like in the orignalscript in the beginning because we generate 
// the images during twg_slideshow.
load_img(curimageindex);

if ((curimageindex % 3) == 2) {
    start_picture_generation();
  }
}

function resetit(what){
curpos=10
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
if (crossobj.filters)
crossobj.filters.alpha.opacity=curpos
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=curpos/101
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">'
twg_rotimage();
}


// we finally start the twg_slideshow !
function starttwg_show() { 
if  ((img!=0)&&(!img.complete)) /* wenn noch nicht fertig geladen */ 
  {
    window.setTimeout("starttwg_show()",1000); 
    return;
  }
if (ie4||dom) {
startit(); 
// window.onload=startit
} else {
setInterval("twg_rotimage()",pause)
}
}

// we precache the 1st image!
function startpreLoading() {
  delete img;
  load_img(curimageindex);
  window.setTimeout("starttwg_show()",500);
  return;
}

// we wait until some images on the server are pregenerated!
function delayStart() {
  {
    window.setTimeout("startpreLoading()",1000);
    return;
  }
}

// this starts the twg_slideshow
delayStart();

</script>    
    </td>
  </tr>
<?php
  if ($show_captions) {
    echo "
      <tr>
        <td id=CaptionBox class=twg_Caption align=center>" . $lang_slideshowid_php_loading . "</td>
      </tr>
  ";
  }
?>
</table>
</center>
</body>
</html>
Return current item: TinyWebGallery