(function($j) {
  $j.picasa = {
    albums: function(user, callback) {
//    var url = "http://picasaweb.google.com/data/feed/base/user/:user_id?alt=json&kind=album&hl=en_US&access=visible&fields=entry(id,media:group(media:content,media:description,media:keywords,media:title))&callback=?";
      var url = "http://picasaweb.google.com/data/feed/base/user/:user_id?alt=json&kind=album&callback=?";
      url = url.replace(/:user_id/, user);
      $j.getJSON(url, function(data) {
        var album = null;
        var albums = [];
        $j.each(data.feed.entry, function(i, element) {
          album = {
            id: element.id["$t"].split("?")[0].split("albumid/")[1],
            title: element["media$group"]["media$title"]["$t"],
            description: element["media$group"]["media$description"]["$t"],
//          thumb: element["media$group"]["media$content"][0]["url"]
            thumb: element["media$group"]["media$thumbnail"][0]["url"]
          }
          album.images = function(callback) {
            $j.picasa.images(user, album.id, callback);
          }
          albums.push(album);
        });
        callback(albums);
      });
    },

    data: function(user, callback){
        $j.picasa.albums(user, function(data){
            var num=null;
            $j.each(data, function(index, album){
               num++;
            });
            callback(num);
        });
    },

    images: function(user, album, callback) {
//    var url = "http://picasaweb.google.com/data/feed/base/user/:user_id/albumid/:album_id?alt=json&kind=photo&hl=en_US&fields=entry(title,gphoto:numphotos,media:group(media:content,media:thumbnail))&callback=?";
      var url = "http://picasaweb.google.com/data/feed/base/user/:user_id/albumid/:album_id?alt=json&kind=photo&callback=?";
      url = url.replace(/:user_id/, user).replace(/:album_id/, album);
      var image = null;
      var images = [];
      $j.getJSON(url, function(data) {
        $j.each(data.feed.entry, function(i, element) {
          image = element["media$group"]["media$content"][0];
          image.title = element.title["$jt"];
          image.thumbs = [];
          $j.each(element["media$group"]["media$thumbnail"], function(j, j_element) {
            image.thumbs.push(j_element);
          });
          images.push(image);
        });
        callback(images);
      });
    }
  };

  $j.fn.picasaAlbums = function(user, callback) {
    $j.picasa.albums(user, function(images) {
      if (callback) {
        callback(images);
      }
    });
  };

  $j.fn.picasaGallery = function(user, album, callback) {
    var scope = $j(this);
    $j.picasa.images(user, album, function(images) {
      if (callback) {
        callback(images);
      } else {
        var picasaAlbum = "<ul class='picasa-album'>\n";
        $j.each(images, function(i, element) {
          picasaAlbum += "  <li class='picasa-image'>\n";
          picasaAlbum += "    <a class='picasa-image-large' href='" + element.url + "'>\n";
          picasaAlbum += "      <img class='picasa-image-thumb' src='" + element.thumbs[1].url + "'/>\n";
          picasaAlbum += "    </a>\n";
          picasaAlbum += "  </li>\n";
        });
        picasaAlbum += "</ul>";
        scope.append(picasaAlbum);
      }
    });
  }
})(jQuery);

/*****************************************************************/

function picImagenes(albumID){
    $j.picasa.images("sdsbdn",albumID, function(imagenes){
      var maquetado="<table class='picImagenTable'><tr>";
      $j.each(imagenes, function(index, imagen) {
        maquetado+="<td><a rel='group' href='"+imagen.url+"'><img src='"+imagen.thumbs[1].url+"'></img></a></td>";
      });
      maquetado+="</tr></table>";
      $j("#picasaAlbum").html('');
      $j("#picasaAlbum").append(maquetado);

      $j("#picTitleAlbum span").remove();
      $j("#picTitleAlbum").append('<label onclick="javascript:picAlbumes();">Tornar</label>');

      visorPic();
    });

    
}

function picAlbumes(){
    $j.picasa.albums("sdsbdn", function(albums) {
      var maquetado="<table class='picAlbumTable'><tr>";
      var info="";
      var title="";
      var fecha="";
      var titor="";

      if($j("#picTitleAlbum").length){
          $j("#picTitleAlbum").remove();
      }

      $j.each(albums, function(index, album) {
        titor=this.title.split("_")[3];
        title=this.title.split("_")[3].substr(0,15);
        fecha=this.title.split("_")[2];
        etapa=this.title.split("_")[0];

        if(titor.length >15){
            title=title+" [...]"
        }
        
        maquetado+="<td class='"+etapa+"'>"+
                        "<div id='datePicAlbum'>"+fecha+"</div>"+
                        "<img onclick=\"javascript:picImagenes('"+album.id+"');\" src='"+album.thumb+"'></img>"+
                        "<div id='titlePicAlbum'>"+title+"</div>"+
                        "<div id='titOriginal' style='display:none'>"+titor+"</div>"+
                   "</td>";
      });
      maquetado+="</tr></table>";
      if($j("#picasaAlbum").length){
        $j("#picasaAlbum").remove();
      }

      var menuti="<span>Selecciona etapa</span>"
      var titmsn="Albums de Salesians Badalona";

      $j(".nopad").hide();
      $j("#main_full").append("<div id='picTitleAlbum'><a>"+titmsn+"</a>"+menuti+"</div><div id='picasaAlbum'>"+maquetado+"</div>");

      $j(".picAlbumTable td").hover(
          function(){
                $j("#picTitleAlbum a").html($j(this).children('#titOriginal').html());
          },
          function(){
                $j("#picTitleAlbum a").html(titmsn);
          }
      );

      var listEtapa="<ul>"+
                        "<li onclick=\"javascript:switchEtapa('GEN');\">General</li>"+
                        "<li onclick=\"javascript:switchEtapa('INF');\">Infantil</li>"+
                        "<li onclick=\"javascript:switchEtapa('PRI');\">Primaria</li>"+
                        "<li onclick=\"javascript:switchEtapa('ESO');\">ESO</li>"+
                        "<li onclick=\"javascript:switchEtapa('CFG');\">CFGM</li>"+
                        "<li onclick=\"javascript:switchEtapa('PQP');\">PQPI</li>"+
                        "<li onclick=\"javascript:switchEtapa('TOT');\">Totes</li>"+
                    "</ul>";

      $j("#picTitleAlbum span").hover(
          function(){
            $j("#picTitleAlbum span").append('<div id="picMenuEtapa">'+listEtapa+'</div>');
          },
          function(){
            $j("#picMenuEtapa").remove();
          }
      );
    });
}

function switchEtapa(sec){
    if(sec=="TOT"){
        $j(".picAlbumTable td").fadeIn();
    }else{
        var tde="";
        $j.each($j(".picAlbumTable td"),function(){
            tde=$j(this).attr('class');
            if(tde!=sec){
                $j(this).fadeOut();
            }else{
                $j(this).fadeIn();
            }
        });
    }
}

function visorPic(){
   $j("a[rel=group]").fancybox({
        'transitionIn'      : 'elastic',
        'transitionOut'     : 'elastic',
        'titlePosition'     : 'over',
        'padding'            : '1',
        'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
            return '<span id="fancybox-title-over">Image ' +  (currentIndex + 1) + ' / ' + currentArray.length + ' ' + title + '</span>';
        }
    });
}