Facebook Album jQuery Plugin

by ignaciocorreia

HTML

<ul id="unyk-photo"></ul>

CSS

#unyk-photo {  padding: 15px;}
#unyk-photo a {  overflow: hidden;  display: block;  float: left;  border: 1px solid #cdcac6;  padding: 0;  margin: 0 7px 10px 8px;  width: 126px;  height: 98px;}
#unyk-photo a span {  display: block;  overflow: hidden;  width: 118px;  height: 90px;   border: 4px solid #FFF;}
#unyk-photo img {  display: block;width: 100%;}
#unyk-photo a::before {content: "teste";height: 99px;position: absolute;background: #efefef;width: 121px;border: solid 1px #ccc;z-index: -1;margin-left: 2px;}
#unyk-photo a::after {content: "";height: 3px;position: absolute;background: #efefef;width: 116px;border: solid 1px #ccc;z-index: -2;margin-left: 4px;}

JavaScript

(function($){
  'use strict';
  $.fn.fbAlbum = function(options) {
    var $this = this;
    var settings = {
      'albumID' : '10150302289698306',
      'limit' : 100,
      'limitThumbs' : false,
	  'ulClass' : 'album',
      'rel' : 'group',
	  'callback' : '',
	  'title' : true,
      'thumbSize' : 0,
      'fullSize' : 0
    };
    
    if(options){$.extend( settings, options );}
  
    var graph = "https://graph.facebook.com/"
        + settings.albumID
        + "/photos?limit=" + settings.limit
        + "&callback=?";  
    
    $.getJSON(graph, function(data) {
        var albumItem = [],
            val2;
        for(var key in data){
            for(var key2 in data[key]){
                val2=data[key][key2];
                if(typeof(val2.source)!="undefined"){
                    var imgHTML ='',
                        liClass = 'class="fbThumb"',
                        liHTML,
                        thumbImg = settings.thumbSize === 0 ? val2.picture : val2.images[ 9 - settings.thumbSize ]['source'],
                        fullImg = settings.fullSize === 0 ? val2.source : val2.images[ 9 - settings.fullSize ]['source'],
					    title,
                        href = 'href="' + fullImg + '" ',
                        rel = 'rel="' + settings.rel + '" '
                    ;
					if ( settings.title && val2.name ) {
                        title = val2.name.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&apos;');
						title = 'title="' + title + '" ';
					} else {
                        title = "";
                    }
                    if ( settings.limitThumbs && key2 >= settings.limitThumbs ) {
                        imgHTML = '';
                        liClass = 'class="noThumb"';
                    } else {
                        imgHTML = '<img src="' + thumbImg + '" alt="facebook album thumbnail" />';
                    }
                    liHTML = '<li ' + liClass +...