var SCROLLABLE_GROUPING = 4;
var activeIndex = 0;
var total_carousel = 0;

$(document).ready(function() {
    $(".navButton a").mouseover(
            function() {
                //alert("test");
                $(this).css({ backgroundPosition: '-' + $(this).width() + 'px 0px' });
            }
           );

    $(".navButton a").mouseout(
            function() {
                $(this).css({ backgroundPosition: '0px 0px' });
            }
            );




    $.easing.noslide = function(x, t, b, c, d) {
        return -c * (t /= d) * (t - 2) + b;
    }

    //    alert("test");
});

function loadEvents(data, carousel) {
    //container variables.
    var eventTemplate = "";
    var eventScrollable = "";
    var scroll_height = 0;

    for (var i = 0; i < data.length; i++) {
        if (i % SCROLLABLE_GROUPING == 0) {
            eventScrollable += "<div class='EventContainer'>" + eventTemplate + "</div>";
            eventTemplate = "";
        }
        eventTemplate += parseTemplate(
              $("#item_tmpl").html(),
              data[i].global_event );
    }
    if (eventTemplate != "")
        eventScrollable += "<div class='EventContainer'>" + eventTemplate + "</div>";
    
    $(".sliderVert .Content .Items").html(
            eventScrollable
	    );


    if ((data.length+1) > SCROLLABLE_GROUPING)
    {
        scroll_height = (SCROLLABLE_GROUPING * 100);
        //$(".sliderVert .Content").height(scroll_height);
        var scroller = $(".sliderVert .Content").scrollable({  circular: true, vertical: true }).autoscroll({ autoplay: true }); 

    }

    var carousel_total = "";
    var strip_total = "";
    total_carousel = carousel.length;
    // make carousel
    for (var i = 0; i < carousel.length; i++) {
        carousel_total += parseTemplate(
              $("#carosuel_tmpl").html(),
              carousel[i]);

        carousel[i].index = i;

        strip_total = parseTemplate(
              $("#thumbstrip_tmpl").html(),
              carousel[i]) + strip_total;

    }
    if ($("#tools").length > 0) {
        $("#tools").html(carousel_total);
        
        $("#thumbstrip").html( strip_total );
        
        // initialize scrollable and return the programming API
        api = $("#scroll").scrollable({
            items: '#tools',
            speed: 100,
            circular: false,
            easing: "noslide"
            // use the navigator plugin
        }).autoscroll({autostart:true, interval:10000}).data("scrollable");

        api.onBeforeSeek(function(event, index) {

            /* Use a recursive* function approach here, if the image is faded out
            * we will allow advancing to the next slide, which will trigger the
            * onSeek event to fade the slides back in */
            var element = jQuery("#scroll");
            if (index == $("div.tool").length) {

                element.fadeTo("slow", .01, function() {
                    api.begin();
                });
                return true;
            }
            if (element.css('opacity') == .01) {
                return true;
            }

            /* The slide has not yet started fading out, so we will fade the item
            * out */
            element.fadeTo("slow", .01, function() {
                /* Once the fade is complete we will call api.seekTo() to trigger
                * the onBeforeSeek event again, which will now advance the slide
                * because we will be returning true instead of false */
                api.seekTo(index);
            });
            // activeIndex = index;
            // Prevent advancing the slide on the first call to onBeforeSeek
            return false;

        }).onSeek(function(event, index) {
            var count = total_carousel - 1;
            $("div.thumb")[count - index].style.borderColor = "red";
            $("div.thumb")[count - activeIndex].style.borderColor= "black";

            activeIndex = index;
            // Fade the item back in
            jQuery("#scroll").fadeTo('slow', 1);


        });
        
    }
    
    //magic number set in css
            
    //alert(scroller);
}

function getLink(linkURL) {
    if (linkURL == "")
        return "";
    else if (linkURL == null)
        return "";
    else {
        var url_match = /https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?/;
        var arrLink = linkURL.match( url_match );
        return "onclick='location.href=\"" + arrLink[0] + "\"' ";
    }

}

function getLinkPointer(linkURL) {
    if (linkURL == "")
        return "";
    else if (linkURL == null)
        return "";
    else {
        var url_match = /https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?/;
        var bool = url_match.test( linkURL );
        if(bool)
            return "cursor:pointer";
        else return "";
    }

}


function getDate(date_str) {
    //alert(date_str);
    var removeT = date_str.split("T");
    var dateObj = removeT[0].split("-");
    var startTime = removeT[1].split("-")[0] 
    var startObj =  startTime.split(":");
    var removeZ = startObj[2].slice(0,-1);
    //var finalDateString = removeT.substring(0, removeLast);/

    var d = new Date(Date.UTC(dateObj[0],
                     parseInt(dateObj[1])-1,
                     dateObj[2],
                     startObj[0],
                     startObj[1],
                     removeZ)
                );
				
	//var time = d.getTime();
	
	// obtain local UTC offset and convertto msec
	//localOffset = d.getTimezoneOffset() * 60000;
	
    return d.format('mmmm dS, h:MM tt');  
}

