var infoBox = null;
infoBoxRec = { 'top': 0, 'bootom': 0, 'left': 0, 'right': 0 };
bKeepInfoBox = false;
bInfoBoxPoppedUp = false;
var vg = 'http://www.vg.no';
var link = '<br /><br /><a href="#" onclick="javascript:window.open(\'' + vg + '\',\'_blank\');">mer informasjon fra P4 Trafikkinfo...</a>';

var popupTimerId = null;
var hideInfoBoxTimerId = null;


function initTrafficAnnotation() {
    Event.observe('map', 'annotation:mouseIn', function(e) { onMouseInTrafficAnnontation(e.memo.annotation) }); //Trigger when mouse on TrafficInfo annotation
    Event.observe('map', 'annotation:mouseOut', function(e) { onMouseOutTrafficAnnotation(e) });
    Event.observe('map', 'map:mouseMoved', function(e) { onMapMouseMoved(e.memo.mouseCoords); });
}


//Show TrafficInfo Details. Delay a little bit and then show traffic-info popup box
function onMouseInTrafficAnnontation(an) {
    if ((an.title == '' || an.title == null) && (an.description == '' || an.description == null)) return;
    if (an.title == 'test' && an.description == 'test') return;
    //Clear old popup if any
    if (popupTimerId != null) clearTimeout(popupTimerId);
    if (hideInfoBoxTimerId != null); clearTimeout(hideInfoBoxTimerId);
    infoBox.style.display = 'none';
    infoBox.innerHTML = '';
    bKeepInfoBox = false;
    bInfoBoxPoppedUp = false;
    //Prepare new popup, delayed 600 ms
    annotation = an; //Parametertransfere to doShowInfoBox
    popupTimerId = setTimeout("doShowTrafficInfoDetails()", 600);
}

//Show traffic info, with link to more info (P4)
function doShowTrafficInfoDetails() {
    infoBox.style.display = 'block';
    infoBox.innerHTML = annotation.title + '<br/><br/><br/>' + annotation.description; //produksjon
    pointersize = 35;
    var m = $('map')
    var top = annotation.y;  //+ offset[1];
    var left = annotation.x;  //+ offset[0];
    infoBoxRec = infoBox.getBoundingClientRect();
    if (top + (infoBoxRec.bottom - infoBoxRec.top) > map.getHeight()) {
        top = map.getHeight() - (infoBoxRec.bottom - infoBoxRec.top);
    }
    if (top < 0) top = 0;
    infoBox.style.top = top + 'px';
    //Infobox beneath bottom of map?
    if ((left + (infoBoxRec.right - infoBoxRec.left) + pointersize) <= map.getWidth()) {
        left = left + pointersize;
    }
    else {
        left = left - 0 - (infoBoxRec.right - infoBoxRec.left);   //+'px';
    }
    infoBox.style.left = left + 'px';

    infoBoxRec = infoBox.getBoundingClientRect();
    bInfoBoxPoppedUp = true;
}

//Hide traffic-info box Stop timeer that will poppup traffic-info. If allready popped up, delay hiding it so that user can move the mouse into box
function onMouseOutTrafficAnnotation(e) {
    if (bInfoBoxPoppedUp == false) {
        doHideInfoBox();
    }
    else {
        hideInfoBoxTimerId = setTimeout("doHideInfoBox()", 700);
        return;
    }
}
function doHideInfoBox() {
    if (bKeepInfoBox != true) {
        clearTimeout(popupTimerId);
        infoBox.style.display = 'none';
        infoBox.innerHTML = '';
        bKeepInfoBox = false;
        bInfoBoxPoppedUp = false;
    }
}
//If infobox is popped up, hide it as soon as mouse is ouside infobox
function onMapMouseMoved(e) {
    if (bKeepInfoBox == true) {
        if (!(e.x > (infoBoxRec.left - 0) && e.x < (infoBoxRec.right + 0) && e.y > (infoBoxRec.top - 0) && e.y < (infoBoxRec.bottom + 0))) {
            bKeepInfoBox = false;
            bInfoBoxPoppedUp = false;
            infoBox.style.display = 'none';
            infoBox.innerHTML = '';
        }
    }

}
//Mouse is inside TrafficInfoBox: Keep infobox alive
function onMouseOverInfoBox() {
    bKeepInfoBox = true;
    bInfoBoxPoppedUp = true;
}