<!--

var op = 100;
var preloader = new Image();
preloader.onload = next;
var cam = 1;
var big = false;
var busy = false;
var slideshow = true;
var timerId;
var interval = 5;

var img, cont, overlay, loading, wbg, wmap;

img = document.getElementById('webcam');
cont = document.getElementById('spacer');
wbg = document.getElementById('webcambg');
overlay = document.getElementById('overlay');
loading = document.getElementById('loading');
wmap = document.getElementById('wmap');

img.onload = play;
img.onclick = enlargeImage;
overlay.onclick = enlargeImage;


function animate(id, x1, y1, w1, h1, x2, y2, w2, h2, steps, easing, n) {
	
	var overlay = document.getElementById('overlay');
	
	if (!n) n = 1;
	var p = n / steps;
	p = Math.pow(p, easing);
	var x = x1 + parseInt(p * ((x2 - x1)));
	var y = y1 + parseInt(p * ((y2 - y1)));
	var w = w1 + parseInt(p * ((w2 - w1)));
	var h = h1 + parseInt(p * ((h2 - h1)));
	var o = parseInt(p * 80);

	//if (!big) changeOpacity('overlay', o);
	changePosition(wbg, x, y, w, h);
	
	if (n < steps) {
		window.setTimeout('this.animate("' + id + '", ' + x1 + ', ' + y1 + ', ' + w1 + ', ' + h1 + ', ' + x2 + ', ' + y2 + ', ' + w2 + ', ' + h2 + ', ' + steps + ', ' + easing + ', ' + (n + 1) + ')', 1);
	} else {
		if (big) {
			overlay.style.display = 'none';
			changeOpacity('overlay', 0);
			wbg.style.position = 'static';
			
		} else {

		}
		busy = false;
		big = !big;
	}
}

function webcamSwitch(c) {
	if (busy == true) return;
	if (wmap) wmap.style.visibility = 'hidden';
	img.style.visibility = 'visible';
	if (c == 0) {
		slideshow = true;
		interval = 5;
	} else {
		slideshow = false;
		cam = c;
		interval = 15;
	}
	var menu = document.getElementById('webcam_switch');
	var items = menu.getElementsByTagName('li');
	for (n = 0; n <= items.length - 1; n++) {
		//alert(n);
		var item = items[n];
		if (n == c) {
			item.className = 'selected';
		} else {
			item.className = '';
		}
	}
	reloadImage();
}

function play() {
	timerId = setTimeout('reloadImage()', interval * 1000);
}

function next() {
	loading.style.display = 'none';
	img.src = preloader.src;
}

function reloadImage() {
	clearInterval(timerId);
	if (slideshow == true) {
		cam++;
		if (cam > 3) cam = 1;
	}
	var now = new Date();
	loading.style.display = 'block';
	preloader.src = 'http://live.opatija.net/image' + cam + '.jpg?' + now.getTime();
}

function enlargeImage() {

	if (busy == true) return;
	
	changeOpacity('overlay', 80)
	overlay.style.display = 'block';

	var x0 = findPos(cont)[0];
	var y0 = findPos(cont)[1];
	
	x1 = findPos(wbg)[0];
	y1 = findPos(wbg)[1];
	w1 = big ? 640 : 400;
	h1 = big ? 480 : 300;
	
	//x2 = big ? x0 : ((windowSize()[0] / 2) - (640 / 2));
	x2 = big ? x0 : (x0 - 80);
	y2 = big ? y0 : y0;
	w2 = big ? 400 : 640;
	h2 = big ? 300 : 480;
		
	wbg.style.position = 'absolute';
	busy = true;
	speed = 4;
	
	animate('webcambg', x1, y1, w1, h1, x2, y2, w2, h2, speed, 1);

}

function showMap() {
	var menu = document.getElementById('webcam_switch');
	var items = menu.getElementsByTagName('li');
	for (n = 0; n <= items.length - 1; n++) {
		var item = items[n];
		if (n == 4) {
			item.className = 'selected';
		} else {
			item.className = '';
		}
	}
	img.style.visibility = 'hidden';
	wmap.style.visibility = 'visible';
}

window.onresize = function() {
	if (big) {
		wbg.style.left = (findPos(cont)[0] - 80) + 'px';
	}
}


-->
