﻿var videoData = [];
var arrayThumbs = [];
var ajaxCounter = 0;

$(document).ready(function () {
    fillVideoData("videos");

    //twitter slider
    $('.twitter').Slider({
        speed: 1000,
        pause: 3000,
        navigation: false,
        showControls: false,
        fadeEffect: false
    });

    //about slider
    $('.image-holder').Slider({
        speed: 1000,
        pause: 5000,
        navigation: false,
        showControls: false
    });

    //events slider
    $('.events-slider').Slider({
        speed: 1000,
        pause: 5000,
        navigation: true,
        showControls: false
    });

    //space-hire slider
    $('.space-slider').Slider({
        speed: 1000,
        pause: 5000,
        navigation: false,
        showControls: false
    });

    //custom scroll
    $('.scroll-pane').jScrollPane();

    $('ul.nav li a, .inner a').click(function () {
        var selector = $(this).attr('name');
        var top = $(selector).offset().top - 160 + 'px';
        $('html, body').animate({ scrollTop: top }, 1000);
    });

    $('#galleria').galleria({
        transition: 'fade',
        dataSelector: "img",
        showImagenav: true,
        width: '624px',
        height: '417px',
        dataConfig: function (a) {
            return {
 //               image: $(a).attr('href') // tell Galleria that the href is the main image,
            };
        }
    });

    $('.gallery-nav li a').click(function () {
        fillSliderWithImages($(this).text());
    });

    $('.thumbNav li a').click(function () {
        $('.calendar-inner li').removeClass("active");
        $('.calendar-inner li').eq(parseInt($(this).text()) - 1).addClass("active");
    });

    setMapCordinates();
});

var fillSliderWithImages = function (category) {
    var webServiceInput = { "category": category };
    var jsonStr = JSON.stringify(webServiceInput);
    $.ajax({
        type: 'POST',
        url: '/Services/DataProviderService.svc/GetGalleryImages',
        data: jsonStr,
        contentType: "application/json; charset=utf-8",
        dataType: 'json',
        success: function (res) {
            $("#galleria > *").remove();
            $("#galleria").galleria({
                showImagenav: true,
                width: '624px',
                height: '417px'
            });

            if (category == "videos") {
                for (i = 0; i < videoData.length; i++) {
                    videoData[i].image = arrayThumbs[i];
                }
                Galleria.ready(function (options) {
                    this.bind('loadfinish', function (e) {
                        $(e.imageTarget).parent().html(videoData[e.index].videoUrl);
                    });
                });
                var $galleryThumbs = $('.galleria-thumbnails');
                $galleryThumbs.children().remove();
                for (var i = 0; i < videoData.length; i++) {
                    $galleryThumbs.append('<div class="galleria-image" style="overflow: hidden; position: relative; width: 64px; height: 40px;"><img width="64" height="40" style="display: block; opacity: 0.6; width: 64px; height: 40px; position: absolute; top: 0px; left: 0px;" src="' + videoData[i].image + '"></div>');
                }
                $("#galleria").galleria({
                    showImagenav: true,
                    width: '624px',
                    height: '417px'
                });
            } else {
                Galleria.ready(function (options) {
                    this.unbind('loadfinish', function (e) {
                    });
                });
                var $galleryThumbs = $('.galleria-thumbnails');
                $galleryThumbs.children().remove();
                for (var i = 0; i < res.d.length; i++) {
                    $galleryThumbs.append('<div class="galleria-image" style="overflow: hidden; position: relative; width: 64px; height: 40px;"><img width="64" height="40" style="display: block; opacity: 0.6; width: 64px; height: 40px; position: absolute; top: 0px; left: 0px;" src="' + res.d[i] + '"></div>');
                }
                $("#galleria").galleria({
                    showImagenav: true,
                    width: '624px',
                    height: '417px'
                });
                retVal = true;
            }
        },
        error: function (data, e1, e2) {
            //  console.log(e1);
        }
    });

    $("#galleria").galleria({
        showImagenav: true,
        width: '624px',
        height: '417px'
    });

    // remove extra notouch, for IE
    if ($("div .notouch").length > 1) {
        for (i = 0; i < $("div .notouch").length; i++) {
            $("div .notouch").eq(0).remove();
        }
    }
};

var setMapCordinates = function () {
    var webServiceInput = {};
    var jsonStr = JSON.stringify("");
    $.ajax({
        type: 'POST',
        url: '/Services/DataProviderService.svc/GetMapLocation',
        data: jsonStr,
        contentType: "application/json; charset=utf-8",
        dataType: 'json',
        success: function (res) {
            var point = res.d.split(',');
            var map;
            var latlng = new google.maps.LatLng(parseFloat(point[0]), parseFloat(point[1]));
            var myOptions = {
                zoom: parseFloat(point[2]),
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            map = new google.maps.Map(document.getElementById("pnlMap"), myOptions);
            var marker = new google.maps.Marker({
                map: map,
                position: latlng
            });
        },
        error: function (data, e1, e2) {
            //  console.log(e1);
        }
    });
};

// loads videoData.videoUrl with video urls, thumb images are set to "" 
var fillVideoData = function (category) {
    var webServiceInput = { "category": category };
    var jsonStr = JSON.stringify(webServiceInput);
    $.ajax({
        type: 'POST',
        url: '/Services/DataProviderService.svc/GetGalleryImages',
        data: jsonStr,
        contentType: "application/json; charset=utf-8",
        dataType: 'json',
        success: function (res) {
            $.each(res.d, function (index, value) {
                videoIframe = value.split('<p>')[0];
                if (videoIframe.indexOf('vimeo.com') > -1) {
                    id = videoIframe.split('/')[4].split('?')[0];
                    videoData.push({ image: "", videoUrl: videoIframe });
                } else {
                    throw new Error('Unrecognised URL');
                }
            });
            getVideoThumbs(videoData);
        },
        error: function (data, e1, e2) {
            //  console.log(e1);
        }
    });
};

// sets all videoData.image to thumb images
var getVideoThumbs = function (videos) {
    $.ajax({
        url: 'http://vimeo.com/api/v2/video/' + videos[ajaxCounter].videoUrl.split('/')[4].split('?')[0] + '.json',
        dataType: 'jsonp',
        sync: false,
        success: function (data) {
            thumbUrl = data[0].thumbnail_small;
            arrayThumbs.push(thumbUrl);
        },
        complete: function () {
            ajaxCounter++;
            if (ajaxCounter != videoData.length) {
                getVideoThumbs(videos);
            }
        }
    });

};
