source: tmcsimulator/trunk/webapps/einotebook/roles/roles.js @ 540

// global variable: The user selected role to be displayed
var selectedRole = "TELEPHONE CONVERSATION"; // default value

/**
 * Holds references to the events and incidents.
 */
function Roles()
{
        Roles.events = null;
        Roles.incidents = null;
}

/**
 * Change which role to display on this page.
 * Invoked by "onchange" in SELECT box.
 */
function changeRole()
{
    // Assign the user's choice to a global variable
    selectedRole = document.getElementById("desiredRole").value;
    displayRolesPage();
}

/**
 * Scrolls to the last event executed based on time.
 */
function jumpToLastExecutedEvent()
{       
        var lastEventArray = Roles.events.getLastExecutedEvent(readCookie("time"));

        // IF a current event exists THEN
        if (lastEventArray != null)
        {
        // Move window focus to first event of the current ones
        var last = lastEventArray.length - 1;
            lastEventArray[last].focus();
        }
        else
        {
                alert("No events have been executed yet.");
        }
}

/**
 * Finds the Event that was last executed by based on time and highlights it.
 * Removes highlighting from old events.
 * @return
 */
function highlightLatestEvent() 
{
    Roles.events.setEmphasis();  // Set text colors on all events

    var currentEventArray = Roles.events.getLastExecutedEvent(readCookie("time"));
        /* highlight the items in the current event array */
    for (var i=0; i<currentEventArray.length; i++) 
    {
                currentEventArray[i].highlight();
        }

    // Set timer to do this again in one second
        setTimeout("highlightLatestEvent()", 1000);
}

/**
 * Inital load of the the roles tab for the given document.
 */
function loadRoles(theEvents, theIncidents)
{
        Roles.incidents = theIncidents;
        Roles.events = theEvents;
        Roles.events.win = document.getElementById("view").contentWindow;
        Roles.events.doc = getDocumentFromFrame('view');
    // reset SELECT box to default value
    document.getElementById("desiredRole").value = "TELEPHONE CONVERSATION";
    displayRolesPage();
}

/**
 * Display the events of the selected type on the page.
 * Uses global variable: selectedRole
 */
function displayRolesPage()
{
        var html = "";
        
        // FOR each Event
        for (var i = 0; i < Roles.events.length; i++)
        {
        // Consider each property of this event
        for (var j = 0; j < Roles.events[i].properties.properties.length; j++)
        {
            // If it matches the currently selected role
            if (Roles.events[i].properties.properties[j].type == selectedRole)
            {
                    // add the Event's html
                    html += "<table class='event'>";
                    html += Roles.events[i].get_html_headerRow();
                    html += "<tr>" + 
                       "<td class='eventData' style='background-color:" + Roles.events[i].incident.color + "' id='" +
                       Roles.events[i].dataID + "'>" + 
                       Roles.events[i].properties.properties[j].html() + 
                       "</td>" +
                       "</tr>";
                    html += "</table>";
            }
        }
        }
        
        // display events in iframe
        getDocumentFromFrame('view').body.innerHTML = html;     
   
        // resize iframe to appropriate height
        resizeIframe();
        window.onresize = resizeIframe;
        
        Roles.events.win.scrollTo(0, readCookie('scriptScrollY'));
        
        highlightLatestEvent();

}
/**
 * @param id The id of the frame element.
 * @return The document of the frame element.
 */
function getDocumentFromFrame(id)
{
    var frame=document.getElementById(id);
    var doc=(frame.contentWindow || frame.contentDocument);
    
    if (doc.document)doc=doc.document;
    
    return doc;
}

/**
 * Finds the height of an element relative to the BODY tag.
 * @param elem The element to find the height of.
 * @return The y-coordinate of the given element relative to the BODY tag.
 */
function pageY(elem) 
{
    return elem.offsetParent ? (elem.offsetTop + pageY(elem.offsetParent)) : elem.offsetTop;
}

/**
 * Resizes the view for the events so that the view's height is at the bottom of its
 * container.
 */
function resizeIframe() 
{
    var height = document.documentElement.clientHeight;
    height -= pageY(document.getElementById('view'));
    height = (height < 0) ? 0 : height - 10;
    document.getElementById('view').style.height = height + 'px';
}

/**
 * Highlights the text of an input text element after a small delay.
 * This method was made because using the code "onFocus='this.focus()'" did not work.
 * @pre textField must have an 'id' attribute
 * @param textField An input text element.
 */
function highlightTextField(textField)
{
        setTimeout("document.getElementById('" + textField.id + "').select();", 100);
}

/**
 * Formats a two digit textbox. If the text box contains only one digit, then a zero
 * is appended to the front.
 * @param textField An input text element.
 */
function formatTimeTextfield(textField)
{
        // IF the text field contains 1 digits THEN
        if (textField.value.length == 1)
        {
                textField.value = "0".concat(textField.value);
        }
}

/**
 * Scrolls to the event latest executed event if the current simulation time was given
 * by text fields 'timeTextSeconds', 'timeTextMinutes', 'timeTextHours'.
 */
function jumpToTime()
{
        var seconds = parseInt(document.getElementById('timeTextSeconds').value, 10);
        var minutes = parseInt(document.getElementById('timeTextMinutes').value, 10);
        var hours = parseInt(document.getElementById('timeTextHours').value, 10);

        var lastEvent = Roles.events.getLastExecutedEvent(new Time(hours, minutes, seconds).getSeconds());

        // IF an event was executed THEN
        if (lastEvent != null)
        {
                lastEvent.focus();
        }
}

/**
 * Collapses the elements based on the value of the dropdownbox with id 'domain'.
 */
function collapse()
{
        var selection = document.getElementById('domain');
        var selectedIndex = selection.selectedIndex;
        var selectedValue = selection.options[selectedIndex].value;
        
        eval("Roles.events.collapseAll" + selectedValue + "();");
}

/**
 * Expands the elements based on the value of the dropdownbox with id 'domain'.
 */
function expand()
{
        var selection = document.getElementById('domain');
        var selectedIndex = selection.selectedIndex;
        var selectedValue = selection.options[selectedIndex].value;
        
        eval("Roles.events.expandAll" + selectedValue + "();");
}