﻿// JavaScript Document

function jsonFlickrApi(rsp) {
    if (rsp.stat != "ok") {
        // If this executes, something broke!
        return;
    }
		
    //variable "s" is going to contain all the markup that is generated by the loop below
    var s = "";
    var u = "";

    //this loop runs through every item and creates HTML 
    for (var i = 0; i < rsp.photos.photo.length; i++) {
    
        photo = rsp.photos.photo[i];

        //notice that "t.jpg" is where you change the size of the image
        t_url = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + "_" + "s.jpg";
        
        s += '<li><a href="/ManOfTheYear/">' + '<img class="gridImage" alt="' + photo.title + '"src="' + t_url + '"/>' + '</a></li>';
        u += '<li><a href="/ManOfTheYear/Anytown">' + '<img class="gridImage" alt="' + photo.title + '"src="' + t_url + '"/>' + '</a></li>';
        
    }
    
    $('ul.thumb').html(s);
    $('ul.moty_thumb').html(u);
    
    DoSubscriptions();

}

//HOVER INFORMATION BELOW, hoverIntent config is included in the js folder
function DoSubscriptions() {

    // Homepage and Man of the year block
    $("ul.thumb li, ul.moty_thumb li").hoverIntent(function () {
        $(this).css({
            'z-index': '100'
        });
        $(this).find('img.gridImage').addClass("hover").stop().animate({
            marginTop: '-53px',
            marginLeft: '-53px',
            top: '50%',
            left: '50%',
            width: '75px',
            height: '75px',
            padding: '15px'
        },200);
    },function () {
        $(this).css({
            'z-index': '0'
        });
        $(this).find('img.gridImage').removeClass("hover").stop().animate({
            marginTop: '0',
            marginLeft: '0',
            top: '0',
            left: '0',
            width: '49px',
            height: '49px',
            padding: '1px'
        },200);
    });
}