// Change the text paragraph with a value from the database
function ChangeElement(elementID, newValue) {
    var para = document.getElementById(elementID);
    if (para != null)
        para.innerHTML = newValue;
}
function ChangeElementWeb(elementID, newValue) {
    var para = document.getElementById(elementID);
    if (para != null) {

        var s = newValue.split('/');
        para.innerHTML = s[0];
        jQuery('#eventWebsite').attr("href", newValue);
    }
}
function ChangeElementDate(elementID, newValue) {
    var para = document.getElementById(elementID);
    var day = parseFloat(newValue);
    if (day > 99) {
        jQuery("#cntdwn").css({ 'font-size': '400%', 'font-weight': 'bold' })
        para.innerHTML = newValue;
    }

}
function oseCallMethod(apiAddress, methodName, methodParam) {
    // encodeURIComponent

    // Prevent caching by passing in date and time
    var url = apiAddress + methodName + "&" + new Date().getTime().toString() + methodParam;

    try {
        // Dynamically create script with callback to given method
        var script = document.createElement("script");
        script.setAttribute("src", url);
        script.setAttribute("type", "text/javascript");
        document.body.appendChild(script);
    }
    catch (ex) {
        alert('error' + ex);
    }
}

function oseRecentRoutes(data) {

    var routeRecords = data;
    // Parse the data into an object format
    // var routeRecords = jQuery.parseJSON(data);

    if (routeRecords) {
        // Display each route for page
        if (routeRecords.RouteCount > 0) {

            for (var i = 0; i < routeRecords.RouteCount; i++) {
                oseAddRecentRoute(document.getElementById('recentRoutes'), routeRecords.Routes[i]);
            }
        }
    }
}

function GetPromotedRoute() {

    // Display routes with default settings
    oseCallMethod("http://api.onesportevent.com/api/routes/v2/RoutesSvc.aspx?jsonp=", "oseRecentRoutes", "");
}

function oseAddRecentRoute(root, routeRecord) {
    if (root != null) {
        var oDivRE = root.appendChild(document.createElement("div"));
        with (oDivRE) {
            className = "routes_element";
        }
        var oDiv = oDivRE.appendChild(document.createElement("div"));
        with (oDiv) {
            className = "routes_left";
        }
        var oImg = oDiv.appendChild(document.createElement("img"));
        //src = "_inc/images/" + routeRecord.GenericImage;

        with (oImg) {
            src = url_img + '_inc/images/running_icon.jpg';
            alt = "";
            height = "60";
            width = "61";
        }
        var oDiv = oDivRE.appendChild(document.createElement("div"));
        with (oDiv) {
            className = "routes_right";
        }
        var oH3 = oDiv.appendChild(document.createElement("h3"));
        var oText = oH3.appendChild(document.createTextNode(routeRecord.CityName));
        var oP = oDiv.appendChild(document.createElement("p"));
        with (oP) {
            className = "route_des";
        }

        var oText = oP.appendChild(document.createTextNode(routeRecord.RouteDesc));

        var oRankingDiv = oDiv.appendChild(document.createElement("div"));
        with (oRankingDiv) {
            className = "ranking";
        }
        var oDiv = oRankingDiv.appendChild(document.createElement("div"));
        with (oDiv) {
            className = "recentrating";
        }
        var oImg = oDiv.appendChild(document.createElement("img"));
        with (oImg) {
            src = url_img + "_inc/images/rating_h.png";
            alt = "";
            height = "10";
            width = "11";
        }

        // Calculate number of full and number of half images
        var full = Math.floor(routeRecord.ScenicRating / 2);
        var half = routeRecord.ScenicRating % 2;
        var off = 5 - full - half;

        // Add full ratings
        for (var i = 0; i < full; i++) {

            var oImg = oDiv.appendChild(document.createElement("img"));

            with (oImg) {
                src = url_img + "_inc/images/rating_on.png";
                alt = "";
                height = "10";
                width = "10";
            }

        }

        // Add a half rating if there is one
        if (half === 1) {

            var oImg = oDiv.appendChild(document.createElement("img"));
            with (oImg) {
                src = url_img + "_inc/images/rating_half.png";
                alt = "";
                height = "10";
                width = "10";
            }
        }

        // Add any remaining ratings as empty
        for (var i = 0; i < off; i++) {

            var oImg = oDiv.appendChild(document.createElement("img"));

            with (oImg) {
                src = url_img + "_inc/images/rating_off.png";
                alt = "";
                height = "10";
                width = "10";
            }
        }

        /* Later - comments & number of workouts
        var oDiv = oRankingDiv.appendChild(document.createElement("div"));
        with (oDiv) {
        className = "num_rating";
        }
        var oUl = oDiv.appendChild(document.createElement("ul"));
            
            
        var oLi = oUl.appendChild(document.createElement("li"));
        with (oLi) {
        className = "pickup_rating";
        }
        var oA = oLi.appendChild(document.createElement("a"));
        with (oA) {
        href = "#";
        title = "Workouts";
        }

        var oText = oA.appendChild(document.createTextNode("Workouts"));
            


        var oLi = oUl.appendChild(document.createElement("li"));
        with (oLi) {
        className = "number";
        }
        var oSpan = oLi.appendChild(document.createElement("span"));
        var oText = oSpan.appendChild(document.createTextNode(routeRecord.TimesUsed));
        */

        root.appendChild(document.createElement("hr"));
    }

}

