$(document).ready(function() {
//flickr feed snippet by css-tricks.com
/*$.getjson("http://api.flickr.com/services/feeds/photos_public.gne?id=37321137@n03&format=json&jsoncallback=?", function(data) {
var target = "#latest-flickr-images ul"; // where is it going?
for (i = 0; i <= 9; i = i + 1) { // loop through the 10 most recent, [0-9]
var pic = data.items[i];
var linumber = i + 1; // add class to each li (1-12)
$(target).append("
");
}
});*/
//prettyphoto
$("a[rel^='prettyphoto']").prettyphoto();
//collapsing header effect
var nav = $('.collapsing_header header');
$(window).scroll(function () {
if ($(this).scrolltop() > 400) {
nav.addclass("absolute");
} else {
nav.removeclass("absolute");
}
});
var window_top = $(window).scrolltop();
if (window_top > 400) {
nav.addclass("absolute");
} else {
nav.removeclass("absolute");
}
//flexslider
$('#main_flexslider').flexslider({
namespace: "flex-", //{new} string: prefix string attached to the class of every element generated by the plugin
selector: ".slides > li", //{new} selector: must match a simple pattern. '{container} > {slide}' -- ignore pattern at your own peril
animation: "slide", //string: select your animation type, "fade" or "slide"
easing: "swing", //{new} string: determines the easing method used in jquery transitions. jquery easing plugin is supported!
direction: "horizontal", //string: select the sliding direction, "horizontal" or "vertical"
reverse: false, //{new} boolean: reverse the animation direction
animationloop: true, //boolean: should the animation loop? if false, directionnav will received "disable" classes at either end
smoothheight: false, //{new} boolean: allow height of the slider to animate smoothly in horizontal mode
startat: 0, //integer: the slide that the slider should start on. array notation (0 = first slide)
slideshow: true, //boolean: animate slider automatically
slideshowspeed: 10000, //integer: set the speed of the slideshow cycling, in milliseconds
animationspeed: 600, //integer: set the speed of animations, in milliseconds
initdelay: 0, //{new} integer: set an initialization delay, in milliseconds
randomize: false, //boolean: randomize slide order
// usability features
pauseonaction: true, //boolean: pause the slideshow when interacting with control elements, highly recommended.
pauseonhover: true, //boolean: pause the slideshow when hovering over slider, then resume when no longer hovering
usecss: true, //{new} boolean: slider will use css3 transitions if available
touch: true, //{new} boolean: allow touch swipe navigation of the slider on touch-enabled devices
video: false, //{new} boolean: if using video in the slider, will prevent css3 3d transforms to avoid graphical glitches
// primary controls
controlnav: true, //boolean: create navigation for paging control of each clide? note: leave true for manualcontrols usage
directionnav: true, //boolean: create navigation for previous/next navigation? (true/false)
prevtext: "previous", //string: set the text for the "previous" directionnav item
nexttext: "next", //string: set the text for the "next" directionnav item
// secondary navigation
keyboard: true, //boolean: allow slider navigating via keyboard left/right keys
multiplekeyboard: false, //{new} boolean: allow keyboard navigation to affect multiple sliders. default behavior cuts out keyboard navigation with more than one slider present.
mousewheel: false, //{updated} boolean: requires jquery.mousewheel.js (https://github.com/brandonaaron/jquery-mousewheel) - allows slider navigating via mousewheel
pauseplay: false, //boolean: create pause/play dynamic element
pausetext: 'pause', //string: set the text for the "pause" pauseplay item
playtext: 'play', //string: set the text for the "play" pauseplay item
// special properties
controlscontainer: "", //{updated} selector: use class selector. declare which container the navigation elements should be appended too. default container is the flexslider element. example use would be ".flexslider-container". property is ignored if given element is not found.
manualcontrols: "", //selector: declare custom control navigation. examples would be ".flex-control-nav li" or "#tabs-nav li img", etc. the number of elements in your controlnav should match the number of slides/tabs.
sync: "", //{new} selector: mirror the actions performed on this slider with another slider. use with care.
asnavfor: "", //{new} selector: internal property exposed for turning the slider into a thumbnail navigation for another slider
// carousel options
itemwidth: 0, //{new} integer: box-model width of individual carousel items, including horizontal borders and padding.
itemmargin: 0, //{new} integer: margin between carousel items.
minitems: 0, //{new} integer: minimum number of carousel items that should be visible. items will resize fluidly when below this.
maxitems: 0, //{new} integer: maxmimum number of carousel items that should be visible. items will resize fluidly when above this limit.
move: 0, //{new} integer: number of carousel items that should move on animation. if 0, slider will move all visible items.
// callback api
start: function(){
$('.flex-active-slide .container .carousel-caption').addclass('show')
}, //callback: function(slider) - fires when the slider loads the first slide
before: function(){
$('.flex-active-slide .container .carousel-caption').removeclass('show')
}, //callback: function(slider) - fires asynchronously with each slider animation
after: function(slider){
$('.flex-active-slide .container .carousel-caption').addclass('show')
}, //callback: function(slider) - fires after each slider animation completes
end: function(){}, //callback: function(slider) - fires when the slider reaches the last slide (asynchronous)
added: function(){}, //{new} callback: function(slider) - fires after a slide is added
removed: function(){} //{new} callback: function(slider) - fires after a slide is removed
});
//portfolio flexslider with carousel
$('#carousel').flexslider({
animation: "slide",
controlnav: false,
animationloop: false,
slideshow: false,
itemwidth: 210,
itemmargin: 10,
asnavfor: '#portfolio_slider'
});
$('#portfolio_slider').flexslider({
namespace: "flex-", //{new} string: prefix string attached to the class of every element generated by the plugin
selector: ".slides > li", //{new} selector: must match a simple pattern. '{container} > {slide}' -- ignore pattern at your own peril
animation: "slide", //string: select your animation type, "fade" or "slide"
easing: "swing", //{new} string: determines the easing method used in jquery transitions. jquery easing plugin is supported!
direction: "horizontal", //string: select the sliding direction, "horizontal" or "vertical"
reverse: false, //{new} boolean: reverse the animation direction
animationloop: true, //boolean: should the animation loop? if false, directionnav will received "disable" classes at either end
smoothheight: false, //{new} boolean: allow height of the slider to animate smoothly in horizontal mode
startat: 0, //integer: the slide that the slider should start on. array notation (0 = first slide)
slideshow: false, //boolean: animate slider automatically
slideshowspeed: 7000, //integer: set the speed of the slideshow cycling, in milliseconds
animationspeed: 600, //integer: set the speed of animations, in milliseconds
initdelay: 0, //{new} integer: set an initialization delay, in milliseconds
randomize: false, //boolean: randomize slide order
// usability features
pauseonaction: true, //boolean: pause the slideshow when interacting with control elements, highly recommended.
pauseonhover: false, //boolean: pause the slideshow when hovering over slider, then resume when no longer hovering
usecss: true, //{new} boolean: slider will use css3 transitions if available
touch: true, //{new} boolean: allow touch swipe navigation of the slider on touch-enabled devices
video: false, //{new} boolean: if using video in the slider, will prevent css3 3d transforms to avoid graphical glitches
// primary controls
controlnav: true, //boolean: create navigation for paging control of each clide? note: leave true for manualcontrols usage
directionnav: true, //boolean: create navigation for previous/next navigation? (true/false)
prevtext: "previous", //string: set the text for the "previous" directionnav item
nexttext: "next", //string: set the text for the "next" directionnav item
// secondary navigation
keyboard: true, //boolean: allow slider navigating via keyboard left/right keys
multiplekeyboard: false, //{new} boolean: allow keyboard navigation to affect multiple sliders. default behavior cuts out keyboard navigation with more than one slider present.
mousewheel: false, //{updated} boolean: requires jquery.mousewheel.js (https://github.com/brandonaaron/jquery-mousewheel) - allows slider navigating via mousewheel
pauseplay: false, //boolean: create pause/play dynamic element
pausetext: 'pause', //string: set the text for the "pause" pauseplay item
playtext: 'play', //string: set the text for the "play" pauseplay item
// special properties
controlscontainer: "", //{updated} selector: use class selector. declare which container the navigation elements should be appended too. default container is the flexslider element. example use would be ".flexslider-container". property is ignored if given element is not found.
manualcontrols: "", //selector: declare custom control navigation. examples would be ".flex-control-nav li" or "#tabs-nav li img", etc. the number of elements in your controlnav should match the number of slides/tabs.
sync: "", //{new} selector: mirror the actions performed on this slider with another slider. use with care.
asnavfor: "", //{new} selector: internal property exposed for turning the slider into a thumbnail navigation for another slider
// carousel options
itemwidth: 0, //{new} integer: box-model width of individual carousel items, including horizontal borders and padding.
itemmargin: 0, //{new} integer: margin between carousel items.
minitems: 0, //{new} integer: minimum number of carousel items that should be visible. items will resize fluidly when below this.
maxitems: 0, //{new} integer: maxmimum number of carousel items that should be visible. items will resize fluidly when above this limit.
move: 0, //{new} integer: number of carousel items that should move on animation. if 0, slider will move all visible items.
// callback api
start: function(){
$('.flex-active-slide .container .carousel-caption').addclass('show')
}, //callback: function(slider) - fires when the slider loads the first slide
before: function(){
$('.flex-active-slide .container .carousel-caption').removeclass('show')
}, //callback: function(slider) - fires asynchronously with each slider animation
after: function(slider){
$('.flex-active-slide .container .carousel-caption').addclass('show')
}, //callback: function(slider) - fires after each slider animation completes
end: function(){}, //callback: function(slider) - fires when the slider reaches the last slide (asynchronous)
added: function(){}, //{new} callback: function(slider) - fires after a slide is added
removed: function(){} //{new} callback: function(slider) - fires after a slide is removed
});
$().uitotop({ easingtype: 'easeoutquart' });
});
$(window).load(function(){
//isotope
// cache container
var $container = $('#portfolio_container');
// initialize isotope
$container.isotope({
});
// filter items when filter link is clicked
$('#portfolio_filters a').click(function(){
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
return false;
});
});
$(window).resize(function() {
//isotope again, in order to fix the resizing bug
var $container = $('#portfolio_container');
$container.isotope({ });
});