function SendForm() {
    var f = document.createElement("form");
    document.body.appendChild(f);
    f.method = "post";
    f.action = "https://linkingshields.onthecity.org/kiosk/17021/signup";
    
    //name
    var inputName = document.createElement("input");
    f.appendChild(inputName);
    inputName.type = "hidden";
    inputName.name = "kiosk_name";
    inputName.value = "PaUl";

    f.submit();
}

function switchSlide(index) {
    api.seekTo(index);
}

/*
* Date Format 1.2.3
* (c) 2007-2009 Steven Levithan <stevenlevithan.com>
* MIT license
*
* Includes enhancements by Scott Trenda <scott.trenda.net>
* and Kris Kowal <cixar.com/~kris.kowal/>
*
* Accepts a date, a mask, or a date and a mask.
* Returns a formatted version of the given date.
* The date defaults to the current date/time.
* The mask defaults to dateFormat.masks.default.
*/

var dateFormat = function() {
    var token = /d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|"[^"]*"|'[^']*'/g,
		timezone = /\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g,
		timezoneClip = /[^-+\dA-Z]/g,
		pad = function(val, len) {
		    val = String(val);
		    len = len || 2;
		    while (val.length < len) val = "0" + val;
		    return val;
		};

    // Regexes and supporting functions are cached through closure
    return function(date, mask, utc) {
        var dF = dateFormat;

        // You can't provide utc if you skip other args (use the "UTC:" mask prefix)
        if (arguments.length == 1 && Object.prototype.toString.call(date) == "[object String]" && !/\d/.test(date)) {
            mask = date;
            date = undefined;
        }

        // Passing date through Date applies Date.parse, if necessary
        date = date ? new Date(date) : new Date;
        if (isNaN(date)) throw SyntaxError("invalid date");

        mask = String(dF.masks[mask] || mask || dF.masks["default"]);

        // Allow setting the utc argument via the mask
        if (mask.slice(0, 4) == "UTC:") {
            mask = mask.slice(4);
            utc = true;
        }

        var _ = utc ? "getUTC" : "get",
			d = date[_ + "Date"](),
			D = date[_ + "Day"](),
			m = date[_ + "Month"](),
			y = date[_ + "FullYear"](),
			H = date[_ + "Hours"](),
			M = date[_ + "Minutes"](),
			s = date[_ + "Seconds"](),
			L = date[_ + "Milliseconds"](),
			o = utc ? 0 : date.getTimezoneOffset(),
			flags = {
			    d: d,
			    dd: pad(d),
			    ddd: dF.i18n.dayNames[D],
			    dddd: dF.i18n.dayNames[D + 7],
			    m: m + 1,
			    mm: pad(m + 1),
			    mmm: dF.i18n.monthNames[m],
			    mmmm: dF.i18n.monthNames[m + 12],
			    yy: String(y).slice(2),
			    yyyy: y,
			    h: H % 12 || 12,
			    hh: pad(H % 12 || 12),
			    H: H,
			    HH: pad(H),
			    M: M,
			    MM: pad(M),
			    s: s,
			    ss: pad(s),
			    l: pad(L, 3),
			    L: pad(L > 99 ? Math.round(L / 10) : L),
			    t: H < 12 ? "a" : "p",
			    tt: H < 12 ? "am" : "pm",
			    T: H < 12 ? "A" : "P",
			    TT: H < 12 ? "AM" : "PM",
			    Z: utc ? "UTC" : (String(date).match(timezone) || [""]).pop().replace(timezoneClip, ""),
			    o: (o > 0 ? "-" : "+") + pad(Math.floor(Math.abs(o) / 60) * 100 + Math.abs(o) % 60, 4),
			    S: ["th", "st", "nd", "rd"][d % 10 > 3 ? 0 : (d % 100 - d % 10 != 10) * d % 10]
			};

        return mask.replace(token, function($0) {
            return $0 in flags ? flags[$0] : $0.slice(1, $0.length - 1);
        });
    };
} ();

// Some common format strings
dateFormat.masks = {
    "default": "ddd mmm dd yyyy HH:MM:ss",
    shortDate: "m/d/yy",
    mediumDate: "mmm d, yyyy",
    longDate: "mmmm d, yyyy",
    fullDate: "dddd, mmmm d, yyyy",
    shortTime: "h:MM TT",
    mediumTime: "h:MM:ss TT",
    longTime: "h:MM:ss TT Z",
    isoDate: "yyyy-mm-dd",
    isoTime: "HH:MM:ss",
    isoDateTime: "yyyy-mm-dd'T'HH:MM:ss",
    isoUtcDateTime: "UTC:yyyy-mm-dd'T'HH:MM:ss'Z'"
};

// Internationalization strings
dateFormat.i18n = {
    dayNames: [
		"Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat",
		"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"
	],
    monthNames: [
		"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",
		"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
	]
};

// For convenience...
Date.prototype.format = function(mask, utc) {
    return dateFormat(this, mask, utc);
};