You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

1 lines
8.0 KiB

(function(e,t,n,o){e.fn.shape=function(t){var i,a=e(this),s=e.extend(!0,{},e.fn.shape.settings,t),r="."+s.namespace,c="module-"+s.namespace,l=a.selector||"",u=(new Date).getTime(),d=[],f=arguments[0],m="string"==typeof f,p=[].slice.call(arguments,1);return a.each(function(){var t,g,h,v=e(this),b=v.find(s.selector.sides),y=v.find(s.selector.side),x="transitionend msTransitionEnd oTransitionEnd webkitTransitionEnd",w=this,C=v.data(c),k=(s.namespace,s.error),T=s.className;h={initialize:function(){h.verbose("Initializing module for",w),h.set.defaultSide(),C=h,v.data(c,C)},destroy:function(){h.verbose("Destroying previous module for",w),v.removeData(c).off(r)},refresh:function(){h.verbose("Refreshing selector cache for",w),v=e(w),b=e(this).find(s.selector.shape),y=e(this).find(s.selector.side)},repaint:function(){h.verbose("Forcing repaint event");var e=b.get(0)||n.createElement("div");e.offsetWidth},animate:function(n,o){h.verbose("Animating box with properties",n),o=o||function(t){h.reset(),h.set.active(),e.proxy(s.onChange,g)(),t.stopImmediatePropagation()},s.useCSS?(h.verbose("Starting CSS animation"),v.addClass(T.animating),h.set.stageSize(),h.repaint(),v.addClass(T.css),t.addClass(T.hidden),b.css(n).one(x,o)):(h.verbose("Starting javascript animation"),v.addClass(T.animating).removeClass(T.css),h.set.stageSize(),h.repaint(),t.animate({opacity:0},s.duration,s.easing),b.animate(n,s.duration,s.easing,o))},queue:function(e){h.debug("Queueing animation of",e),b.one(x,function(){h.debug("Executing queued animation"),v.shape(e)})},reset:function(){h.verbose("Animating states reset"),v.removeClass(T.css).removeClass(T.animating).removeAttr("style"),b.removeAttr("style"),y.removeAttr("style").removeClass(T.hidden),g.removeClass(T.animating).removeAttr("style")},is:{animating:function(){return v.hasClass(T.animating)}},get:{nextSide:function(){return t.next(s.selector.side).size()>0?t.next(s.selector.side):v.find(s.selector.side).first()}},set:{defaultSide:function(){t=v.find("."+s.className.active),g=t.next(s.selector.side).size()>0?t.next(s.selector.side):v.find(s.selector.side).first(),h.verbose("Active side set to",t),h.verbose("Next side set to",g)},stageSize:function(){var e={width:g.outerWidth(),height:g.outerHeight()};h.verbose("Resizing stage to fit new content",e),v.css({width:e.width,height:e.height})},nextSide:function(e){g=v.find(e),0===g.size()&&h.error(k.side),h.verbose("Next side manually set to",g)},active:function(){h.verbose("Setting new side to active",g),y.removeClass(T.active),g.addClass(T.active),h.set.defaultSide()}},flip:{up:function(){h.debug("Flipping up",g),h.is.animating()?h.queue("flip.up"):(h.stage.above(),h.animate(h.getTransform.up()))},down:function(){h.debug("Flipping down",g),h.is.animating()?h.queue("flip.down"):(h.stage.below(),h.animate(h.getTransform.down()))},left:function(){h.debug("Flipping left",g),h.is.animating()?h.queue("flip.left"):(h.stage.left(),h.animate(h.getTransform.left()))},right:function(){h.debug("Flipping right",g),h.is.animating()?h.queue("flip.right"):(h.stage.right(),h.animate(h.getTransform.right()))},over:function(){h.debug("Flipping over",g),h.is.animating()?h.queue("flip.over"):(h.stage.behind(),h.animate(h.getTransform.behind()))}},getTransform:{up:function(){var e={y:-((t.outerHeight()-g.outerHeight())/2),z:-(t.outerHeight()/2)};return{transform:"translateY("+e.y+"px) translateZ("+e.z+"px) rotateX(-90deg)"}},down:function(){var e={y:-((t.outerHeight()-g.outerHeight())/2),z:-(t.outerHeight()/2)};return{transform:"translateY("+e.y+"px) translateZ("+e.z+"px) rotateX(90deg)"}},left:function(){var e={x:-((t.outerWidth()-g.outerWidth())/2),z:-(t.outerWidth()/2)};return{transform:"translateX("+e.x+"px) translateZ("+e.z+"px) rotateY(90deg)"}},right:function(){var e={x:-((t.outerWidth()-g.outerWidth())/2),z:-(t.outerWidth()/2)};return{transform:"translateX("+e.x+"px) translateZ("+e.z+"px) rotateY(-90deg)"}},behind:function(){var e={x:-((t.outerWidth()-g.outerWidth())/2)};return{transform:"translateX("+e.x+"px) rotateY(180deg)"}}},stage:{above:function(){var e={origin:(t.outerHeight()-g.outerHeight())/2,depth:{active:g.outerHeight()/2,next:t.outerHeight()/2}};h.verbose("Setting the initial animation position as above",g,e),t.css({transform:"rotateY(0deg) translateZ("+e.depth.active+"px)"}),g.addClass(T.animating).css({display:"block",top:e.origin+"px",transform:"rotateX(90deg) translateZ("+e.depth.next+"px)"})},below:function(){var e={origin:(t.outerHeight()-g.outerHeight())/2,depth:{active:g.outerHeight()/2,next:t.outerHeight()/2}};h.verbose("Setting the initial animation position as below",g,e),t.css({transform:"rotateY(0deg) translateZ("+e.depth.active+"px)"}),g.addClass(T.animating).css({display:"block",top:e.origin+"px",transform:"rotateX(-90deg) translateZ("+e.depth.next+"px)"})},left:function(){var e={origin:(t.outerWidth()-g.outerWidth())/2,depth:{active:g.outerWidth()/2,next:t.outerWidth()/2}};h.verbose("Setting the initial animation position as left",g,e),t.css({transform:"rotateY(0deg) translateZ("+e.depth.active+"px)"}),g.addClass(T.animating).css({display:"block",left:e.origin+"px",transform:"rotateY(-90deg) translateZ("+e.depth.next+"px)"})},right:function(){var e={origin:(t.outerWidth()-g.outerWidth())/2,depth:{active:g.outerWidth()/2,next:t.outerWidth()/2}};h.verbose("Setting the initial animation position as left",g,e),t.css({transform:"rotateY(0deg) translateZ("+e.depth.active+"px)"}),g.addClass(T.animating).css({display:"block",left:e.origin+"px",transform:"rotateY(90deg) translateZ("+e.depth.next+"px)"})},behind:function(){var e={origin:(t.outerWidth()-g.outerWidth())/2,depth:{active:g.outerWidth()/2,next:t.outerWidth()/2}};h.verbose("Setting the initial animation position as behind",g,e),t.css({transform:"rotateY(0deg)"}),g.addClass(T.animating).css({display:"block",left:e.origin+"px",transform:"rotateY(-180deg)"})}},setting:function(t,n){return n===o?s[t]:(e.isPlainObject(t)?(h.verbose("Modifying settings object",t,n),e.extend(!0,s,t)):(h.verbose("Modifying setting",t,n),s[t]=n),o)},internal:function(t,n){return n===o?h[t]:(e.isPlainObject(t)?(h.verbose("Modifying internal property",t,n),e.extend(!0,h,t)):(h.verbose("Changing internal method to",n),h[t]=n),o)},debug:function(){s.debug&&(s.performance?h.performance.log(arguments):h.debug=Function.prototype.bind.call(console.info,console,s.moduleName+":"))},verbose:function(){s.verbose&&s.debug&&(s.performance?h.performance.log(arguments):h.verbose=Function.prototype.bind.call(console.info,console,s.moduleName+":"))},error:function(){h.error=Function.prototype.bind.call(console.log,console,s.moduleName+":")},performance:{log:function(e){var t,n,o;s.performance&&(t=(new Date).getTime(),o=u||t,n=t-o,u=t,d.push({Element:w,Name:e[0],Arguments:e[1]||"None","Execution Time":n}),clearTimeout(h.performance.timer),h.performance.timer=setTimeout(h.performance.display,100))},display:function(){var t=s.moduleName,n=(s.moduleName+": "+l+"("+a.size()+" elements)",0);l&&(t+=" Performance ("+l+")"),(console.group!==o||console.table!==o)&&d.length>0&&(console.groupCollapsed(t),console.table?(e.each(d,function(e,t){n+=t["Execution Time"]}),console.table(d)):e.each(d,function(e,t){n+=t["Execution Time"],console.log(t.Name+": "+t["Execution Time"]+"ms")}),console.log("Total Execution Time:",n+"ms"),console.groupEnd(),d=[],u=!1)}},invoke:function(t,n,i){var a,s;return n=n||p,i=w||i,"string"==typeof t&&C!==o&&(t=t.split("."),a=t.length-1,e.each(t,function(t,n){return e.isPlainObject(C[n])&&t!=a?(C=C[n],!0):C[n]!==o?(s=C[n],!0):(h.error(errors.method),!1)})),e.isFunction(s)?(h.verbose("Executing invoked function",s),s.apply(i,n)):s||!1}},m?(C===o&&h.initialize(),i=h.invoke(f)):(C!==o&&h.destroy(),h.initialize())}),i?i:this},e.fn.shape.settings={moduleName:"Shape Module",debug:!0,verbose:!0,performance:!0,namespace:"shape",beforeChange:function(){},onChange:function(){},useCSS:!0,duration:1e3,easing:"easeInOutQuad",error:{side:"You tried to switch to a side that does not exist.",method:"The method you called is not defined"},className:{css:"css",animating:"animating",hidden:"hidden",active:"active"},selector:{sides:".sides",side:".side"}}})(jQuery,window,document);