/*
Imperia [ Premium Portfolio, Photography & Design Studio Template ]
Developed By ~ QuadCodes
Date ~ 12/04/2011
Version ~ 1.0
Website ~ http://quadcodes.com/
--------------------------------
custom.js ~ This JS file contains JavaScripts for diffrent elements:
1. SuperBig Image
2. Navigation Menu
3. Scroll To Top
4. Scrollable
5. Nivo Slider
6. Flickr
7. Twitter
8. PrettyPhoto
9. Audio Player
10. Shortcodes
A] Tabs
B] Toggle
C] Quotes
11. Contact Form
*/
/*-----------------------------------------------------------------------------------------------------------*/
$(document).ready(function() {
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 1. SuperBig Image //////////////// */
$(function() {
// initialize SuperBGImage
$('#thumbs1').superbgimage();
// Options for SuperBGImage
$.fn.superbgimage.options = {
id: 'superbgimage', // id for the containter
z_index: 0, // z-index for the container
inlineMode: 0, // 0-resize to browser size, 1-do not resize to browser-size
showimage: 1, // number of first image to display
vertical_center: 1, // 0-align top, 1-center vertical
transition: 90, // 0-none, 1-fade, 2-slide down, 3-slide left, 4-slide top, 5-slide right, 6-blind horizontal, 7-blind vertical, 90-slide right/left, 91-slide top/down
transitionout: 1, // 0-no transition for previous image, 1-transition for previous image
randomtransition: 0, // 0-none, 1-use random transition (0-7)
showtitle: 0, // 0-none, 1-show title
slideshow: 0, // 0-none, 1-autostart slideshow
slide_interval: 5000, // interval for the slideshow
randomimage: 0, // 0-none, 1-random image
speed: 'slow', // animation speed
preload: 1, // 0-none, 1-preload images
onShow: superbgimage_show, // function-callback show image
onClick: superbgimage_click, // function-callback click image
onHide: superbgimage_hide, // function-callback hide image
onMouseenter: superbgimage_mouseenter, // function-callback mouseenter
onMouseleave: superbgimage_mouseleave, // function-callback mouseleave
onMousemove: superbgimage_mousemove // function-callback mousemove
};
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 2. Navigation Menu //////////////// */
closetimer = 0;
if($("#nav")) {
$("#nav b").mouseover(function() {
clearTimeout(closetimer);
if(this.className.indexOf("hover") != -1) {
$("#nav ul ul ul:visible").slideUp(500);
$("#nav em").removeClass("hover");
$("#nav ul ul:visible").slideUp(500);
$("#nav i").removeClass("hover");
$(this).parent().next().fadeOut("slow");
$(this).removeClass("hover");
}
else {
$("#nav b").removeClass();
$(this).addClass("hover");
$("#nav ul ul ul:visible").slideUp(500);
$("#nav em").removeClass("hover");
$("#nav ul ul:visible").slideUp(500);
$("#nav i").removeClass("hover");
$("#nav ul:visible").fadeOut("slow");
$(this).parent().next().fadeIn("slow");
}
return false;
});
$("#nav i").mouseover(function() {
clearTimeout(closetimer);
if(this.className.indexOf("hover") != -1) {
$("#nav ul ul ul:visible").slideUp(500);
$("#nav em").removeClass("hover");
$(this).parent().next().slideUp(500);
$(this).removeClass("hover");
}
else {
$("#nav i").removeClass();
$(this).addClass("hover");
$("#nav ul ul ul:visible").slideUp(500);
$("#nav em").removeClass("hover");
$("#nav ul ul:visible").slideUp(500);
$(this).parent().next().slideDown(500);
}
return false;
});
$("#nav em").mouseover(function() {
clearTimeout(closetimer);
if(this.className.indexOf("hover") != -1) {
$(this).parent().next().fadeOut("slow");
$(this).removeClass("hover");
}
else {
$("#nav em").removeClass();
$(this).addClass("hover");
$("#nav ul ul ul:visible").fadeOut("slow");
$(this).parent().next().fadeIn("slow");
}
return false;
});
$("#nav").mouseover(function() {
clearTimeout(closetimer);
});
$("#nav").mouseout(function() {
closetimer = window.setTimeout(function(){
$("#nav ul ul ul:visible").fadeOut("slow");
$("#nav em").removeClass("hover");
$("#nav ul ul:visible").slideUp(500);
$("#nav i").removeClass("hover");
}, 2000);
});
}
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 3. Scroll To Top //////////////// */
$('a[href=#top]').click(function(){
$('html, body').animate({scrollTop:0}, 'slow');
return false;
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 4. Scrollable //////////////// */
$( '.scrollable' ).scrollable({
size: '1',
item: '.item',
nextPage: '.nextPage',
prevPage: '.prevPage',
easing : 'easeInBack',
speed: 'slow',
clickable: false
});
$( '.prevPage, .nextPage' ).click(function(){
return false;
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 5. Nivo Slider //////////////// */
$(window).load(function() {
$('#slider').nivoSlider({
effect:'random', // Specify sets like: 'fold,fade,sliceDown'
slices:15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed:500, // Slide transition speed
pauseTime:3000, // How long each slide will show
startSlide:0, // Set starting Slide (0 index)
directionNav:true, // Next & Prev navigation
directionNavHide:true, // Only show on hover
controlNav:true, // 1,2,3... navigation
controlNavThumbs:false, // Use thumbnails for Control Nav
controlNavThumbsFromRel:false, // Use image rel for thumbs
controlNavThumbsSearch: '.jpg', // Replace this with...
controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
keyboardNav:true, // Use left & right arrows
pauseOnHover:true, // Stop animation while hovering
manualAdvance:false, // Force manual transitions
captionOpacity:0.8, // Universal caption opacity
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
beforeChange: function(){}, // Triggers before a slide transition
afterChange: function(){}, // Triggers after a slide transition
slideshowEnd: function(){}, // Triggers after all slides have been shown
lastSlide: function(){}, // Triggers when last slide is shown
afterLoad: function(){} // Triggers when slider has loaded
});
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 6. Flickr //////////////// */
$('#flickr').jflickrfeed({
limit: 8,
qstrings: {
id: '63347064@N03'
},
itemTemplate: '
'
}, function(data) {
$('#flickr a').prettyPhoto();
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 7. Twitter //////////////// */
$(".tweet").tweet({
join_text: "auto",
username: "bluesunni",
avatar_size: 0,
count: 2,
auto_join_text_default: "we said,",
auto_join_text_ed: "we",
auto_join_text_ing: "we were",
auto_join_text_reply: "we replied",
auto_join_text_url: "we were checking out",
loading_text: "loading tweets..."
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 8. PrettyPhoto //////////////// */
$("a[rel^='prettyPhoto']").prettyPhoto();
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 9. JQuery Audio Player //////////////// */
jQuery("#jquery_jplayer").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3 : "http://www.jplayer.org/audio/mp3/Miaow-07-Bubble.mp3"
})
},
cssSelectorAncestor : '#audio-player',
cssSelector : {
play : '.jp-play',
pause : '.jp-pause',
stop : '.jp-stop'
},
volume: 50,
swfPath : 'js/',
solution: 'html, flash',
supplied : 'mp3',
backgroundColor : 'transparent'
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 10. Shortcodes //////////////// */
/*-- Tabs --*/
$('.tabs a').click(function(){
switch_tabs($(this));
});
switch_tabs($('.defaulttab'));
function switch_tabs(obj) {
$('.tab-content').hide();
$('.tabs a').removeClass("selected");
var id = obj.attr("rel");
$('#'+id).fadeIn(500);
obj.addClass("selected");
}
/*-- Toggle --*/
if ( jQuery( '.shortcode-toggle').length ) {
jQuery( '.shortcode-toggle').each( function () {
var toggleObj = jQuery(this);
toggleObj.closedText = toggleObj.find( 'input[name="title_closed"]').attr( 'value' );
toggleObj.openText = toggleObj.find( 'input[name="title_open"]').attr( 'value' );
toggleObj.find( 'input[name="title_closed"]').remove();
toggleObj.find( 'input[name="title_open"]').remove();
toggleObj.find( 'h4.toggle-trigger a').click( function () {
toggleObj.find( '.toggle-content').animate({ opacity: 'toggle', height: 'toggle' }, 300);
toggleObj.toggleClass( 'open' ).toggleClass( 'closed' );
if ( toggleObj.hasClass( 'open') ) {
jQuery(this).text(toggleObj.openText);
} // End IF Statement
if ( toggleObj.hasClass( 'closed') ) {
jQuery(this).text(toggleObj.closedText);
} // End IF Statement
return false;
});
});
} // End IF Statement
/*-- Quotes --*/
jQuery('.quotes').innerfade({
animationtype: 'fade',
speed: 'normal',
timeout: 6000,
type: 'random_start'
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 11. Contact Form //////////////// */
$("#submit-form").click(function(){
$(".error").hide();
var hasError = false;
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
var formName = $("#name").val();
var formEmail = $("#email").val();
var formMessage = $("#message").val();
if(formName == '') {
$("#name").after('Name required.');
hasError = true;
}
if(formEmail == '') {
$("#email").after('Email address required.');
hasError = true;
}
if(formMessage == '') {
$("#message").after('A message is required.');
hasError = true;
}
if( !emailReg.test( formEmail ) ) {
$("#email").after('Invalid Email entered.');
hasError = true;
}
// remove error messages when user starts typing
$("form input, form textarea").keypress(function() {
$(this).parent().find('span').fadeOut();
});
if(hasError == false) {
$("#submit-form").attr("src", "../assets/loading.gif");
$.post("./submitform.php",
{ name: formName,
email: formEmail,
message: formMessage
},
function(data){
$("#contact-form").html("Thank You! Our customer care representative will get back to you shortly.
");
}
);
}
return false;
});
/*-----------------------------------------------------------------------------------------------------------*/
/* ///////////////// 12. Icon Menu Script //////////////// */
(function ($) {
// Monkey patch jQuery 1.3.1+ css() method to support CSS 'transform'
// property uniformly across Webkit/Safari/Chrome and Firefox 3.5.
// 2009 Zachary Johnson www.zachstronaut.com
function getTransformProperty(element)
{
// Try transform first for forward compatibility
var properties = ['transform', 'WebkitTransform', 'MozTransform'];
var p;
while (p = properties.shift())
{
if (typeof element.style[p] != 'undefined')
{
return p;
}
}
// Default to transform also
return 'transform';
}
var proxied = $.fn.css;
$.fn.css = function (arg)
{
// Find the correct browser specific property and setup the mapping using
// $.props which is used internally by jQuery.attr() when setting CSS
// properties via either the css(name, value) or css(properties) method.
// The problem with doing this once outside of css() method is that you
// need a DOM node to find the right CSS property, and there is some risk
// that somebody would call the css() method before body has loaded or any
// DOM-is-ready events have fired.
if
(
typeof $.props['transform'] == 'undefined'
&&
(
arg == 'transform'
||
(
typeof arg == 'object'
&& typeof arg['transform'] != 'undefined'
)
)
)
{
$.props['transform'] = getTransformProperty(this.get(0));
}
// We force the property mapping here because jQuery.attr() does
// property mapping with jQuery.props when setting a CSS property,
// but curCSS() does *not* do property mapping when *getting* a
// CSS property. (It probably should since it manually does it
// for 'float' now anyway... but that'd require more testing.)
if (arg == 'transform')
{
arg = $.props['transform'];
}
return proxied.apply(this, arguments);
};
})(jQuery);
(function ($) {
// Monkey patch jQuery 1.3.1+ to add support for setting or animating CSS
// scale and rotation independently.
// 2009 Zachary Johnson www.zachstronaut.com
var rotateUnits = 'deg';
$.fn.rotate = function (val)
{
var style = $(this).css('transform') || 'none';
if (typeof val == 'undefined')
{
if (style)
{
var m = style.match(/rotate\(([^)]+)\)/);
if (m && m[1])
{
return m[1];
}
}
return 0;
}
var m = val.toString().match(/^(-?\d+(\.\d+)?)(.+)?$/);
if (m)
{
if (m[3])
{
rotateUnits = m[3];
}
$(this).css(
'transform',
style.replace(/none|rotate\([^)]*\)/, '') + 'rotate(' + m[1] + rotateUnits + ')'
);
}
}
// Note that scale is unitless.
$.fn.scale = function (val, duration, options)
{
var style = $(this).css('transform');
if (typeof val == 'undefined')
{
if (style)
{
var m = style.match(/scale\(([^)]+)\)/);
if (m && m[1])
{
return m[1];
}
}
return 1;
}
$(this).css(
'transform',
style.replace(/none|scale\([^)]*\)/, '') + 'scale(' + val + ')'
);
}
// fx.cur() must be monkey patched because otherwise it would always
// return 0 for current rotate and scale values
var curProxied = $.fx.prototype.cur;
$.fx.prototype.cur = function ()
{
if (this.prop == 'rotate')
{
return parseFloat($(this.elem).rotate());
}
else if (this.prop == 'scale')
{
return parseFloat($(this.elem).scale());
}
return curProxied.apply(this, arguments);
}
$.fx.step.rotate = function (fx)
{
$(fx.elem).rotate(fx.now + rotateUnits);
}
$.fx.step.scale = function (fx)
{
$(fx.elem).scale(fx.now);
}
/*
Starting on line 3905 of jquery-1.3.2.js we have this code:
// We need to compute starting value
if ( unit != "px" ) {
self.style[ name ] = (end || 1) + unit;
start = ((end || 1) / e.cur(true)) * start;
self.style[ name ] = start + unit;
}
This creates a problem where we cannot give units to our custom animation
because if we do then this code will execute and because self.style[name]
does not exist where name is our custom animation's name then e.cur(true)
will likely return zero and create a divide by zero bug which will set
start to NaN.
The following monkey patch for animate() gets around this by storing the
units used in the rotation definition and then stripping the units off.
*/
var animateProxied = $.fn.animate;
$.fn.animate = function (prop)
{
if (typeof prop['rotate'] != 'undefined')
{
var m = prop['rotate'].toString().match(/^(([+-]=)?(-?\d+(\.\d+)?))(.+)?$/);
if (m && m[5])
{
rotateUnits = m[5];
}
prop['rotate'] = m[1];
}
return animateProxied.apply(this, arguments);
}
})(jQuery);
/*-----------------------------------------------------------------------------------------------------------*/
});
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-18434961-1']);
_gaq.push(['_setDomainName', '.quadcodes.com']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();