/* 
 This file was generated by Dashcode and is covered by the 
 license.txt included in the project.  You may edit this file, 
 however it is recommended to first turn off the Dashcode 
 code generator otherwise the changes will be lost.
 */

// Note: Properties and methods beginning with underbar ("_") are considered private and subject to change in future Dashcode releases.

// Public properties:
//     element: the List's DOM element (read-only)
//     templateRowElement: the List's template row, the element that will be cloned to form the rows of the List
//     dataSource: for dynamic Lists, the dataSource object
//     dataArray: for static Lists, the static list data
//     rows: the current row elements for the list (read-only)
//
// Public Methods:
//     setDataSource(dataSource): set the List to be dynamic, using the given dataSource (will reload the list)
//     setDataArray(array): set the List to be static, using the given data.  The array should be like [[row0Label, row0Value], [row1Label, row1Value], ...].
//     reloadData(): causes the List to reload itself.  Mostly useful for dynamic Lists when you know the data has changed and need the List to show the updated data.
//
// Row objects: (Each instantiated row has an "object" property.  Those objects have the following properties.)
//     rowIndex: the index of the row within the List
//     value: the value of the row (only for static Lists)
//     templateElements: a dictionary mapping original element ids from the template row element to the corresponding clones in this row

function CreateList(elementOrID, spec)
{
    var listElement = elementOrID;
    if (elementOrID.nodeType != Node.ELEMENT_NODE) {
        listElement = document.getElementById(elementOrID);
    }
    
	if (listElement && !listElement.loaded) {
		listElement.loaded = true;
		listElement.object = new List(listElement, spec);
		
		return listElement.object;
	}
}

function List(element, spec)
{
	this.element = element;
	
    try {
        this._listStyle = eval(spec.listStyle);
    } catch (e) {
        this._listStyle = this.EDGE_TO_EDGE;
    }
    this._labelElementId = spec.labelElementId || 'label';
    var dataArray = spec.dataArray || null;
    var dataSourceName = spec.dataSourceName || null;
    
	this._useDataSource = spec.useDataSource || false;
    this._sampleRows = spec.sampleRows || 0;
    
    // When using this part inside a list template row, preserve ids temporarily
    spec.preserveChildIdsWhenCloning = true;
    
    // Find the row template.
    for (var child = element.firstChild; child != null; child = child.nextSibling) {
        if (child.nodeType == Node.ELEMENT_NODE) {
            this.templateRowElement = child;
            break;
        }
    }
    
    // Set up the highlight element
    if (!dashcode.inDesign){
        this._rowHighlight = document.createElement("div");
        this._rowHighlight.style.position = "absolute";
        this._rowHighlight.style.backgroundColor = "rgba(0,0,0,.3)";
        this._rowHighlight.style.right = "0";
        this._rowHighlight.style.left = "0";
        this._rowHighlight.style.top = "0";
        this._rowHighlight.style.bottom = "0";
    }
    
    // determine where to get the data from
    if (this._useDataSource) {
        var dataSource = window[dataSourceName];
        if (dataSource) {
            this.dataSource = dataSource;
        }
    } else if (dataArray) {
        this.dataArray = dataArray;
    }
    
    this.rows = [];
}

// Constants for the list types
List.EDGE_TO_EDGE = 1;
List.ROUNDED_RECTANGLE = 2;

//
// Set the data source object that will insert the data and format each row for dynamic lists.
// dataSource must implement two required callback methods: numberOfRows() and prepareRow(rowElement, rowIndex, templateElements).
// dataSource.numberOfRows() is called while the list is initializing and it should return the total number of rows in the list.
// dataSource.prepareRow() is called once for each row. It is passed 3 parameters:
//     rowElement: The HTML DOM element that represents the row being prepared. Typically an <li> element.
//     rowIndex: The position of the row in the list, starting at 0.
//     templateElements: A JavaScript object that contains a reference to each cloned element that had an ID in the template row. For example, if the template row had an element with id="label", the cloned element can be obtained using templateElements.label. These elements are descendants of rowElement.
//
List.prototype.setDataSource = function(dataSource)
{
    this._useDataSource = true;
    this.dataSource = dataSource;
    this.reloadData();
}

//
// Set the data array to use in static lists.
// dataArray should be an Array of HTML strings and a row will be created for each item. The HTML string will be inserted as the innerHTML of the element with the ID specified in the part spec as labelElementId.
//
List.prototype.setDataArray = function(dataArray)
{
    this._useDataSource = false;
    this.dataArray = dataArray;
    this.reloadData();
}

//
// This function is called by setupParts after all the parts have been set up.  
// We do not initially load our data until all setup is complete.
//
List.prototype.finishLoading = function()
{
    this.reloadData();
}

