function Controller() {

    // ################## Asetukset, säädä näitä #####################
    
    // Kuvakansion hakemistopolku.
    var imageDir = "/webcam/";
    
    
    // ######## Asetukset loppuu. Tästä alaspäin ei tartte mennä. ####


    var playState = 0;
    var currentFrame = 0;
    var images = new Array();
    var imageId = "monitor";
	var loadedImages = 0;
	
    this.loadImages = loadImages;
    this.displayImage = displayImage;
    this.init = init;
    this.play = play;
    this.playFrame = playFrame;
    this.stop = stop;
    this.pause = pause;
    
	// Ladataan.
    document.getElementById("timeline").innerHTML = drawSlider();

	
    function loadImages(day, hour) {
    
		// Sitten loopataan.
            d = new Date();
		for (i = 0; i < 60; i++) {
            images[i] = document.createElement("img");//new Image(704, 576);
            images[i].onload = imageLoaded;
            images[i].src = imageDir + "halli"
                            + addLeadingZeros(hour)
                            + addLeadingZeros(i)
                            + ".jpg?rand="
                            + d.getTime();
			loadedImages++;
        }

    }

	function imageLoaded() {

		loadedImages--;
		
		if (loadedImages == 1) {
			document.getElementById("loading").style.visibility = "hidden";
			document.getElementById("imageArea").style.visibility = "visible";
		}
	
	}
	
    function displayImage(minute) {
        
        if (minute < 0 || minute >= 60) {
            return false;
        }
        
        obj = document.getElementById(imageId);
        
        if (obj == null) {
            return false;
        }
		
		if (typeof(images[minute]) != "object") {
			return false;
		}
		
        
        obj.src = images[minute].src;
        
    }
    
    function init() {
        
        var day = 0;

        obj = document.getElementById("hour");        
        var hour = obj[obj.selectedIndex].value;
       		
        document.getElementById("loading").style.visibility = "visible";
        document.getElementById("imageArea").style.visibility = "hidden";
        loadImages(day, hour);
        displayImage(0);
    
    }
    
    function play() {
        playState = 1;
        playFrame();
    }
    
    function stop() {
        playState = 0;
        currentFrame = 0;
    }
    
    function pause() {
        playState = 0;
    }
    
    /**
     * Näyttää framen ja kutsuu itseään uudelleen.
     */
    function playFrame() {
    
        if (playState == 0) {
            return false;
        }
    
        if (currentFrame == 60) {
            currentFrame = 0;
        }
        
        displayImage(currentFrame);
        
        currentFrame++;
        
        setTimeout("controller.playFrame()", 100);
    
    }
    
    function drawSlider() {
        var output = "";

		output += "<div style=\"float: left; "
						+ "width: 10px; "
						+ "height: 25px;\">";
		output += "</div>";
        
        for (i = 0; i < 60; i++) {
            output += "<div style=\"float: left; "
                            + "width: 6px; "
                            + "height: 25px; "
                            + "/*background-color: rgb("+(i*2+80)+",*/"
                                        +(i*2+80)+", "
                                        +(i*2+80)+")\" "
                            + "onMouseOver=\"controller.displayImage("+i+")\">";
            output += "</div>";
        }
        return output;
    }
    
    
    /**
     * Lisää numeroon etunollan tarvittaessa.
     */
    function addLeadingZeros(number) {
        if (number < 10) {
            return "0" + number;
        } else {
            return number;
        }
    }

}



var controller = new Controller();