diff --git a/scripts/camera.js b/scripts/camera.js index daddaaa..fb84486 100644 --- a/scripts/camera.js +++ b/scripts/camera.js @@ -1,2272 +1,2278 @@ -// Camera slideshow v1.3.4 - a jQuery slideshow with many effects, transitions, easy to customize, using canvas and mobile ready, based on jQuery 1.4+ -// Copyright (c) 2012 by Manuel Masia - www.pixedelic.com -// Licensed under the MIT license: http://www.opensource.org/licenses/mit-license.php -;(function($){$.fn.camera = function(opts, callback) { - - var defaults = { - alignment : 'center', //topLeft, topCenter, topRight, centerLeft, center, centerRight, bottomLeft, bottomCenter, bottomRight - - autoAdvance : true, //true, false - - mobileAutoAdvance : true, //true, false. Auto-advancing for mobile devices - - barDirection : 'leftToRight', //'leftToRight', 'rightToLeft', 'topToBottom', 'bottomToTop' - - barPosition : 'bottom', //'bottom', 'left', 'top', 'right' - - cols : 6, - - easing : 'easeInOutExpo', //for the complete list http://jqueryui.com/demos/effect/easing.html - - mobileEasing : '', //leave empty if you want to display the same easing on mobile devices and on desktop etc. - - fx : 'random', //'random','simpleFade', 'curtainTopLeft', 'curtainTopRight', 'curtainBottomLeft', 'curtainBottomRight', 'curtainSliceLeft', 'curtainSliceRight', 'blindCurtainTopLeft', 'blindCurtainTopRight', 'blindCurtainBottomLeft', 'blindCurtainBottomRight', 'blindCurtainSliceBottom', 'blindCurtainSliceTop', 'stampede', 'mosaic', 'mosaicReverse', 'mosaicRandom', 'mosaicSpiral', 'mosaicSpiralReverse', 'topLeftBottomRight', 'bottomRightTopLeft', 'bottomLeftTopRight', 'bottomLeftTopRight' - //you can also use more than one effect, just separate them with commas: 'simpleFade, scrollRight, scrollBottom' - - mobileFx : '', //leave empty if you want to display the same effect on mobile devices and on desktop etc. - - gridDifference : 250, //to make the grid blocks slower than the slices, this value must be smaller than transPeriod - - height : '50%', //here you can type pixels (for instance '300px'), a percentage (relative to the width of the slideshow, for instance '50%') or 'auto' - - imagePath : 'images/', //he path to the image folder (it serves for the blank.gif, when you want to display videos) - - hover : true, //true, false. Puase on state hover. Not available for mobile devices - - loader : 'pie', //pie, bar, none (even if you choose "pie", old browsers like IE8- can't display it... they will display always a loading bar) - - loaderColor : '#eeeeee', - - loaderBgColor : '#222222', - - loaderOpacity : .8, //0, .1, .2, .3, .4, .5, .6, .7, .8, .9, 1 - - loaderPadding : 2, //how many empty pixels you want to display between the loader and its background - - loaderStroke : 7, //the thickness both of the pie loader and of the bar loader. Remember: for the pie, the loader thickness must be less than a half of the pie diameter - - minHeight : '200px', //you can also leave it blank - - navigation : true, //true or false, to display or not the navigation buttons - - navigationHover : true, //if true the navigation button (prev, next and play/stop buttons) will be visible on hover state only, if false they will be visible always - - mobileNavHover : true, //same as above, but only for mobile devices - - opacityOnGrid : false, //true, false. Decide to apply a fade effect to blocks and slices: if your slideshow is fullscreen or simply big, I recommend to set it false to have a smoother effect - - overlayer : true, //a layer on the images to prevent the users grab them simply by clicking the right button of their mouse (.camera_overlayer) - - pagination : true, - - playPause : true, //true or false, to display or not the play/pause buttons - - pauseOnClick : true, //true, false. It stops the slideshow when you click the sliders. - - pieDiameter : 38, - - piePosition : 'rightTop', //'rightTop', 'leftTop', 'leftBottom', 'rightBottom' - - portrait : false, //true, false. Select true if you don't want that your images are cropped - - rows : 4, - - slicedCols : 12, //if 0 the same value of cols - - slicedRows : 8, //if 0 the same value of rows - - slideOn : 'random', //next, prev, random: decide if the transition effect will be applied to the current (prev) or the next slide - - thumbnails : false, - - time : 7000, //milliseconds between the end of the sliding effect and the start of the nex one - - transPeriod : 1500, //lenght of the sliding effect in milliseconds - -////////callbacks - - onEndTransition : function() { }, //this callback is invoked when the transition effect ends - - onLoaded : function() { }, //this callback is invoked when the image on a slide has completely loaded - - onStartLoading : function() { }, //this callback is invoked when the image on a slide start loading - - onStartTransition : function() { } //this callback is invoked when the transition effect starts - - }; - - - function isMobile() { - if( navigator.userAgent.match(/Android/i) || - navigator.userAgent.match(/webOS/i) || - navigator.userAgent.match(/iPad/i) || - navigator.userAgent.match(/iPhone/i) || - navigator.userAgent.match(/iPod/i) - ){ - return true; - } - } - - var opts = $.extend({}, defaults, opts); - - var wrap = $(this).addClass('camera_wrap'); - - wrap.wrapInner( - '
' - ).wrapInner( - '
' - ); - - var fakeHover = $('.camera_fakehover',wrap); - - fakeHover.append( - '
' - ); - if(opts.overlayer == true){ - fakeHover.append( - '
' - ) - } - fakeHover.append( - '
' - ); - - var loader; - - if(opts.loader=='pie' && $.browser.msie && $.browser.version < 9){ - loader = 'bar'; - } else { - loader = opts.loader; - } - - if(loader == 'pie'){ - fakeHover.append( - '
' - ) - } else if (loader == 'bar') { - fakeHover.append( - '
' - ) - } else { - fakeHover.append( - '' - ) - } - - if(opts.playPause==true){ - fakeHover.append( - '
' - ) - } - - if(opts.navigation==true){ - fakeHover.append( - '
' - ).append( - '
' - ); - } - - if(opts.thumbnails==true){ - wrap.append( - '
' - ); - } - - if(opts.thumbnails==true && opts.pagination!=true){ - $('.camera_thumbs_cont',wrap).wrap( - '
' - ).wrap( - '
' - ).wrap( - '
' - ).wrap( - '
' - ); - } - - if(opts.pagination==true){ - wrap.append( - '
' - ); - } - - wrap.append( - '
' - ); - - $('.camera_caption',wrap).each(function(){ - $(this).wrapInner('
'); - }); - - - var pieID = 'pie_'+wrap.index(), - elem = $('.camera_src',wrap), - target = $('.camera_target',wrap), - content = $('.camera_target_content',wrap), - pieContainer = $('.camera_pie',wrap), - barContainer = $('.camera_bar',wrap), - prevNav = $('.camera_prev',wrap), - nextNav = $('.camera_next',wrap), - commands = $('.camera_commands',wrap), - pagination = $('.camera_pag',wrap), - thumbs = $('.camera_thumbs_cont',wrap); - - - var w, - h; - - - var allImg = new Array(); - $('> div', elem).each( function() { - allImg.push($(this).attr('data-src')); - }); - - var allLinks = new Array(); - $('> div', elem).each( function() { - if($(this).attr('data-link')){ - allLinks.push($(this).attr('data-link')); - } else { - allLinks.push(''); - } - }); - - var allTargets = new Array(); - $('> div', elem).each( function() { - if($(this).attr('data-target')){ - allTargets.push($(this).attr('data-target')); - } else { - allTargets.push(''); - } - }); - - var allPor = new Array(); - $('> div', elem).each( function() { - if($(this).attr('data-portrait')){ - allPor.push($(this).attr('data-portrait')); - } else { - allPor.push(''); - } - }); - - var allAlign= new Array(); - $('> div', elem).each( function() { - if($(this).attr('data-alignment')){ - allAlign.push($(this).attr('data-alignment')); - } else { - allAlign.push(''); - } - }); - - - var allThumbs = new Array(); - $('> div', elem).each( function() { - if($(this).attr('data-thumb')){ - allThumbs.push($(this).attr('data-thumb')); - } else { - allThumbs.push(''); - } - }); - - var amountSlide = allImg.length; - - $(content).append('
'); - var loopMove; - for (loopMove=0;loopMove'); - if(allLinks[loopMove]!=''){ - //only for Wordpress plugin - var dataBox = $('> div ',elem).eq(loopMove).attr('data-box'); - if(typeof dataBox !== 'undefined' && dataBox !== false && dataBox != '') { - dataBox = 'data-box="'+$('> div ',elem).eq(loopMove).attr('data-box')+'"'; - } else { - dataBox = ''; - } - // - $('.camera_target_content .cameraContent:eq('+loopMove+')',wrap).append(''); - } - - } - $('.camera_caption',wrap).each(function(){ - var ind = $(this).parent().index(), - cont = wrap.find('.cameraContent').eq(ind); - $(this).appendTo(cont); - }); - - target.append('
'); - var cameraCont = $('.cameraCont',wrap); - - - - var loop; - for (loop=0;loop'); - var div = $('> div:eq('+loop+')',elem); - target.find('.cameraSlide_'+loop).clone(div); - } - - - function thumbnailVisible() { - var wTh = $(thumbs).width(); - $('li', thumbs).removeClass('camera_visThumb'); - $('li', thumbs).each(function(){ - var pos = $(this).position(), - ulW = $('ul', thumbs).outerWidth(), - offUl = $('ul', thumbs).offset().left, - offDiv = $('> div',thumbs).offset().left, - ulLeft = offDiv-offUl; - if(ulLeft>0){ - $('.camera_prevThumbs',camera_thumbs_wrap).removeClass('hideNav'); - } else { - $('.camera_prevThumbs',camera_thumbs_wrap).addClass('hideNav'); - } - if((ulW-ulLeft)>wTh){ - $('.camera_nextThumbs',camera_thumbs_wrap).removeClass('hideNav'); - } else { - $('.camera_nextThumbs',camera_thumbs_wrap).addClass('hideNav'); - } - var left = pos.left, - right = pos.left+($(this).width()); - if(right-ulLeft<=wTh && left-ulLeft>=0){ - $(this).addClass('camera_visThumb'); - } - }); - } - - $(window).bind('load resize pageshow',function(){ - thumbnailPos(); - thumbnailVisible(); - }); - - - cameraCont.append('
'); - - - var started; - - wrap.show(); - var w = target.width(); - var h = target.height(); - - var setPause; - - $(window).bind('resize pageshow',function(){ - if(started == true) { - resizeImage(); - } - $('ul', thumbs).animate({'margin-top':0},0,thumbnailPos); - if(!elem.hasClass('paused')){ - elem.addClass('paused'); - if($('.camera_stop',camera_thumbs_wrap).length){ - $('.camera_stop',camera_thumbs_wrap).hide() - $('.camera_play',camera_thumbs_wrap).show(); - if(loader!='none'){ - $('#'+pieID).hide(); - } - } else { - if(loader!='none'){ - $('#'+pieID).hide(); - } - } - clearTimeout(setPause); - setPause = setTimeout(function(){ - elem.removeClass('paused'); - if($('.camera_play',camera_thumbs_wrap).length){ - $('.camera_play',camera_thumbs_wrap).hide(); - $('.camera_stop',camera_thumbs_wrap).show(); - if(loader!='none'){ - $('#'+pieID).fadeIn(); - } - } else { - if(loader!='none'){ - $('#'+pieID).fadeIn(); - } - } - },1500); - } - }); - - function resizeImage(){ - var res; - function resizeImageWork(){ - w = wrap.width(); - if(opts.height.indexOf('%')!=-1) { - var startH = Math.round(w / (100/parseFloat(opts.height))); - if(opts.minHeight != '' && startH < parseFloat(opts.minHeight)){ - h = parseFloat(opts.minHeight); - } else { - h = startH; - } - wrap.css({height:h}); - } else if (opts.height=='auto') { - h = wrap.height(); - } else { - h = parseFloat(opts.height); - wrap.css({height:h}); - } - $('.camerarelative',target).css({'width':w,'height':h}); - $('.imgLoaded',target).each(function(){ - var t = $(this), - wT = t.attr('width'), - hT = t.attr('height'), - imgLoadIn = t.index(), - mTop, - mLeft, - alignment = t.attr('data-alignment'), - portrait = t.attr('data-portrait'); - - if(typeof alignment === 'undefined' || alignment === false || alignment === ''){ - alignment = opts.alignment; - } - - if(typeof portrait === 'undefined' || portrait === false || portrait === ''){ - portrait = opts.portrait; - } - - if(portrait==false||portrait=='false'){ - if((wT/hT)<(w/h)) { - var r = w / wT; - var d = (Math.abs(h - (hT*r)))*0.5; - switch(alignment){ - case 'topLeft': - mTop = 0; - break; - case 'topCenter': - mTop = 0; - break; - case 'topRight': - mTop = 0; - break; - case 'centerLeft': - mTop = '-'+d+'px'; - break; - case 'center': - mTop = '-'+d+'px'; - break; - case 'centerRight': - mTop = '-'+d+'px'; - break; - case 'bottomLeft': - mTop = '-'+d*2+'px'; - break; - case 'bottomCenter': - mTop = '-'+d*2+'px'; - break; - case 'bottomRight': - mTop = '-'+d*2+'px'; - break; - } - t.css({ - 'height' : hT*r, - 'margin-left' : 0, - 'margin-right' : 0, - 'margin-top' : mTop, - 'position' : 'absolute', - 'visibility' : 'visible', - 'width' : w - }); - } - else { - var r = h / hT; - var d = (Math.abs(w - (wT*r)))*0.5; - switch(alignment){ - case 'topLeft': - mLeft = 0; - break; - case 'topCenter': - mLeft = '-'+d+'px'; - break; - case 'topRight': - mLeft = '-'+d*2+'px'; - break; - case 'centerLeft': - mLeft = 0; - break; - case 'center': - mLeft = '-'+d+'px'; - break; - case 'centerRight': - mLeft = '-'+d*2+'px'; - break; - case 'bottomLeft': - mLeft = 0; - break; - case 'bottomCenter': - mLeft = '-'+d+'px'; - break; - case 'bottomRight': - mLeft = '-'+d*2+'px'; - break; - } - t.css({ - 'height' : h, - 'margin-left' : mLeft, - 'margin-right' : mLeft, - 'margin-top' : 0, - 'position' : 'absolute', - 'visibility' : 'visible', - 'width' : wT*r - }); - } - } else { - if((wT/hT)<(w/h)) { - var r = h / hT; - var d = (Math.abs(w - (wT*r)))*0.5; - switch(alignment){ - case 'topLeft': - mLeft = 0; - break; - case 'topCenter': - mLeft = d+'px'; - break; - case 'topRight': - mLeft = d*2+'px'; - break; - case 'centerLeft': - mLeft = 0; - break; - case 'center': - mLeft = d+'px'; - break; - case 'centerRight': - mLeft = d*2+'px'; - break; - case 'bottomLeft': - mLeft = 0; - break; - case 'bottomCenter': - mLeft = d+'px'; - break; - case 'bottomRight': - mLeft = d*2+'px'; - break; - } - t.css({ - 'height' : h, - 'margin-left' : mLeft, - 'margin-right' : mLeft, - 'margin-top' : 0, - 'position' : 'absolute', - 'visibility' : 'visible', - 'width' : wT*r - }); - } - else { - var r = w / wT; - var d = (Math.abs(h - (hT*r)))*0.5; - switch(alignment){ - case 'topLeft': - mTop = 0; - break; - case 'topCenter': - mTop = 0; - break; - case 'topRight': - mTop = 0; - break; - case 'centerLeft': - mTop = d+'px'; - break; - case 'center': - mTop = d+'px'; - break; - case 'centerRight': - mTop = d+'px'; - break; - case 'bottomLeft': - mTop = d*2+'px'; - break; - case 'bottomCenter': - mTop = d*2+'px'; - break; - case 'bottomRight': - mTop = d*2+'px'; - break; - } - t.css({ - 'height' : hT*r, - 'margin-left' : 0, - 'margin-right' : 0, - 'margin-top' : mTop, - 'position' : 'absolute', - 'visibility' : 'visible', - 'width' : w - }); - } - } - }); - } - if (started == true) { - clearTimeout(res); - res = setTimeout(resizeImageWork,200); - } else { - resizeImageWork(); - } - - started = true; - } - - - var u, - setT; - - var clickEv, - autoAdv, - navHover, - commands, - pagination; - - var videoHover, - videoPresent; - - if(isMobile() && opts.mobileAutoAdvance!=''){ - autoAdv = opts.mobileAutoAdvance; - } else { - autoAdv = opts.autoAdvance; - } - - if(autoAdv==false){ - elem.addClass('paused'); - } - - if(isMobile() && opts.mobileNavHover!=''){ - navHover = opts.mobileNavHover; - } else { - navHover = opts.navigationHover; - } - - if(elem.length!=0){ - - var selector = $('.cameraSlide',target); - selector.wrapInner('
'); - - var navSlide; - - var barDirection = opts.barDirection; - - var camera_thumbs_wrap = wrap; - - - $('iframe',fakeHover).each(function(){ - var t = $(this); - var src = t.attr('src'); - t.attr('data-src',src); - var divInd = t.parent().index('.camera_src > div'); - $('.camera_target_content .cameraContent:eq('+divInd+')',wrap).append(t); - }); - function imgFake() { - $('iframe',fakeHover).each(function(){ - $('.camera_caption',fakeHover).show(); - var t = $(this); - var cloneSrc = t.attr('data-src'); - t.attr('src',cloneSrc); - var imgFakeUrl = opts.imagePath+'blank.gif'; - var imgFake = new Image(); - imgFake.src = imgFakeUrl; - if(opts.height.indexOf('%')!=-1) { - var startH = Math.round(w / (100/parseFloat(opts.height))); - if(opts.minHeight != '' && startH < parseFloat(opts.minHeight)){ - h = parseFloat(opts.minHeight); - } else { - h = startH; - } - } else if (opts.height=='auto') { - h = wrap.height(); - } else { - h = parseFloat(opts.height); - } - t.after($(imgFake).attr({'class':'imgFake','width':w,'height':h})); - var clone = t.clone(); - t.remove(); - $(imgFake).bind('click',function(){ - if($(this).css('position')=='absolute') { - $(this).remove(); - if(cloneSrc.indexOf('vimeo') != -1 || cloneSrc.indexOf('youtube') != -1) { - if(cloneSrc.indexOf('?') != -1){ - autoplay = '&autoplay=1'; - } else { - autoplay = '?autoplay=1'; - } - } else if(cloneSrc.indexOf('dailymotion') != -1) { - if(cloneSrc.indexOf('?') != -1){ - autoplay = '&autoPlay=1'; - } else { - autoplay = '?autoPlay=1'; - } - } - clone.attr('src',cloneSrc+autoplay); - videoPresent = true; - } else { - $(this).css({position:'absolute',top:0,left:0,zIndex:10}).after(clone); - clone.css({position:'absolute',top:0,left:0,zIndex:9}); - } - }); - }); - } - - imgFake(); - - - if(opts.hover==true){ - if(!isMobile()){ - fakeHover.hover(function(){ - elem.addClass('hovered'); - },function(){ - elem.removeClass('hovered'); - }); - } - } - - if(navHover==true){ - $(prevNav,wrap).animate({opacity:0},0); - $(nextNav,wrap).animate({opacity:0},0); - $(commands,wrap).animate({opacity:0},0); - if(isMobile()){ - fakeHover.live('vmouseover',function(){ - $(prevNav,wrap).animate({opacity:1},200); - $(nextNav,wrap).animate({opacity:1},200); - $(commands,wrap).animate({opacity:1},200); - }); - fakeHover.live('vmouseout',function(){ - $(prevNav,wrap).delay(500).animate({opacity:0},200); - $(nextNav,wrap).delay(500).animate({opacity:0},200); - $(commands,wrap).delay(500).animate({opacity:0},200); - }); - } else { - fakeHover.hover(function(){ - $(prevNav,wrap).animate({opacity:1},200); - $(nextNav,wrap).animate({opacity:1},200); - $(commands,wrap).animate({opacity:1},200); - },function(){ - $(prevNav,wrap).animate({opacity:0},200); - $(nextNav,wrap).animate({opacity:0},200); - $(commands,wrap).animate({opacity:0},200); - }); - } - } - - - $('.camera_stop',camera_thumbs_wrap).live('click',function(){ - autoAdv = false; - elem.addClass('paused'); - if($('.camera_stop',camera_thumbs_wrap).length){ - $('.camera_stop',camera_thumbs_wrap).hide() - $('.camera_play',camera_thumbs_wrap).show(); - if(loader!='none'){ - $('#'+pieID).hide(); - } - } else { - if(loader!='none'){ - $('#'+pieID).hide(); - } - } - }); - - $('.camera_play',camera_thumbs_wrap).live('click',function(){ - autoAdv = true; - elem.removeClass('paused'); - if($('.camera_play',camera_thumbs_wrap).length){ - $('.camera_play',camera_thumbs_wrap).hide(); - $('.camera_stop',camera_thumbs_wrap).show(); - if(loader!='none'){ - $('#'+pieID).show(); - } - } else { - if(loader!='none'){ - $('#'+pieID).show(); - } - } - }); - - if(opts.pauseOnClick==true){ - $('.camera_target_content',fakeHover).mouseup(function(){ - autoAdv = false; - elem.addClass('paused'); - $('.camera_stop',camera_thumbs_wrap).hide() - $('.camera_play',camera_thumbs_wrap).show(); - $('#'+pieID).hide(); - }); - } - $('.cameraContent, .imgFake',fakeHover).hover(function(){ - videoHover = true; - },function(){ - videoHover = false; - }); - - $('.cameraContent, .imgFake',fakeHover).bind('click',function(){ - if(videoPresent == true && videoHover == true) { - autoAdv = false; - $('.camera_caption',fakeHover).hide(); - elem.addClass('paused'); - $('.camera_stop',camera_thumbs_wrap).hide() - $('.camera_play',camera_thumbs_wrap).show(); - $('#'+pieID).hide(); - } - }); - - - } - - - function shuffle(arr) { - for( - var j, x, i = arr.length; i; - j = parseInt(Math.random() * i), - x = arr[--i], arr[i] = arr[j], arr[j] = x - ); - return arr; - } - - function isInteger(s) { - return Math.ceil(s) == Math.floor(s); - } - - if (loader != 'pie') { - barContainer.append(''); - $('.camera_bar_cont',barContainer) - .animate({opacity:opts.loaderOpacity},0) - .css({'position':'absolute', 'left':0, 'right':0, 'top':0, 'bottom':0, 'background-color':opts.loaderBgColor}) - .append(''); - $('#'+pieID).animate({opacity:0},0); - var canvas = $('#'+pieID); - canvas.css({'position':'absolute', 'background-color':opts.loaderColor}); - switch(opts.barPosition){ - case 'left': - barContainer.css({right:'auto',width:opts.loaderStroke}); - break; - case 'right': - barContainer.css({left:'auto',width:opts.loaderStroke}); - break; - case 'top': - barContainer.css({bottom:'auto',height:opts.loaderStroke}); - break; - case 'bottom': - barContainer.css({top:'auto',height:opts.loaderStroke}); - break; - } - switch(barDirection){ - case 'leftToRight': - canvas.css({'left':0, 'right':0, 'top':opts.loaderPadding, 'bottom':opts.loaderPadding}); - break; - case 'rightToLeft': - canvas.css({'left':0, 'right':0, 'top':opts.loaderPadding, 'bottom':opts.loaderPadding}); - break; - case 'topToBottom': - canvas.css({'left':opts.loaderPadding, 'right':opts.loaderPadding, 'top':0, 'bottom':0}); - break; - case 'bottomToTop': - canvas.css({'left':opts.loaderPadding, 'right':opts.loaderPadding, 'top':0, 'bottom':0}); - break; - } - } else { - pieContainer.append(''); - var G_vmlCanvasManager; - var canvas = document.getElementById(pieID); - canvas.setAttribute("width", opts.pieDiameter); - canvas.setAttribute("height", opts.pieDiameter); - var piePosition; - switch(opts.piePosition){ - case 'leftTop' : - piePosition = 'left:0; top:0;'; - break; - case 'rightTop' : - piePosition = 'right:0; top:0;'; - break; - case 'leftBottom' : - piePosition = 'left:0; bottom:0;'; - break; - case 'rightBottom' : - piePosition = 'right:0; bottom:0;'; - break; - } - canvas.setAttribute("style", "position:absolute; z-index:1002; "+piePosition); - var rad; - var radNew; - - if (canvas && canvas.getContext) { - var ctx = canvas.getContext("2d"); - ctx.rotate(Math.PI*(3/2)); - ctx.translate(-opts.pieDiameter,0); - } - - } - if(loader=='none' || autoAdv==false) { - $('#'+pieID).hide(); - $('.camera_canvas_wrap',camera_thumbs_wrap).hide(); - } - - if($(pagination).length) { - $(pagination).append('
    '); - var li; - for (li = 0; li < amountSlide; li++){ - $('.camera_pag_ul',wrap).append('
  • '+li+'
    • '); - } - $('.camera_pag_ul li',wrap).hover(function(){ - $(this).addClass('camera_hover'); - if($('.camera_thumb',this).length){ - var wTh = $('.camera_thumb',this).outerWidth(), - hTh = $('.camera_thumb',this).outerHeight(), - wTt = $(this).outerWidth(); - $('.camera_thumb',this).show().css({'top':'-'+hTh+'px','left':'-'+(wTh-wTt)/2+'px'}).animate({'opacity':1,'margin-top':'-3px'},200); - $('.thumb_arrow',this).show().animate({'opacity':1,'margin-top':'-3px'},200); - } - },function(){ - $(this).removeClass('camera_hover'); - $('.camera_thumb',this).animate({'margin-top':'-20px','opacity':0},200,function(){ - $(this).css({marginTop:'5px'}).hide(); - }); - $('.thumb_arrow',this).animate({'margin-top':'-20px','opacity':0},200,function(){ - $(this).css({marginTop:'5px'}).hide(); - }); - }); - } - - - - if($(thumbs).length) { - var thumbUrl; - if(!$(pagination).length) { - $(thumbs).append('
    '); - $(thumbs).before('
    ').before('
    '); - $('> div',thumbs).append('
      '); - $.each(allThumbs, function(i, val) { - if($('> div', elem).eq(i).attr('data-thumb')!='') { - var thumbUrl = $('> div', elem).eq(i).attr('data-thumb'), - newImg = new Image(); - newImg.src = thumbUrl; - $('ul',thumbs).append('
    • '); - $('li.pix_thumb_'+i,thumbs).append($(newImg).attr('class','camera_thumb')); - } - }); - } else { - $.each(allThumbs, function(i, val) { - if($('> div', elem).eq(i).attr('data-thumb')!='') { - var thumbUrl = $('> div', elem).eq(i).attr('data-thumb'), - newImg = new Image(); - newImg.src = thumbUrl; - $('li.pag_nav_'+i,pagination).append($(newImg).attr('class','camera_thumb').css({'position':'absolute'}).animate({opacity:0},0)); - $('li.pag_nav_'+i+' > img',pagination).after('
      '); - $('li.pag_nav_'+i+' > .thumb_arrow',pagination).animate({opacity:0},0); - } - }); - wrap.css({marginBottom:$(pagination).outerHeight()}); - } - } else if(!$(thumbs).length && $(pagination).length) { - wrap.css({marginBottom:$(pagination).outerHeight()}); - } - - - var firstPos = true; - - function thumbnailPos() { - if($(thumbs).length && !$(pagination).length) { - var wTh = $(thumbs).outerWidth(), - owTh = $('ul > li',thumbs).outerWidth(), - pos = $('li.cameracurrent', thumbs).length ? $('li.cameracurrent', thumbs).position() : '', - ulW = ($('ul > li', thumbs).length * $('ul > li', thumbs).outerWidth()), - offUl = $('ul', thumbs).offset().left, - offDiv = $('> div', thumbs).offset().left, - ulLeft; - - if(offUl<0){ - ulLeft = '-'+ (offDiv-offUl); - } else { - ulLeft = offDiv-offUl; - } - - - - if(firstPos == true) { - $('ul', thumbs).width($('ul > li', thumbs).length * $('ul > li', thumbs).outerWidth()); - if($(thumbs).length && !$(pagination).lenght) { - wrap.css({marginBottom:$(thumbs).outerHeight()}); - } - thumbnailVisible(); - /*I repeat this two lines because of a problem with iPhones*/ - $('ul', thumbs).width($('ul > li', thumbs).length * $('ul > li', thumbs).outerWidth()); - if($(thumbs).length && !$(pagination).lenght) { - wrap.css({marginBottom:$(thumbs).outerHeight()}); - } - /*...*/ - } - firstPos = false; - - var left = $('li.cameracurrent', thumbs).length ? pos.left : '', - right = $('li.cameracurrent', thumbs).length ? pos.left+($('li.cameracurrent', thumbs).outerWidth()) : ''; - if(left<$('li.cameracurrent', thumbs).outerWidth()) { - left = 0; - } - if(right-ulLeft>wTh){ - if((left+wTh)
      ').append('
      '); - if(autoAdv==true){ - $('.camera_play',camera_thumbs_wrap).hide(); - $('.camera_stop',camera_thumbs_wrap).show(); - } else { - $('.camera_stop',camera_thumbs_wrap).hide(); - $('.camera_play',camera_thumbs_wrap).show(); - } - - } - - - function canvasLoader() { - rad = 0; - var barWidth = $('.camera_bar_cont',camera_thumbs_wrap).width(), - barHeight = $('.camera_bar_cont',camera_thumbs_wrap).height(); - - if (loader != 'pie') { - switch(barDirection){ - case 'leftToRight': - $('#'+pieID).css({'right':barWidth}); - break; - case 'rightToLeft': - $('#'+pieID).css({'left':barWidth}); - break; - case 'topToBottom': - $('#'+pieID).css({'bottom':barHeight}); - break; - case 'bottomToTop': - $('#'+pieID).css({'top':barHeight}); - break; - } - } else { - ctx.clearRect(0,0,opts.pieDiameter,opts.pieDiameter); - } - } - - - canvasLoader(); - - - $('.moveFromLeft, .moveFromRight, .moveFromTop, .moveFromBottom, .fadeIn, .fadeFromLeft, .fadeFromRight, .fadeFromTop, .fadeFromBottom',fakeHover).each(function(){ - $(this).css('visibility','hidden'); - }); - - opts.onStartLoading.call(this); - - nextSlide(); - - - /*************************** FUNCTION nextSlide() ***************************/ - - function nextSlide(navSlide){ - elem.addClass('camerasliding'); - - videoPresent = false; - var vis = parseFloat($('div.cameraSlide.cameracurrent',target).index()); - - if(navSlide>0){ - var slideI = navSlide-1; - } else if (vis == amountSlide-1) { - var slideI = 0; - } else { - var slideI = vis+1; - } - - - var slide = $('.cameraSlide:eq('+slideI+')',target); - var slideNext = $('.cameraSlide:eq('+(slideI+1)+')',target).addClass('cameranext'); - if( vis != slideI+1 ) { - slideNext.hide(); - } - $('.cameraContent',fakeHover).fadeOut(600); - $('.camera_caption',fakeHover).show(); - - $('.camerarelative',slide).append($('> div ',elem).eq(slideI).find('> div.camera_effected')); - - $('.camera_target_content .cameraContent:eq('+slideI+')',wrap).append($('> div ',elem).eq(slideI).find('> div')); - - if(!$('.imgLoaded',slide).length){ - var imgUrl = allImg[slideI]; - var imgLoaded = new Image(); - imgLoaded.src = imgUrl +"?"+ new Date().getTime(); - slide.css('visibility','hidden'); - slide.prepend($(imgLoaded).attr('class','imgLoaded').css('visibility','hidden')); - var wT, hT; - if (!$(imgLoaded).get(0).complete || wT == '0' || hT == '0' || typeof wT === 'undefined' || wT === false || typeof hT === 'undefined' || hT === false) { - $('.camera_loader',wrap).delay(500).fadeIn(400); - imgLoaded.onload = function() { - wT = imgLoaded.naturalWidth; - hT = imgLoaded.naturalHeight; - $(imgLoaded).attr('data-alignment',allAlign[slideI]).attr('data-portrait',allPor[slideI]); - $(imgLoaded).attr('width',wT); - $(imgLoaded).attr('height',hT); - target.find('.cameraSlide_'+slideI).hide().css('visibility','visible'); - resizeImage(); - nextSlide(slideI+1); - }; - } - } else { - if( allImg.length > (slideI+1) && !$('.imgLoaded',slideNext).length ){ - var imgUrl2 = allImg[(slideI+1)]; - var imgLoaded2 = new Image(); - imgLoaded2.src = imgUrl2 +"?"+ new Date().getTime(); - slideNext.prepend($(imgLoaded2).attr('class','imgLoaded').css('visibility','hidden')); - imgLoaded2.onload = function() { - wT = imgLoaded2.naturalWidth; - hT = imgLoaded2.naturalHeight; - $(imgLoaded2).attr('data-alignment',allAlign[slideI+1]).attr('data-portrait',allPor[slideI+1]); - $(imgLoaded2).attr('width',wT); - $(imgLoaded2).attr('height',hT); - resizeImage(); - }; - } - opts.onLoaded.call(this); - if($('.camera_loader',wrap).is(':visible')){ - $('.camera_loader',wrap).fadeOut(400); - } else { - $('.camera_loader',wrap).css({'visibility':'hidden'}); - $('.camera_loader',wrap).fadeOut(400,function(){ - $('.camera_loader',wrap).css({'visibility':'visible'}); - }); - } - var rows = opts.rows, - cols = opts.cols, - couples = 1, - difference = 0, - dataSlideOn, - time, - transPeriod, - fx, - easing, - randomFx = new Array('simpleFade','curtainTopLeft','curtainTopRight','curtainBottomLeft','curtainBottomRight','curtainSliceLeft','curtainSliceRight','blindCurtainTopLeft','blindCurtainTopRight','blindCurtainBottomLeft','blindCurtainBottomRight','blindCurtainSliceBottom','blindCurtainSliceTop','stampede','mosaic','mosaicReverse','mosaicRandom','mosaicSpiral','mosaicSpiralReverse','topLeftBottomRight','bottomRightTopLeft','bottomLeftTopRight','topRightBottomLeft','scrollLeft','scrollRight','scrollTop','scrollBottom','scrollHorz'); - marginLeft = 0, - marginTop = 0, - opacityOnGrid = 0; - - if(opts.opacityOnGrid==true){ - opacityOnGrid = 0; - } else { - opacityOnGrid = 1; - } - - - - var dataFx = $(' > div',elem).eq(slideI).attr('data-fx'); - - if(isMobile()&&opts.mobileFx!=''&&opts.mobileFx!='default'){ - fx = opts.mobileFx; - } else { - if(typeof dataFx !== 'undefined' && dataFx!== false && dataFx!== 'default'){ - fx = dataFx; - } else { - fx = opts.fx; - } - } - - if(fx=='random') { - fx = shuffle(randomFx); - fx = fx[0]; - } else { - fx = fx; - if(fx.indexOf(',')>0){ - fx = fx.replace(/ /g,''); - fx = fx.split(','); - fx = shuffle(fx); - fx = fx[0]; - } - } - - dataEasing = $(' > div',elem).eq(slideI).attr('data-easing'); - mobileEasing = $(' > div',elem).eq(slideI).attr('data-mobileEasing'); - - if(isMobile()&&opts.mobileEasing!=''&&opts.mobileEasing!='default'){ - if(typeof mobileEasing !== 'undefined' && mobileEasing!== false && mobileEasing!== 'default') { - easing = mobileEasing; - } else { - easing = opts.mobileEasing; - } - } else { - if(typeof dataEasing !== 'undefined' && dataEasing!== false && dataEasing!== 'default') { - easing = dataEasing; - } else { - easing = opts.easing; - } - } - - dataSlideOn = $(' > div',elem).eq(slideI).attr('data-slideOn'); - if(typeof dataSlideOn !== 'undefined' && dataSlideOn!== false){ - slideOn = dataSlideOn; - } else { - if(opts.slideOn=='random'){ - var slideOn = new Array('next','prev'); - slideOn = shuffle(slideOn); - slideOn = slideOn[0]; - } else { - slideOn = opts.slideOn; - } - } - - var dataTime = $(' > div',elem).eq(slideI).attr('data-time'); - if(typeof dataTime !== 'undefined' && dataTime!== false && dataTime!== ''){ - time = parseFloat(dataTime); - } else { - time = opts.time; - } - - var dataTransPeriod = $(' > div',elem).eq(slideI).attr('data-transPeriod'); - if(typeof dataTransPeriod !== 'undefined' && dataTransPeriod!== false && dataTransPeriod!== ''){ - transPeriod = parseFloat(dataTransPeriod); - } else { - transPeriod = opts.transPeriod; - } - - if(!$(elem).hasClass('camerastarted')){ - fx = 'simpleFade'; - slideOn = 'next'; - easing = ''; - transPeriod = 400; - $(elem).addClass('camerastarted') - } - - switch(fx){ - case 'simpleFade': - cols = 1; - rows = 1; - break; - case 'curtainTopLeft': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'curtainTopRight': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'curtainBottomLeft': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'curtainBottomRight': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'curtainSliceLeft': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'curtainSliceRight': - if(opts.slicedCols == 0) { - cols = opts.cols; - } else { - cols = opts.slicedCols; - } - rows = 1; - break; - case 'blindCurtainTopLeft': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'blindCurtainTopRight': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'blindCurtainBottomLeft': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'blindCurtainBottomRight': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'blindCurtainSliceTop': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'blindCurtainSliceBottom': - if(opts.slicedRows == 0) { - rows = opts.rows; - } else { - rows = opts.slicedRows; - } - cols = 1; - break; - case 'stampede': - difference = '-'+transPeriod; - break; - case 'mosaic': - difference = opts.gridDifference; - break; - case 'mosaicReverse': - difference = opts.gridDifference; - break; - case 'mosaicRandom': - break; - case 'mosaicSpiral': - difference = opts.gridDifference; - couples = 1.7; - break; - case 'mosaicSpiralReverse': - difference = opts.gridDifference; - couples = 1.7; - break; - case 'topLeftBottomRight': - difference = opts.gridDifference; - couples = 6; - break; - case 'bottomRightTopLeft': - difference = opts.gridDifference; - couples = 6; - break; - case 'bottomLeftTopRight': - difference = opts.gridDifference; - couples = 6; - break; - case 'topRightBottomLeft': - difference = opts.gridDifference; - couples = 6; - break; - case 'scrollLeft': - cols = 1; - rows = 1; - break; - case 'scrollRight': - cols = 1; - rows = 1; - break; - case 'scrollTop': - cols = 1; - rows = 1; - break; - case 'scrollBottom': - cols = 1; - rows = 1; - break; - case 'scrollHorz': - cols = 1; - rows = 1; - break; - } - - var cycle = 0; - var blocks = rows*cols; - var leftScrap = w-(Math.floor(w/cols)*cols); - var topScrap = h-(Math.floor(h/rows)*rows); - var addLeft; - var addTop; - var tAppW = 0; - var tAppH = 0; - var arr = new Array(); - var delay = new Array(); - var order = new Array(); - while(cycle < blocks){ - arr.push(cycle); - delay.push(cycle); - cameraCont.append('