var Flickr = {
  url: "http://api.flickr.com/services/rest/",
  api_key: "2fbf19b71cf4d0a232d9a938e489ad28",
  
  getPhotosFromSet: function(set_id, callback) {
    Flickr.getJSON({ method: "flickr.photosets.getPhotos", photoset_id: set_id, extras: "url_sq,url_m,url_o", per_page: 10, page: 1 }, callback);
  },
  
  getJSON: function(hash, callback) {
    $.getJSON(Flickr.url+Flickr.mash(hash), callback);
  },
  
  mash: function(hash) {
    query_string = "?";
    
    if (!hash) { hash = {}; }
    
    hash.api_key = Flickr.api_key;
    hash.format = "json";
    hash.jsoncallback = "?";
    
    for (i in hash) {
      query_string += i + "=" + hash[i] + "&";
    }
    
    return query_string;
  }
};

var Slideshow = {
  findAll: function() {
    $(".galleryview").each(function() {
      Slideshow.create(this);
    });
  },
  
  create: function(element) {
    var set_id = $(element).attr("rel");
    
    Flickr.getPhotosFromSet(set_id, function(json) {
      var photos = json.photoset.photo;
      // console.log(photos);
      element.innerHTML = Slideshow.panels_html(photos) + Slideshow.filmstrip_html(photos);
      
      $(element).galleryView({
        panel_width: 500,
        panel_height: 340,
        frame_width: 75,
        frame_height: 75,
        background_color: "#000"
      });
      
      $(element).css({ margin: "1em auto", background: "#000" });
    });
  },
  
  panels_html: function(photos) {
    html = '';
    
    for (var i=0; i < photos.length; i++) {
      html += '<div class="panelg">';
      html += '<img src="'+ photos[i].url_m +'">';
      html += '<div class="panelg-overlay">';
      html += '<h2>'+ photos[i].title +'</h2>';
      html += '<p>View full-size photo <a href="'+ photos[i].url_o +'" target="_blank">here</a>.</p>';
      html += '</div>';
      html += '</div>';
    };
    
    return html;
  },
  
  filmstrip_html: function(photos) {
    html = '<ul class="filmstrip">';
    
    for (var i=0; i < photos.length; i++) {
      html += '<li><img src="'+ photos[i].url_sq +'" alt="'+ photos[i].title +'"></li>';
    };
    
    html += '</ul>';
    
    return html;
  }
};

$(function() {
  
  // Search form
  var label_text = $("label[for=\"q\"]").html();

  $("input[name=\"q\"]").focus(function() {
    if (this.value == label_text) {
      this.value = "";
    }
  }).blur(function() {
    if (this.value == "") {
      this.value = label_text;
    }
  }).blur();
  
  // FAQ toggles
  if ($('dl#faq').length == 1) {
    
    $('dl#faq dd').hide();
    
    $('dl#faq dt').addClass('on').click(function(event) {
      $(this).next('dd').toggle();
    });
    
  }// if
  
  // CC form toggle based on drop down selection
  if ($('p#levels').length == 1) {
    if (typeof all_levels == 'undefined') {
      all_levels = {};
    }
    
    var cc_show_hide = function() {
      var selected = $('#level').val();
      
      if (!all_levels[selected]) {
        $('#cc_form').hide();
        $('#mail_in').show();
      } else {
        $('#cc_form').show();
        $('#mail_in').hide();
      }
    };
    
    $('#level').change(cc_show_hide);
    
    (cc_show_hide)();
  }
  
  // Flickr slideshows
  Slideshow.findAll();
  
});