﻿
function Photo(src) {
    this.src = src;
}

function VirtualTour(container) {
    this.vt1 = document.getElementById('vt1');
    this.vt2 = document.getElementById('vt2');
    this.vt3 = document.getElementById('vt3');    
    this.width = 0;
    this.vtleft = 0;
    this.polarity = 1;
    this.delay = 15;
    this.ppi = 1;
    this.interval = null;
    
    var self = this;
    container.onmousemove = function(event) { self.mouseEvent(event); };
}
VirtualTour.prototype.scroll = function() {
    this.vt1.style.left = this.vtleft + 'px';
    this.vt2.style.left = (this.vtleft + (this.width * (this.polarity * -1))) + 'px';
    this.vt3.style.left = (this.vtleft + (this.width * this.polarity)) + 'px';
    this.vtleft += this.polarity * this.ppi;
    if(this.vtleft <= (this.width * -1) || this.vtleft >= this.width)
        this.vtleft = 0;
}
VirtualTour.prototype.stop = function() {
    clearInterval(this.interval);
}
VirtualTour.prototype.loadHandler = function() {
    this.width = this.vt1.width;
    this.vtleft = 0;
    this.polarity = 1;
    this.ppi = 1;
    
    var self = this;
    this.interval = setInterval(function() { self.scroll(); },this.delay);
}
VirtualTour.prototype.start = function(src) {
    var self = this;
    this.vt1.onload = function() { self.loadHandler(); }
    this.vt3.src = this.vt2.src = this.vt1.src = src;
}
VirtualTour.prototype.mouseEvent = function(event) {
    var e;
    if(window.event)
        e = window.event;
    else
        e = event;
    var pos = Math.ceil(e.clientX - (screen.width / 2));
    this.ppi = Math.round((Math.abs(pos) / 180) * (Math.abs(pos) / 180));
    if(pos < -100)
        this.polarity = 1;
    if(pos > 100)
        this.polarity = -1;
}
function VirtualTourGallery(images, index) {
    this.index = index;
    this.images = images;
	this.loadr			= $('loadLayer');
	this.container      = $('vtContainer');
	this.status 		= $('status');
    this.preLoad        = new Image();
    this.nextLoad       = new Image();
    this.vt             = new VirtualTour(this.container);
}
VirtualTourGallery.prototype.curImage = function() {
    return this.images[this.index];
}
VirtualTourGallery.prototype.next = function() {
    this.index = this.index + 1 == this.images.length ? 0 : this.index + 1;
    this.load();
}
VirtualTourGallery.prototype.prev = function() {
    this.index = this.index - 1 <= -1 ? this.images.length - 1 : this.index - 1;
    this.load();
}
VirtualTourGallery.prototype.load = function() {
	this.loadr.style.display = 'block';
    var self = this;
	this.preLoad.src = this.curImage().src;
	this.preLoad.onload = function() { self.display(); };
}
VirtualTourGallery.prototype.display = function() {
    var windowWidth = this.windowWidth();
    var w = (this.preLoad.width - 120) > (windowWidth - 120) ? (windowWidth - 120) : (this.preLoad.width - 120);
    
    this.container.style.width = w + 'px';
    this.container.style.height = this.preLoad.height + 'px';

    this.nextLoad.src = this.images[this.index].src;
    this.status.className = '';
    this.status.innerHTML = ((this.index + 1) + ' / ' + this.images.length);

	this.loadr.style.display = 'none';
	
    this.vt.stop();
    this.vt.start(this.preLoad.src);
}
VirtualTourGallery.prototype.windowWidth = function() {
    if(window.innerWidth)
        return window.innerWidth;
    else if (document.all)
        return document.body.clientWidth;
    else
		return 800;
}