$(document).ready(function() {
    var mUrl = 'https://graph.facebook.com/45761679829?callback=?';
    $.ajax({
        url: mUrl,
        dataType: 'json',
        success: function(data, status) {
            $('.likeCountContent').html(data.likes);
            $('.likesCount').fadeIn('slow');
        }
    });

    $("#contactForm").validationEngine({
        validationEventTriggers:"keyup blur",
        success : false
    });
    $("#contactForm2").validationEngine({
        validationEventTriggers:"keyup blur",
        success : false
    });

    $("#introContent").tabs({ selected: 0 });
    $(".contactFormsContent").tabs({ selected: 0 });

    $("a.fancy").fancybox({
        'width'                : '75%',
        'height'            : '75%',
        'autoScale'            : false,
        'transitionIn'        : 'elastic',
        'transitionOut'        : 'elastic',
        'type'                : 'iframe',
        'titlePosition'        : 'outside',
        'overlayColor'        : '#000',
        'overlayOpacity'    :  0.6,
        'onStart'        :  function() {
            $.validationEngine.closePrompt('.formError', true);
        },
        'onClosed'        :  function() {
            $.validationEngine.closePrompt('.formError', true);
        }
    });

    //Set opacity on each span to 0%
    $(".rolloverF").css({'opacity':'0'});
    $(".rollover").css({'opacity':'0.3'});
    $(".rolloverL").css({'opacity':'0.7'});

    $('.img_list a').hover(
        function() {
            //$(this).find('.rollover').stop().fadeTo(500, 0);
            $(this).find('.rolloverF').stop().fadeTo(500, 1);
            $(this).find('.rollover').stop().animate({opacity: 0.1}, 500);
            $(this).find('.rolloverL').stop().animate({opacity: 0.1}, 500);
        },
        function() {
            //$(this).find('.rollover').stop().fadeTo(500, 1);
            $(this).find('.rolloverF').stop().fadeTo(500, 0);
            $(this).find('.rollover').stop().animate({opacity: 0.3}, 500);
            $(this).find('.rolloverL').stop().animate({opacity: 0.7}, 500);
        }
    );


    var shown = false;
    var distance = 10;
    var time = 150;
    var hideDelay = 100;
    var hideDelayTimer = null;
    var beingShown = false;
    var info = $('.popup').css('opacity', 0);

    var $eventCal = $('#eventCalAjax'),
        $eventsInfo = $('#eventsInfoAjax');
    var now = new Date();
    $eventCal.EventCalendar({
        // Ajax Variables
        /** The JSON variable that will be return on the AJAX request which will contain our entries */
        ajaxEntriesVariable: 'entries',
        /** The AJAX url to request for our entries */
            //ajaxEntriesUrl: 'http://box21.hostko.net/~karaokes/index.php?id=35',
        ajaxEntriesUrl: resourceUrl,
        /** The JSON Object to send via POST to our AJAX request */
        ajaxPostData: {},
        /** Whether or not to Cache the AJAX data */
        ajaxCache: true,

        // Data Variables
        /* If you are not using AJAX, you can define your entries here */
        //calendarEntries: [],

        // Customisation Variables
        /** The CSS class which will be assigned to the Event Calendar */
        calendarClass: 'hasEventCalendar',
        /** The CSS class which will be assigned to day when the day contains a entry */
        dayEventClass: 'ui-state-active hasEvent',
        /** The standard options to send to the datepicker */
        datepickerOptions: {
            firstDay: 1,
            dayNames: ['nedelja', 'ponedeljek', 'torek', 'sreda', 'četrtek', 'petek', 'sobota'],
            dayNamesMin: ['ned', 'pon', 'tor', 'sre', 'čet', 'pet', 'sob'],
            monthNames: ['januar', 'februar', 'marec', 'april', 'maj', 'junij', 'julij', 'avgust', 'september', 'oktober', 'november', 'december'],
            prevText: "<",
            nextText: ">"
        },
        /** Whether or not to disable the datepicker date selection click */
        disableClick: true,
        
        domEvents: {
            mouseover: function(domEvent, details) {
 
                 $(this).css({
                    cursor: "pointer"
                });

                // Prepare
                var $day = $(this),
                    dayEntries = details.dayEntries;
				
                // Output
                $.each(dayEntries, function(i, entry) {

                    timeString = $.format.date(entry.start, "dd. MMMM yyyy @HH:mm");
                    
                    bubleContent = '<div class="cloudcontent" style="padding: 5px;">' +
                            '<h2 style="background: none;">' + entry.title + '</h2>' +
                            '<p>' + entry.description + '</p>' +
                            '<em>' + timeString + '</em>' +
                            '</div>';
                    showTooltip(bubleContent);                  
                    
                 });
            },
            click: function(domEvent, details) {
                var $day = $(this),
                    dayEntries = details.dayEntries;
                $.each(dayEntries, function(i, entry) {
                    location.href = entry.link;
                });
            }
        }
    });
    
    // initialize tooltips
    $(document).ajaxSuccess(function(e, xhr, settings){
    	// check if calendar ajax is loaded
    	if(settings.url.substring(0, 5)==='/inde'){
            var t=setTimeout(showTooltip,200);
    	}
	});
	
	$(document).ajaxError(function(e, jqxhr, settings, exception) {
        console.log(exception);
    });

    function showTooltip(bubleContent) {
        if(bubleContent == null || typeof(bubleContent) == 'undefined' || bubleContent == ''){
        	bubleContent = "&nbsp;";
        }
        $('.hasEvent').tipTip({maxWidth: "200px", edgeOffset: 3, defaultPosition: "top", delay: 0, content: bubleContent});
    }
});