﻿var v_head = document.getElementById("Head");
$(v_head).append("<link href='/Portals/1/ImageScroller/ImageScroller.css' rel='stylesheet' type='text/css' />");

var img_list = new Array();

var n_img = null;
var rotation_started = false;

var clip_width = 250;
var clip_height = 500;

var c_clip = 0;
var v_clip = 5;

var pause_duration = 1500;

var current_img = null;
var next_img = null;

var i_index = 0;
var i_index2 = 1;

var t_url = "";

function load_image(image_url)
{
    //alert("load");
    n_img = new Image();
    n_img.src = image_url;
    t_url = image_url;
    setTimeout("check_image()",500);
}
function check_image()
{
    //alert("check");
    if (!n_img.complete)
    {
        setTimeout("check_image()", 500);
        return;
    }
    // Image is loaded, add it to the image list.
    
    setTimeout("build_preload()", 50);

    var t_width = n_img.width;
    var t_height = n_img.height;

    if (isNaN(t_width) || (t_width == 0))
    {
        t_width = n_img.offsetWidth;
        t_height = n_img.offsetHeight;
    }
    if (isNaN(t_width) || (t_width == 0))
    {
        t_width = n_img.clientWidth;
        t_height = n_img.clientHeight;
    }

    if ((t_width > clip_width)||(t_height > clip_height))
    {
        var s_scaleX = clip_width / t_width;
        var s_scaleY = clip_height / t_height;

        var s_scale = 1.0;

        if (s_scaleX > s_scaleY)
            s_scale = s_scaleY;
        else
            s_scale = s_scaleX;

        var n_width = Math.round(t_width * s_scale);
        var n_height = Math.round(t_height * s_scale);
        var p_img = new Image(n_width, n_height);
        p_img.src = t_url;
        n_img = p_img;
    }
    img_list.push(n_img);
    // Push the first 2 images into place.
    if (img_list.length == 1)
    {
        current_img = img_list[0];
        $('#ImageScroll1').html(img_list[0]);
    }
    else if (img_list.length == 2)
    {
        next_img = img_list[1];
        $('#ImageScroll2').html(img_list[1]);
    }
    // initiate rotation upon loading image #2.
    if (!rotation_started && (img_list.length > 1))
    {
        rotation_started = true;
        init_rotation();
    }
    
}
function build_preload()
{
    var t_item = null;
    //alert(load_list.length);
    if (load_list.length >= 1)
    {
        t_item = load_list[load_list.length - 1];
        
        if (t_item == "")
        {
            load_list.pop();
            if (load_list.length >= 1)
                t_item = load_list[load_list.length - 1];
            else
                return;
        }
        load_image(t_item);
        load_list.pop();
    }
}
function init_rotation()
{
    shiftLeft();
}
function shiftLeft()
{
    c_clip += v_clip;
    var wait_time = 15;
    var change = false;
    var sign = "-";
    if (c_clip > clip_width)
    {
        c_clip = 0;
        sign = "";
        wait_time = pause_duration;
        change = true;
        i_index += 1;
        i_index2 += 1;
        if (i_index >= img_list.length)
            i_index = 0;
        if (i_index2 >= img_list.length)
            i_index2 = 0;
        current_img = next_img;
        next_img = img_list[i_index2];
    }
    $('#ImageScroll1').attr("style", "margin-left: " + sign + c_clip + "px");
    if (change)
    {
        $('#ImageScroll1').html(current_img);
        $('#ImageScroll2').html(next_img);
    }
    setTimeout("shiftLeft()",wait_time);
}
build_preload();
