<script>
function formatDate(date) {
  var monthNames = [
    "January", "February", "March",
    "April", "May", "June", "July",
    "August", "September", "October",
    "November", "December"
  ];

  var day = date.getDate();
  var monthIndex = date.getMonth();
  var year = date.getFullYear();

  return day + ' ' + monthNames[monthIndex] + ' ' + year;
}
    function ajax(url) {
        fetch(url).then(data => data.json()).then(data => dataGen.next(data))
    }

    function* tour() {
        // console.log('fetching artist');
        const artist = yield ajax('https://api.officialcommunity.com/api/liveevents/bluerodeo');

        for (let i = 0; i < artist.length; i++) {
            // console.log("this is working");
            // Get the Date and put it in a <div>
            let date = formatDate(new Date(artist[1].LiveEvent.EventDate));
            let dateWrap = $("<div>");
            dateWrap.addClass('date col-md-3');
            dateWrap.append(date);

            // Get the Venue and Location Details and put it in a <div>
            //venue
            let venue = artist[i].LiveEvent.Venue;
            let venueLink = $("<a>");
            venueLink.attr('href', artist[i].LiveEvent.VenueUrl);
            venueLink.attr('target', '_blank');
            venueLink.addClass('venue');
            venueLink.append(venue);
            //city
            let city = artist[i].LiveEvent.City;
            let citySpan = $()
            let country = artist[i].LiveEvent.Country;
            let cityWrap = $('<div>');
            cityWrap.append(city, `, `);
            cityWrap.append(country);
            //wrap
            let location = $('<div>');
            location.addClass('location col-md-6');
            location.append(venueLink, cityWrap);

            // Get the Facebook Event Details and put it in a <button>
            // let fbText = "RSVP"
            // let fbEvent = artist[i].LiveEvent.FacebookEventId;
            // let fbLink = $("<a>");
            // fbLink.attr('href', 'https://www.facebook.com/' + fbEvent);
            // fbLink.attr('target', '_blank');
            // let fbIcon = $('<span>');
            // fbIcon.addClass('fa fa-facebook');
            // fbLink.append(fbText);
            // let fbButton = $("<button>");
            // fbButton.append(fbIcon, fbLink);

            // Get the Ticket Details and put it in a <button>
            let ticketText = "Buy Tickets"
            let ticketEvent = artist[i].LiveEvent.ExternalTicketUrl;
            let ticketLink = $("<a>");
            ticketLink.attr('href', ticketEvent);
            ticketLink.attr('target', '_blank');
            ticketLink.addClass('tickets');
            ticketLink.append(ticketText);
            let ticketButton = $("<button class='btn btn-info btn-clear'>");
            ticketButton.append(ticketLink);

            let buttonWrap = $('<div>');
            buttonWrap.addClass('buttons col-md-3');
            // buttonWrap.append(fbButton, ticketButton);
            buttonWrap.append(ticketButton);

            let container = $("<div>");
            container.addClass('tourRow');
            container.append(dateWrap, location, buttonWrap);
            $('#tour-dates').append(container);
        }
    }

    const dataGen = tour();
    dataGen.next(); // kick it off
</script>