Pleets /
SQLWebManager
| @@ 18610-19694 (lines=1085) @@ | ||
| 18607 | * |
|
| 18608 | */ |
|
| 18609 | ||
| 18610 | ;(function ($, window, document, undefined) { |
|
| 18611 | ||
| 18612 | "use strict"; |
|
| 18613 | ||
| 18614 | window = (typeof window != 'undefined' && window.Math == Math) |
|
| 18615 | ? window |
|
| 18616 | : (typeof self != 'undefined' && self.Math == Math) |
|
| 18617 | ? self |
|
| 18618 | : Function('return this')() |
|
| 18619 | ; |
|
| 18620 | ||
| 18621 | $.fn.transition = function() { |
|
| 18622 | var |
|
| 18623 | $allModules = $(this), |
|
| 18624 | moduleSelector = $allModules.selector || '', |
|
| 18625 | ||
| 18626 | time = new Date().getTime(), |
|
| 18627 | performance = [], |
|
| 18628 | ||
| 18629 | moduleArguments = arguments, |
|
| 18630 | query = moduleArguments[0], |
|
| 18631 | queryArguments = [].slice.call(arguments, 1), |
|
| 18632 | methodInvoked = (typeof query === 'string'), |
|
| 18633 | ||
| 18634 | requestAnimationFrame = window.requestAnimationFrame |
|
| 18635 | || window.mozRequestAnimationFrame |
|
| 18636 | || window.webkitRequestAnimationFrame |
|
| 18637 | || window.msRequestAnimationFrame |
|
| 18638 | || function(callback) { setTimeout(callback, 0); }, |
|
| 18639 | ||
| 18640 | returnedValue |
|
| 18641 | ; |
|
| 18642 | $allModules |
|
| 18643 | .each(function(index) { |
|
| 18644 | var |
|
| 18645 | $module = $(this), |
|
| 18646 | element = this, |
|
| 18647 | ||
| 18648 | // set at run time |
|
| 18649 | settings, |
|
| 18650 | instance, |
|
| 18651 | ||
| 18652 | error, |
|
| 18653 | className, |
|
| 18654 | metadata, |
|
| 18655 | animationEnd, |
|
| 18656 | animationName, |
|
| 18657 | ||
| 18658 | namespace, |
|
| 18659 | moduleNamespace, |
|
| 18660 | eventNamespace, |
|
| 18661 | module |
|
| 18662 | ; |
|
| 18663 | ||
| 18664 | module = { |
|
| 18665 | ||
| 18666 | initialize: function() { |
|
| 18667 | ||
| 18668 | // get full settings |
|
| 18669 | settings = module.get.settings.apply(element, moduleArguments); |
|
| 18670 | ||
| 18671 | // shorthand |
|
| 18672 | className = settings.className; |
|
| 18673 | error = settings.error; |
|
| 18674 | metadata = settings.metadata; |
|
| 18675 | ||
| 18676 | // define namespace |
|
| 18677 | eventNamespace = '.' + settings.namespace; |
|
| 18678 | moduleNamespace = 'module-' + settings.namespace; |
|
| 18679 | instance = $module.data(moduleNamespace) || module; |
|
| 18680 | ||
| 18681 | // get vendor specific events |
|
| 18682 | animationEnd = module.get.animationEndEvent(); |
|
| 18683 | ||
| 18684 | if(methodInvoked) { |
|
| 18685 | methodInvoked = module.invoke(query); |
|
| 18686 | } |
|
| 18687 | ||
| 18688 | // method not invoked, lets run an animation |
|
| 18689 | if(methodInvoked === false) { |
|
| 18690 | module.verbose('Converted arguments into settings object', settings); |
|
| 18691 | if(settings.interval) { |
|
| 18692 | module.delay(settings.animate); |
|
| 18693 | } |
|
| 18694 | else { |
|
| 18695 | module.animate(); |
|
| 18696 | } |
|
| 18697 | module.instantiate(); |
|
| 18698 | } |
|
| 18699 | }, |
|
| 18700 | ||
| 18701 | instantiate: function() { |
|
| 18702 | module.verbose('Storing instance of module', module); |
|
| 18703 | instance = module; |
|
| 18704 | $module |
|
| 18705 | .data(moduleNamespace, instance) |
|
| 18706 | ; |
|
| 18707 | }, |
|
| 18708 | ||
| 18709 | destroy: function() { |
|
| 18710 | module.verbose('Destroying previous module for', element); |
|
| 18711 | $module |
|
| 18712 | .removeData(moduleNamespace) |
|
| 18713 | ; |
|
| 18714 | }, |
|
| 18715 | ||
| 18716 | refresh: function() { |
|
| 18717 | module.verbose('Refreshing display type on next animation'); |
|
| 18718 | delete module.displayType; |
|
| 18719 | }, |
|
| 18720 | ||
| 18721 | forceRepaint: function() { |
|
| 18722 | module.verbose('Forcing element repaint'); |
|
| 18723 | var |
|
| 18724 | $parentElement = $module.parent(), |
|
| 18725 | $nextElement = $module.next() |
|
| 18726 | ; |
|
| 18727 | if($nextElement.length === 0) { |
|
| 18728 | $module.detach().appendTo($parentElement); |
|
| 18729 | } |
|
| 18730 | else { |
|
| 18731 | $module.detach().insertBefore($nextElement); |
|
| 18732 | } |
|
| 18733 | }, |
|
| 18734 | ||
| 18735 | repaint: function() { |
|
| 18736 | module.verbose('Repainting element'); |
|
| 18737 | var |
|
| 18738 | fakeAssignment = element.offsetWidth |
|
| 18739 | ; |
|
| 18740 | }, |
|
| 18741 | ||
| 18742 | delay: function(interval) { |
|
| 18743 | var |
|
| 18744 | direction = module.get.animationDirection(), |
|
| 18745 | shouldReverse, |
|
| 18746 | delay |
|
| 18747 | ; |
|
| 18748 | if(!direction) { |
|
| 18749 | direction = module.can.transition() |
|
| 18750 | ? module.get.direction() |
|
| 18751 | : 'static' |
|
| 18752 | ; |
|
| 18753 | } |
|
| 18754 | interval = (interval !== undefined) |
|
| 18755 | ? interval |
|
| 18756 | : settings.interval |
|
| 18757 | ; |
|
| 18758 | shouldReverse = (settings.reverse == 'auto' && direction == className.outward); |
|
| 18759 | delay = (shouldReverse || settings.reverse == true) |
|
| 18760 | ? ($allModules.length - index) * settings.interval |
|
| 18761 | : index * settings.interval |
|
| 18762 | ; |
|
| 18763 | module.debug('Delaying animation by', delay); |
|
| 18764 | setTimeout(module.animate, delay); |
|
| 18765 | }, |
|
| 18766 | ||
| 18767 | animate: function(overrideSettings) { |
|
| 18768 | settings = overrideSettings || settings; |
|
| 18769 | if(!module.is.supported()) { |
|
| 18770 | module.error(error.support); |
|
| 18771 | return false; |
|
| 18772 | } |
|
| 18773 | module.debug('Preparing animation', settings.animation); |
|
| 18774 | if(module.is.animating()) { |
|
| 18775 | if(settings.queue) { |
|
| 18776 | if(!settings.allowRepeats && module.has.direction() && module.is.occurring() && module.queuing !== true) { |
|
| 18777 | module.debug('Animation is currently occurring, preventing queueing same animation', settings.animation); |
|
| 18778 | } |
|
| 18779 | else { |
|
| 18780 | module.queue(settings.animation); |
|
| 18781 | } |
|
| 18782 | return false; |
|
| 18783 | } |
|
| 18784 | else if(!settings.allowRepeats && module.is.occurring()) { |
|
| 18785 | module.debug('Animation is already occurring, will not execute repeated animation', settings.animation); |
|
| 18786 | return false; |
|
| 18787 | } |
|
| 18788 | else { |
|
| 18789 | module.debug('New animation started, completing previous early', settings.animation); |
|
| 18790 | instance.complete(); |
|
| 18791 | } |
|
| 18792 | } |
|
| 18793 | if( module.can.animate() ) { |
|
| 18794 | module.set.animating(settings.animation); |
|
| 18795 | } |
|
| 18796 | else { |
|
| 18797 | module.error(error.noAnimation, settings.animation, element); |
|
| 18798 | } |
|
| 18799 | }, |
|
| 18800 | ||
| 18801 | reset: function() { |
|
| 18802 | module.debug('Resetting animation to beginning conditions'); |
|
| 18803 | module.remove.animationCallbacks(); |
|
| 18804 | module.restore.conditions(); |
|
| 18805 | module.remove.animating(); |
|
| 18806 | }, |
|
| 18807 | ||
| 18808 | queue: function(animation) { |
|
| 18809 | module.debug('Queueing animation of', animation); |
|
| 18810 | module.queuing = true; |
|
| 18811 | $module |
|
| 18812 | .one(animationEnd + '.queue' + eventNamespace, function() { |
|
| 18813 | module.queuing = false; |
|
| 18814 | module.repaint(); |
|
| 18815 | module.animate.apply(this, settings); |
|
| 18816 | }) |
|
| 18817 | ; |
|
| 18818 | }, |
|
| 18819 | ||
| 18820 | complete: function (event) { |
|
| 18821 | module.debug('Animation complete', settings.animation); |
|
| 18822 | module.remove.completeCallback(); |
|
| 18823 | module.remove.failSafe(); |
|
| 18824 | if(!module.is.looping()) { |
|
| 18825 | if( module.is.outward() ) { |
|
| 18826 | module.verbose('Animation is outward, hiding element'); |
|
| 18827 | module.restore.conditions(); |
|
| 18828 | module.hide(); |
|
| 18829 | } |
|
| 18830 | else if( module.is.inward() ) { |
|
| 18831 | module.verbose('Animation is outward, showing element'); |
|
| 18832 | module.restore.conditions(); |
|
| 18833 | module.show(); |
|
| 18834 | } |
|
| 18835 | else { |
|
| 18836 | module.verbose('Static animation completed'); |
|
| 18837 | module.restore.conditions(); |
|
| 18838 | settings.onComplete.call(element); |
|
| 18839 | } |
|
| 18840 | } |
|
| 18841 | }, |
|
| 18842 | ||
| 18843 | force: { |
|
| 18844 | visible: function() { |
|
| 18845 | var |
|
| 18846 | style = $module.attr('style'), |
|
| 18847 | userStyle = module.get.userStyle(), |
|
| 18848 | displayType = module.get.displayType(), |
|
| 18849 | overrideStyle = userStyle + 'display: ' + displayType + ' !important;', |
|
| 18850 | currentDisplay = $module.css('display'), |
|
| 18851 | emptyStyle = (style === undefined || style === '') |
|
| 18852 | ; |
|
| 18853 | if(currentDisplay !== displayType) { |
|
| 18854 | module.verbose('Overriding default display to show element', displayType); |
|
| 18855 | $module |
|
| 18856 | .attr('style', overrideStyle) |
|
| 18857 | ; |
|
| 18858 | } |
|
| 18859 | else if(emptyStyle) { |
|
| 18860 | $module.removeAttr('style'); |
|
| 18861 | } |
|
| 18862 | }, |
|
| 18863 | hidden: function() { |
|
| 18864 | var |
|
| 18865 | style = $module.attr('style'), |
|
| 18866 | currentDisplay = $module.css('display'), |
|
| 18867 | emptyStyle = (style === undefined || style === '') |
|
| 18868 | ; |
|
| 18869 | if(currentDisplay !== 'none' && !module.is.hidden()) { |
|
| 18870 | module.verbose('Overriding default display to hide element'); |
|
| 18871 | $module |
|
| 18872 | .css('display', 'none') |
|
| 18873 | ; |
|
| 18874 | } |
|
| 18875 | else if(emptyStyle) { |
|
| 18876 | $module |
|
| 18877 | .removeAttr('style') |
|
| 18878 | ; |
|
| 18879 | } |
|
| 18880 | } |
|
| 18881 | }, |
|
| 18882 | ||
| 18883 | has: { |
|
| 18884 | direction: function(animation) { |
|
| 18885 | var |
|
| 18886 | hasDirection = false |
|
| 18887 | ; |
|
| 18888 | animation = animation || settings.animation; |
|
| 18889 | if(typeof animation === 'string') { |
|
| 18890 | animation = animation.split(' '); |
|
| 18891 | $.each(animation, function(index, word){ |
|
| 18892 | if(word === className.inward || word === className.outward) { |
|
| 18893 | hasDirection = true; |
|
| 18894 | } |
|
| 18895 | }); |
|
| 18896 | } |
|
| 18897 | return hasDirection; |
|
| 18898 | }, |
|
| 18899 | inlineDisplay: function() { |
|
| 18900 | var |
|
| 18901 | style = $module.attr('style') || '' |
|
| 18902 | ; |
|
| 18903 | return $.isArray(style.match(/display.*?;/, '')); |
|
| 18904 | } |
|
| 18905 | }, |
|
| 18906 | ||
| 18907 | set: { |
|
| 18908 | animating: function(animation) { |
|
| 18909 | var |
|
| 18910 | animationClass, |
|
| 18911 | direction |
|
| 18912 | ; |
|
| 18913 | // remove previous callbacks |
|
| 18914 | module.remove.completeCallback(); |
|
| 18915 | ||
| 18916 | // determine exact animation |
|
| 18917 | animation = animation || settings.animation; |
|
| 18918 | animationClass = module.get.animationClass(animation); |
|
| 18919 | ||
| 18920 | // save animation class in cache to restore class names |
|
| 18921 | module.save.animation(animationClass); |
|
| 18922 | ||
| 18923 | // override display if necessary so animation appears visibly |
|
| 18924 | module.force.visible(); |
|
| 18925 | ||
| 18926 | module.remove.hidden(); |
|
| 18927 | module.remove.direction(); |
|
| 18928 | ||
| 18929 | module.start.animation(animationClass); |
|
| 18930 | ||
| 18931 | }, |
|
| 18932 | duration: function(animationName, duration) { |
|
| 18933 | duration = duration || settings.duration; |
|
| 18934 | duration = (typeof duration == 'number') |
|
| 18935 | ? duration + 'ms' |
|
| 18936 | : duration |
|
| 18937 | ; |
|
| 18938 | if(duration || duration === 0) { |
|
| 18939 | module.verbose('Setting animation duration', duration); |
|
| 18940 | $module |
|
| 18941 | .css({ |
|
| 18942 | 'animation-duration': duration |
|
| 18943 | }) |
|
| 18944 | ; |
|
| 18945 | } |
|
| 18946 | }, |
|
| 18947 | direction: function(direction) { |
|
| 18948 | direction = direction || module.get.direction(); |
|
| 18949 | if(direction == className.inward) { |
|
| 18950 | module.set.inward(); |
|
| 18951 | } |
|
| 18952 | else { |
|
| 18953 | module.set.outward(); |
|
| 18954 | } |
|
| 18955 | }, |
|
| 18956 | looping: function() { |
|
| 18957 | module.debug('Transition set to loop'); |
|
| 18958 | $module |
|
| 18959 | .addClass(className.looping) |
|
| 18960 | ; |
|
| 18961 | }, |
|
| 18962 | hidden: function() { |
|
| 18963 | $module |
|
| 18964 | .addClass(className.transition) |
|
| 18965 | .addClass(className.hidden) |
|
| 18966 | ; |
|
| 18967 | }, |
|
| 18968 | inward: function() { |
|
| 18969 | module.debug('Setting direction to inward'); |
|
| 18970 | $module |
|
| 18971 | .removeClass(className.outward) |
|
| 18972 | .addClass(className.inward) |
|
| 18973 | ; |
|
| 18974 | }, |
|
| 18975 | outward: function() { |
|
| 18976 | module.debug('Setting direction to outward'); |
|
| 18977 | $module |
|
| 18978 | .removeClass(className.inward) |
|
| 18979 | .addClass(className.outward) |
|
| 18980 | ; |
|
| 18981 | }, |
|
| 18982 | visible: function() { |
|
| 18983 | $module |
|
| 18984 | .addClass(className.transition) |
|
| 18985 | .addClass(className.visible) |
|
| 18986 | ; |
|
| 18987 | } |
|
| 18988 | }, |
|
| 18989 | ||
| 18990 | start: { |
|
| 18991 | animation: function(animationClass) { |
|
| 18992 | animationClass = animationClass || module.get.animationClass(); |
|
| 18993 | module.debug('Starting tween', animationClass); |
|
| 18994 | $module |
|
| 18995 | .addClass(animationClass) |
|
| 18996 | .one(animationEnd + '.complete' + eventNamespace, module.complete) |
|
| 18997 | ; |
|
| 18998 | if(settings.useFailSafe) { |
|
| 18999 | module.add.failSafe(); |
|
| 19000 | } |
|
| 19001 | module.set.duration(settings.duration); |
|
| 19002 | settings.onStart.call(element); |
|
| 19003 | } |
|
| 19004 | }, |
|
| 19005 | ||
| 19006 | save: { |
|
| 19007 | animation: function(animation) { |
|
| 19008 | if(!module.cache) { |
|
| 19009 | module.cache = {}; |
|
| 19010 | } |
|
| 19011 | module.cache.animation = animation; |
|
| 19012 | }, |
|
| 19013 | displayType: function(displayType) { |
|
| 19014 | if(displayType !== 'none') { |
|
| 19015 | $module.data(metadata.displayType, displayType); |
|
| 19016 | } |
|
| 19017 | }, |
|
| 19018 | transitionExists: function(animation, exists) { |
|
| 19019 | $.fn.transition.exists[animation] = exists; |
|
| 19020 | module.verbose('Saving existence of transition', animation, exists); |
|
| 19021 | } |
|
| 19022 | }, |
|
| 19023 | ||
| 19024 | restore: { |
|
| 19025 | conditions: function() { |
|
| 19026 | var |
|
| 19027 | animation = module.get.currentAnimation() |
|
| 19028 | ; |
|
| 19029 | if(animation) { |
|
| 19030 | $module |
|
| 19031 | .removeClass(animation) |
|
| 19032 | ; |
|
| 19033 | module.verbose('Removing animation class', module.cache); |
|
| 19034 | } |
|
| 19035 | module.remove.duration(); |
|
| 19036 | } |
|
| 19037 | }, |
|
| 19038 | ||
| 19039 | add: { |
|
| 19040 | failSafe: function() { |
|
| 19041 | var |
|
| 19042 | duration = module.get.duration() |
|
| 19043 | ; |
|
| 19044 | module.timer = setTimeout(function() { |
|
| 19045 | $module.triggerHandler(animationEnd); |
|
| 19046 | }, duration + settings.failSafeDelay); |
|
| 19047 | module.verbose('Adding fail safe timer', module.timer); |
|
| 19048 | } |
|
| 19049 | }, |
|
| 19050 | ||
| 19051 | remove: { |
|
| 19052 | animating: function() { |
|
| 19053 | $module.removeClass(className.animating); |
|
| 19054 | }, |
|
| 19055 | animationCallbacks: function() { |
|
| 19056 | module.remove.queueCallback(); |
|
| 19057 | module.remove.completeCallback(); |
|
| 19058 | }, |
|
| 19059 | queueCallback: function() { |
|
| 19060 | $module.off('.queue' + eventNamespace); |
|
| 19061 | }, |
|
| 19062 | completeCallback: function() { |
|
| 19063 | $module.off('.complete' + eventNamespace); |
|
| 19064 | }, |
|
| 19065 | display: function() { |
|
| 19066 | $module.css('display', ''); |
|
| 19067 | }, |
|
| 19068 | direction: function() { |
|
| 19069 | $module |
|
| 19070 | .removeClass(className.inward) |
|
| 19071 | .removeClass(className.outward) |
|
| 19072 | ; |
|
| 19073 | }, |
|
| 19074 | duration: function() { |
|
| 19075 | $module |
|
| 19076 | .css('animation-duration', '') |
|
| 19077 | ; |
|
| 19078 | }, |
|
| 19079 | failSafe: function() { |
|
| 19080 | module.verbose('Removing fail safe timer', module.timer); |
|
| 19081 | if(module.timer) { |
|
| 19082 | clearTimeout(module.timer); |
|
| 19083 | } |
|
| 19084 | }, |
|
| 19085 | hidden: function() { |
|
| 19086 | $module.removeClass(className.hidden); |
|
| 19087 | }, |
|
| 19088 | visible: function() { |
|
| 19089 | $module.removeClass(className.visible); |
|
| 19090 | }, |
|
| 19091 | looping: function() { |
|
| 19092 | module.debug('Transitions are no longer looping'); |
|
| 19093 | if( module.is.looping() ) { |
|
| 19094 | module.reset(); |
|
| 19095 | $module |
|
| 19096 | .removeClass(className.looping) |
|
| 19097 | ; |
|
| 19098 | } |
|
| 19099 | }, |
|
| 19100 | transition: function() { |
|
| 19101 | $module |
|
| 19102 | .removeClass(className.visible) |
|
| 19103 | .removeClass(className.hidden) |
|
| 19104 | ; |
|
| 19105 | } |
|
| 19106 | }, |
|
| 19107 | get: { |
|
| 19108 | settings: function(animation, duration, onComplete) { |
|
| 19109 | // single settings object |
|
| 19110 | if(typeof animation == 'object') { |
|
| 19111 | return $.extend(true, {}, $.fn.transition.settings, animation); |
|
| 19112 | } |
|
| 19113 | // all arguments provided |
|
| 19114 | else if(typeof onComplete == 'function') { |
|
| 19115 | return $.extend({}, $.fn.transition.settings, { |
|
| 19116 | animation : animation, |
|
| 19117 | onComplete : onComplete, |
|
| 19118 | duration : duration |
|
| 19119 | }); |
|
| 19120 | } |
|
| 19121 | // only duration provided |
|
| 19122 | else if(typeof duration == 'string' || typeof duration == 'number') { |
|
| 19123 | return $.extend({}, $.fn.transition.settings, { |
|
| 19124 | animation : animation, |
|
| 19125 | duration : duration |
|
| 19126 | }); |
|
| 19127 | } |
|
| 19128 | // duration is actually settings object |
|
| 19129 | else if(typeof duration == 'object') { |
|
| 19130 | return $.extend({}, $.fn.transition.settings, duration, { |
|
| 19131 | animation : animation |
|
| 19132 | }); |
|
| 19133 | } |
|
| 19134 | // duration is actually callback |
|
| 19135 | else if(typeof duration == 'function') { |
|
| 19136 | return $.extend({}, $.fn.transition.settings, { |
|
| 19137 | animation : animation, |
|
| 19138 | onComplete : duration |
|
| 19139 | }); |
|
| 19140 | } |
|
| 19141 | // only animation provided |
|
| 19142 | else { |
|
| 19143 | return $.extend({}, $.fn.transition.settings, { |
|
| 19144 | animation : animation |
|
| 19145 | }); |
|
| 19146 | } |
|
| 19147 | }, |
|
| 19148 | animationClass: function(animation) { |
|
| 19149 | var |
|
| 19150 | animationClass = animation || settings.animation, |
|
| 19151 | directionClass = (module.can.transition() && !module.has.direction()) |
|
| 19152 | ? module.get.direction() + ' ' |
|
| 19153 | : '' |
|
| 19154 | ; |
|
| 19155 | return className.animating + ' ' |
|
| 19156 | + className.transition + ' ' |
|
| 19157 | + directionClass |
|
| 19158 | + animationClass |
|
| 19159 | ; |
|
| 19160 | }, |
|
| 19161 | currentAnimation: function() { |
|
| 19162 | return (module.cache && module.cache.animation !== undefined) |
|
| 19163 | ? module.cache.animation |
|
| 19164 | : false |
|
| 19165 | ; |
|
| 19166 | }, |
|
| 19167 | currentDirection: function() { |
|
| 19168 | return module.is.inward() |
|
| 19169 | ? className.inward |
|
| 19170 | : className.outward |
|
| 19171 | ; |
|
| 19172 | }, |
|
| 19173 | direction: function() { |
|
| 19174 | return module.is.hidden() || !module.is.visible() |
|
| 19175 | ? className.inward |
|
| 19176 | : className.outward |
|
| 19177 | ; |
|
| 19178 | }, |
|
| 19179 | animationDirection: function(animation) { |
|
| 19180 | var |
|
| 19181 | direction |
|
| 19182 | ; |
|
| 19183 | animation = animation || settings.animation; |
|
| 19184 | if(typeof animation === 'string') { |
|
| 19185 | animation = animation.split(' '); |
|
| 19186 | // search animation name for out/in class |
|
| 19187 | $.each(animation, function(index, word){ |
|
| 19188 | if(word === className.inward) { |
|
| 19189 | direction = className.inward; |
|
| 19190 | } |
|
| 19191 | else if(word === className.outward) { |
|
| 19192 | direction = className.outward; |
|
| 19193 | } |
|
| 19194 | }); |
|
| 19195 | } |
|
| 19196 | // return found direction |
|
| 19197 | if(direction) { |
|
| 19198 | return direction; |
|
| 19199 | } |
|
| 19200 | return false; |
|
| 19201 | }, |
|
| 19202 | duration: function(duration) { |
|
| 19203 | duration = duration || settings.duration; |
|
| 19204 | if(duration === false) { |
|
| 19205 | duration = $module.css('animation-duration') || 0; |
|
| 19206 | } |
|
| 19207 | return (typeof duration === 'string') |
|
| 19208 | ? (duration.indexOf('ms') > -1) |
|
| 19209 | ? parseFloat(duration) |
|
| 19210 | : parseFloat(duration) * 1000 |
|
| 19211 | : duration |
|
| 19212 | ; |
|
| 19213 | }, |
|
| 19214 | displayType: function(shouldDetermine) { |
|
| 19215 | shouldDetermine = (shouldDetermine !== undefined) |
|
| 19216 | ? shouldDetermine |
|
| 19217 | : true |
|
| 19218 | ; |
|
| 19219 | if(settings.displayType) { |
|
| 19220 | return settings.displayType; |
|
| 19221 | } |
|
| 19222 | if(shouldDetermine && $module.data(metadata.displayType) === undefined) { |
|
| 19223 | // create fake element to determine display state |
|
| 19224 | module.can.transition(true); |
|
| 19225 | } |
|
| 19226 | return $module.data(metadata.displayType); |
|
| 19227 | }, |
|
| 19228 | userStyle: function(style) { |
|
| 19229 | style = style || $module.attr('style') || ''; |
|
| 19230 | return style.replace(/display.*?;/, ''); |
|
| 19231 | }, |
|
| 19232 | transitionExists: function(animation) { |
|
| 19233 | return $.fn.transition.exists[animation]; |
|
| 19234 | }, |
|
| 19235 | animationStartEvent: function() { |
|
| 19236 | var |
|
| 19237 | element = document.createElement('div'), |
|
| 19238 | animations = { |
|
| 19239 | 'animation' :'animationstart', |
|
| 19240 | 'OAnimation' :'oAnimationStart', |
|
| 19241 | 'MozAnimation' :'mozAnimationStart', |
|
| 19242 | 'WebkitAnimation' :'webkitAnimationStart' |
|
| 19243 | }, |
|
| 19244 | animation |
|
| 19245 | ; |
|
| 19246 | for(animation in animations){ |
|
| 19247 | if( element.style[animation] !== undefined ){ |
|
| 19248 | return animations[animation]; |
|
| 19249 | } |
|
| 19250 | } |
|
| 19251 | return false; |
|
| 19252 | }, |
|
| 19253 | animationEndEvent: function() { |
|
| 19254 | var |
|
| 19255 | element = document.createElement('div'), |
|
| 19256 | animations = { |
|
| 19257 | 'animation' :'animationend', |
|
| 19258 | 'OAnimation' :'oAnimationEnd', |
|
| 19259 | 'MozAnimation' :'mozAnimationEnd', |
|
| 19260 | 'WebkitAnimation' :'webkitAnimationEnd' |
|
| 19261 | }, |
|
| 19262 | animation |
|
| 19263 | ; |
|
| 19264 | for(animation in animations){ |
|
| 19265 | if( element.style[animation] !== undefined ){ |
|
| 19266 | return animations[animation]; |
|
| 19267 | } |
|
| 19268 | } |
|
| 19269 | return false; |
|
| 19270 | } |
|
| 19271 | ||
| 19272 | }, |
|
| 19273 | ||
| 19274 | can: { |
|
| 19275 | transition: function(forced) { |
|
| 19276 | var |
|
| 19277 | animation = settings.animation, |
|
| 19278 | transitionExists = module.get.transitionExists(animation), |
|
| 19279 | displayType = module.get.displayType(false), |
|
| 19280 | elementClass, |
|
| 19281 | tagName, |
|
| 19282 | $clone, |
|
| 19283 | currentAnimation, |
|
| 19284 | inAnimation, |
|
| 19285 | directionExists |
|
| 19286 | ; |
|
| 19287 | if( transitionExists === undefined || forced) { |
|
| 19288 | module.verbose('Determining whether animation exists'); |
|
| 19289 | elementClass = $module.attr('class'); |
|
| 19290 | tagName = $module.prop('tagName'); |
|
| 19291 | ||
| 19292 | $clone = $('<' + tagName + ' />').addClass( elementClass ).insertAfter($module); |
|
| 19293 | currentAnimation = $clone |
|
| 19294 | .addClass(animation) |
|
| 19295 | .removeClass(className.inward) |
|
| 19296 | .removeClass(className.outward) |
|
| 19297 | .addClass(className.animating) |
|
| 19298 | .addClass(className.transition) |
|
| 19299 | .css('animationName') |
|
| 19300 | ; |
|
| 19301 | inAnimation = $clone |
|
| 19302 | .addClass(className.inward) |
|
| 19303 | .css('animationName') |
|
| 19304 | ; |
|
| 19305 | if(!displayType) { |
|
| 19306 | displayType = $clone |
|
| 19307 | .attr('class', elementClass) |
|
| 19308 | .removeAttr('style') |
|
| 19309 | .removeClass(className.hidden) |
|
| 19310 | .removeClass(className.visible) |
|
| 19311 | .show() |
|
| 19312 | .css('display') |
|
| 19313 | ; |
|
| 19314 | module.verbose('Determining final display state', displayType); |
|
| 19315 | module.save.displayType(displayType); |
|
| 19316 | } |
|
| 19317 | ||
| 19318 | $clone.remove(); |
|
| 19319 | if(currentAnimation != inAnimation) { |
|
| 19320 | module.debug('Direction exists for animation', animation); |
|
| 19321 | directionExists = true; |
|
| 19322 | } |
|
| 19323 | else if(currentAnimation == 'none' || !currentAnimation) { |
|
| 19324 | module.debug('No animation defined in css', animation); |
|
| 19325 | return; |
|
| 19326 | } |
|
| 19327 | else { |
|
| 19328 | module.debug('Static animation found', animation, displayType); |
|
| 19329 | directionExists = false; |
|
| 19330 | } |
|
| 19331 | module.save.transitionExists(animation, directionExists); |
|
| 19332 | } |
|
| 19333 | return (transitionExists !== undefined) |
|
| 19334 | ? transitionExists |
|
| 19335 | : directionExists |
|
| 19336 | ; |
|
| 19337 | }, |
|
| 19338 | animate: function() { |
|
| 19339 | // can transition does not return a value if animation does not exist |
|
| 19340 | return (module.can.transition() !== undefined); |
|
| 19341 | } |
|
| 19342 | }, |
|
| 19343 | ||
| 19344 | is: { |
|
| 19345 | animating: function() { |
|
| 19346 | return $module.hasClass(className.animating); |
|
| 19347 | }, |
|
| 19348 | inward: function() { |
|
| 19349 | return $module.hasClass(className.inward); |
|
| 19350 | }, |
|
| 19351 | outward: function() { |
|
| 19352 | return $module.hasClass(className.outward); |
|
| 19353 | }, |
|
| 19354 | looping: function() { |
|
| 19355 | return $module.hasClass(className.looping); |
|
| 19356 | }, |
|
| 19357 | occurring: function(animation) { |
|
| 19358 | animation = animation || settings.animation; |
|
| 19359 | animation = '.' + animation.replace(' ', '.'); |
|
| 19360 | return ( $module.filter(animation).length > 0 ); |
|
| 19361 | }, |
|
| 19362 | visible: function() { |
|
| 19363 | return $module.is(':visible'); |
|
| 19364 | }, |
|
| 19365 | hidden: function() { |
|
| 19366 | return $module.css('visibility') === 'hidden'; |
|
| 19367 | }, |
|
| 19368 | supported: function() { |
|
| 19369 | return(animationEnd !== false); |
|
| 19370 | } |
|
| 19371 | }, |
|
| 19372 | ||
| 19373 | hide: function() { |
|
| 19374 | module.verbose('Hiding element'); |
|
| 19375 | if( module.is.animating() ) { |
|
| 19376 | module.reset(); |
|
| 19377 | } |
|
| 19378 | element.blur(); // IE will trigger focus change if element is not blurred before hiding |
|
| 19379 | module.remove.display(); |
|
| 19380 | module.remove.visible(); |
|
| 19381 | module.set.hidden(); |
|
| 19382 | module.force.hidden(); |
|
| 19383 | settings.onHide.call(element); |
|
| 19384 | settings.onComplete.call(element); |
|
| 19385 | // module.repaint(); |
|
| 19386 | }, |
|
| 19387 | ||
| 19388 | show: function(display) { |
|
| 19389 | module.verbose('Showing element', display); |
|
| 19390 | module.remove.hidden(); |
|
| 19391 | module.set.visible(); |
|
| 19392 | module.force.visible(); |
|
| 19393 | settings.onShow.call(element); |
|
| 19394 | settings.onComplete.call(element); |
|
| 19395 | // module.repaint(); |
|
| 19396 | }, |
|
| 19397 | ||
| 19398 | toggle: function() { |
|
| 19399 | if( module.is.visible() ) { |
|
| 19400 | module.hide(); |
|
| 19401 | } |
|
| 19402 | else { |
|
| 19403 | module.show(); |
|
| 19404 | } |
|
| 19405 | }, |
|
| 19406 | ||
| 19407 | stop: function() { |
|
| 19408 | module.debug('Stopping current animation'); |
|
| 19409 | $module.triggerHandler(animationEnd); |
|
| 19410 | }, |
|
| 19411 | ||
| 19412 | stopAll: function() { |
|
| 19413 | module.debug('Stopping all animation'); |
|
| 19414 | module.remove.queueCallback(); |
|
| 19415 | $module.triggerHandler(animationEnd); |
|
| 19416 | }, |
|
| 19417 | ||
| 19418 | clear: { |
|
| 19419 | queue: function() { |
|
| 19420 | module.debug('Clearing animation queue'); |
|
| 19421 | module.remove.queueCallback(); |
|
| 19422 | } |
|
| 19423 | }, |
|
| 19424 | ||
| 19425 | enable: function() { |
|
| 19426 | module.verbose('Starting animation'); |
|
| 19427 | $module.removeClass(className.disabled); |
|
| 19428 | }, |
|
| 19429 | ||
| 19430 | disable: function() { |
|
| 19431 | module.debug('Stopping animation'); |
|
| 19432 | $module.addClass(className.disabled); |
|
| 19433 | }, |
|
| 19434 | ||
| 19435 | setting: function(name, value) { |
|
| 19436 | module.debug('Changing setting', name, value); |
|
| 19437 | if( $.isPlainObject(name) ) { |
|
| 19438 | $.extend(true, settings, name); |
|
| 19439 | } |
|
| 19440 | else if(value !== undefined) { |
|
| 19441 | if($.isPlainObject(settings[name])) { |
|
| 19442 | $.extend(true, settings[name], value); |
|
| 19443 | } |
|
| 19444 | else { |
|
| 19445 | settings[name] = value; |
|
| 19446 | } |
|
| 19447 | } |
|
| 19448 | else { |
|
| 19449 | return settings[name]; |
|
| 19450 | } |
|
| 19451 | }, |
|
| 19452 | internal: function(name, value) { |
|
| 19453 | if( $.isPlainObject(name) ) { |
|
| 19454 | $.extend(true, module, name); |
|
| 19455 | } |
|
| 19456 | else if(value !== undefined) { |
|
| 19457 | module[name] = value; |
|
| 19458 | } |
|
| 19459 | else { |
|
| 19460 | return module[name]; |
|
| 19461 | } |
|
| 19462 | }, |
|
| 19463 | debug: function() { |
|
| 19464 | if(!settings.silent && settings.debug) { |
|
| 19465 | if(settings.performance) { |
|
| 19466 | module.performance.log(arguments); |
|
| 19467 | } |
|
| 19468 | else { |
|
| 19469 | module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); |
|
| 19470 | module.debug.apply(console, arguments); |
|
| 19471 | } |
|
| 19472 | } |
|
| 19473 | }, |
|
| 19474 | verbose: function() { |
|
| 19475 | if(!settings.silent && settings.verbose && settings.debug) { |
|
| 19476 | if(settings.performance) { |
|
| 19477 | module.performance.log(arguments); |
|
| 19478 | } |
|
| 19479 | else { |
|
| 19480 | module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); |
|
| 19481 | module.verbose.apply(console, arguments); |
|
| 19482 | } |
|
| 19483 | } |
|
| 19484 | }, |
|
| 19485 | error: function() { |
|
| 19486 | if(!settings.silent) { |
|
| 19487 | module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); |
|
| 19488 | module.error.apply(console, arguments); |
|
| 19489 | } |
|
| 19490 | }, |
|
| 19491 | performance: { |
|
| 19492 | log: function(message) { |
|
| 19493 | var |
|
| 19494 | currentTime, |
|
| 19495 | executionTime, |
|
| 19496 | previousTime |
|
| 19497 | ; |
|
| 19498 | if(settings.performance) { |
|
| 19499 | currentTime = new Date().getTime(); |
|
| 19500 | previousTime = time || currentTime; |
|
| 19501 | executionTime = currentTime - previousTime; |
|
| 19502 | time = currentTime; |
|
| 19503 | performance.push({ |
|
| 19504 | 'Name' : message[0], |
|
| 19505 | 'Arguments' : [].slice.call(message, 1) || '', |
|
| 19506 | 'Element' : element, |
|
| 19507 | 'Execution Time' : executionTime |
|
| 19508 | }); |
|
| 19509 | } |
|
| 19510 | clearTimeout(module.performance.timer); |
|
| 19511 | module.performance.timer = setTimeout(module.performance.display, 500); |
|
| 19512 | }, |
|
| 19513 | display: function() { |
|
| 19514 | var |
|
| 19515 | title = settings.name + ':', |
|
| 19516 | totalTime = 0 |
|
| 19517 | ; |
|
| 19518 | time = false; |
|
| 19519 | clearTimeout(module.performance.timer); |
|
| 19520 | $.each(performance, function(index, data) { |
|
| 19521 | totalTime += data['Execution Time']; |
|
| 19522 | }); |
|
| 19523 | title += ' ' + totalTime + 'ms'; |
|
| 19524 | if(moduleSelector) { |
|
| 19525 | title += ' \'' + moduleSelector + '\''; |
|
| 19526 | } |
|
| 19527 | if($allModules.length > 1) { |
|
| 19528 | title += ' ' + '(' + $allModules.length + ')'; |
|
| 19529 | } |
|
| 19530 | if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { |
|
| 19531 | console.groupCollapsed(title); |
|
| 19532 | if(console.table) { |
|
| 19533 | console.table(performance); |
|
| 19534 | } |
|
| 19535 | else { |
|
| 19536 | $.each(performance, function(index, data) { |
|
| 19537 | console.log(data['Name'] + ': ' + data['Execution Time']+'ms'); |
|
| 19538 | }); |
|
| 19539 | } |
|
| 19540 | console.groupEnd(); |
|
| 19541 | } |
|
| 19542 | performance = []; |
|
| 19543 | } |
|
| 19544 | }, |
|
| 19545 | // modified for transition to return invoke success |
|
| 19546 | invoke: function(query, passedArguments, context) { |
|
| 19547 | var |
|
| 19548 | object = instance, |
|
| 19549 | maxDepth, |
|
| 19550 | found, |
|
| 19551 | response |
|
| 19552 | ; |
|
| 19553 | passedArguments = passedArguments || queryArguments; |
|
| 19554 | context = element || context; |
|
| 19555 | if(typeof query == 'string' && object !== undefined) { |
|
| 19556 | query = query.split(/[\. ]/); |
|
| 19557 | maxDepth = query.length - 1; |
|
| 19558 | $.each(query, function(depth, value) { |
|
| 19559 | var camelCaseValue = (depth != maxDepth) |
|
| 19560 | ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) |
|
| 19561 | : query |
|
| 19562 | ; |
|
| 19563 | if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) { |
|
| 19564 | object = object[camelCaseValue]; |
|
| 19565 | } |
|
| 19566 | else if( object[camelCaseValue] !== undefined ) { |
|
| 19567 | found = object[camelCaseValue]; |
|
| 19568 | return false; |
|
| 19569 | } |
|
| 19570 | else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) { |
|
| 19571 | object = object[value]; |
|
| 19572 | } |
|
| 19573 | else if( object[value] !== undefined ) { |
|
| 19574 | found = object[value]; |
|
| 19575 | return false; |
|
| 19576 | } |
|
| 19577 | else { |
|
| 19578 | return false; |
|
| 19579 | } |
|
| 19580 | }); |
|
| 19581 | } |
|
| 19582 | if ( $.isFunction( found ) ) { |
|
| 19583 | response = found.apply(context, passedArguments); |
|
| 19584 | } |
|
| 19585 | else if(found !== undefined) { |
|
| 19586 | response = found; |
|
| 19587 | } |
|
| 19588 | ||
| 19589 | if($.isArray(returnedValue)) { |
|
| 19590 | returnedValue.push(response); |
|
| 19591 | } |
|
| 19592 | else if(returnedValue !== undefined) { |
|
| 19593 | returnedValue = [returnedValue, response]; |
|
| 19594 | } |
|
| 19595 | else if(response !== undefined) { |
|
| 19596 | returnedValue = response; |
|
| 19597 | } |
|
| 19598 | return (found !== undefined) |
|
| 19599 | ? found |
|
| 19600 | : false |
|
| 19601 | ; |
|
| 19602 | } |
|
| 19603 | }; |
|
| 19604 | module.initialize(); |
|
| 19605 | }) |
|
| 19606 | ; |
|
| 19607 | return (returnedValue !== undefined) |
|
| 19608 | ? returnedValue |
|
| 19609 | : this |
|
| 19610 | ; |
|
| 19611 | }; |
|
| 19612 | ||
| 19613 | // Records if CSS transition is available |
|
| 19614 | $.fn.transition.exists = {}; |
|
| 19615 | ||
| 19616 | $.fn.transition.settings = { |
|
| 19617 | ||
| 19618 | // module info |
|
| 19619 | name : 'Transition', |
|
| 19620 | ||
| 19621 | // hide all output from this component regardless of other settings |
|
| 19622 | silent : false, |
|
| 19623 | ||
| 19624 | // debug content outputted to console |
|
| 19625 | debug : false, |
|
| 19626 | ||
| 19627 | // verbose debug output |
|
| 19628 | verbose : false, |
|
| 19629 | ||
| 19630 | // performance data output |
|
| 19631 | performance : true, |
|
| 19632 | ||
| 19633 | // event namespace |
|
| 19634 | namespace : 'transition', |
|
| 19635 | ||
| 19636 | // delay between animations in group |
|
| 19637 | interval : 0, |
|
| 19638 | ||
| 19639 | // whether group animations should be reversed |
|
| 19640 | reverse : 'auto', |
|
| 19641 | ||
| 19642 | // animation callback event |
|
| 19643 | onStart : function() {}, |
|
| 19644 | onComplete : function() {}, |
|
| 19645 | onShow : function() {}, |
|
| 19646 | onHide : function() {}, |
|
| 19647 | ||
| 19648 | // whether timeout should be used to ensure callback fires in cases animationend does not |
|
| 19649 | useFailSafe : true, |
|
| 19650 | ||
| 19651 | // delay in ms for fail safe |
|
| 19652 | failSafeDelay : 100, |
|
| 19653 | ||
| 19654 | // whether EXACT animation can occur twice in a row |
|
| 19655 | allowRepeats : false, |
|
| 19656 | ||
| 19657 | // Override final display type on visible |
|
| 19658 | displayType : false, |
|
| 19659 | ||
| 19660 | // animation duration |
|
| 19661 | animation : 'fade', |
|
| 19662 | duration : false, |
|
| 19663 | ||
| 19664 | // new animations will occur after previous ones |
|
| 19665 | queue : true, |
|
| 19666 | ||
| 19667 | metadata : { |
|
| 19668 | displayType: 'display' |
|
| 19669 | }, |
|
| 19670 | ||
| 19671 | className : { |
|
| 19672 | animating : 'animating', |
|
| 19673 | disabled : 'disabled', |
|
| 19674 | hidden : 'hidden', |
|
| 19675 | inward : 'in', |
|
| 19676 | loading : 'loading', |
|
| 19677 | looping : 'looping', |
|
| 19678 | outward : 'out', |
|
| 19679 | transition : 'transition', |
|
| 19680 | visible : 'visible' |
|
| 19681 | }, |
|
| 19682 | ||
| 19683 | // possible errors |
|
| 19684 | error: { |
|
| 19685 | noAnimation : 'Element is no longer attached to DOM. Unable to animate. Use silent setting to surpress this warning in production.', |
|
| 19686 | repeated : 'That animation is already occurring, cancelling repeated animation', |
|
| 19687 | method : 'The method you called is not defined', |
|
| 19688 | support : 'This browser does not support CSS animations' |
|
| 19689 | } |
|
| 19690 | ||
| 19691 | }; |
|
| 19692 | ||
| 19693 | ||
| 19694 | })( jQuery, window, document ); |
|
| 19695 | ||
| 19696 | /*! |
|
| 19697 | * # Semantic UI 2.2.11 - API |
|
| @@ 11-1095 (lines=1085) @@ | ||
| 8 | * |
|
| 9 | */ |
|
| 10 | ||
| 11 | ;(function ($, window, document, undefined) { |
|
| 12 | ||
| 13 | "use strict"; |
|
| 14 | ||
| 15 | window = (typeof window != 'undefined' && window.Math == Math) |
|
| 16 | ? window |
|
| 17 | : (typeof self != 'undefined' && self.Math == Math) |
|
| 18 | ? self |
|
| 19 | : Function('return this')() |
|
| 20 | ; |
|
| 21 | ||
| 22 | $.fn.transition = function() { |
|
| 23 | var |
|
| 24 | $allModules = $(this), |
|
| 25 | moduleSelector = $allModules.selector || '', |
|
| 26 | ||
| 27 | time = new Date().getTime(), |
|
| 28 | performance = [], |
|
| 29 | ||
| 30 | moduleArguments = arguments, |
|
| 31 | query = moduleArguments[0], |
|
| 32 | queryArguments = [].slice.call(arguments, 1), |
|
| 33 | methodInvoked = (typeof query === 'string'), |
|
| 34 | ||
| 35 | requestAnimationFrame = window.requestAnimationFrame |
|
| 36 | || window.mozRequestAnimationFrame |
|
| 37 | || window.webkitRequestAnimationFrame |
|
| 38 | || window.msRequestAnimationFrame |
|
| 39 | || function(callback) { setTimeout(callback, 0); }, |
|
| 40 | ||
| 41 | returnedValue |
|
| 42 | ; |
|
| 43 | $allModules |
|
| 44 | .each(function(index) { |
|
| 45 | var |
|
| 46 | $module = $(this), |
|
| 47 | element = this, |
|
| 48 | ||
| 49 | // set at run time |
|
| 50 | settings, |
|
| 51 | instance, |
|
| 52 | ||
| 53 | error, |
|
| 54 | className, |
|
| 55 | metadata, |
|
| 56 | animationEnd, |
|
| 57 | animationName, |
|
| 58 | ||
| 59 | namespace, |
|
| 60 | moduleNamespace, |
|
| 61 | eventNamespace, |
|
| 62 | module |
|
| 63 | ; |
|
| 64 | ||
| 65 | module = { |
|
| 66 | ||
| 67 | initialize: function() { |
|
| 68 | ||
| 69 | // get full settings |
|
| 70 | settings = module.get.settings.apply(element, moduleArguments); |
|
| 71 | ||
| 72 | // shorthand |
|
| 73 | className = settings.className; |
|
| 74 | error = settings.error; |
|
| 75 | metadata = settings.metadata; |
|
| 76 | ||
| 77 | // define namespace |
|
| 78 | eventNamespace = '.' + settings.namespace; |
|
| 79 | moduleNamespace = 'module-' + settings.namespace; |
|
| 80 | instance = $module.data(moduleNamespace) || module; |
|
| 81 | ||
| 82 | // get vendor specific events |
|
| 83 | animationEnd = module.get.animationEndEvent(); |
|
| 84 | ||
| 85 | if(methodInvoked) { |
|
| 86 | methodInvoked = module.invoke(query); |
|
| 87 | } |
|
| 88 | ||
| 89 | // method not invoked, lets run an animation |
|
| 90 | if(methodInvoked === false) { |
|
| 91 | module.verbose('Converted arguments into settings object', settings); |
|
| 92 | if(settings.interval) { |
|
| 93 | module.delay(settings.animate); |
|
| 94 | } |
|
| 95 | else { |
|
| 96 | module.animate(); |
|
| 97 | } |
|
| 98 | module.instantiate(); |
|
| 99 | } |
|
| 100 | }, |
|
| 101 | ||
| 102 | instantiate: function() { |
|
| 103 | module.verbose('Storing instance of module', module); |
|
| 104 | instance = module; |
|
| 105 | $module |
|
| 106 | .data(moduleNamespace, instance) |
|
| 107 | ; |
|
| 108 | }, |
|
| 109 | ||
| 110 | destroy: function() { |
|
| 111 | module.verbose('Destroying previous module for', element); |
|
| 112 | $module |
|
| 113 | .removeData(moduleNamespace) |
|
| 114 | ; |
|
| 115 | }, |
|
| 116 | ||
| 117 | refresh: function() { |
|
| 118 | module.verbose('Refreshing display type on next animation'); |
|
| 119 | delete module.displayType; |
|
| 120 | }, |
|
| 121 | ||
| 122 | forceRepaint: function() { |
|
| 123 | module.verbose('Forcing element repaint'); |
|
| 124 | var |
|
| 125 | $parentElement = $module.parent(), |
|
| 126 | $nextElement = $module.next() |
|
| 127 | ; |
|
| 128 | if($nextElement.length === 0) { |
|
| 129 | $module.detach().appendTo($parentElement); |
|
| 130 | } |
|
| 131 | else { |
|
| 132 | $module.detach().insertBefore($nextElement); |
|
| 133 | } |
|
| 134 | }, |
|
| 135 | ||
| 136 | repaint: function() { |
|
| 137 | module.verbose('Repainting element'); |
|
| 138 | var |
|
| 139 | fakeAssignment = element.offsetWidth |
|
| 140 | ; |
|
| 141 | }, |
|
| 142 | ||
| 143 | delay: function(interval) { |
|
| 144 | var |
|
| 145 | direction = module.get.animationDirection(), |
|
| 146 | shouldReverse, |
|
| 147 | delay |
|
| 148 | ; |
|
| 149 | if(!direction) { |
|
| 150 | direction = module.can.transition() |
|
| 151 | ? module.get.direction() |
|
| 152 | : 'static' |
|
| 153 | ; |
|
| 154 | } |
|
| 155 | interval = (interval !== undefined) |
|
| 156 | ? interval |
|
| 157 | : settings.interval |
|
| 158 | ; |
|
| 159 | shouldReverse = (settings.reverse == 'auto' && direction == className.outward); |
|
| 160 | delay = (shouldReverse || settings.reverse == true) |
|
| 161 | ? ($allModules.length - index) * settings.interval |
|
| 162 | : index * settings.interval |
|
| 163 | ; |
|
| 164 | module.debug('Delaying animation by', delay); |
|
| 165 | setTimeout(module.animate, delay); |
|
| 166 | }, |
|
| 167 | ||
| 168 | animate: function(overrideSettings) { |
|
| 169 | settings = overrideSettings || settings; |
|
| 170 | if(!module.is.supported()) { |
|
| 171 | module.error(error.support); |
|
| 172 | return false; |
|
| 173 | } |
|
| 174 | module.debug('Preparing animation', settings.animation); |
|
| 175 | if(module.is.animating()) { |
|
| 176 | if(settings.queue) { |
|
| 177 | if(!settings.allowRepeats && module.has.direction() && module.is.occurring() && module.queuing !== true) { |
|
| 178 | module.debug('Animation is currently occurring, preventing queueing same animation', settings.animation); |
|
| 179 | } |
|
| 180 | else { |
|
| 181 | module.queue(settings.animation); |
|
| 182 | } |
|
| 183 | return false; |
|
| 184 | } |
|
| 185 | else if(!settings.allowRepeats && module.is.occurring()) { |
|
| 186 | module.debug('Animation is already occurring, will not execute repeated animation', settings.animation); |
|
| 187 | return false; |
|
| 188 | } |
|
| 189 | else { |
|
| 190 | module.debug('New animation started, completing previous early', settings.animation); |
|
| 191 | instance.complete(); |
|
| 192 | } |
|
| 193 | } |
|
| 194 | if( module.can.animate() ) { |
|
| 195 | module.set.animating(settings.animation); |
|
| 196 | } |
|
| 197 | else { |
|
| 198 | module.error(error.noAnimation, settings.animation, element); |
|
| 199 | } |
|
| 200 | }, |
|
| 201 | ||
| 202 | reset: function() { |
|
| 203 | module.debug('Resetting animation to beginning conditions'); |
|
| 204 | module.remove.animationCallbacks(); |
|
| 205 | module.restore.conditions(); |
|
| 206 | module.remove.animating(); |
|
| 207 | }, |
|
| 208 | ||
| 209 | queue: function(animation) { |
|
| 210 | module.debug('Queueing animation of', animation); |
|
| 211 | module.queuing = true; |
|
| 212 | $module |
|
| 213 | .one(animationEnd + '.queue' + eventNamespace, function() { |
|
| 214 | module.queuing = false; |
|
| 215 | module.repaint(); |
|
| 216 | module.animate.apply(this, settings); |
|
| 217 | }) |
|
| 218 | ; |
|
| 219 | }, |
|
| 220 | ||
| 221 | complete: function (event) { |
|
| 222 | module.debug('Animation complete', settings.animation); |
|
| 223 | module.remove.completeCallback(); |
|
| 224 | module.remove.failSafe(); |
|
| 225 | if(!module.is.looping()) { |
|
| 226 | if( module.is.outward() ) { |
|
| 227 | module.verbose('Animation is outward, hiding element'); |
|
| 228 | module.restore.conditions(); |
|
| 229 | module.hide(); |
|
| 230 | } |
|
| 231 | else if( module.is.inward() ) { |
|
| 232 | module.verbose('Animation is outward, showing element'); |
|
| 233 | module.restore.conditions(); |
|
| 234 | module.show(); |
|
| 235 | } |
|
| 236 | else { |
|
| 237 | module.verbose('Static animation completed'); |
|
| 238 | module.restore.conditions(); |
|
| 239 | settings.onComplete.call(element); |
|
| 240 | } |
|
| 241 | } |
|
| 242 | }, |
|
| 243 | ||
| 244 | force: { |
|
| 245 | visible: function() { |
|
| 246 | var |
|
| 247 | style = $module.attr('style'), |
|
| 248 | userStyle = module.get.userStyle(), |
|
| 249 | displayType = module.get.displayType(), |
|
| 250 | overrideStyle = userStyle + 'display: ' + displayType + ' !important;', |
|
| 251 | currentDisplay = $module.css('display'), |
|
| 252 | emptyStyle = (style === undefined || style === '') |
|
| 253 | ; |
|
| 254 | if(currentDisplay !== displayType) { |
|
| 255 | module.verbose('Overriding default display to show element', displayType); |
|
| 256 | $module |
|
| 257 | .attr('style', overrideStyle) |
|
| 258 | ; |
|
| 259 | } |
|
| 260 | else if(emptyStyle) { |
|
| 261 | $module.removeAttr('style'); |
|
| 262 | } |
|
| 263 | }, |
|
| 264 | hidden: function() { |
|
| 265 | var |
|
| 266 | style = $module.attr('style'), |
|
| 267 | currentDisplay = $module.css('display'), |
|
| 268 | emptyStyle = (style === undefined || style === '') |
|
| 269 | ; |
|
| 270 | if(currentDisplay !== 'none' && !module.is.hidden()) { |
|
| 271 | module.verbose('Overriding default display to hide element'); |
|
| 272 | $module |
|
| 273 | .css('display', 'none') |
|
| 274 | ; |
|
| 275 | } |
|
| 276 | else if(emptyStyle) { |
|
| 277 | $module |
|
| 278 | .removeAttr('style') |
|
| 279 | ; |
|
| 280 | } |
|
| 281 | } |
|
| 282 | }, |
|
| 283 | ||
| 284 | has: { |
|
| 285 | direction: function(animation) { |
|
| 286 | var |
|
| 287 | hasDirection = false |
|
| 288 | ; |
|
| 289 | animation = animation || settings.animation; |
|
| 290 | if(typeof animation === 'string') { |
|
| 291 | animation = animation.split(' '); |
|
| 292 | $.each(animation, function(index, word){ |
|
| 293 | if(word === className.inward || word === className.outward) { |
|
| 294 | hasDirection = true; |
|
| 295 | } |
|
| 296 | }); |
|
| 297 | } |
|
| 298 | return hasDirection; |
|
| 299 | }, |
|
| 300 | inlineDisplay: function() { |
|
| 301 | var |
|
| 302 | style = $module.attr('style') || '' |
|
| 303 | ; |
|
| 304 | return $.isArray(style.match(/display.*?;/, '')); |
|
| 305 | } |
|
| 306 | }, |
|
| 307 | ||
| 308 | set: { |
|
| 309 | animating: function(animation) { |
|
| 310 | var |
|
| 311 | animationClass, |
|
| 312 | direction |
|
| 313 | ; |
|
| 314 | // remove previous callbacks |
|
| 315 | module.remove.completeCallback(); |
|
| 316 | ||
| 317 | // determine exact animation |
|
| 318 | animation = animation || settings.animation; |
|
| 319 | animationClass = module.get.animationClass(animation); |
|
| 320 | ||
| 321 | // save animation class in cache to restore class names |
|
| 322 | module.save.animation(animationClass); |
|
| 323 | ||
| 324 | // override display if necessary so animation appears visibly |
|
| 325 | module.force.visible(); |
|
| 326 | ||
| 327 | module.remove.hidden(); |
|
| 328 | module.remove.direction(); |
|
| 329 | ||
| 330 | module.start.animation(animationClass); |
|
| 331 | ||
| 332 | }, |
|
| 333 | duration: function(animationName, duration) { |
|
| 334 | duration = duration || settings.duration; |
|
| 335 | duration = (typeof duration == 'number') |
|
| 336 | ? duration + 'ms' |
|
| 337 | : duration |
|
| 338 | ; |
|
| 339 | if(duration || duration === 0) { |
|
| 340 | module.verbose('Setting animation duration', duration); |
|
| 341 | $module |
|
| 342 | .css({ |
|
| 343 | 'animation-duration': duration |
|
| 344 | }) |
|
| 345 | ; |
|
| 346 | } |
|
| 347 | }, |
|
| 348 | direction: function(direction) { |
|
| 349 | direction = direction || module.get.direction(); |
|
| 350 | if(direction == className.inward) { |
|
| 351 | module.set.inward(); |
|
| 352 | } |
|
| 353 | else { |
|
| 354 | module.set.outward(); |
|
| 355 | } |
|
| 356 | }, |
|
| 357 | looping: function() { |
|
| 358 | module.debug('Transition set to loop'); |
|
| 359 | $module |
|
| 360 | .addClass(className.looping) |
|
| 361 | ; |
|
| 362 | }, |
|
| 363 | hidden: function() { |
|
| 364 | $module |
|
| 365 | .addClass(className.transition) |
|
| 366 | .addClass(className.hidden) |
|
| 367 | ; |
|
| 368 | }, |
|
| 369 | inward: function() { |
|
| 370 | module.debug('Setting direction to inward'); |
|
| 371 | $module |
|
| 372 | .removeClass(className.outward) |
|
| 373 | .addClass(className.inward) |
|
| 374 | ; |
|
| 375 | }, |
|
| 376 | outward: function() { |
|
| 377 | module.debug('Setting direction to outward'); |
|
| 378 | $module |
|
| 379 | .removeClass(className.inward) |
|
| 380 | .addClass(className.outward) |
|
| 381 | ; |
|
| 382 | }, |
|
| 383 | visible: function() { |
|
| 384 | $module |
|
| 385 | .addClass(className.transition) |
|
| 386 | .addClass(className.visible) |
|
| 387 | ; |
|
| 388 | } |
|
| 389 | }, |
|
| 390 | ||
| 391 | start: { |
|
| 392 | animation: function(animationClass) { |
|
| 393 | animationClass = animationClass || module.get.animationClass(); |
|
| 394 | module.debug('Starting tween', animationClass); |
|
| 395 | $module |
|
| 396 | .addClass(animationClass) |
|
| 397 | .one(animationEnd + '.complete' + eventNamespace, module.complete) |
|
| 398 | ; |
|
| 399 | if(settings.useFailSafe) { |
|
| 400 | module.add.failSafe(); |
|
| 401 | } |
|
| 402 | module.set.duration(settings.duration); |
|
| 403 | settings.onStart.call(element); |
|
| 404 | } |
|
| 405 | }, |
|
| 406 | ||
| 407 | save: { |
|
| 408 | animation: function(animation) { |
|
| 409 | if(!module.cache) { |
|
| 410 | module.cache = {}; |
|
| 411 | } |
|
| 412 | module.cache.animation = animation; |
|
| 413 | }, |
|
| 414 | displayType: function(displayType) { |
|
| 415 | if(displayType !== 'none') { |
|
| 416 | $module.data(metadata.displayType, displayType); |
|
| 417 | } |
|
| 418 | }, |
|
| 419 | transitionExists: function(animation, exists) { |
|
| 420 | $.fn.transition.exists[animation] = exists; |
|
| 421 | module.verbose('Saving existence of transition', animation, exists); |
|
| 422 | } |
|
| 423 | }, |
|
| 424 | ||
| 425 | restore: { |
|
| 426 | conditions: function() { |
|
| 427 | var |
|
| 428 | animation = module.get.currentAnimation() |
|
| 429 | ; |
|
| 430 | if(animation) { |
|
| 431 | $module |
|
| 432 | .removeClass(animation) |
|
| 433 | ; |
|
| 434 | module.verbose('Removing animation class', module.cache); |
|
| 435 | } |
|
| 436 | module.remove.duration(); |
|
| 437 | } |
|
| 438 | }, |
|
| 439 | ||
| 440 | add: { |
|
| 441 | failSafe: function() { |
|
| 442 | var |
|
| 443 | duration = module.get.duration() |
|
| 444 | ; |
|
| 445 | module.timer = setTimeout(function() { |
|
| 446 | $module.triggerHandler(animationEnd); |
|
| 447 | }, duration + settings.failSafeDelay); |
|
| 448 | module.verbose('Adding fail safe timer', module.timer); |
|
| 449 | } |
|
| 450 | }, |
|
| 451 | ||
| 452 | remove: { |
|
| 453 | animating: function() { |
|
| 454 | $module.removeClass(className.animating); |
|
| 455 | }, |
|
| 456 | animationCallbacks: function() { |
|
| 457 | module.remove.queueCallback(); |
|
| 458 | module.remove.completeCallback(); |
|
| 459 | }, |
|
| 460 | queueCallback: function() { |
|
| 461 | $module.off('.queue' + eventNamespace); |
|
| 462 | }, |
|
| 463 | completeCallback: function() { |
|
| 464 | $module.off('.complete' + eventNamespace); |
|
| 465 | }, |
|
| 466 | display: function() { |
|
| 467 | $module.css('display', ''); |
|
| 468 | }, |
|
| 469 | direction: function() { |
|
| 470 | $module |
|
| 471 | .removeClass(className.inward) |
|
| 472 | .removeClass(className.outward) |
|
| 473 | ; |
|
| 474 | }, |
|
| 475 | duration: function() { |
|
| 476 | $module |
|
| 477 | .css('animation-duration', '') |
|
| 478 | ; |
|
| 479 | }, |
|
| 480 | failSafe: function() { |
|
| 481 | module.verbose('Removing fail safe timer', module.timer); |
|
| 482 | if(module.timer) { |
|
| 483 | clearTimeout(module.timer); |
|
| 484 | } |
|
| 485 | }, |
|
| 486 | hidden: function() { |
|
| 487 | $module.removeClass(className.hidden); |
|
| 488 | }, |
|
| 489 | visible: function() { |
|
| 490 | $module.removeClass(className.visible); |
|
| 491 | }, |
|
| 492 | looping: function() { |
|
| 493 | module.debug('Transitions are no longer looping'); |
|
| 494 | if( module.is.looping() ) { |
|
| 495 | module.reset(); |
|
| 496 | $module |
|
| 497 | .removeClass(className.looping) |
|
| 498 | ; |
|
| 499 | } |
|
| 500 | }, |
|
| 501 | transition: function() { |
|
| 502 | $module |
|
| 503 | .removeClass(className.visible) |
|
| 504 | .removeClass(className.hidden) |
|
| 505 | ; |
|
| 506 | } |
|
| 507 | }, |
|
| 508 | get: { |
|
| 509 | settings: function(animation, duration, onComplete) { |
|
| 510 | // single settings object |
|
| 511 | if(typeof animation == 'object') { |
|
| 512 | return $.extend(true, {}, $.fn.transition.settings, animation); |
|
| 513 | } |
|
| 514 | // all arguments provided |
|
| 515 | else if(typeof onComplete == 'function') { |
|
| 516 | return $.extend({}, $.fn.transition.settings, { |
|
| 517 | animation : animation, |
|
| 518 | onComplete : onComplete, |
|
| 519 | duration : duration |
|
| 520 | }); |
|
| 521 | } |
|
| 522 | // only duration provided |
|
| 523 | else if(typeof duration == 'string' || typeof duration == 'number') { |
|
| 524 | return $.extend({}, $.fn.transition.settings, { |
|
| 525 | animation : animation, |
|
| 526 | duration : duration |
|
| 527 | }); |
|
| 528 | } |
|
| 529 | // duration is actually settings object |
|
| 530 | else if(typeof duration == 'object') { |
|
| 531 | return $.extend({}, $.fn.transition.settings, duration, { |
|
| 532 | animation : animation |
|
| 533 | }); |
|
| 534 | } |
|
| 535 | // duration is actually callback |
|
| 536 | else if(typeof duration == 'function') { |
|
| 537 | return $.extend({}, $.fn.transition.settings, { |
|
| 538 | animation : animation, |
|
| 539 | onComplete : duration |
|
| 540 | }); |
|
| 541 | } |
|
| 542 | // only animation provided |
|
| 543 | else { |
|
| 544 | return $.extend({}, $.fn.transition.settings, { |
|
| 545 | animation : animation |
|
| 546 | }); |
|
| 547 | } |
|
| 548 | }, |
|
| 549 | animationClass: function(animation) { |
|
| 550 | var |
|
| 551 | animationClass = animation || settings.animation, |
|
| 552 | directionClass = (module.can.transition() && !module.has.direction()) |
|
| 553 | ? module.get.direction() + ' ' |
|
| 554 | : '' |
|
| 555 | ; |
|
| 556 | return className.animating + ' ' |
|
| 557 | + className.transition + ' ' |
|
| 558 | + directionClass |
|
| 559 | + animationClass |
|
| 560 | ; |
|
| 561 | }, |
|
| 562 | currentAnimation: function() { |
|
| 563 | return (module.cache && module.cache.animation !== undefined) |
|
| 564 | ? module.cache.animation |
|
| 565 | : false |
|
| 566 | ; |
|
| 567 | }, |
|
| 568 | currentDirection: function() { |
|
| 569 | return module.is.inward() |
|
| 570 | ? className.inward |
|
| 571 | : className.outward |
|
| 572 | ; |
|
| 573 | }, |
|
| 574 | direction: function() { |
|
| 575 | return module.is.hidden() || !module.is.visible() |
|
| 576 | ? className.inward |
|
| 577 | : className.outward |
|
| 578 | ; |
|
| 579 | }, |
|
| 580 | animationDirection: function(animation) { |
|
| 581 | var |
|
| 582 | direction |
|
| 583 | ; |
|
| 584 | animation = animation || settings.animation; |
|
| 585 | if(typeof animation === 'string') { |
|
| 586 | animation = animation.split(' '); |
|
| 587 | // search animation name for out/in class |
|
| 588 | $.each(animation, function(index, word){ |
|
| 589 | if(word === className.inward) { |
|
| 590 | direction = className.inward; |
|
| 591 | } |
|
| 592 | else if(word === className.outward) { |
|
| 593 | direction = className.outward; |
|
| 594 | } |
|
| 595 | }); |
|
| 596 | } |
|
| 597 | // return found direction |
|
| 598 | if(direction) { |
|
| 599 | return direction; |
|
| 600 | } |
|
| 601 | return false; |
|
| 602 | }, |
|
| 603 | duration: function(duration) { |
|
| 604 | duration = duration || settings.duration; |
|
| 605 | if(duration === false) { |
|
| 606 | duration = $module.css('animation-duration') || 0; |
|
| 607 | } |
|
| 608 | return (typeof duration === 'string') |
|
| 609 | ? (duration.indexOf('ms') > -1) |
|
| 610 | ? parseFloat(duration) |
|
| 611 | : parseFloat(duration) * 1000 |
|
| 612 | : duration |
|
| 613 | ; |
|
| 614 | }, |
|
| 615 | displayType: function(shouldDetermine) { |
|
| 616 | shouldDetermine = (shouldDetermine !== undefined) |
|
| 617 | ? shouldDetermine |
|
| 618 | : true |
|
| 619 | ; |
|
| 620 | if(settings.displayType) { |
|
| 621 | return settings.displayType; |
|
| 622 | } |
|
| 623 | if(shouldDetermine && $module.data(metadata.displayType) === undefined) { |
|
| 624 | // create fake element to determine display state |
|
| 625 | module.can.transition(true); |
|
| 626 | } |
|
| 627 | return $module.data(metadata.displayType); |
|
| 628 | }, |
|
| 629 | userStyle: function(style) { |
|
| 630 | style = style || $module.attr('style') || ''; |
|
| 631 | return style.replace(/display.*?;/, ''); |
|
| 632 | }, |
|
| 633 | transitionExists: function(animation) { |
|
| 634 | return $.fn.transition.exists[animation]; |
|
| 635 | }, |
|
| 636 | animationStartEvent: function() { |
|
| 637 | var |
|
| 638 | element = document.createElement('div'), |
|
| 639 | animations = { |
|
| 640 | 'animation' :'animationstart', |
|
| 641 | 'OAnimation' :'oAnimationStart', |
|
| 642 | 'MozAnimation' :'mozAnimationStart', |
|
| 643 | 'WebkitAnimation' :'webkitAnimationStart' |
|
| 644 | }, |
|
| 645 | animation |
|
| 646 | ; |
|
| 647 | for(animation in animations){ |
|
| 648 | if( element.style[animation] !== undefined ){ |
|
| 649 | return animations[animation]; |
|
| 650 | } |
|
| 651 | } |
|
| 652 | return false; |
|
| 653 | }, |
|
| 654 | animationEndEvent: function() { |
|
| 655 | var |
|
| 656 | element = document.createElement('div'), |
|
| 657 | animations = { |
|
| 658 | 'animation' :'animationend', |
|
| 659 | 'OAnimation' :'oAnimationEnd', |
|
| 660 | 'MozAnimation' :'mozAnimationEnd', |
|
| 661 | 'WebkitAnimation' :'webkitAnimationEnd' |
|
| 662 | }, |
|
| 663 | animation |
|
| 664 | ; |
|
| 665 | for(animation in animations){ |
|
| 666 | if( element.style[animation] !== undefined ){ |
|
| 667 | return animations[animation]; |
|
| 668 | } |
|
| 669 | } |
|
| 670 | return false; |
|
| 671 | } |
|
| 672 | ||
| 673 | }, |
|
| 674 | ||
| 675 | can: { |
|
| 676 | transition: function(forced) { |
|
| 677 | var |
|
| 678 | animation = settings.animation, |
|
| 679 | transitionExists = module.get.transitionExists(animation), |
|
| 680 | displayType = module.get.displayType(false), |
|
| 681 | elementClass, |
|
| 682 | tagName, |
|
| 683 | $clone, |
|
| 684 | currentAnimation, |
|
| 685 | inAnimation, |
|
| 686 | directionExists |
|
| 687 | ; |
|
| 688 | if( transitionExists === undefined || forced) { |
|
| 689 | module.verbose('Determining whether animation exists'); |
|
| 690 | elementClass = $module.attr('class'); |
|
| 691 | tagName = $module.prop('tagName'); |
|
| 692 | ||
| 693 | $clone = $('<' + tagName + ' />').addClass( elementClass ).insertAfter($module); |
|
| 694 | currentAnimation = $clone |
|
| 695 | .addClass(animation) |
|
| 696 | .removeClass(className.inward) |
|
| 697 | .removeClass(className.outward) |
|
| 698 | .addClass(className.animating) |
|
| 699 | .addClass(className.transition) |
|
| 700 | .css('animationName') |
|
| 701 | ; |
|
| 702 | inAnimation = $clone |
|
| 703 | .addClass(className.inward) |
|
| 704 | .css('animationName') |
|
| 705 | ; |
|
| 706 | if(!displayType) { |
|
| 707 | displayType = $clone |
|
| 708 | .attr('class', elementClass) |
|
| 709 | .removeAttr('style') |
|
| 710 | .removeClass(className.hidden) |
|
| 711 | .removeClass(className.visible) |
|
| 712 | .show() |
|
| 713 | .css('display') |
|
| 714 | ; |
|
| 715 | module.verbose('Determining final display state', displayType); |
|
| 716 | module.save.displayType(displayType); |
|
| 717 | } |
|
| 718 | ||
| 719 | $clone.remove(); |
|
| 720 | if(currentAnimation != inAnimation) { |
|
| 721 | module.debug('Direction exists for animation', animation); |
|
| 722 | directionExists = true; |
|
| 723 | } |
|
| 724 | else if(currentAnimation == 'none' || !currentAnimation) { |
|
| 725 | module.debug('No animation defined in css', animation); |
|
| 726 | return; |
|
| 727 | } |
|
| 728 | else { |
|
| 729 | module.debug('Static animation found', animation, displayType); |
|
| 730 | directionExists = false; |
|
| 731 | } |
|
| 732 | module.save.transitionExists(animation, directionExists); |
|
| 733 | } |
|
| 734 | return (transitionExists !== undefined) |
|
| 735 | ? transitionExists |
|
| 736 | : directionExists |
|
| 737 | ; |
|
| 738 | }, |
|
| 739 | animate: function() { |
|
| 740 | // can transition does not return a value if animation does not exist |
|
| 741 | return (module.can.transition() !== undefined); |
|
| 742 | } |
|
| 743 | }, |
|
| 744 | ||
| 745 | is: { |
|
| 746 | animating: function() { |
|
| 747 | return $module.hasClass(className.animating); |
|
| 748 | }, |
|
| 749 | inward: function() { |
|
| 750 | return $module.hasClass(className.inward); |
|
| 751 | }, |
|
| 752 | outward: function() { |
|
| 753 | return $module.hasClass(className.outward); |
|
| 754 | }, |
|
| 755 | looping: function() { |
|
| 756 | return $module.hasClass(className.looping); |
|
| 757 | }, |
|
| 758 | occurring: function(animation) { |
|
| 759 | animation = animation || settings.animation; |
|
| 760 | animation = '.' + animation.replace(' ', '.'); |
|
| 761 | return ( $module.filter(animation).length > 0 ); |
|
| 762 | }, |
|
| 763 | visible: function() { |
|
| 764 | return $module.is(':visible'); |
|
| 765 | }, |
|
| 766 | hidden: function() { |
|
| 767 | return $module.css('visibility') === 'hidden'; |
|
| 768 | }, |
|
| 769 | supported: function() { |
|
| 770 | return(animationEnd !== false); |
|
| 771 | } |
|
| 772 | }, |
|
| 773 | ||
| 774 | hide: function() { |
|
| 775 | module.verbose('Hiding element'); |
|
| 776 | if( module.is.animating() ) { |
|
| 777 | module.reset(); |
|
| 778 | } |
|
| 779 | element.blur(); // IE will trigger focus change if element is not blurred before hiding |
|
| 780 | module.remove.display(); |
|
| 781 | module.remove.visible(); |
|
| 782 | module.set.hidden(); |
|
| 783 | module.force.hidden(); |
|
| 784 | settings.onHide.call(element); |
|
| 785 | settings.onComplete.call(element); |
|
| 786 | // module.repaint(); |
|
| 787 | }, |
|
| 788 | ||
| 789 | show: function(display) { |
|
| 790 | module.verbose('Showing element', display); |
|
| 791 | module.remove.hidden(); |
|
| 792 | module.set.visible(); |
|
| 793 | module.force.visible(); |
|
| 794 | settings.onShow.call(element); |
|
| 795 | settings.onComplete.call(element); |
|
| 796 | // module.repaint(); |
|
| 797 | }, |
|
| 798 | ||
| 799 | toggle: function() { |
|
| 800 | if( module.is.visible() ) { |
|
| 801 | module.hide(); |
|
| 802 | } |
|
| 803 | else { |
|
| 804 | module.show(); |
|
| 805 | } |
|
| 806 | }, |
|
| 807 | ||
| 808 | stop: function() { |
|
| 809 | module.debug('Stopping current animation'); |
|
| 810 | $module.triggerHandler(animationEnd); |
|
| 811 | }, |
|
| 812 | ||
| 813 | stopAll: function() { |
|
| 814 | module.debug('Stopping all animation'); |
|
| 815 | module.remove.queueCallback(); |
|
| 816 | $module.triggerHandler(animationEnd); |
|
| 817 | }, |
|
| 818 | ||
| 819 | clear: { |
|
| 820 | queue: function() { |
|
| 821 | module.debug('Clearing animation queue'); |
|
| 822 | module.remove.queueCallback(); |
|
| 823 | } |
|
| 824 | }, |
|
| 825 | ||
| 826 | enable: function() { |
|
| 827 | module.verbose('Starting animation'); |
|
| 828 | $module.removeClass(className.disabled); |
|
| 829 | }, |
|
| 830 | ||
| 831 | disable: function() { |
|
| 832 | module.debug('Stopping animation'); |
|
| 833 | $module.addClass(className.disabled); |
|
| 834 | }, |
|
| 835 | ||
| 836 | setting: function(name, value) { |
|
| 837 | module.debug('Changing setting', name, value); |
|
| 838 | if( $.isPlainObject(name) ) { |
|
| 839 | $.extend(true, settings, name); |
|
| 840 | } |
|
| 841 | else if(value !== undefined) { |
|
| 842 | if($.isPlainObject(settings[name])) { |
|
| 843 | $.extend(true, settings[name], value); |
|
| 844 | } |
|
| 845 | else { |
|
| 846 | settings[name] = value; |
|
| 847 | } |
|
| 848 | } |
|
| 849 | else { |
|
| 850 | return settings[name]; |
|
| 851 | } |
|
| 852 | }, |
|
| 853 | internal: function(name, value) { |
|
| 854 | if( $.isPlainObject(name) ) { |
|
| 855 | $.extend(true, module, name); |
|
| 856 | } |
|
| 857 | else if(value !== undefined) { |
|
| 858 | module[name] = value; |
|
| 859 | } |
|
| 860 | else { |
|
| 861 | return module[name]; |
|
| 862 | } |
|
| 863 | }, |
|
| 864 | debug: function() { |
|
| 865 | if(!settings.silent && settings.debug) { |
|
| 866 | if(settings.performance) { |
|
| 867 | module.performance.log(arguments); |
|
| 868 | } |
|
| 869 | else { |
|
| 870 | module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':'); |
|
| 871 | module.debug.apply(console, arguments); |
|
| 872 | } |
|
| 873 | } |
|
| 874 | }, |
|
| 875 | verbose: function() { |
|
| 876 | if(!settings.silent && settings.verbose && settings.debug) { |
|
| 877 | if(settings.performance) { |
|
| 878 | module.performance.log(arguments); |
|
| 879 | } |
|
| 880 | else { |
|
| 881 | module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':'); |
|
| 882 | module.verbose.apply(console, arguments); |
|
| 883 | } |
|
| 884 | } |
|
| 885 | }, |
|
| 886 | error: function() { |
|
| 887 | if(!settings.silent) { |
|
| 888 | module.error = Function.prototype.bind.call(console.error, console, settings.name + ':'); |
|
| 889 | module.error.apply(console, arguments); |
|
| 890 | } |
|
| 891 | }, |
|
| 892 | performance: { |
|
| 893 | log: function(message) { |
|
| 894 | var |
|
| 895 | currentTime, |
|
| 896 | executionTime, |
|
| 897 | previousTime |
|
| 898 | ; |
|
| 899 | if(settings.performance) { |
|
| 900 | currentTime = new Date().getTime(); |
|
| 901 | previousTime = time || currentTime; |
|
| 902 | executionTime = currentTime - previousTime; |
|
| 903 | time = currentTime; |
|
| 904 | performance.push({ |
|
| 905 | 'Name' : message[0], |
|
| 906 | 'Arguments' : [].slice.call(message, 1) || '', |
|
| 907 | 'Element' : element, |
|
| 908 | 'Execution Time' : executionTime |
|
| 909 | }); |
|
| 910 | } |
|
| 911 | clearTimeout(module.performance.timer); |
|
| 912 | module.performance.timer = setTimeout(module.performance.display, 500); |
|
| 913 | }, |
|
| 914 | display: function() { |
|
| 915 | var |
|
| 916 | title = settings.name + ':', |
|
| 917 | totalTime = 0 |
|
| 918 | ; |
|
| 919 | time = false; |
|
| 920 | clearTimeout(module.performance.timer); |
|
| 921 | $.each(performance, function(index, data) { |
|
| 922 | totalTime += data['Execution Time']; |
|
| 923 | }); |
|
| 924 | title += ' ' + totalTime + 'ms'; |
|
| 925 | if(moduleSelector) { |
|
| 926 | title += ' \'' + moduleSelector + '\''; |
|
| 927 | } |
|
| 928 | if($allModules.length > 1) { |
|
| 929 | title += ' ' + '(' + $allModules.length + ')'; |
|
| 930 | } |
|
| 931 | if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { |
|
| 932 | console.groupCollapsed(title); |
|
| 933 | if(console.table) { |
|
| 934 | console.table(performance); |
|
| 935 | } |
|
| 936 | else { |
|
| 937 | $.each(performance, function(index, data) { |
|
| 938 | console.log(data['Name'] + ': ' + data['Execution Time']+'ms'); |
|
| 939 | }); |
|
| 940 | } |
|
| 941 | console.groupEnd(); |
|
| 942 | } |
|
| 943 | performance = []; |
|
| 944 | } |
|
| 945 | }, |
|
| 946 | // modified for transition to return invoke success |
|
| 947 | invoke: function(query, passedArguments, context) { |
|
| 948 | var |
|
| 949 | object = instance, |
|
| 950 | maxDepth, |
|
| 951 | found, |
|
| 952 | response |
|
| 953 | ; |
|
| 954 | passedArguments = passedArguments || queryArguments; |
|
| 955 | context = element || context; |
|
| 956 | if(typeof query == 'string' && object !== undefined) { |
|
| 957 | query = query.split(/[\. ]/); |
|
| 958 | maxDepth = query.length - 1; |
|
| 959 | $.each(query, function(depth, value) { |
|
| 960 | var camelCaseValue = (depth != maxDepth) |
|
| 961 | ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1) |
|
| 962 | : query |
|
| 963 | ; |
|
| 964 | if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) { |
|
| 965 | object = object[camelCaseValue]; |
|
| 966 | } |
|
| 967 | else if( object[camelCaseValue] !== undefined ) { |
|
| 968 | found = object[camelCaseValue]; |
|
| 969 | return false; |
|
| 970 | } |
|
| 971 | else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) { |
|
| 972 | object = object[value]; |
|
| 973 | } |
|
| 974 | else if( object[value] !== undefined ) { |
|
| 975 | found = object[value]; |
|
| 976 | return false; |
|
| 977 | } |
|
| 978 | else { |
|
| 979 | return false; |
|
| 980 | } |
|
| 981 | }); |
|
| 982 | } |
|
| 983 | if ( $.isFunction( found ) ) { |
|
| 984 | response = found.apply(context, passedArguments); |
|
| 985 | } |
|
| 986 | else if(found !== undefined) { |
|
| 987 | response = found; |
|
| 988 | } |
|
| 989 | ||
| 990 | if($.isArray(returnedValue)) { |
|
| 991 | returnedValue.push(response); |
|
| 992 | } |
|
| 993 | else if(returnedValue !== undefined) { |
|
| 994 | returnedValue = [returnedValue, response]; |
|
| 995 | } |
|
| 996 | else if(response !== undefined) { |
|
| 997 | returnedValue = response; |
|
| 998 | } |
|
| 999 | return (found !== undefined) |
|
| 1000 | ? found |
|
| 1001 | : false |
|
| 1002 | ; |
|
| 1003 | } |
|
| 1004 | }; |
|
| 1005 | module.initialize(); |
|
| 1006 | }) |
|
| 1007 | ; |
|
| 1008 | return (returnedValue !== undefined) |
|
| 1009 | ? returnedValue |
|
| 1010 | : this |
|
| 1011 | ; |
|
| 1012 | }; |
|
| 1013 | ||
| 1014 | // Records if CSS transition is available |
|
| 1015 | $.fn.transition.exists = {}; |
|
| 1016 | ||
| 1017 | $.fn.transition.settings = { |
|
| 1018 | ||
| 1019 | // module info |
|
| 1020 | name : 'Transition', |
|
| 1021 | ||
| 1022 | // hide all output from this component regardless of other settings |
|
| 1023 | silent : false, |
|
| 1024 | ||
| 1025 | // debug content outputted to console |
|
| 1026 | debug : false, |
|
| 1027 | ||
| 1028 | // verbose debug output |
|
| 1029 | verbose : false, |
|
| 1030 | ||
| 1031 | // performance data output |
|
| 1032 | performance : true, |
|
| 1033 | ||
| 1034 | // event namespace |
|
| 1035 | namespace : 'transition', |
|
| 1036 | ||
| 1037 | // delay between animations in group |
|
| 1038 | interval : 0, |
|
| 1039 | ||
| 1040 | // whether group animations should be reversed |
|
| 1041 | reverse : 'auto', |
|
| 1042 | ||
| 1043 | // animation callback event |
|
| 1044 | onStart : function() {}, |
|
| 1045 | onComplete : function() {}, |
|
| 1046 | onShow : function() {}, |
|
| 1047 | onHide : function() {}, |
|
| 1048 | ||
| 1049 | // whether timeout should be used to ensure callback fires in cases animationend does not |
|
| 1050 | useFailSafe : true, |
|
| 1051 | ||
| 1052 | // delay in ms for fail safe |
|
| 1053 | failSafeDelay : 100, |
|
| 1054 | ||
| 1055 | // whether EXACT animation can occur twice in a row |
|
| 1056 | allowRepeats : false, |
|
| 1057 | ||
| 1058 | // Override final display type on visible |
|
| 1059 | displayType : false, |
|
| 1060 | ||
| 1061 | // animation duration |
|
| 1062 | animation : 'fade', |
|
| 1063 | duration : false, |
|
| 1064 | ||
| 1065 | // new animations will occur after previous ones |
|
| 1066 | queue : true, |
|
| 1067 | ||
| 1068 | metadata : { |
|
| 1069 | displayType: 'display' |
|
| 1070 | }, |
|
| 1071 | ||
| 1072 | className : { |
|
| 1073 | animating : 'animating', |
|
| 1074 | disabled : 'disabled', |
|
| 1075 | hidden : 'hidden', |
|
| 1076 | inward : 'in', |
|
| 1077 | loading : 'loading', |
|
| 1078 | looping : 'looping', |
|
| 1079 | outward : 'out', |
|
| 1080 | transition : 'transition', |
|
| 1081 | visible : 'visible' |
|
| 1082 | }, |
|
| 1083 | ||
| 1084 | // possible errors |
|
| 1085 | error: { |
|
| 1086 | noAnimation : 'Element is no longer attached to DOM. Unable to animate. Use silent setting to surpress this warning in production.', |
|
| 1087 | repeated : 'That animation is already occurring, cancelling repeated animation', |
|
| 1088 | method : 'The method you called is not defined', |
|
| 1089 | support : 'This browser does not support CSS animations' |
|
| 1090 | } |
|
| 1091 | ||
| 1092 | }; |
|
| 1093 | ||
| 1094 | ||
| 1095 | })( jQuery, window, document ); |
|
| 1096 | ||
