Galleria / Flickr plugin problem

Question

I'm having a bit of a struggle with something that should be quite easy to do, yet i'm failing at it.

I'm trying to implement the Jquery Galleria Flickr plugin into this website: http://www.mathijsdelva.be/yury.

This is the code i have:

<script src="js/jquery-1.4.4.min.js" type="text/javascript"></script> 
<script src="js/galleria.js" type="text/javascript"></script> 
<script src="js/galleria.flickr.js" type="text/javascript"></script> 
<script src="js/classic/galleria.classic.js"></script> 

<script type="text/javascript"> 
var api_key = '22b0615cb0499c7a9f67e166c74b8d6d' // you must have a flickr API key 
var flickr = new Galleria.Flickr(api_key); // initialize the plugin 

flickr.getSet('72157623495372507', { 
size: 'big', 
description: false, 
max: 100, 
sort: 'date-posted-desc' 
}, function(data) { 
$('#flickrfeed').galleria({ 
data_source: data 
}); 
}); 
</script> 

I'm doing this just as the github galleria readme is telling me but it's just not working.

Can anyone please help me? it's probably something really stupid/small!

Mathijs

Answer 1

I've got problems getting it to work also. What version of galleria.js and galleria.flick.js? There might be a miss match, I'm trying v1.2 for both without luck. Also from the documentation for v1.2 I've been following it looks more like this for the theme load;

// Load the classic theme
    Galleria.loadTheme('galleria.classic.min.js');
var api_key = 'MyRealFlickRKey' // my key not shown
var flickr = new Galleria.Flickr(api_key); 

flickr.getSet('72057594078378762', function(data) {
    $('#galleria').galleria({
        data_source: data
    });
});

From your code it looks like you are using a previous version of galleria, and i think that did not support getSet(), but I could be wrong.

Answer 2

22/02/11 Galleria posted on twitter, they wont be supporting FlickR plugin anymore.. link: http://twitter.com/#!/galleriajs Maybe an add-on coming, let's hope, FlickR Seems to be an underutilized resource.

Answer 3

@Mathijs try this out:

<script type="text/javascript">
    $(function(){
      $('#flickrFeed').galleria({
          flickr: 'set:72157623495372507',
          width: 700,
          height: 500,
          transition: 'fade',
          flickrOptions:{    
              size: 'big', 
              description: false, 
              max: 100, 
              sort: 'date-posted-desc'
          }
      });
    });
</script>

Answer 4

Forget about what is in the galleria.flickr.js plugin file and focus on what you have on the page html.

Use either 'user' or 'set' next to flickr, then the user or set ID's.

$('#galleria').galleria({
    flickr: 'set:72157627552529927',
    transition: 'fade',
          flickrOptions:{    
              size: 'original', 
              description: false, 
              max: 100, 
              sort: 'date-posted-desc'
    }
});

An added tip is to ensure the images on flickr are of adequate resolution, or the plugin stalls trying to upscale them when set in imagecrop is set to true (in the twelve theme)