//------------------------------------
//
// CAFEUNO.JS
//
//------------------------------------
//BEGIN jQuery
$(function(){
////////////////////////
// SAME HEIGHTS
if( $('#news').length > 0 ) $('#news').sameHeights('.column');
////////////////////////
// LOCATION SELECT
$('#restaurants').simpleSelect({
'change': function(){
window.location = $(this).val();
}
});
//////////////////////////
// BLACK CHEQUERBOARD
if( !$('html').hasClass('ie6') && !$('html').hasClass('ie7') ){
$('',{
'id': 'chequerboard'
}).appendTo('body');
$('html').addClass('chequerboard');
}
////////////////////////
// TWITTER
$('#twitter').tweetable({
'ready': function($t){
// Objects
var $t = $('#tweets');
// Variables
var total = $t.find('li').length - 1;
var c = 2;
var timer;
var fresh = true;
var ban = false;
var hover = false;
// Start
tweet();
// Tweet slider thingy!
function tweet(){
timer = setTimeout(function(){
// Ban the new auto being fired
ban = true;
// Hide the old
$t.find('li:visible').animate({
'top': 48
},600,'easeInExpo',function(){
// Hide or remove
$(this).hasClass('loading') ? $(this).remove() : $(this).hide();
// Show the new
$t.find('li:eq(' + ( c - 1 ) + ')').css({
'display': 'block',
'top': -48
}).animate({
'top': 0
},600,'easeOutExpo',function(){
// Wait and then again
if( !hover ){
// Increase current
c = c == total ? 1 : c + 1;
// Unban
ban = false;
// And again
tweet();
}
});
});
}, fresh ? 0 : 6000 );
fresh = false;
}
// Pause on hover
$t.hover(function(){
clearTimeout(timer);
hover = true;
},function(){
hover = false;
if( !ban ) tweet();
});
}
});
////////////////////////
// BACK TO TOP LINKS
$('#back_to_top').scrollTo({
'target': 'top'
});
if( ( $(window).height() * 1.3 ) < $(document).height() && $(window).width() > 1160 ){
$('#back_to_top').show();
}
//////////////////////////
// TARGET BLANK
$('a[href*="http://"]:not([href*="'+location.hostname+'"]):not([class*="internal"]), .external').live('click',function() {
window.open($(this).attr('href'));
return false;
});
});
//////////////////////////
// PLUGINS
(function($) {
////////////////////////
// PROMO SLIDER
$.fn.slider = function(settings) {
// Settings
var defaults = {
nav: true, // Do we need a nav?
content: true // Is there any content to go with the images?
};
var o = $.extend(defaults, settings);
return this.each(function(){
// Objects
var $p = $(this); // The slider container
var $nav; // The nav
var $l = $p.find('.loading'); // The loading spinner
// Variables
var total = $p.children('div').length; // How many slides are there? Add 1 for the initial slide that is outside the window to start!
var c = 0; // Current slide
var pause = $p.data().pause; // In seconds
var timer; // For the pause
var mooseBan = false; // Bad moose!
var w = $p.width(); // The width of the whole thing
var h = $p.height(); // The height of the whole thing
var fresh = true; // On first load
// Don't go any further if there is only 1 slide (or none!)
if( total > 1 ){
// Build the nav
function buildNav(){
// The html
var navHTML = '';
// Build the list
for( i = 1; i <= total; i++ ){
// For each slide, add a nav dot. If it's the first one, add class of on.
navHTML += '' + i + '';
}
// Build them
$nav = $('',{
'html': navHTML
}).appendTo( $p );
// Clicks!
$nav.find('a').click(function(e){
// Go to the number
goTo( parseFloat( $(this).text() ) );
// Stop badness
e.preventDefault();
});
// Center the nav
$nav.css({
'margin-left': 0 - Math.round( $nav.width() / 2 )
});
}
if( o.nav ){
buildNav();
}
//////////////////////////
// GO TO SLIDE
function goTo(num,callback){
function slide(){
// Left or right?
if( callback ){
$p.addClass('right');
}else{
$p.addClass( c > num ? 'left' : 'right' );
}
// Do the clever stuff
$new.addClass('new').css({
'display': 'block',
'width': 0,
'opacity': 0
}).animate({
'width': w,
'opacity': 1
},800,'easeInOutExpo',function(){
// If this is the first slide, don't bother, but do for the rest
if( !fresh ) $old.hide();
// Clean up time
done();
});
// And the content
if( o.content ){
$new.children('h1').css({
'left': c > num ? 100 : -100,
'opacity': 0,
'background': 'url(' + contentSrc + ')'
}).delay(400).animate({
'left': [0,'easeOutExpo'],
'opacity': 1
},2000).children('a').css({
'display': 'block',
'top': $new.data().btn[1],
'left': $new.data().btn[0],
'opacity': 0
}).delay(1200).animate({
'opacity': 1
},600);
}
}
function done(){
// We have a new current slide! Well done!
c = num;
// AUTO TIME (if just loaded)
if( fresh ) auto();
// Left and right
$p.removeClass('left right');
// Remove new class
$new.removeClass('new');
// If callback
if( callback ) callback.apply();
// Unban that moose!
mooseBan = false;
}
// Make sure we don't over shoot
if( num > total ){
num = 1;
}
// And make sure that the moose isn't banned, and that we're not clicking the active one
if( !mooseBan && num != c ){
// Ban that bad moose!
mooseBan = true;
// Get new and old
var $new = $p.find('div:eq(' + ( num - 1 ) + ')');
var $old = $p.find('div:eq(' + ( c - 1 ) + ')');
// Get image bg src
var imgSrc = $p.data().url + $new.data('bg') + '.jpg';
// And the content, if there is content
if( o.content ){
var contentSrc = $p.data().url + $new.data('bg') + '.png';
}
if( o.nav ){
// Remove the old nav on state
$nav.find('.on').removeClass('on');
// And add a new one
$nav.find('a[href=#' + num + ']').addClass('on');
}
// Do we need to preload the image?
if( $new.data('loaded') ){
// Nope! Slide this sukka!
slide();
}else{
// We need to load, but we're not showing the spinner yet
var image = false;
var content = false;
var loading = false;
setTimeout(function(){
// Don't go any further if we are already loaded
if( !image || ( !content && o.content ) ){
// We are loading
loading = true;
// Animate it in
$l.css({
'display': 'block',
'margin-top': -20,
'opacity': 0
}).animate({
'margin-top': 0,
'opacity': 1
},600,'easeOutExpo');
}
},200);
$('![]()
').attr('src',imgSrc).preload(function(){
// Are we showing the spinner?
if( loading ){
// Not any more!
loading = false;
// Animate it out and hide
$l.animate({
'margin-top': 20,
'opacity': 1
},600,'easeInExpo',function(){
$(this).hide();
});
}
// Set the background and set loaded to true for the slide so that we don't do this bit again
$new.css({
'background-image': 'url(' + imgSrc + ')'
}).data('loaded',true);
// Image is loaded!
image = true;
// Slide if content is ready
if( content || !o.content ) slide();
});
if( o.content ){
$('![]()
').attr('src',contentSrc).preload(function(){
// Content is loaded
content = true;
// Slide if image is ready
if( image ) slide();
});
}
}
}
}
// Go to the first one
goTo(1);
//////////////////////////
// AUTO SLIDE
// The repeating function
function auto(){
// No longer fresh
fresh = false;
// Get the pause data from the slide, if there is any
var sp = $p.find('div:eq(' + ( c - 1 ) + ')').data().pause;
// If there is, set that as the pause period, else use the pause value from settings
var p = sp == undefined ? pause : sp;
// Set the timeout function
timer = setTimeout(function(){
// Go to the next slide
goTo(c+1,function(){
// Fire the auto function again on callback - we have to use this method as tabs save processing power by not performing animations off screen
auto();
});
},p*1000);
}
// Detect hover
$p.bind({
'mousemove': function(){
// Clear the pause timer
clearTimeout(timer);
},
'mouseleave': function(){
// Start the timer again
if( !fresh ) auto();
}
});
}
});
};
////////////////////////
// PRELOAD IMAGES
$.fn.preload = function(c){
return this.each(function(){
var $img = $(this);
var img = new Image();
$(img).load(function(){
if( c ) c.apply($img);
}).attr('src', $img.attr('src'));
});
}
//////////////////////////
// SELECT REPLACEMENT
$.fn.simpleSelect = function(settings) {
// Settings
var defaults = {
ready: function(){},
click: function(){},
change: function(){}
};
var o = $.extend(defaults, settings);
return this.each(function(){
// The objects involved
var $this = $(this).closest('.select');
var $s = $(this);
// Fit the select to the container completely
$s.css({
'width': $this.outerWidth(),
'height': $this.outerHeight(),
'opacity': 0
}).bind({
change: function(){
$this.find('span').text($s.find('option:selected').text());
o.change.apply($s);
},
click: function(){
o.click.apply($s);
},
focus: function(){
$this.addClass('focus');
},
blur: function(){
$this.removeClass('focus');
},
mouseenter: function(){
$this.addClass('hover');
},
mouseleave: function(){
$this.removeClass('hover');
}
});
o.ready.apply($s);
});
};
//////////////////////////
// SAME HEIGHT COLUMNS
var shWindowLoaded = false;
$.fn.sameHeights = function(s){
return this.each(function(){
var tallest = 0;
var $t = $(this);
var $s = $t.find(s);
var total = $s.length;
var i = 0;
if( !shWindowLoaded ){
$(window).load(function(){
shWindowLoaded = true;
setNCheck();
});
}else{
setNCheck();
}
function setNCheck(){
$s.each(function(){
var h = $(this).height();
tallest = h > tallest ? h : tallest;
i++;
if( i == total ){
$s.css({
'min-height': tallest
});
}
});
}
});
};
//////////////////////////
// SCROLL TO
$.fn.scrollTo = function (settings){
return this.click(function(e){
$.scrollTo(settings,$(this))
e.preventDefault();
});
}
$.scrollTo = function(settings,$this){
// Settings
var defaults = {
target: 'href', // If left, it will assume that the target is an href. If you set the target, it must be either: top, bottom, or an object
speed: 600, // Speed of scroll
offset: 0, // Add or subtract from the final position
easing: 'easeInOutExpo', // Easing to use
before: function(){}, // Callback before scrolling
after: function(){} // Callback after scrolling
};
var o = $.extend(defaults, settings);
// The scrolling element
var $element = $('html').hasClass('webkit') ? $('body') : $('html');
// Before callback
o.before.apply($this);
// Just creating it for now
var y = 0;
// The max scroll (to stop sudden stops)
var max = $(document).height() - $(window).height();
// The current
var current = $element.scrollTop();
// Target detection
if( o.target == 'href' ){
y = $($this.attr('href')).offset().top;
}else{
if( o.target == 'top' ){
y = 0;
}else if( o.target == 'bottom' ){
y = max;
}else{
y = o.target.offset().top;
}
}
// Add the offset
y = y + o.offset;
// If the page isn't long enough just go as far as possible
if( y > max ){
y = max;
}
// If we're not going anywhere, don't bother with the animation
if( y == $element.scrollTop() || y == max ){
o.after.apply($this);
}else{
// Animate! - Put body back in if anything breaks, or do an if statement for the tag on certain browsers. I think it's just ie that has an issue.
$element.animate({
'scrollTop': y
},o.speed,o.easing,function(){
o.after.apply($this);
});
}
};
})(jQuery);
////////////////////////
// EASING
jQuery.extend(jQuery.easing,{
easeInOutExpo: function (x, t, b, c, d) {
if (t==0) return b;
if (t==d) return b+c;
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
},
easeInExpo: function (x, t, b, c, d) {
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
},
easeOutExpo: function (x, t, b, c, d) {
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
},
easeInCubic: function (x, t, b, c, d) {
return c*(t/=d)*t*t + b;
},
easeOutCubic: function (x, t, b, c, d) {
return c*((t=t/d-1)*t*t + 1) + b;
},
easeInOutCubic: function (x, t, b, c, d) {
if ((t/=d/2) < 1) return c/2*t*t*t + b;
return c/2*((t-=2)*t*t + 2) + b;
},
easeInOutSine: function (x, t, b, c, d) {
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
}
});
//////////////////////////
// TWITTER WEB INTENTS
(function(){
if( window.__twitterIntentHandler ) return;
var intentRegex = /twitter\.com(\:\d{2,4})?\/intent\/(\w+)/,
windowOptions = 'scrollbars=yes,resizable=yes,toolbar=no,location=yes',
width = 550,
height = 420,
winHeight = screen.height,
winWidth = screen.width;
function handleIntent(e) {
e = e || window.event;
var target = e.target || e.srcElement,
m, left, top;
while (target && target.nodeName.toLowerCase() !== 'a') {
target = target.parentNode;
}
if (target && target.nodeName.toLowerCase() === 'a' && target.href) {
m = target.href.match(intentRegex);
if (m) {
left = Math.round((winWidth / 2) - (width / 2));
top = 0;
if (winHeight > height) {
top = Math.round((winHeight / 2) - (height / 2));
}
window.open(target.href, 'intent', windowOptions + ',width=' + width + ',height=' + height + ',left=' + left + ',top=' + top);
e.returnValue = false;
e.preventDefault && e.preventDefault();
}
}
}
if (document.addEventListener) {
document.addEventListener('click', handleIntent, false);
} else if (document.attachEvent) {
document.attachEvent('onclick', handleIntent);
}
window.__twitterIntentHandler = true;
}());