﻿// JScript File
function TimeSetting(startTime, endTime, currentTime, resolution, inUse) {
    if (startTime != null) this.startTime = startTime;
    if (endTime != null) this.endTime = endTime;
    if (currentTime != null) this.currentTime = currentTime;
    if (resolution != null) this.resolution = resolution;
    if (inUse != null) this.inUse = inUse;
}

TimeSetting.prototype.startTime = new Date(new Date().getTime() - 1000*3600*24);
TimeSetting.prototype.endTime = new Date();
TimeSetting.prototype.currentTime = endTime;
TimeSetting.prototype.resolution = 3600;
TimeSetting.prototype.inUse = false;

TimeSetting.prototype.update = function(startTime, endTime, currentTime, resolution, inUse) {
    if (startTime != null) this.startTime = startTime;
    if (endTime != null) this.endTime = endTime;
    if (currentTime != null) this.currentTime = currentTime;
    if (resolution != null) this.resolution = resolution;
    if (inUse != null) {
        this.inUse = inUse;
    } else {
        this.inUse = false;
    }
}

TimeSetting.prototype.clear = function() {
    this.startTime = null;
    this.endTime = null;
    this.currentTime = null;
    this.resolution = null;
    this.inUse = false;
}
    var startTime;
    var endTime;
    var ontimechange = function() {};
    
    function dateToMyString(date) {
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        if (month < 10)
            month = '0' + month;
        var day = date.getDate();
        if (day < 10)
            day = '0' + day;
        var hour = date.getHours();
        var amOrPm = 'AM';
        if (hour > 12) {
            hour -= 12;
            amOrPm = 'PM';
        }
        if (hour < 10)
            hour = '0' + hour;
        var minute = date.getMinutes();
        if (minute < 10)
            minute = '0' + minute;
        var second = date.getSeconds();
        if (second < 10)
            second = '0' + second;
        return month + '/'
            + day + '/'
            + year + ' '
            + hour + ':'
            + minute + ':'
            + second + ' '
            + amOrPm;    
    }
    
    function getTimeBounds() {
        startTime = Date.parse(document.getElementById(startTime1ID).value
            + ' '
            + document.getElementById(startTime2ID).value);
        endTime = Date.parse(document.getElementById(endTime1ID).value
            + ' '
            + document.getElementById(endTime2ID).value);
        if (endTime <= startTime) {
            //alert("End time has to be later than start time!");
            return false;
        }
        return true;
    }

    function setTimeBounds() {
        var dateStr = dateToMyString(startTime);
        var dateStr1 = dateStr.substring(0, dateStr.indexOf(' '));
        var dateStr2 = dateStr.substring(dateStr.indexOf(' ') + 1, dateStr.length);
        document.getElementById(startTime1ID).value = dateStr1;
        document.getElementById(startTime2ID).value = dateStr2;
        
        dateStr = dateToMyString(endTime);
        dateStr1 = dateStr.substring(0, dateStr.indexOf(' '));
        dateStr2 = dateStr.substring(dateStr.indexOf(' ') + 1, dateStr.length);
        document.getElementById(endTime1ID).value = dateStr1;
        document.getElementById(endTime2ID).value = dateStr2;
    }

    function setResolution(resolution) {
        var unitEl = document.getElementById(resolutionUnitID);
        for (var i = unitEl.options.length - 1; i -- ; i >= 0) {
            var temp = resolution / unitEl.options[i].value;
            if (parseInt(temp) == temp) {
                document.getElementById(resolutionID).value = temp;
                unitEl.selectedIndex = i;
                break;
            }
        }
    }
    
    function addOntimechangeEvent(func){
        if (!ontimechange || ontimechange == null) {
            ontimechange = func;
        } else {
            var old = ontimechange;
            ontimechange = function(startTime, endTime, currentTime, resolutionInMs) {
                old(startTime, endTime, currentTime, resolutionInMs);
                func(startTime, endTime, currentTime, resolutionInMs);
            }
        }
    }   
    
    var dragging = false;
    var xOffset = 0;
    var yOffset = 0;
    var oldCursor;
    var oldOnmousemove;
    var oldOnmouseup;
    var minLeft;
    var dragTarget;
    var boundingBox;
    var maxLeft = 395;
    var minLeft = 5;
    var currentValue = 0.5;
    var dragTime;

    function newValue(value, signalEvent) {
        if (!getTimeBounds()) return;
        currentValue = value;
        var unitEl = document.getElementById(resolutionUnitID);
        var resolutionInMs = document.getElementById(resolutionID).value
            * unitEl.options[unitEl.selectedIndex].value
            * 1000;
        var currentTime = new Date(
            startTime
            + Math.round((endTime - startTime) * value / resolutionInMs) * resolutionInMs);
        
        document.getElementById('currentTime').innerHTML = dateToMyString(currentTime);
        if (signalEvent) {
            TimePanel.timeSetting.update(new Date(startTime), new Date(endTime), currentTime, resolutionInMs/1000, true);
            TimePanel.onChange(TimePanel.timeSetting);
        }
    }
    
    function startDrag(e) {
        if (!e) e = window.event;
        if (!dragging) {
            oldCursor = dragTarget.style.cursor;
            xOffset = e.clientX - dragTarget.offsetLeft;
            yOffset = e.clientY - dragTarget.offsetTop;
            oldOnmousemove = document.onmousemove;
            document.onmousemove = drag;
            oldOnmouseup = document.onmouseup;
            document.onmouseup = dragDone;
            dragTime = new Date().getTime();
            dragging = true;
        }
        return false;
    }
    
    function drag(e) {
        if (!e) e = window.event;
        if (dragging) {
        	var temp = e.clientX - xOffset;
        	temp = maxLeft == undefined ? temp : Math.min(temp, maxLeft);
        	temp = minLeft == undefined ? temp : Math.max(temp, minLeft);
            dragTarget.style.left = temp + 'px';
            if (new Date().getTime() - dragTime > 100) {
                var value = (dragTarget.offsetLeft - minLeft) * 1.0 / (maxLeft - minLeft);
                newValue(value, false);
                dragTime = new Date().getTime();
            }
        }
        return false;
    }
    function dragDone(e) {
        if (!e) e = window.event;
        if (dragging) {
            dragging = false;
            dragTarget.style.cursor = oldCursor;
            document.onmousemove = oldOnmousemove;
            document.onmouseup = oldOnmouseup;
            var value = (dragTarget.offsetLeft - minLeft) * 1.0 / (maxLeft - minLeft);
            newValue(value, true);
        }
        return false;
    }
    
    function initTimePanel() {
    }