// Change the text paragraph with a value from the database
function osePromotedEvent(data) {

    createEventHTML(document.getElementById('coolEvent'), data);

    //    // Parse the data into an object format
    //    var eventRecord = data;

    //    // Here is where we will display the data on the page
    //    // TODO: change to write in appropriate spot
    //    ChangeElement('eventName', eventRecord.EventName);
    //    ChangeElement('subTitle', eventRecord.EventSubTitle);
    //    ChangeElement('eventDate', eventRecord.DateRanges);
    //    ChangeElement('promoText', eventRecord.Promo);
    //    ChangeElement('cntdwn', eventRecord.DaysToEvent);
    //    ChangeElementWeb('eventWebsite', "www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID);

    //    createEventHTML(data);
}




function GetPromotedEvent() {

    // Display routes with default settings
    oseCallMethod("http://api.onesportevent.com/api/event/v5/EventSvc.aspx?jsonp=", "osePromotedEvent", "&eventID=3943");

}

//<span class="st_facebook_large"></span>
//<span class="st_twitter_large"></span>
//<span class="st_myspace_large"></span>
//<span class="st_email_large" ></span>

//<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
//<script type="text/javascript">
//        stLight.publisher="12345";
//</script>

//<span class="st_twitter_large" displayText="Tweet"></span><span class="st_facebook_large" displayText="Facebook"></span><span class="st_ybuzz_large" displayText="Yahoo! Buzz"></span><span class="st_gbuzz_large" displayText="Google Buzz"></span><span class="st_email_large" displayText="Email"></span><span class="st_sharethis_large" displayText="ShareThis"></span>
//<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script><script type="text/javascript">stLight.options({publisher:'f86c9218-2cc9-41bb-959e-adabb1d6d188'});</script>


function createEventHTML(root, eventRecord) {

    var oEventContent = root.appendChild(document.createElement("div"));

    with (oEventContent) {
        className = "event_content";
    }


    //	var oScript=oDiv.appendChild(document.createElement("script"));
    //	with(oScript){
    //		type="text/javascript";
    //	}
    //	var oText = oScript.appendChild (document.createTextNode("
    //jQuery(document).ready(function(){
    //GetPromotedEvent();
    //});
    //"));


    var oDiv = oEventContent.appendChild(document.createElement("div"));
    with (oDiv) {
        className = "event_left";
    }
    var oSpan = oDiv.appendChild(document.createElement("span"));
    with (oSpan) {
        id = "cntdwn";
        style.backgroundColor = "transparent";
        style.color = "black";
    }

    if (eventRecord.DaysToEvent > 99 ) {
        oSpan.style.fontSize = '400%';
        oSpan.style.fontWeight = 'bold';
    }

    var oText = oSpan.appendChild(document.createTextNode(eventRecord.DaysToEvent));

    var oDiv = oEventContent.appendChild(document.createElement("div"));
    with (oDiv) {
        className = "event_right";
    }

    var oA = oDiv.appendChild(document.createElement("a"));
    with (oA) {
        id = "eventWebsite";
        href = "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID;
        className = "readmore";
    }
    
    var oH2 = oA.appendChild(document.createElement("h2"));
    with (oH2) {
        id = "eventName";
        className = "event_title";
    }
    var oText = oH2.appendChild(document.createTextNode(eventRecord.EventName));
    var oP = oDiv.appendChild(document.createElement("p"));
    with (oP) {
        id = "subTitle";
    }
    var oText = oP.appendChild(document.createTextNode(eventRecord.EventSubTitle));
    var oP = oDiv.appendChild(document.createElement("p"));
    with (oP) {
        id = "eventDate";
        className = "day_event";
    }
    var oText = oP.appendChild(document.createTextNode(eventRecord.DateRanges));
    var oDiv = oEventContent.appendChild(document.createElement("div"));
    with (oDiv) {
        id = "recentevents";
    }

    var oP = root.appendChild(document.createElement("p"));
    var oSpan = oP.appendChild(document.createElement("span"));
    with (oSpan) {
        id = "promoText";
    }
    var oText = oSpan.appendChild(document.createTextNode(eventRecord.Promo));

    var oShareDiv = root.appendChild(document.createElement("div"));
    with (oShareDiv) {
        id = "shareevent";
        style.marginTop = "10px";
    }

    addShareItem(oShareDiv, "st_twitter_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "Tweet" );
    addShareItem(oShareDiv, "st_facebook_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "Facebook");
    addShareItem(oShareDiv, "st_ybuzz_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "Yahoo! Buzz");
    addShareItem(oShareDiv, "st_gbuzz_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "Google Buzz");
    addShareItem(oShareDiv, "st_email_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "Email");
    addShareItem(oShareDiv, "st_sharethis_large", "http://www.onesportevent.com/detail.aspx?eventid=" + eventRecord.EventID, eventRecord.eventName, "ShareThis");
  

   //<span class="st_sharethis" st_url="http://sharethis.com" st_title="Sharing Rocks!" displayText="ShareThis"></span>
    //<span class="st_twitter_large" displayText="Tweet"></span><span class="st_facebook_large" displayText="Facebook"></span><span class="st_ybuzz_large" displayText="Yahoo! Buzz"></span>
    //<span class="st_gbuzz_large" displayText="Google Buzz"></span><span class="st_email_large" displayText="Email"></span><span class="st_sharethis_large" displayText="ShareThis"></span>

    
}

function addShareItem( shareDiv, shareClass, shareUrl, shareTitle, shareText )
{
    var oSpan = shareDiv.appendChild(document.createElement("span"));
    with (oSpan) {
        className = shareClass;
    }

    oSpan.setAttribute("st_url", shareUrl);
    oSpan.setAttribute("st_title", shareTitle);
    oSpan.setAttribute("displayText", shareText);
}