Besoin d'aide avec Flickr/JSON/Javascript problème lors de l'affichage des images de la galerie

Question

Vous vous demandez si quelqu'un peut m'aider. J'essaie de créer une page hebdomadaire de concours de photos en tirant des photos d'une galerie Flickr, mais je ne peux pas obtenir les images à afficher. Cela fonctionne bien pour les groupes, mais il y a des problèmes avec le code de la galerie. Obtenir la réponse JSON correcte, mais ne peut pas obtenir les résultats à afficher sur la page aussi bien que les images de groupe font.

Voici mon Javascript:

$(function() { 

    var map; 
    var markers = []; 
    var infowindow; 

    // Get gallery photos 
    var visibleGallery; 

    $.getJSON("http://api.flickr.com/services/rest/" + 
"?method=flickr.galleries.getPhotos" + 
"&api_key=XXXX" + 
"&photoset_id=XXXX" + 
"&extras=geo,tags,url_sq,url_t,url_s,url_m,url_o" + 
"&format=json&jsoncallback=?", function(data, textStatus) { 

      var htmlString = '<div id="weekContainer">'; 

      var weeks = sortIntoWeekArrays(data.photos.photo); 

      $.each(weeks, function(i, week) 
      { 
        var weekNumber = i + 1; 
        var numberOfWeeks = weeks.length - 1; 

        htmlString += '<div id="week' + weekNumber + '">'; 
        htmlString += '<ul class="weeks">'; 
        if(i < numberOfWeeks) 
        { 
          htmlString += '<li><a class="weekLinksNext" href="#"><span>Next</span></a></li>'; 
        } 

        var sunday = new Date(week.monday.toUTCString()); 
        sunday.setDate(week.monday.getDate() + 6); 
        htmlString += '<li class="weekTitle">Week ' + weekNumber + ':</li><li class="weekDate"> ' + week.monday.format("ddd d mmm") + ' &mdash; ' + sunday.format("ddd d mmm") + '</li>'; 
        if(i > 0) 
        { 
          htmlString += '<li><a class="weekLinksPrev" href="#"><span>Previous</span></a></li>'; 
        } 
    htmlString += '</ul>'; 

        if(week.winner !== undefined) 
        { 
          htmlString += '<p class="galleryTitleFirst">Photo of the Week</p>'; 
          htmlString += '<ul class="imagesWinners">'; 
          htmlString += '<li class="winner"><a href="http://www.flickr.com/photos/' + week.winner.owner + '/' + week.winner.id + '" target="_blank">'; 
          htmlString += '<img title="' + week.winner.title + '" src="' + week.winner.url_m + '" alt="' + week.winner.title + '" />'; 
          htmlString += '</a></li>'; 
          htmlString += '<li class="name"><a href="http://www.flickr.com/photos/' + week.winner.owner + '/' + week.winner.id + '" target="_blank">' + week.winner.title + '</a></li>'; 
          htmlString += '<li class="owner">' + 'by <a href="http://www.flickr.com/photos/' + week.winner.owner + '" target="_blank">' + week.winner.ownername + '</a></li>'; 
          htmlString += '</ul>'; 
        } 

        htmlString += '<p class="galleryTitle">Our other favourites this week</p>'; 
        htmlString += '<ul class="imagesRunnersUp">'; 

        $.each(week.images, function(i, item) 
        { 
          htmlString += '<li><a href="http://www.flickr.com/photos/' + item.owner + '/' + item.id + '" target="_blank">'; 
          htmlString += '<img title="' + item.title + '" src="' + item.url_sq + '" alt="' + item.title + '" />'; 
          htmlString += '</a></li>'; 

          if(item.longitude == "0" && item.latitude == "0") 
          { 
            return true; 
          } 

          var latlng = new google.maps.LatLng(item.latitude, item.longitude); 

          var marker = new google.maps.Marker(
          { 
            position: latlng, 
            map: map, 
            title:item.title 
          }); 
          marker.content = '<a href="http://www.flickr.com/photos/' + item.owner + '/' + item.id + '" target="_blank"><img title="' + item.title + '" src="' + item.url_s + '" alt="' + item.title + '" /></a>'; 
          markers.push(marker); 

        }); 
        htmlString += '</ul>'; 
        htmlString += '</div>'; 
      }); 

      htmlString += '</div>'; 
      $('div#weekViewer').append(htmlString); 

      $('div#weekContainer > div').css('float', 'left').css('margin-right', '30px'); 

      $('div#weekContainer').width(weeks.length * 450); 

      $('div#weekContainer .weekLinksPrev') 
        .click(function(){ 
          $('div#weekViewer').animate({scrollLeft: '-=450'}, 'slow'); 
          return false; 
        }); 
      $('div#weekContainer .weekLinksNext') 
        .click(function(){ 
          $('div#weekViewer').animate({scrollLeft: '+=450'}, 'slow'); 
          return false; 
        }); 

    }); 


}); 

function sortIntoWeekArrays(items) 
{ 
    var weeks = []; 

    // Returns single dimension array containing single dimension arrays 
    $(items).each(function(i, item) 
    { 
      var monday = new Date(item.dateadded * 1000); 
      monday.setDate(monday.getDate() - monday.getDay() + 1); 
      monday.setHours(0,0,0,0); 

      var week, thisWeek; 
      for (i in weeks) 
      { 
        week = weeks[i]; 
        if(week.monday - monday == 0) 
        { 
          thisWeek = week; 
          break; 
        } 
      } 
      if(thisWeek === undefined) 
      { 
        thisWeek = 
        { 
          monday: monday, 
          images: [] 
        }; 
        weeks.push(thisWeek); 
      } 

      if($.inArray('winner', item.tags.split(" ")) > -1) 
      { 
        thisWeek.winner = item; 
      } 
      else 
      { 
        thisWeek.images.push(item); 
      } 
    }); 
    return weeks.sort(function(first, second) 
    { 
      return (first.monday > second.monday) - (first.monday < second.monday); 
    }); 
} 

Toute aide serait fantastique :)

Cordialement, David

Answer 1

il après Travaillé aide d'un ami. Il me manquait la valeur date_upload dans l'argument extras et item.dateadded nécessaire pour passer à item.upload.