mirror of
https://gitee.com/lauix/HFish
synced 2025-05-13 21:28:02 +08:00
499 lines
68 KiB
Go
499 lines
68 KiB
Go
|
|
||
|
|
|
||
|
|
;(function(window) {
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
var Waves = Waves || {};
|
||
|
|
var $$ = document.querySelectorAll.bind(document);
|
||
|
|
|
||
|
|
// Find exact position of element
|
||
|
|
function isWindow(obj) {
|
||
|
|
return obj !== null && obj === obj.window;
|
||
|
|
}
|
||
|
|
|
||
|
|
function getWindow(elem) {
|
||
|
|
return isWindow(elem) ? elem : elem.nodeType === 9 && elem.defaultView;
|
||
|
|
}
|
||
|
|
|
||
|
|
function offset(elem) {
|
||
|
|
var docElem, win,
|
||
|
|
box = {top: 0, left: 0},
|
||
|
|
doc = elem && elem.ownerDocument;
|
||
|
|
|
||
|
|
docElem = doc.documentElement;
|
||
|
|
|
||
|
|
if (typeof elem.getBoundingClientRect !== typeof undefined) {
|
||
|
|
box = elem.getBoundingClientRect();
|
||
|
|
}
|
||
|
|
win = getWindow(doc);
|
||
|
|
return {
|
||
|
|
top: box.top + win.pageYOffset - docElem.clientTop,
|
||
|
|
left: box.left + win.pageXOffset - docElem.clientLeft
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
function convertStyle(obj) {
|
||
|
|
var style = '';
|
||
|
|
|
||
|
|
for (var a in obj) {
|
||
|
|
if (obj.hasOwnProperty(a)) {
|
||
|
|
style += (a + ':' + obj[a] + ';');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
return style;
|
||
|
|
}
|
||
|
|
|
||
|
|
var Effect = {
|
||
|
|
|
||
|
|
// Effect delay
|
||
|
|
duration: 750,
|
||
|
|
|
||
|
|
show: function(e, element) {
|
||
|
|
|
||
|
|
// Disable right click
|
||
|
|
if (e.button === 2) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
|
||
|
|
var el = element || this;
|
||
|
|
|
||
|
|
// Create ripple
|
||
|
|
var ripple = document.createElement('div');
|
||
|
|
ripple.className = 'waves-ripple';
|
||
|
|
el.appendChild(ripple);
|
||
|
|
|
||
|
|
// Get click coordinate and element witdh
|
||
|
|
var pos = offset(el);
|
||
|
|
var relativeY = (e.pageY - pos.top);
|
||
|
|
var relativeX = (e.pageX - pos.left);
|
||
|
|
var scale = 'scale('+((el.clientWidth / 100) * 10)+')';
|
||
|
|
|
||
|
|
// Support for touch devices
|
||
|
|
if ('touches' in e) {
|
||
|
|
relativeY = (e.touches[0].pageY - pos.top);
|
||
|
|
relativeX = (e.touches[0].pageX - pos.left);
|
||
|
|
}
|
||
|
|
|
||
|
|
// Attach data to element
|
||
|
|
ripple.setAttribute('data-hold', Date.now());
|
||
|
|
ripple.setAttribute('data-scale', scale);
|
||
|
|
ripple.setAttribute('data-x', relativeX);
|
||
|
|
ripple.setAttribute('data-y', relativeY);
|
||
|
|
|
||
|
|
// Set ripple position
|
||
|
|
var rippleStyle = {
|
||
|
|
'top': relativeY+'px',
|
||
|
|
'left': relativeX+'px'
|
||
|
|
};
|
||
|
|
|
||
|
|
ripple.className = ripple.className + ' waves-notransition';
|
||
|
|
ripple.setAttribute('style', convertStyle(rippleStyle));
|
||
|
|
ripple.className = ripple.className.replace('waves-notransition', '');
|
||
|
|
|
||
|
|
// Scale the ripple
|
||
|
|
rippleStyle['-webkit-transform'] = scale;
|
||
|
|
rippleStyle['-moz-transform'] = scale;
|
||
|
|
rippleStyle['-ms-transform'] = scale;
|
||
|
|
rippleStyle['-o-transform'] = scale;
|
||
|
|
rippleStyle.transform = scale;
|
||
|
|
rippleStyle.opacity = '1';
|
||
|
|
|
||
|
|
rippleStyle['-webkit-transition-duration'] = Effect.duration + 'ms';
|
||
|
|
rippleStyle['-moz-transition-duration'] = Effect.duration + 'ms';
|
||
|
|
rippleStyle['-o-transition-duration'] = Effect.duration + 'ms';
|
||
|
|
rippleStyle['transition-duration'] = Effect.duration + 'ms';
|
||
|
|
|
||
|
|
rippleStyle['-webkit-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
|
||
|
|
rippleStyle['-moz-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
|
||
|
|
rippleStyle['-o-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
|
||
|
|
rippleStyle['transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
|
||
|
|
|
||
|
|
ripple.setAttribute('style', convertStyle(rippleStyle));
|
||
|
|
},
|
||
|
|
|
||
|
|
hide: function(e) {
|
||
|
|
TouchHandler.touchup(e);
|
||
|
|
|
||
|
|
var el = this;
|
||
|
|
var width = el.clientWidth * 1.4;
|
||
|
|
|
||
|
|
// Get first ripple
|
||
|
|
var ripple = null;
|
||
|
|
var ripples = el.getElementsByClassName('waves-ripple');
|
||
|
|
if (ripples.length > 0) {
|
||
|
|
ripple = ripples[ripples.length - 1];
|
||
|
|
} else {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
|
||
|
|
var relativeX = ripple.getAttribute('data-x');
|
||
|
|
var relativeY = ripple.getAttribute('data-y');
|
||
|
|
var scale = ripple.getAttribute('data-scale');
|
||
|
|
|
||
|
|
// Get delay beetween mousedown and mouse leave
|
||
|
|
var diff = Date.now() - Number(ripple.getAttribute('data-hold'));
|
||
|
|
var delay = 350 - diff;
|
||
|
|
|
||
|
|
if (delay < 0) {
|
||
|
|
delay = 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Fade out ripple after delay
|
||
|
|
setTimeout(function() {
|
||
|
|
var style = {
|
||
|
|
'top': relativeY+'px',
|
||
|
|
'left': relativeX+'px',
|
||
|
|
'opacity': '0',
|
||
|
|
|
||
|
|
// Duration
|
||
|
|
'-webkit-transition-duration': Effect.duration + 'ms',
|
||
|
|
'-moz-transition-duration': Effect.duration + 'ms',
|
||
|
|
'-o-transition-duration': Effect.duration + 'ms',
|
||
|
|
'transition-duration': Effect.duration + 'ms',
|
||
|
|
'-webkit-transform': scale,
|
||
|
|
'-moz-transform': scale,
|
||
|
|
'-ms-transform': scale,
|
||
|
|
'-o-transform': scale,
|
||
|
|
'transform': scale,
|
||
|
|
};
|
||
|
|
|
||
|
|
ripple.setAttribute('style', convertStyle(style));
|
||
|
|
|
||
|
|
setTimeout(function() {
|
||
|
|
try {
|
||
|
|
el.removeChild(ripple);
|
||
|
|
} catch(e) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
}, Effect.duration);
|
||
|
|
}, delay);
|
||
|
|
},
|
||
|
|
|
||
|
|
// Little hack to make <input> can perform waves effect
|
||
|
|
wrapInput: function(elements) {
|
||
|
|
for (var a = 0; a < elements.length; a++) {
|
||
|
|
var el = elements[a];
|
||
|
|
|
||
|
|
if (el.tagName.toLowerCase() === 'input') {
|
||
|
|
var parent = el.parentNode;
|
||
|
|
|
||
|
|
// If input already have parent just pass through
|
||
|
|
if (parent.tagName.toLowerCase() === 'i' && parent.className.indexOf('waves-effect') !== -1) {
|
||
|
|
continue;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Put element class and style to the specified parent
|
||
|
|
var wrapper = document.createElement('i');
|
||
|
|
wrapper.className = el.className + ' waves-input-wrapper';
|
||
|
|
|
||
|
|
var elementStyle = el.getAttribute('style');
|
||
|
|
|
||
|
|
if (!elementStyle) {
|
||
|
|
elementStyle = '';
|
||
|
|
}
|
||
|
|
|
||
|
|
wrapper.setAttribute('style', elementStyle);
|
||
|
|
|
||
|
|
el.className = 'waves-button-input';
|
||
|
|
el.removeAttribute('style');
|
||
|
|
|
||
|
|
// Put element as child
|
||
|
|
parent.replaceChild(wrapper, el);
|
||
|
|
wrapper.appendChild(el);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Disable mousedown event for 500ms during and after touch
|
||
|
|
*/
|
||
|
|
var TouchHandler = {
|
||
|
|
/* uses an integer rather than bool so there's no issues with
|
||
|
|
* needing to clear timeouts if another touch event occurred
|
||
|
|
* within the 500ms. Cannot mouseup between touchstart and
|
||
|
|
* touchend, nor in the 500ms after touchend. */
|
||
|
|
touches: 0,
|
||
|
|
allowEvent: function(e) {
|
||
|
|
var allow = true;
|
||
|
|
|
||
|
|
if (e.type === 'touchstart') {
|
||
|
|
TouchHandler.touches += 1; //push
|
||
|
|
} else if (e.type === 'touchend' || e.type === 'touchcancel') {
|
||
|
|
setTimeout(function() {
|
||
|
|
if (TouchHandler.touches > 0) {
|
||
|
|
TouchHandler.touches -= 1; //pop after 500ms
|
||
|
|
}
|
||
|
|
}, 500);
|
||
|
|
} else if (e.type === 'mousedown' && TouchHandler.touches > 0) {
|
||
|
|
allow = false;
|
||
|
|
}
|
||
|
|
|
||
|
|
return allow;
|
||
|
|
},
|
||
|
|
touchup: function(e) {
|
||
|
|
TouchHandler.allowEvent(e);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Delegated click handler for .waves-effect element.
|
||
|
|
* returns null when .waves-effect element not in "click tree"
|
||
|
|
*/
|
||
|
|
function getWavesEffectElement(e) {
|
||
|
|
if (TouchHandler.allowEvent(e) === false) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
var element = null;
|
||
|
|
var target = e.target || e.srcElement;
|
||
|
|
|
||
|
|
while (target.parentElement !== null) {
|
||
|
|
if (!(target instanceof SVGElement) && target.className.indexOf('waves-effect') !== -1) {
|
||
|
|
element = target;
|
||
|
|
break;
|
||
|
|
} else if (target.classList.contains('waves-effect')) {
|
||
|
|
element = target;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
target = target.parentElement;
|
||
|
|
}
|
||
|
|
|
||
|
|
return element;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Bubble the click and show effect if .waves-effect elem was found
|
||
|
|
*/
|
||
|
|
function showEffect(e) {
|
||
|
|
var element = getWavesEffectElement(e);
|
||
|
|
|
||
|
|
if (element !== null) {
|
||
|
|
Effect.show(e, element);
|
||
|
|
|
||
|
|
if ('ontouchstart' in window) {
|
||
|
|
element.addEventListener('touchend', Effect.hide, false);
|
||
|
|
element.addEventListener('touchcancel', Effect.hide, false);
|
||
|
|
}
|
||
|
|
|
||
|
|
element.addEventListener('mouseup', Effect.hide, false);
|
||
|
|
element.addEventListener('mouseleave', Effect.hide, false);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
Waves.displayEffect = function(options) {
|
||
|
|
options = options || {};
|
||
|
|
|
||
|
|
if ('duration' in options) {
|
||
|
|
Effect.duration = options.duration;
|
||
|
|
}
|
||
|
|
|
||
|
|
//Wrap input inside <i> tag
|
||
|
|
Effect.wrapInput($$('.waves-effect'));
|
||
|
|
|
||
|
|
if ('ontouchstart' in window) {
|
||
|
|
document.body.addEventListener('touchstart', showEffect, false);
|
||
|
|
}
|
||
|
|
|
||
|
|
document.body.addEventListener('mousedown', showEffect, false);
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Attach Waves to an input element (or any element which doesn't
|
||
|
|
* bubble mouseup/mousedown events).
|
||
|
|
* Intended to be used with dynamically loaded forms/inputs, or
|
||
|
|
* where the user doesn't want a delegated click handler.
|
||
|
|
*/
|
||
|
|
Waves.attach = function(element) {
|
||
|
|
//FUTURE: automatically add waves classes and allow users
|
||
|
|
// to specify them with an options param? Eg. light/classic/button
|
||
|
|
if (element.tagName.toLowerCase() === 'input') {
|
||
|
|
Effect.wrapInput([element]);
|
||
|
|
element = element.parentElement;
|
||
|
|
}
|
||
|
|
|
||
|
|
if ('ontouchstart' in window) {
|
||
|
|
element.addEventListener('touchstart', showEffect, false);
|
||
|
|
}
|
||
|
|
|
||
|
|
element.addEventListener('mousedown', showEffect, false);
|
||
|
|
};
|
||
|
|
|
||
|
|
window.Waves = Waves;
|
||
|
|
|
||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
||
|
|
Waves.displayEffect();
|
||
|
|
}, false);
|
||
|
|
|
||
|
|
})(window);
|
||
|
|
|
||
|
|
/*
|
||
|
|
Tabs
|
||
|
|
*/
|
||
|
|
/*! VelocityJS.org (1.2.2). (C) 2014 Julian Shapiro. MIT @license: en.wikipedia.org/wiki/MIT_License */
|
||
|
|
/*! VelocityJS.org jQuery Shim (1.0.1). (C) 2014 The jQuery Foundation. MIT @license: en.wikipedia.org/wiki/MIT_License. */
|
||
|
|
!function(e){function t(e){var t=e.length,r=$.type(e);return"function"===r||$.isWindow(e)?!1:1===e.nodeType&&t?!0:"array"===r||0===t||"number"==typeof t&&t>0&&t-1 in e}if(!e.jQuery){var $=function(e,t){return new $.fn.init(e,t)};$.isWindow=function(e){return null!=e&&e==e.window},$.type=function(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?a[o.call(e)]||"object":typeof e},$.isArray=Array.isArray||function(e){return"array"===$.type(e)},$.isPlainObject=function(e){var t;if(!e||"object"!==$.type(e)||e.nodeType||$.isWindow(e))return!1;try{if(e.constructor&&!n.call(e,"constructor")&&!n.call(e.constructor.prototype,"isPrototypeOf"))return!1}catch(r){return!1}for(t in e);return void 0===t||n.call(e,t)},$.each=function(e,r,a){var n,o=0,i=e.length,s=t(e);if(a){if(s)for(;i>o&&(n=r.apply(e[o],a),n!==!1);o++);else for(o in e)if(n=r.apply(e[o],a),n===!1)break}else if(s)for(;i>o&&(n=r.call(e[o],o,e[o]),n!==!1);o++);else for(o in e)if(n=r.call(e[o],o,e[o]),n===!1)break;return e},$.data=function(e,t,a){if(void 0===a){var n=e[$.expando],o=n&&r[n];if(void 0===t)return o;if(o&&t in o)return o[t]}else if(void 0!==t){var n=e[$.expando]||(e[$.expando]=++$.uuid);return r[n]=r[n]||{},r[n][t]=a,a}},$.removeData=function(e,t){var a=e[$.expando],n=a&&r[a];n&&$.each(t,function(e,t){delete n[t]})},$.extend=function(){var e,t,r,a,n,o,i=arguments[0]||{},s=1,l=arguments.length,u=!1;for("boolean"==typeof i&&(u=i,i=arguments[s]||{},s++),"object"!=typeof i&&"function"!==$.type(i)&&(i={}),s===l&&(i=this,s--);l>s;s++)if(null!=(n=arguments[s]))for(a in n)e=i[a],r=n[a],i!==r&&(u&&r&&($.isPlainObject(r)||(t=$.isArray(r)))?(t?(t=!1,o=e&&$.isArray(e)?e:[]):o=e&&$.isPlainObject(e)?e:{},i[a]=$.extend(u,o,r)):void 0!==r&&(i[a]=r));return i},$.queue=function(e,r,a){function n(e,r){var a=r||[];return null!=e&&(t(Object(e))?!function(e,t){for(var r=+t.length,a=0,n=e.length;r>a;)e[n++]=t[a++];if(r!==r)for(;void 0!==t[a];)e[n++]=t[a++];return e.length=n,e}(a,"string"==typeof e?[e]:e):[].push.call(a,e)),a}if(e){r=(r||"fx")+"queue";var o=$.data(e,r);return a?(!o||$.isArray(a)?o=$.data(e,r,n(a)):o.push(a),o):o||[]}},$.dequeue=function(e,t){$.each(e.nodeType?[e]:e,function(e,r){t=t||"fx";var a=$.queue(r,t),n=a.shift();"inprogress"===n&&(n=a.shift()),n&&("fx"===t&&a.unshift("inprogress"),n.call(r,function(){$.dequeue(r,t)}))})},$.fn=$.prototype={init:function(e){if(e.nodeType)return this[0]=e,this;throw new Error("Not a DOM node.")},offset:function(){var t=this[0].getBoundingClientRect?this[0].getBoundingClientRect():{top:0,left:0};return{top:t.top+(e.pageYOffset||document.scrollTop||0)-(document.clientTop||0),left:t.left+(e.pageXOffset||document.scrollLeft||0)-(document.clientLeft||0)}},position:function(){function e(){for(var e=this.offsetParent||document;e&&"html"===!e.nodeType.toLowerCase&&"static"===e.style.position;)e=e.offsetParent;return e||document}var t=this[0],e=e.apply(t),r=this.offset(),a=/^(?:body|html)$/i.test(e.nodeName)?{top:0,left:0}:$(e).offset();return r.top-=parseFloat(t.style.marginTop)||0,r.left-=parseFloat(t.style.marginLeft)||0,e.style&&(a.top+=parseFloat(e.style.borderTopWidth)||0,a.left+=parseFloat(e.style.borderLeftWidth)||0),{top:r.top-a.top,left:r.left-a.left}}};var r={};$.expando="velocity"+(new Date).getTime(),$.uuid=0;for(var a={},n=a.hasOwnProperty,o=a.toString,i="Boolean Number String Function Array Date RegExp Object Error".split(" "),s=0;s<i.length;s++)a["[object "+i[s]+"]"]=i[s].toLowerCase();$.fn.init.prototype=$.fn,e.Velocity={Utilities:$}}}(window),function(e){"object"==typeof module&&"object"==typeof module.exports?module.exports=e():"function"==typeof define&&define.amd?define(e):e()}(function(){return function(e,t,r,a){function n(e){for(var t=-1,r=e?e.length:0,a=[];++t<r;){var n=e[t];n&&a.push(n)}return a}function o(e){return g.isWrapped(e)?e=[].slice.call(e):g.isNode(e)&&(e=[e]),e}function i(e){var t=$.data(e,"velocity");return null===t?a:t}function s(e){return function(t){return Math.round(t*e)*(1/e)}}function l(e,r,a,n){function o(e,t){return 1-3*t+3*e}function i(e,t){return 3*t-6*e}function s(e){return 3*e}f
|
||
|
|
}),A.push(e)):"finish"===h&&(t[2].duration=1))}):!0})}),"stop"===h&&($.each(A,function(e,t){p(t,!0)}),T.promise&&T.resolver(m)),e();default:if(!$.isPlainObject(h)||g.isEmptyObject(h)){if(g.isString(h)&&v.Redirects[h]){var F=$.extend({},b),E=F.duration,j=F.delay||0;return F.backwards===!0&&(m=$.extend(!0,[],m).reverse()),$.each(m,function(e,t){parseFloat(F.stagger)?F.delay=j+parseFloat(F.stagger)*e:g.isFunction(F.stagger)&&(F.delay=j+F.stagger.call(t,e,P)),F.drag&&(F.duration=parseFloat(E)||(/^(callout|transition)/.test(h)?1e3:y),F.duration=Math.max(F.duration*(F.backwards?1-e/P:(e+1)/P),.75*F.duration,200)),v.Redirects[h].call(t,t,F||{},e,P,m,T.promise?T:a)}),e()}var H="Velocity: First argument ("+h+") was not a property map, a known action, or a registered redirect. Aborting.";return T.promise?T.rejecter(new Error(H)):console.log(H),e()}k="start"}var N={lastParent:null,lastPosition:null,lastFontSize:null,lastPercentToPxWidth:null,lastPercentToPxHeight:null,lastEmToPx:null,remToPx:null,vwToPx:null,vhToPx:null},L=[];$.each(m,function(e,t){g.isNode(t)&&n.call(t)});var F=$.extend({},v.defaults,b),R;if(F.loop=parseInt(F.loop),R=2*F.loop-1,F.loop)for(var O=0;R>O;O++){var z={delay:F.delay,progress:F.progress};O===R-1&&(z.display=F.display,z.visibility=F.visibility,z.complete=F.complete),S(m,"reverse",z)}return e()}};v=$.extend(S,v),v.animate=S;var P=t.requestAnimationFrame||d;return v.State.isMobile||r.hidden===a||r.addEventListener("visibilitychange",function(){r.hidden?(P=function(e){return setTimeout(function(){e(!0)},16)},c()):P=t.requestAnimationFrame||d}),e.Velocity=v,e!==t&&(e.fn.velocity=S,e.fn.velocity.defaults=v.defaults),$.each(["Down","Up"],function(e,t){v.Redirects["slide"+t]=function(e,r,n,o,i,s){var l=$.extend({},r),u=l.begin,c=l.complete,p={height:"",marginTop:"",marginBottom:"",paddingTop:"",paddingBottom:""},f={};l.display===a&&(l.display="Down"===t?"inline"===v.CSS.Values.getDisplayType(e)?"inline-block":"block":"none"),l.begin=function(){u&&u.call(i,i);for(var r in p){f[r]=e.style[r];var a=v.CSS.getPropertyValue(e,r);p[r]="Down"===t?[a,0]:[0,a]}f.overflow=e.style.overflow,e.style.overflow="hidden"},l.complete=function(){for(var t in f)e.style[t]=f[t];c&&c.call(i,i),s&&s.resolver(i)},v(e,p,l)}}),$.each(["In","Out"],function(e,t){v.Redirects["fade"+t]=function(e,r,n,o,i,s){var l=$.extend({},r),u={opacity:"In"===t?1:0},c=l.complete;l.complete=n!==o-1?l.begin=null:function(){c&&c.call(i,i),s&&s.resolver(i)},l.display===a&&(l.display="In"===t?"auto":"none"),v(this,u,l)}}),v}(window.jQuery||window.Zepto||window,window,document)});;!function(a,b,c,d){"use strict";function k(a,b,c){return setTimeout(q(a,c),b)}function l(a,b,c){return Array.isArray(a)?(m(a,c[b],c),!0):!1}function m(a,b,c){var e;if(a)if(a.forEach)a.forEach(b,c);else if(a.length!==d)for(e=0;e<a.length;)b.call(c,a[e],e,a),e++;else for(e in a)a.hasOwnProperty(e)&&b.call(c,a[e],e,a)}function n(a,b,c){for(var e=Object.keys(b),f=0;f<e.length;)(!c||c&&a[e[f]]===d)&&(a[e[f]]=b[e[f]]),f++;return a}function o(a,b){return n(a,b,!0)}function p(a,b,c){var e,d=b.prototype;e=a.prototype=Object.create(d),e.constructor=a,e._super=d,c&&n(e,c)}function q(a,b){return function(){return a.apply(b,arguments)}}function r(a,b){return typeof a==g?a.apply(b?b[0]||d:d,b):a}function s(a,b){return a===d?b:a}function t(a,b,c){m(x(b),function(b){a.addEventListener(b,c,!1)})}function u(a,b,c){m(x(b),function(b){a.removeEventListener(b,c,!1)})}function v(a,b){for(;a;){if(a==b)return!0;a=a.parentNode}return!1}function w(a,b){return a.indexOf(b)>-1}function x(a){return a.trim().split(/\s+/g)}function y(a,b,c){if(a.indexOf&&!c)return a.indexOf(b);for(var d=0;d<a.length;){if(c&&a[d][c]==b||!c&&a[d]===b)return d;d++}return-1}function z(a){return Array.prototype.slice.call(a,0)}function A(a,b,c){for(var d=[],e=[],f=0;f<a.length;){var g=b?a[f][b]:a[f];y(e,g)<0&&d.push(a[f]),e[f]=g,f++}return c&&(d=b?d.sort(function(a,c){return a[b]>c[b]}):d.sort()),d}function B(a,b){for(var c,f,g=b[0].toUpperCase()+b.slice(1),h=0;h<e.length;){if(c=e[h],f=c?c+g:b,f in a)return f;h++}return d}function D(){re
|
||
|
|
if (typeof define === 'function' && define.amd) {
|
||
|
|
define(['jquery', 'hammerjs'], factory);
|
||
|
|
} else if (typeof exports === 'object') {
|
||
|
|
factory(require('jquery'), require('hammerjs'));
|
||
|
|
} else {
|
||
|
|
factory(jQuery, Hammer);
|
||
|
|
}
|
||
|
|
}(function($, Hammer) {
|
||
|
|
function hammerify(el, options) {
|
||
|
|
var $el = $(el);
|
||
|
|
if(!$el.data("hammer")) {
|
||
|
|
$el.data("hammer", new Hammer($el[0], options));
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
$.fn.hammer = function(options) {
|
||
|
|
return this.each(function() {
|
||
|
|
hammerify(this, options);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
// extend the emit method to also trigger jQuery events
|
||
|
|
Hammer.Manager.prototype.emit = (function(originalEmit) {
|
||
|
|
return function(type, data) {
|
||
|
|
originalEmit.call(this, type, data);
|
||
|
|
$(this.element).trigger({
|
||
|
|
type: type,
|
||
|
|
gesture: data
|
||
|
|
});
|
||
|
|
};
|
||
|
|
})(Hammer.Manager.prototype.emit);
|
||
|
|
}));
|
||
|
|
|
||
|
|
var methods = {
|
||
|
|
init : function() {
|
||
|
|
return this.each(function() {
|
||
|
|
|
||
|
|
// For each set of tabs, we want to keep track of
|
||
|
|
// which tab is active and its associated content
|
||
|
|
var $this = $(this),
|
||
|
|
window_width = $(window).width();
|
||
|
|
|
||
|
|
$this.width('100%');
|
||
|
|
// Set Tab Width for each tab
|
||
|
|
var $num_tabs = $(this).children('li').length;
|
||
|
|
$this.children('li').each(function() {
|
||
|
|
$(this).width((100/$num_tabs)+'%');
|
||
|
|
});
|
||
|
|
var $active, $content, $links = $this.find('li.tab a'),
|
||
|
|
$tabs_width = $this.width(),
|
||
|
|
$tab_width = $this.find('li').first().outerWidth(),
|
||
|
|
$index = 0;
|
||
|
|
|
||
|
|
// If the location.hash matches one of the links, use that as the active tab.
|
||
|
|
$active = $($links.filter('[href="'+location.hash+'"]'));
|
||
|
|
|
||
|
|
// If no match is found, use the first link or any with class 'active' as the initial active tab.
|
||
|
|
if ($active.length === 0) {
|
||
|
|
$active = $(this).find('li.tab a.active').first();
|
||
|
|
}
|
||
|
|
if ($active.length === 0) {
|
||
|
|
$active = $(this).find('li.tab a').first();
|
||
|
|
}
|
||
|
|
|
||
|
|
$active.addClass('active');
|
||
|
|
$index = $links.index($active);
|
||
|
|
if ($index < 0) {
|
||
|
|
$index = 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
$content = $($active[0].hash);
|
||
|
|
|
||
|
|
// append indicator then set indicator width to tab width
|
||
|
|
$this.append('<div class="indicator"></div>');
|
||
|
|
var $indicator = $this.find('.indicator');
|
||
|
|
if ($this.is(":visible")) {
|
||
|
|
$indicator.css({"right": $tabs_width - (($index + 1) * $tab_width)});
|
||
|
|
$indicator.css({"left": $index * $tab_width});
|
||
|
|
}
|
||
|
|
$(window).resize(function () {
|
||
|
|
$tabs_width = $this.width();
|
||
|
|
$tab_width = $this.find('li').first().outerWidth();
|
||
|
|
if ($index < 0) {
|
||
|
|
$index = 0;
|
||
|
|
}
|
||
|
|
if ($tab_width !== 0 && $tabs_width !== 0) {
|
||
|
|
$indicator.css({"right": $tabs_width - (($index + 1) * $tab_width)});
|
||
|
|
$indicator.css({"left": $index * $tab_width});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// Hide the remaining content
|
||
|
|
$links.not($active).each(function () {
|
||
|
|
$(this.hash).hide();
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
// Bind the click event handler
|
||
|
|
$this.on('click', 'a', function(e){
|
||
|
|
$tabs_width = $this.width();
|
||
|
|
$tab_width = $this.find('li').first().outerWidth();
|
||
|
|
|
||
|
|
// Make the old tab inactive.
|
||
|
|
$active.removeClass('active');
|
||
|
|
$content.hide();
|
||
|
|
|
||
|
|
// Update the variables with the new link and content
|
||
|
|
$active = $(this);
|
||
|
|
$content = $(this.hash);
|
||
|
|
$links = $this.find('li.tab a');
|
||
|
|
|
||
|
|
// Make the tab active.
|
||
|
|
$active.addClass('active');
|
||
|
|
var $prev_index = $index;
|
||
|
|
$index = $links.index($(this));
|
||
|
|
if ($index < 0) {
|
||
|
|
$index = 0;
|
||
|
|
}
|
||
|
|
// Change url to current tab
|
||
|
|
// window.location.hash = $active.attr('href');
|
||
|
|
|
||
|
|
$content.show();
|
||
|
|
|
||
|
|
// Update indicator
|
||
|
|
if (($index - $prev_index) >= 0) {
|
||
|
|
$indicator.velocity({"right": $tabs_width - (($index + 1) * $tab_width)}, { duration: 300, queue: false, easing: 'easeOutQuad'});
|
||
|
|
$indicator.velocity({"left": $index * $tab_width}, {duration: 300, queue: false, easing: 'easeOutQuad', delay: 90});
|
||
|
|
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
$indicator.velocity({"left": $index * $tab_width}, { duration: 300, queue: false, easing: 'easeOutQuad'});
|
||
|
|
$indicator.velocity({"right": $tabs_width - (($index + 1) * $tab_width)}, {duration: 300, queue: false, easing: 'easeOutQuad', delay: 90});
|
||
|
|
}
|
||
|
|
|
||
|
|
// Prevent the anchor's default click action
|
||
|
|
e.preventDefault();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
},
|
||
|
|
select_tab : function( id ) {
|
||
|
|
this.find('a[href="#' + id + '"]').trigger('click');
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
$.fn.tabs = function(methodOrOptions) {
|
||
|
|
if ( methods[methodOrOptions] ) {
|
||
|
|
return methods[ methodOrOptions ].apply( this, Array.prototype.slice.call( arguments, 1 ));
|
||
|
|
} else if ( typeof methodOrOptions === 'object' || ! methodOrOptions ) {
|
||
|
|
// Default to "init"
|
||
|
|
return methods.init.apply( this, arguments );
|
||
|
|
} else {
|
||
|
|
$.error( 'Method ' + methodOrOptions + ' does not exist on jQuery.tooltip' );
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
$(document).ready(function(){
|
||
|
|
$('ul.tabs').tabs();
|
||
|
|
});
|