var TimePanel = {
    timeSetting: null
    , timerId: null
    , isNextDone: null
    , isTimeOut: null
    , isTimerOn: false
    , onChange: function() {
    }
    , init: function(timeSetting) {
        TimePanel.timeSetting = timeSetting;
        if (TimePanel.timeSetting.inUse) {
            startTime = TimePanel.timeSetting.startTime;
            endTime = TimePanel.timeSetting.endTime;
            setTimeBounds();
            setResolution(TimePanel.timeSetting.resolution);
        }

        document.getElementById('timePanel').style.display = 'none';
        if (window.addEventListener)
            document.getElementById('sliderBackground').style.top = '13px';
        else 
            document.getElementById('sliderBackground').style.top = '-4px';
        dragTarget = document.getElementById('sliderControl');
        boundingBox = document.getElementById('sliderBackground');
        dragTarget.onmousedown = startDrag;
    }
    , close: function() {
        TimePanel.pause();
        document.getElementById('timePanel').style.display = 'none';
        TimePanel.timeSetting.inUse = false;
        //TimePanel.onChange(TimePanel.timeSetting);
    }
    , open: function() {
        TimePanel.timeSetting.inUse = true;
        //TimePanel.onChange(TimePanel.timeSetting);
        newValue(currentValue, true);
        document.getElementById('timePanel').style.display = 'block';
        //newValue(currentValue, true);
    }

    , addEventListener: function(func) {
        if (TimePanel.onChange == null) {
            TimePanel.onChange = func;
        } else {
            var old = TimePanel.onChange;
            TimePanel.onChange = function() {
                old(TimePanel.timeSetting);
                func(TimePanel.timeSetting);
            }
        }
    }
    , play: function() {        
        TimePanel.isNextDone = false;
        TimePanel.isTimeOut = false;
        TimePanel.isTimerOn = true;
        TimePanel.next();
        TimePanel.timerId = setTimeout("TimePanel.timeOut()", 1000);
        document.getElementById('play').value = 'Pause';
        document.getElementById('play').onclick = TimePanel.pause;
    }
    , pause: function() {
        document.getElementById('play').value = 'Play';
        document.getElementById('play').onclick = TimePanel.play;
        clearTimeout(TimePanel.timerId);
        TimePanel.isTimerOn = false;
        TimePanel.isTimeOut = false;
        TimePanel.isNextDone = false;
    }
    , timeOut: function() {
        TimePanel.isTimeOut = true;
        if (TimePanel.isNextDone && currentValue < 1)
            TimePanel.play();
    }
    
    , nextDone: function() {
        TimePanel.isNextDone = true;
        if (TimePanel.isTimeOut && currentValue < 1)
            TimePanel.play();
    }
    
    , next: function() {
        //  alert('next');
        var value = currentValue + TimePanel.timeSetting.resolution / ((TimePanel.timeSetting.endTime.getTime()
            - TimePanel.timeSetting.startTime.getTime()) * 1.0 / 1000.0)
        dragTarget.style.left = value * (maxLeft - minLeft) + minLeft + 'px';
        newValue(value, true);
        //TimePanel.nextDone();
    }
}