//
// Reload the data from the data source (for dynamic lists) or from the data array (for static lists).
// The list is regenerated by removing all the rows and cloning the template row. Parts inside each cloned row are also initialized.
//
List.prototype.reloadData = function()
{
    var self = this;
    var templateRow = this.templateRowElement;
	if (!templateRow) return;
    var useTemplateAsRow = dashcode.inDesign;
    
    if (!useTemplateAsRow) {
        templateRow.style.visibility = "hidden";
        templateRow.style.display = "";
    }
    
    // remove all children except for the template row
	var list = this.element;
    var child = list.firstChild;
	var dataSource = this.dataSource;
    
    while (child) {
        var nextChild = child.nextSibling;
        if (child != templateRow) {
            list.removeChild(child);
        }
        child = nextChild;
    }
    this.rows = [];
    
    var cloneAndStyleRow = function(rowIndex, numRows, listStyle) {
        // clone the template DOM node
        var newRowElement = dashcode.cloneTemplateElement(templateRow, useTemplateAsRow && rowIndex == 0);
        // style the new row
        if (newRowElement.style.visibility == "hidden") {
            newRowElement.style.visibility = "visible";
        }
        if (listStyle == List.ROUNDED_RECTANGLE) {
            newRowElement.style.borderTopWidth = rowIndex > 0 ? "1px" : "0px";
        }
        return newRowElement;
    }
    
    var insertRow = function(rowElement, rowIndex, value) {
        // save index and value in row's object
        if (rowElement != templateRow && rowElement.object) {
            rowElement.object.index = rowIndex;
            rowElement.object.value = value;
        }        
        // insert into the DOM
        if (!useTemplateAsRow) {
            list.insertBefore(rowElement, templateRow);
        } else {
            list.appendChild(rowElement);
        }
		
        // handle click events with TouchButtonEventHandler for better user feedback
        if (rowElement.onclick) {
            rowElement.object.buttonEventHandler = dashcode.CreateTouchButtonEventHandler(rowElement,rowElement.onclick);
            rowElement.object.buttonEventHandler.highlightCallback = function(highlight) { self._setHighlight(rowElement,highlight); };
            rowElement.onclick = null;
        }
		
		if( dataSource && dataSource.rowSwiped ){
			rowElement.object.buttonEventHandler.swipeCallback = function(event,xDelta) { return dataSource.rowSwiped(rowElement,event,xDelta); };
		}
		
        self.rows.push(rowElement);
    }
    
    var dataArray = this.dataArray;
    if (this._useDataSource) {
        // using dynamic data from a datasource
        var numRows = dashcode.inDesign ? this._sampleRows : 0;        
        if (dataSource && dataSource.numberOfRows) {
            numRows = dataSource.numberOfRows();
        }
		
        for (var rowIndex=0; rowIndex<numRows; rowIndex++) {
			var newRowElement = cloneAndStyleRow(rowIndex, numRows, this._listStyle);
            
            // hand the new row to the data source to process it and insert the data
            if (dataSource && dataSource.prepareRow) {
                dataSource.prepareRow(newRowElement, rowIndex, newRowElement.object.templateElements);
            }
            
            insertRow(newRowElement, rowIndex);
        }
    } else if(dataArray) {
        // using static data from a data array
        var numRows = this.dataArray.length;
        for (var rowIndex=0; rowIndex<numRows; rowIndex++) {
            var newRowElement = cloneAndStyleRow(rowIndex, numRows, this._listStyle);
            // process the new row to insert the data
            var templateElements = newRowElement.object.templateElements;
            var labelElement = null;
            for (var key in templateElements) {
                // try to find the label element
                if (this._labelElementId && this._labelElementId.length > 0 && key.indexOf(this._labelElementId) == 0) { 
                    labelElement = templateElements[key];
                    break;
                }
            }
            // get the text and value
            var itemLabel = '';
            var itemValue = '';
            if ((dataArray[rowIndex]) instanceof Array) {
                if (dataArray[rowIndex].length > 0) {
                    itemLabel = dataArray[rowIndex][0];
                    if (dataArray[rowIndex].length > 1) {
                        itemValue = dataArray[rowIndex][1];
                    }
                }
            }
            else {
                itemLabel = dataArray[rowIndex];
                itemValue = itemLabel;
            }
            // assign the label and insert it
            if (labelElement) {
                labelElement.innerHTML = itemLabel;
            }
            insertRow(newRowElement, rowIndex, itemValue);
        }
    }
    
    if (!useTemplateAsRow) {
        templateRow.style.display = "none";
    }
    // show the list after the data is loaded
    if (dashcode.inDesign) {
        setTimeout(function() {list.style.display = "block";}, 0);
    } else {
        list.style.display = "block";
    }
    
    // if it is inside a scroll area, notify it of the change
    if (typeof(AppleScrollArea) != "undefined") {
        var scrollElement = list.parentNode;
        while (scrollElement && scrollElement != document) {
            if (scrollElement.object && scrollElement.object.constructor == AppleScrollArea) {
                scrollElement.object.refresh();
                break;
            }
            scrollElement = scrollElement.parentNode;
        }
    }
}

List.prototype._setDataArray = function(dataArray)
{
	this.dataArray = dataArray;
	this.reloadData();
}

List.prototype._setSampleRows = function(numberOfRows)
{
    this._sampleRows = numberOfRows;
    this.reloadData();
}

List.prototype._setUseDataSource = function(useDataSource)
{
    this._useDataSource = useDataSource;
    this.reloadData();
}

List.prototype._setLabelElementId = function(newId)
{
    this._labelElementId = newId;
    this.reloadData();
}

List.prototype._setHighlight = function(rowElement,highlight)
{
	if (highlight) {
        if (this._rowHighlight){
            // Remove from any existing parent
            if (this._rowHighlight.parentNode)
                this._rowHighlight.parentNode.removeChild(this._rowHighlight);            
                
            // Add to parent
            rowElement.appendChild(this._rowHighlight);            
        }
        
	} else {
        if (this._rowHighlight && this._rowHighlight.parentNode){
            this._rowHighlight.parentNode.removeChild(this._rowHighlight);            
        }
	}
}