﻿///////////////////////////////////////////////////////////////////
// Implements a fade out fade in effect within a slideshow.
//
// by Vasile Marita, www.tara-oasului.com
// If you use this code please let this info here, thanks
//
// Created on May 14, 2007
// 
///////////////////////////////////////////////////////////////////


function sinkObjectToEvent(obj, methodName, p1){
    return (function(){
        return obj[methodName](this, p1);
    });
}

function vmSlideShow()
{
    this.Images = new Array();
    this.UrlTemplate = '\"../MediaTransform.ashx?w=600&h=400&tr=ref&ratio=true&img=\" + this.ExecutingItem.Url';
    this.UrlTemplateCache = '\"../MediaTransform.ashx?w=600&h=400&tr=ref&ratio=true&img=\" + checkedImage.Url';
    
//    this.UrlTemplate = '\"ImageLoader.ashx?ImageId=\"+this.ExecutingItem.PhotoID+\"&SizeSet=Full\"';
  //  this.UrlTemplateCache = '\"ImageLoader.ashx?ImageId=\"+checkedImage.PhotoID+\"&SizeSet=Full\"';
    this.CurrentIndex = -1;
    this.ExecutingItem = null;
    this.FadeSpeed = 1000;
    this.TargetImageId = null;
    this.CachedImages = new Array();
    this.PrefetchIndex = -1;
}

vmSlideShow.prototype = new JS_Object();
vmSlideShow.prototype.constructor = vmSlideShow;


vmSlideShow.prototype.connectImage = function() {
var imageElem = document.getElementById(this.TargetImageId);
    if (imageElem) {
        imageElem.onload = sinkObjectToEvent(this, "imageLoaded", null);
    }
}

vmSlideShow.prototype.getCurrent = function ()
{
    if (this.CurrentIndex < 0 || this.CurrentIndex >= this.Images.length )
        return null;
        
    return this.Images[this.CurrentIndex];
}

vmSlideShow.prototype.show = function (index)
{
    // Check the boundaries
    if (index < 0 || index >= this.Images.length )
        return;

    if ( this.CurrentIndex != index )
    {
        this.CurrentIndex = index;
        this.ExecutingItem = this.Images[index];
        
        //if ( this.ensureCached(index) )
        this.changeImageWithFade();
    }
}

vmSlideShow.prototype.imageLoaded = function ()
{
    this.invokeEvent("onImageChanged", this, this.ExecutingItem)
    var cOpacity = this.getOpac(this.TargetImageId);
    if ( cOpacity < 100 )
        this.blendInImage( cOpacity, this.FadeSpeed/100 );
        
    this.ensureCached( this.PrefetchIndex );
}

vmSlideShow.prototype.ensureCached = function( index ) 
{
    if (index < 0 || index >= this.Images.length )
        return;
        
    var checkedImage = this.Images[index];
    if ( null == checkedImage.Cached )
    {
        // The image is not cached, get the image from server
        checkedImage.Cached = new Image();
        checkedImage.Cached.src = eval(this.UrlTemplateCache);
	    checkedImage.Cached.onload	= sinkObjectToEvent ( this , "cacheLoaded", checkedImage );
	    checkedImage.Cached.onerror	= sinkObjectToEvent ( this , "cacheError", checkedImage );
	    return false;
    }
    else
        return true;
}

vmSlideShow.prototype.changeOpac = function(opacity, id) 
{
	var object = document.getElementById(id).style; 
	object.opacity = (opacity / 100);
	object.MozOpacity = (opacity / 100);
	object.KhtmlOpacity = (opacity / 100);
	object.filter = "alpha(opacity=" + opacity + ")";
}

vmSlideShow.prototype.getOpac = function(id) 
{
	var object = document.getElementById(id).style; 
	
	if ( object.opacity != null )
	    return (object.opacity * 100);
	else
	    if ( object.MozOpacity != null )
	        return (object.MozOpacity * 100);
	else
	    if (object.KhtmlOpacity != null)
	        return (object.KhtmlOpacity * 100);
    
    return 100;
}

function blendLater(slideShowObj, blendMethod, steps, timerStmp)
{
    return (function(){
        slideShowObj[blendMethod](steps, timerStmp);
    });
}

vmSlideShow.prototype.blendOutImage = function(steps, timerStamp) {
    var i = 12;
    this.changeOpac(steps, this.TargetImageId)
    if (steps > 10) {
        var funcRef = blendLater(this, "blendOutImage", steps - 5, timerStamp);
        setTimeout(funcRef, timerStamp);
    }
    else {
        this.invokeEvent("onImageChanging", this, this.ExecutingItem)
        document.getElementById(this.TargetImageId).src = eval(this.UrlTemplate)
    }
}

vmSlideShow.prototype.blendInImage = function( steps, imageid, timerStamp )
{
    this.changeOpac( steps, this.TargetImageId )
    if (steps <= 100)
    {
        var funcRef = blendLater( this, "blendInImage", steps+5, timerStamp);
        setTimeout(funcRef, timerStamp);
    }
}

vmSlideShow.prototype.changeImageWithFade = function ()
{
	var speed = Math.round(this.FadeSpeed / 100);
    this.blendOutImage(100, speed );
}

vmSlideShow.prototype.cacheLoaded = function (source, imageEntry)
{
    delete imageEntry.Cache;
    imageEntry.Cache = null;
}

vmSlideShow.prototype.cacheError = function (source, imageEntry)
{
    delete imageEntry.Cached;
    imageEntry.Cached = null;
}

vmSlideShow.prototype.next = function () {
    var nextIdex = ( this.CurrentIndex + 1 );
    
    if ( nextIdex > this.Images.length - 1)
        nextIdex = 0;
        
    this.show( nextIdex );

    if (nextIdex + 1 < this.Images.length - 1)
        this.PrefetchIndex = nextIdex + 1 ;
        //this.ensureCached( nextIdex + 1 )
  
    return false;
}

vmSlideShow.prototype.prev = function ()
{
    var prevIdex = (this.CurrentIndex - 1);
    if ( prevIdex < 0 )
        prevIdex = this.Images.length - 1;
    this.show( prevIdex );

    
    if (prevIdex - 1 >= 0 && ( prevIdex - 1 < this.Images.length - 1 ) )
        this.PrefetchIndex = prevIdex - 1 ;
        
    return false;
}

vmSlideShow.prototype.first = function ()
{
    this.show( 0 );
    this.PrefetchIndex = 1 ;
    return false;
}

vmSlideShow.prototype.last = function ()
{
    this.show( this.Images.length-1 );
    this.PrefetchIndex = this.Images.length-2 ;
    return false;
}



