/** * This is the main JS file. It initializes some plugins and contains the functionality * for the send email form. * * Author: Pexeto * http://pexeto.com/ */ /** * Initialize the plugins and do the main settings */ $(function(){ //SET THE SEARCH BUTTON CLICK HANDLER $('#search_button').click(function(event){ event.preventDefault(); $('#searchform').submit(); }); //remove the right margin of the last column of the four-column layout $('.columns_wrapper .four_column').eq(3).css({marginRight:0}); }); /** * Contains the functionality of the send email form. Makes the validation and sends the message. */ perception_contact_form={ set:function(){ this.setSendButtonClickHandler(); this.setInputClickHandler(); }, setSendButtonClickHandler:function(){ $("#send_button").click(function(event){ event.preventDefault(); valid=true; $("#name_text_box").removeClass('invalid'); $("#email_text_box").removeClass('invalid'); $("#question_text_area").removeClass('invalid'); $("#phone_text_box").removeClass('invalid'); $("#company_text_box").removeClass('invalid'); $("#position_text_box").removeClass('invalid'); $("#country_text_box").removeClass('invalid'); $("#marketing_text_box").removeClass('invalid'); $('#invalid_input').hide(); $('#sent_successful').hide(); //verify whether the name text box is empty var name=$("#name_text_box").val(); if(name=='' || name=='Name' || name==null){ $("#name_text_box").addClass('invalid'); valid=false; } //verify whether the phone text box is empty var phone=$("#phone_text_box").val(); if(phone=='' || phone=='Phone number' || phone==null){ $("#phone_text_box").addClass('invalid'); valid=false; } //verify whether the company text box is empty var company=$("#company_text_box").val(); if(company=='' || company=='Company' || company==null){ $("#company_text_box").addClass('invalid'); valid=false; } //verify whether the position text box is empty var position=$("#position_text_box").val(); if(position=='' || position=='Position' || position==null){ $("#position_text_box").addClass('invalid'); valid=false; } //verify whether the country text box is empty var country=$("#country_text_box").val(); if(country=='Select' || country==null){ $("#country_text_box").addClass('invalid'); valid=false; } //verify whether the marketing text box is empty var marketing=$("#marketing_text_box").val(); if(marketing=='Select' || marketing==null){ $("#marketing_text_box").addClass('invalid'); valid=false; } //verify whether the inserted email address is valid var email = $("#email_text_box").val(); if(!perception_contact_form.isValidEmailAddress(email)) { $("#email_text_box").addClass('invalid'); valid=false; } //verify whether the question text area is empty var question=$("#question_text_area").val(); if(question=='' || question=='Message' || question=='Enter your message here' || question==null){ $("#question_text_area").addClass('invalid'); valid=false; } if(!valid){ $('#invalid_input').show(); }else{ //the data is valid, sumbit the form urlToPhp=$("#url").val(); emailToSend=$("#email_to_send").val(); var dataString = 'name='+ name + '&phone='+ phone + '&company='+ company + '&position='+ position + '&country='+ country + '&marketing='+ marketing + '&question=' + question + '&email=' + email + '&emailToSend=' + emailToSend; $.ajax({ type: "POST", url: urlToPhp, data: dataString, success: function() { $('#sent_successful').show(); $("#submit_form").each(function(){ this.reset(); }); } }); } }); }, setInputClickHandler:function(){ $('.form_input').click(function(){ $(this).removeClass('invalid'); }); }, /** * Checks if an email address is a valid one. * * @param emailAddress * the email address to validate * @return true if the address is a valid one */ isValidEmailAddress:function(emailAddress) { var pattern = new RegExp( /^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i); return pattern.test(emailAddress); } }; function set_piecemaker_slider(){ AC_FL_RunContent( 'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0', 'width', '100%', 'height', '100%', 'src', 'piecemaker', 'quality', 'high', 'pluginspage', 'http://www.adobe.com/go/getflashplayer_de', 'align', 'middle', 'play', 'true', 'loop', 'true', 'scale', 'noscale', 'wmode', 'transparent', 'devicefont', 'false', 'id', 'piecemaker', 'bgcolor', 'none', 'name', 'piecemaker', 'menu', 'true', 'allowFullScreen', 'false', 'allowScriptAccess','sameDomain', 'movie', 'piecemaker', 'salign', '' ); //end AC code } function set_submit_comment(){ $('#submit_comment_button').click(function(event){ event.preventDefault(); $('#commentform').submit(); }); } function init_slider(){ if (!($.browser.msie && $.browser.version.substr(0,1)<7)){ window.onload=function(){ $('.loading').hide(); $('#slider_container').slider(); }; }else{ $(document).ready(function() { $('.loading').hide(); $('#slider_container').slider(); }); } } (function($){$.prettyPhoto={version:'2.5.4'};$.fn.prettyPhoto=function(settings){settings=jQuery.extend({animationSpeed:'normal',padding:40,opacity:0.80,showTitle:true,allowresize:true,counter_separator_label:'/',theme:'light_rounded',hideflash:false,modal:false,changepicturecallback:function(){},callback:function(){}},settings);if($.browser.msie&&$.browser.version==6){settings.theme="light_square";} if($('.pp_overlay').size()==0){_buildOverlay();}else{$pp_pic_holder=$('.pp_pic_holder');$ppt=$('.ppt');} var doresize=true,percentBased=false,correctSizes,$pp_pic_holder,$ppt,pp_contentHeight,pp_contentWidth,pp_containerHeight,pp_containerWidth,pp_type='image',setPosition=0,$scrollPos=_getScroll();$(window).scroll(function(){$scrollPos=_getScroll();_centerOverlay();_resizeOverlay();});$(window).resize(function(){_centerOverlay();_resizeOverlay();});$(document).keydown(function(e){if($pp_pic_holder.is(':visible')) switch(e.keyCode){case 37:$.prettyPhoto.changePage('previous');break;case 39:$.prettyPhoto.changePage('next');break;case 27:if(!settings.modal) $.prettyPhoto.close();break;};});$(this).each(function(){$(this).bind('click',function(){link=this;theRel=$(this).attr('rel');galleryRegExp=/\[(?:.*)\]/;theGallery=galleryRegExp.exec(theRel);var images=new Array(),titles=new Array(),descriptions=new Array();if(theGallery){$('a[rel*='+theGallery+']').each(function(i){if($(this)[0]===$(link)[0])setPosition=i;images.push($(this).attr('href'));titles.push($(this).find('img').attr('alt'));descriptions.push($(this).attr('title'));});}else{images=$(this).attr('href');titles=($(this).find('img').attr('alt'))?$(this).find('img').attr('alt'):'';descriptions=($(this).attr('title'))?$(this).attr('title'):'';} $.prettyPhoto.open(images,titles,descriptions);return false;});});$.prettyPhoto.open=function(gallery_images,gallery_titles,gallery_descriptions){if($.browser.msie&&$.browser.version==6){$('select').css('visibility','hidden');};if(settings.hideflash)$('object,embed').css('visibility','hidden');images=$.makeArray(gallery_images);titles=$.makeArray(gallery_titles);descriptions=$.makeArray(gallery_descriptions);if($('.pp_overlay').size()==0){_buildOverlay();}else{$pp_pic_holder=$('.pp_pic_holder');$ppt=$('.ppt');} $pp_pic_holder.attr('class','pp_pic_holder '+settings.theme);isSet=($(images).size()>0)?true:false;_getFileType(images[setPosition]);_centerOverlay();_checkPosition($(images).size());$('.pp_loaderIcon').show();$('div.pp_overlay').show().fadeTo(settings.animationSpeed,settings.opacity,function(){$pp_pic_holder.fadeIn(settings.animationSpeed,function(){$pp_pic_holder.find('p.currentTextHolder').text((setPosition+1)+settings.counter_separator_label+$(images).size());if(descriptions[setPosition]){$pp_pic_holder.find('.pp_description').show().html(unescape(descriptions[setPosition]));}else{$pp_pic_holder.find('.pp_description').hide().text('');};if(titles[setPosition]&&settings.showTitle){hasTitle=true;$ppt.html(unescape(titles[setPosition]));}else{hasTitle=false;};if(pp_type=='image'){imgPreloader=new Image();nextImage=new Image();if(isSet&&setPosition>$(images).size())nextImage.src=images[setPosition+1];prevImage=new Image();if(isSet&&images[setPosition-1])prevImage.src=images[setPosition-1];pp_typeMarkup='';$pp_pic_holder.find('#pp_full_res')[0].innerHTML=pp_typeMarkup;$pp_pic_holder.find('.pp_content').css('overflow','hidden');$pp_pic_holder.find('#fullResImage').attr('src',images[setPosition]);imgPreloader.onload=function(){correctSizes=_fitToViewport(imgPreloader.width,imgPreloader.height);_showContent();};imgPreloader.src=images[setPosition];}else{movie_width=(parseFloat(grab_param('width',images[setPosition])))?grab_param('width',images[setPosition]):"425";movie_height=(parseFloat(grab_param('height',images[setPosition])))?grab_param('height',images[setPosition]):"344";if(movie_width.indexOf('%')!=-1||movie_height.indexOf('%')!=-1){movie_height=($(window).height()*parseFloat(movie_height)/100)-100;movie_width=($(window).width()*parseFloat(movie_width)/100)-100;percentBased=true;} movie_height=parseFloat(movie_height);movie_width=parseFloat(movie_width);if(pp_type=='quicktime')movie_height+=15;correctSizes=_fitToViewport(movie_width,movie_height);if(pp_type=='youtube'){pp_typeMarkup='';}else if(pp_type=='quicktime'){pp_typeMarkup='';}else if(pp_type=='flash'){flash_vars=images[setPosition];flash_vars=flash_vars.substring(images[setPosition].indexOf('flashvars')+10,images[setPosition].length);filename=images[setPosition];filename=filename.substring(0,filename.indexOf('?'));pp_typeMarkup='';}else if(pp_type=='iframe'){movie_url=images[setPosition];movie_url=movie_url.substr(0,movie_url.indexOf('iframe')-1);pp_typeMarkup='';} _showContent();}});});};$.prettyPhoto.changePage=function(direction){if(direction=='previous'){setPosition--;if(setPosition<0){setPosition=0;return;}}else{if($('.pp_arrow_next').is('.disabled'))return;setPosition++;};if(!doresize)doresize=true;_hideContent();$('a.pp_expand,a.pp_contract').fadeOut(settings.animationSpeed,function(){$(this).removeClass('pp_contract').addClass('pp_expand');$.prettyPhoto.open(images,titles,descriptions);});};$.prettyPhoto.close=function(){$pp_pic_holder.find('object,embed').css('visibility','hidden');$('div.pp_pic_holder,div.ppt').fadeOut(settings.animationSpeed);$('div.pp_overlay').fadeOut(settings.animationSpeed,function(){$('div.pp_overlay,div.pp_pic_holder,div.ppt').remove();if($.browser.msie&&$.browser.version==6){$('select').css('visibility','visible');};if(settings.hideflash)$('object,embed').css('visibility','visible');setPosition=0;settings.callback();});doresize=true;};_showContent=function(){$('.pp_loaderIcon').hide();if($.browser.opera){windowHeight=window.innerHeight;windowWidth=window.innerWidth;}else{windowHeight=$(window).height();windowWidth=$(window).width();};projectedTop=$scrollPos['scrollTop']+((windowHeight/2)-(correctSizes['containerHeight']/2));if(projectedTop<0)projectedTop=0+$pp_pic_holder.find('.ppt').height();$pp_pic_holder.find('.pp_content').animate({'height':correctSizes['contentHeight']},settings.animationSpeed);$pp_pic_holder.animate({'top':projectedTop,'left':((windowWidth/2)-(correctSizes['containerWidth']/2)),'width':correctSizes['containerWidth']},settings.animationSpeed,function(){$pp_pic_holder.width(correctSizes['containerWidth']);$pp_pic_holder.find('.pp_hoverContainer,#fullResImage').height(correctSizes['height']).width(correctSizes['width']);$pp_pic_holder.find('#pp_full_res').fadeIn(settings.animationSpeed);if(isSet&&pp_type=="image"){$pp_pic_holder.find('.pp_hoverContainer').fadeIn(settings.animationSpeed);}else{$pp_pic_holder.find('.pp_hoverContainer').hide();} $pp_pic_holder.find('.pp_details').fadeIn(settings.animationSpeed);if(settings.showTitle&&hasTitle){$ppt.css({'top':$pp_pic_holder.offset().top-20,'left':$pp_pic_holder.offset().left+(settings.padding/2),'display':'none'});$ppt.fadeIn(settings.animationSpeed);};if(correctSizes['resized'])$('a.pp_expand,a.pp_contract').fadeIn(settings.animationSpeed);if(pp_type!='image')$pp_pic_holder.find('#pp_full_res')[0].innerHTML=pp_typeMarkup;settings.changepicturecallback();});};function _hideContent(){$pp_pic_holder.find('#pp_full_res object,#pp_full_res embed').css('visibility','hidden');$pp_pic_holder.find('.pp_hoverContainer,.pp_details').fadeOut(settings.animationSpeed);$pp_pic_holder.find('#pp_full_res').fadeOut(settings.animationSpeed,function(){$('.pp_loaderIcon').show();});$ppt.fadeOut(settings.animationSpeed);} function _checkPosition(setCount){if(setPosition==setCount-1){$pp_pic_holder.find('a.pp_next').css('visibility','hidden');$pp_pic_holder.find('a.pp_arrow_next').addClass('disabled').unbind('click');}else{$pp_pic_holder.find('a.pp_next').css('visibility','visible');$pp_pic_holder.find('a.pp_arrow_next.disabled').removeClass('disabled').bind('click',function(){$.prettyPhoto.changePage('next');return false;});};if(setPosition==0){$pp_pic_holder.find('a.pp_previous').css('visibility','hidden');$pp_pic_holder.find('a.pp_arrow_previous').addClass('disabled').unbind('click');}else{$pp_pic_holder.find('a.pp_previous').css('visibility','visible');$pp_pic_holder.find('a.pp_arrow_previous.disabled').removeClass('disabled').bind('click',function(){$.prettyPhoto.changePage('previous');return false;});};if(setCount>1){$('.pp_nav').show();}else{$('.pp_nav').hide();}};function _fitToViewport(width,height){hasBeenResized=false;_getDimensions(width,height);imageWidth=width;imageHeight=height;windowHeight=$(window).height();windowWidth=$(window).width();if(((pp_containerWidth>windowWidth)||(pp_containerHeight>windowHeight))&&doresize&&settings.allowresize&&!percentBased){hasBeenResized=true;notFitting=true;while(notFitting){if((pp_containerWidth>windowWidth)){imageWidth=(windowWidth-200);imageHeight=(height/width)*imageWidth;}else if((pp_containerHeight>windowHeight)){imageHeight=(windowHeight-200);imageWidth=(width/height)*imageHeight;}else{notFitting=false;};pp_containerHeight=imageHeight;pp_containerWidth=imageWidth;};_getDimensions(imageWidth,imageHeight);};return{width:imageWidth,height:imageHeight,containerHeight:pp_containerHeight,containerWidth:pp_containerWidth,contentHeight:pp_contentHeight,contentWidth:pp_contentWidth,resized:hasBeenResized};};function _getDimensions(width,height){$pp_pic_holder.find('.pp_details').width(width).find('.pp_description').width(width-parseFloat($pp_pic_holder.find('a.pp_close').css('width')));pp_contentHeight=height+$pp_pic_holder.find('.pp_details').height()+parseFloat($pp_pic_holder.find('.pp_details').css('marginTop'))+parseFloat($pp_pic_holder.find('.pp_details').css('marginBottom'));pp_contentWidth=width;pp_containerHeight=pp_contentHeight+$pp_pic_holder.find('.ppt').height()+$pp_pic_holder.find('.pp_top').height()+$pp_pic_holder.find('.pp_bottom').height();pp_containerWidth=width+settings.padding;} function _getFileType(itemSrc){if(itemSrc.match(/youtube\.com\/watch/i)){pp_type='youtube';}else if(itemSrc.indexOf('.mov')!=-1){pp_type='quicktime';}else if(itemSrc.indexOf('.swf')!=-1){pp_type='flash';}else if(itemSrc.indexOf('iframe')!=-1){pp_type='iframe'}else{pp_type='image';};};function _centerOverlay(){if($.browser.opera){windowHeight=window.innerHeight;windowWidth=window.innerWidth;}else{windowHeight=$(window).height();windowWidth=$(window).width();};if(doresize){$pHeight=$pp_pic_holder.height();$pWidth=$pp_pic_holder.width();$tHeight=$ppt.height();projectedTop=(windowHeight/2)+$scrollPos['scrollTop']-($pHeight/2);if(projectedTop<0)projectedTop=0+$tHeight;$pp_pic_holder.css({'top':projectedTop,'left':(windowWidth/2)+$scrollPos['scrollLeft']-($pWidth/2)});$ppt.css({'top':projectedTop-$tHeight,'left':(windowWidth/2)+$scrollPos['scrollLeft']-($pWidth/2)+(settings.padding/2)});};};function _getScroll(){if(self.pageYOffset){scrollTop=self.pageYOffset;scrollLeft=self.pageXOffset;}else if(document.documentElement&&document.documentElement.scrollTop){scrollTop=document.documentElement.scrollTop;scrollLeft=document.documentElement.scrollLeft;}else if(document.body){scrollTop=document.body.scrollTop;scrollLeft=document.body.scrollLeft;} return{scrollTop:scrollTop,scrollLeft:scrollLeft};};function _resizeOverlay(){$('div.pp_overlay').css({'height':$(document).height(),'width':$(window).width()});};function _buildOverlay(){toInject="";toInject+="
";toInject+='
Expand
nextprevious
Close

Previous

0'+settings.counter_separator_label+'0

Next
';toInject+='
';$('body').append(toInject);$('div.pp_overlay').css('opacity',0);$pp_pic_holder=$('.pp_pic_holder');$ppt=$('.ppt');$('div.pp_overlay').css('height',$(document).height()).hide().bind('click',function(){if(!settings.modal) $.prettyPhoto.close();});$('a.pp_close').bind('click',function(){$.prettyPhoto.close();return false;});$('a.pp_expand').bind('click',function(){$this=$(this);if($this.hasClass('pp_expand')){$this.removeClass('pp_expand').addClass('pp_contract');doresize=false;}else{$this.removeClass('pp_contract').addClass('pp_expand');doresize=true;};_hideContent();$pp_pic_holder.find('.pp_hoverContainer, .pp_details').fadeOut(settings.animationSpeed);$pp_pic_holder.find('#pp_full_res').fadeOut(settings.animationSpeed,function(){$.prettyPhoto.open(images,titles,descriptions);});return false;});$pp_pic_holder.find('.pp_previous, .pp_arrow_previous').bind('click',function(){$.prettyPhoto.changePage('previous');return false;});$pp_pic_holder.find('.pp_next, .pp_arrow_next').bind('click',function(){$.prettyPhoto.changePage('next');return false;});$pp_pic_holder.find('.pp_hoverContainer').css({'margin-left':settings.padding/2});};};function grab_param(name,url){name=name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");var regexS="[\\?&]"+name+"=([^&#]*)";var regex=new RegExp(regexS);var results=regex.exec(url);if(results==null) return"";else return results[1];}})(jQuery); /** * This is the portfolio category selector. By defined portfolio categories when clicking * on a specified category, shows only the items that belong to this category. Also sets the * info that is shown when hovering a portfolio item. * * Author: Pexeto * http://pexeto.com/ */ var portfolioSetter={ imgWidth:260, imgHeight:180, imgArray:new Array(), imgNumber:0, /** * Inits the portfolio setter. Calls the main functions for setting category selectors and * portfolio items info. */ init:function(){ this.getAllDivs(); if(this.imgNumber>0){ //this.setSelector(); this.setInfo('.portfolio_item_top'); } this.setMainPortfolioHover(); // $("#portfolio_categories li:first").addClass('selected'); }, /** * Gets all the divs that have to be shown in the slider and fills them in an array. */ getAllDivs: function(){ //fill the divs in an array $("#portfolio_gallery img").each(function(i){ portfolioSetter.imgArray[i]=$(this); portfolioSetter.imgNumber++; //add the shadow to the image $('
').insertAfter($(this)); }); $('.portfolio_item_top').show().animate({opacity:0},0); $('.portfolio_item_top a').hide(); $('a.portfolio_info').hide(); }, /** * Sets the category selector. When a category has been selected, only the images from * this category are shown. */ setSelector: function(){ $("#portfolio_categories a").click(function(event){ event.preventDefault(); var rel=$(this).attr("class"); portfolioSetter.setSelected($(this).parent().parent('li')); for(var i=0; i 0) { this.setFader(); this.setClickHandlers(); this.setLinks(); this.timer = window.setInterval(function() { perception_fader.fade(); }, this.waitInterval); } }, /** * Gets all the divs that have to be shown in the slider and fills them in * an array. */ getAllDivs : function() { $('#fader').append('
'); var html = ''; // fill the divs in an array $(".fade_holder img").each(function(i) { perception_fader.imgArray[i] = $(this); perception_fader.linkArray[i] = $(this).parent().attr('href'); perception_fader.divNumber+=1; if (i !== 0) { html += '
    • '; } else { html += '
    • '; } }); $("#fader_navigation ul").append(html); this.navArray = $("div#fader_navigation ul li"); }, /** * Makes all the images invisible. */ setFader : function() { for ( var i = 1; i < this.divNumber; i+=1) { this.imgArray[i].css( { display : "none" }); } }, setClickHandlers : function() { $("#fader_navigation ul li a").each(function(i) { $(this).click(function(event) { event.preventDefault(); if(perception_fader.selectedImage!=i){ window.clearInterval(perception_fader.timer); perception_fader.selectedImage = i; perception_fader.fadeSelected(); perception_fader.timer = window.setInterval(function() { perception_fader.fade(); }, perception_fader.waitInterval); } }); }); }, fadeSelected : function() { var img = this.imgArray[this.currentImage], navLi = $(this.navArray[this.currentImage]); img.fadeOut(this.selectFadeSpeed); navLi.removeClass("selected"); img = this.imgArray[this.selectedImage]; img.fadeIn(this.selectFadeSpeed); navLi = $(this.navArray[this.selectedImage]); navLi.addClass("selected"); this.currentImage = this.selectedImage; }, setLinks : function() { $('.fade_holder').click(function() { var link = perception_fader.linkArray[perception_fader.currentImage]; if (link !== null) { location.href = link; } }); $('.fade_holder').mouseover(function() { $(this).css( { cursor : "pointer" }); }); }, /** * The whole fading is performed here. */ fade : function() { var img = this.imgArray[this.currentImage], navLi = $(this.navArray[this.currentImage]); img.fadeOut(this.fadeSpeed); navLi.removeClass("selected"); if (this.currentImage < this.divNumber - 1) { img = this.imgArray[this.currentImage + 1]; navLi = $(this.navArray[this.currentImage + 1]); this.currentImage+=1; } else { img = this.imgArray[0]; navLi = $(this.navArray[0]); this.currentImage = 0; } img.fadeIn(this.fadeSpeed); navLi.addClass("selected"); } }; /** * This is the rotation image slider with reflections. * * @author Pexeto * http://pexeto.com/ */ (function($) { $.fn.slider = function(options) { var options = $.extend({ animationSpeed : 400, //this is the animation speed wrapperWidth:1000, //this is the width of the div that contains all the images imageWidth:400, //this is the width of a single image widthToReduce:60, smallTop:55, originalTop:40 }, options); var values={ // DO NOT CHANGE THESE VALUES: currentLeft:0, previousLeft:0, nextLeft:0, smallWidth:0, divNumber:0, imageHolders:[], images:[], reflections:[], reflectionImages:[], marginLeft:-60 }; return this.each(function(settings) { var divArray=$.makeArray($(this).find('.image_holder')); values.divNumber=divArray.length; //do the initial calculations for positioning images values.currentLeft=options.wrapperWidth/2-options.imageWidth/2; values.previousLeft=values.currentLeft-((options.imageWidth-options.widthToReduce)/2)+30; values.nextLeft=values.currentLeft+options.imageWidth-(options.imageWidth-options.widthToReduce)/2-30; values.smallWidth=options.imageWidth-options.widthToReduce; values.imageHolders=$(this).find(('div.image_holder')); values.images=$(this).find(('div.image_holder img.slider_img')); var currentImage=1; //append the transparent hovers to all the images: $('
    ').insertAfter($(this).find('div.image_holder img')); values.reflections=$(this).find(('div.image_holder div.reflect')); //set the reflections values.imageHolders.each(function(i){ var img = new Image(); img.onload = function() { Pixastic.process(img, "flipv"); values.reflectionImages[i]=img; if(i==values.imageHolders.length-1){ $.fn.slider.positionImages($(this),values, options,currentImage); } }; $(values.reflections[i]).append(img); img.src = $(values.images[i]).attr('src'); }); }); }; /** * Initially position the images. */ $.fn.slider.positionImages = function(wrapper,values,options,current) { //position all the images on the place of the central one values.imageHolders.css({left:values.currentLeft, top:options.smallTop, zIndex:1}).hide(); values.images.css({width:values.smallWidth+'px', opacity:'hide'}); values.images.mouseover(function(){ $(this).css({cursor:'pointer'}); }); //position the top images values.imageHolders.each(function(i){ switch(i){ case(current-1): $(this).css({left:values.previousLeft, zIndex:10}).show().bind('click', {options:options, values:values, wrapper:wrapper},$.fn.slider.clickLeft); $(values.images[i]).animate({opacity:0.5},0); break; case(current): $(this).css({left:values.currentLeft, zIndex:20, top:options.originalTop}).show().find('img').css({width:options.imageWidth,opacity:1}); $(values.images[i]).mouseover(function(){ $(this).css({cursor:'default'}); }); break; case(current+1): $(this).css({left:values.nextLeft, zIndex:10}).show().bind('click', {options:options, values:values, wrapper:wrapper}, $.fn.slider.clickRight); $(values.images[i]).animate({opacity:0.5},0); $(values.reflections[i]).css({marginLeft:values.marginLeft}); break; case(current-2): $(this).css({left:values.previousLeft-20}); $(values.reflections[i]).css({marginLeft:values.marginLeft}); break; case(current+2): $(this).css({left:values.nextLeft+20}); break; } }); $('#rotation_slider').css({visibility:'visible'}); }; /** * Gets the next image. If it reaches the end of the images, returns the first one */ $.fn.slider.getNextImage = function(current, step, divNumber) { if ((step + current) <= (divNumber - 1)) { return step + current; } else { var res = divNumber - (step + current); if (res >= 0) { return res; } else { return (res * (-1)); } } }; /** * Gets the next image. If it reaches the end of the images, returns the first one */ $.fn.slider.getPreviousImage = function(current, step, divNumber) { if (current-step>=0) { return current-step; } else { return divNumber+current-step; } }; /** * This is the function which is executed after clicking on an image from the right */ $.fn.slider.clickRight = function(event){ var options=event.data.options, values=event.data.values, divNumber=values.divNumber, currentClicked=Number($('#'+$(this).parent().attr('id')+' .image_holder').index(this)), currentImage=$.fn.slider.getPreviousImage(currentClicked,1,divNumber); //hide the most left image var img_index=$.fn.slider.getPreviousImage(currentImage,1,divNumber); $(values.imageHolders[img_index]).animate({opacity:'hide'},100); $(values.imageHolders[img_index]).animate({left:values.previousLeft+20},1000); // $(values.reflections[img_index]).css({marginLeft:0}); //show the image which will be in the right img_index=$.fn.slider.getNextImage(currentImage,2,divNumber); $.fn.slider.showNextImage(values, options, values.nextLeft, img_index, values.marginLeft); //move the old current image to the left $.fn.slider.removeCurrentImage(values, options, values.previousLeft, currentImage, 0); //move the right image to the center- now this is the current image img_index=$.fn.slider.getNextImage(currentImage,1,divNumber); $.fn.slider.showCurrentImage(values, options, img_index, values.marginLeft); //prepare the next image to be shown on the right side for the next click img_index=$.fn.slider.getNextImage(currentImage,3,divNumber); $(values.imageHolders[img_index]).css({left:values.nextLeft-20, top:options.smallTop, zIndex:1}); //unbind the click handlers for the old left and right images and bind the click handlers for the new ones $(this).unbind(); img_index=$.fn.slider.getNextImage(currentImage,2,divNumber); $(values.imageHolders[img_index]).bind('click', {options:options, values:values}, $.fn.slider.clickRight); img_index=$.fn.slider.getPreviousImage(currentImage,1,divNumber); $(values.imageHolders[img_index]).unbind(); $(values.imageHolders[currentImage]).bind('click', {options:options, values:values}, $.fn.slider.clickLeft); }; /** * This is the function which is executed after clicking on an image from the left. */ $.fn.slider.clickLeft = function(event){ var options=event.data.options, values=event.data.values, divNumber=values.divNumber, currentClicked=Number($('#'+$(this).parent().attr('id')+' .image_holder').index(this)), currentImage=$.fn.slider.getNextImage(currentClicked,1,divNumber); //move the left image to the center, now this is the current image var img_index=$.fn.slider.getPreviousImage(currentImage,1,divNumber); $.fn.slider.showCurrentImage(values, options, img_index,0); //hide the most right image img_index=$.fn.slider.getNextImage(currentImage,1,divNumber); $(values.imageHolders[img_index]).animate({opacity:'hide'},100); $(values.imageHolders[img_index]).animate({left:values.nextLeft-30},1000); //move the old current image to the right $.fn.slider.removeCurrentImage(values, options, values.nextLeft, currentImage, values.marginLeft); //show the new left image img_index=$.fn.slider.getPreviousImage(currentImage,2,divNumber); $.fn.slider.showNextImage(values, options, values.previousLeft, img_index, 0); //prepare the next left image to be shown img_index=$.fn.slider.getPreviousImage(currentImage,3,divNumber); $(values.imageHolders[img_index]).css({left:values.previousLeft+30, top:options.smallTop, zIndex:1}); //unbind the click handlers for the old left and right images and bind the click handlers for the new ones $(values.imageHolders[currentImage]).bind('click', {options:options, values:values}, $.fn.slider.clickRight); img_index=$.fn.slider.getNextImage(currentImage,1,divNumber); $(values.imageHolders[img_index]).unbind('click'); $(this).unbind(); img_index=$.fn.slider.getPreviousImage(currentImage,2,divNumber); $(values.imageHolders[img_index]).bind('click', {options:options, values:values}, $.fn.slider.clickLeft); }; /** * Shows the new current image. */ $.fn.slider.showCurrentImage=function(values, options, img_index, margin){ //$(values.images[img_index]).css({width:options.imageWidth+'px', marginLeft:margin}); $(values.images[img_index]).animate({opacity:1, marginLeft:0,width:options.imageWidth},options.animationSpeed); $(values.imageHolders[img_index]).animate({left:values.currentLeft, top:options.originalTop}, options.animationSpeed).css({zIndex:20}); $(values.images[img_index]).animate({opacity:1},200); var reflectionSpeed=(options.imageWidth+20)*options.animationSpeed/options.imageWidth; $(values.reflections[img_index]).animate({marginLeft:0}); $(values.images[img_index]).mouseover(function(){ $(this).css({cursor:'default'}); }); }; /** * Removes the old current image and places it to the lefr/right. */ $.fn.slider.removeCurrentImage=function(values, options, left, currentImage, margin){ $(values.imageHolders[currentImage]).animate({left:left, top:options.smallTop},options.animationSpeed-50).css({zIndex:10}); $(values.images[currentImage]).animate({opacity:0.5,width:values.smallWidth+'px'}, options.animationSpeed); $(values.reflections[currentImage]).animate({marginLeft:margin}); $(values.images[currentImage]).mouseover(function(){ $(this).css({cursor:'pointer'}); }); }; /** * Shows the next image. */ $.fn.slider.showNextImage=function(values, options, left, img_index, margin){ $(values.imageHolders[img_index]).animate({opacity:'show'},0); //$(values.images[img_index]).animate({opacity:0.4}); $(values.imageHolders[img_index]).animate({left:left, top:options.smallTop},options.animationSpeed).css({zIndex:10}); $(values.images[img_index]).css({width:values.smallWidth+'px'}); $(values.images[img_index]).animate({opacity:0.5}); $(values.reflections[img_index]).css({marginLeft:margin}); }; })(jQuery);