From 2bd1f6eaff454a34d3b80cdab535af427255f71a Mon Sep 17 00:00:00 2001 From: Tim Holman Date: Tue, 7 Dec 2021 19:12:44 -0500 Subject: [PATCH] init --- .DS_Store | Bin 0 -> 6148 bytes css/style.css | 110 ++++++++++++++++++++++++++++++++ index.html | 41 ++++++++++++ js/anime.min.js | 19 ++++++ js/main.js | 166 ++++++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 336 insertions(+) create mode 100644 .DS_Store create mode 100755 css/style.css create mode 100755 index.html create mode 100644 js/anime.min.js create mode 100644 js/main.js diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..d9c2a634821636efd3a1e76bda7a51ccd18a3fc7 GIT binary patch literal 6148 zcmeHKu};G<5IwgM3S#Nl(O-bnku8+KjFgoDC6S6sQddMU=PURPm|6J>{(~9u?(8-R z1xAFbJIQ{|v(G-iM824a%>2Hb5lx6FMqwNsqWZ?TpUaMo0&@g3JV#OG&Q;8gLzluo zSAgH$m1Z+Kmff?@# z^sXjcF^qQyZ^O7GVC&JllaZA%PgvQ68;X(D!CM(lCh@4XDxeAs6$qE~3FrUwpYQ)e zCw)={RDr!xz(i@5&atJCTX#0cxz?gwqp + + + + + + + Travis Heinström + + + + + + + +
+ +
+
+
+
+
+
+

Travis
Heinström

+

Things Here
Things Here - Things here

+
+
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/js/anime.min.js b/js/anime.min.js new file mode 100644 index 0000000..c7ed90e --- /dev/null +++ b/js/anime.min.js @@ -0,0 +1,19 @@ +(function(u,r){"function"===typeof define&&define.amd?define([],r):"object"===typeof module&&module.exports?module.exports=r():u.anime=r()})(this,function(){var u={duration:1E3,delay:0,loop:!1,autoplay:!0,direction:"normal",easing:"easeOutElastic",elasticity:400,round:!1,begin:void 0,update:void 0,complete:void 0},r="translateX translateY translateZ rotate rotateX rotateY rotateZ scale scaleX scaleY scaleZ skewX skewY".split(" "),y,f={arr:function(a){return Array.isArray(a)},obj:function(a){return-1< +Object.prototype.toString.call(a).indexOf("Object")},svg:function(a){return a instanceof SVGElement},dom:function(a){return a.nodeType||f.svg(a)},num:function(a){return!isNaN(parseInt(a))},str:function(a){return"string"===typeof a},fnc:function(a){return"function"===typeof a},und:function(a){return"undefined"===typeof a},nul:function(a){return"null"===typeof a},hex:function(a){return/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(a)},rgb:function(a){return/^rgb/.test(a)},hsl:function(a){return/^hsl/.test(a)}, +col:function(a){return f.hex(a)||f.rgb(a)||f.hsl(a)}},D=function(){var a={},b={Sine:function(a){return 1-Math.cos(a*Math.PI/2)},Circ:function(a){return 1-Math.sqrt(1-a*a)},Elastic:function(a,b){if(0===a||1===a)return a;var d=1-Math.min(b,998)/1E3,g=a/1-1;return-(Math.pow(2,10*g)*Math.sin(2*(g-d/(2*Math.PI)*Math.asin(1))*Math.PI/d))},Back:function(a){return a*a*(3*a-2)},Bounce:function(a){for(var b,d=4;a<((b=Math.pow(2,--d))-1)/11;);return 1/Math.pow(4,3-d)-7.5625*Math.pow((3*b-2)/22-a,2)}};["Quad", +"Cubic","Quart","Quint","Expo"].forEach(function(a,e){b[a]=function(a){return Math.pow(a,e+2)}});Object.keys(b).forEach(function(c){var e=b[c];a["easeIn"+c]=e;a["easeOut"+c]=function(a,b){return 1-e(1-a,b)};a["easeInOut"+c]=function(a,b){return.5>a?e(2*a,b)/2:1-e(-2*a+2,b)/2};a["easeOutIn"+c]=function(a,b){return.5>a?(1-e(1-2*a,b))/2:(e(2*a-1,b)+1)/2}});a.linear=function(a){return a};return a}(),z=function(a){return f.str(a)?a:a+""},E=function(a){return a.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}, +F=function(a){if(f.col(a))return!1;try{return document.querySelectorAll(a)}catch(b){return!1}},A=function(a){return a.reduce(function(a,c){return a.concat(f.arr(c)?A(c):c)},[])},t=function(a){if(f.arr(a))return a;f.str(a)&&(a=F(a)||a);return a instanceof NodeList||a instanceof HTMLCollection?[].slice.call(a):[a]},G=function(a,b){return a.some(function(a){return a===b})},R=function(a,b){var c={};a.forEach(function(a){var d=JSON.stringify(b.map(function(b){return a[b]}));c[d]=c[d]||[];c[d].push(a)}); +return Object.keys(c).map(function(a){return c[a]})},H=function(a){return a.filter(function(a,c,e){return e.indexOf(a)===c})},B=function(a){var b={},c;for(c in a)b[c]=a[c];return b},v=function(a,b){for(var c in b)a[c]=f.und(a[c])?b[c]:a[c];return a},S=function(a){a=a.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(a,b,c,m){return b+b+c+c+m+m});var b=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(a);a=parseInt(b[1],16);var c=parseInt(b[2],16),b=parseInt(b[3],16);return"rgb("+a+","+c+","+b+")"}, +T=function(a){a=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(a);var b=parseInt(a[1])/360,c=parseInt(a[2])/100,e=parseInt(a[3])/100;a=function(a,b,c){0>c&&(c+=1);1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a};if(0==c)c=e=b=e;else var d=.5>e?e*(1+c):e+c-e*c,g=2*e-d,c=a(g,d,b+1/3),e=a(g,d,b),b=a(g,d,b-1/3);return"rgb("+255*c+","+255*e+","+255*b+")"},p=function(a){return/([\+\-]?[0-9|auto\.]+)(%|px|pt|em|rem|in|cm|mm|ex|pc|vw|vh|deg)?/.exec(a)[2]},I=function(a,b,c){return p(b)? +b:-1=d.delay&&(d.begin(b),d.begin=void 0);c.current>=b.duration&&(d.loop?(c.start=a,"alternate"===d.direction&&C(b,!0),f.num(d.loop)&&d.loop--):(b.ended=!0,b.pause(),d.complete&&d.complete(b)),c.last=0)};b.seek=function(a){P(b,a/100*b.duration)};b.pause=function(){ba(b);var a=n.indexOf(b);-1 div'); + this._initEvents(); + }; + + /** + * Init/Bind events. + */ + TiltFx.prototype._initEvents = function() { + var self = this; + + this.mouseenterFn = function() { + for(var key in self.DOM.animatable) { + anime.remove(self.DOM.animatable[key]); + } + }; + + this.mousemoveFn = function(ev) { + requestAnimationFrame(function() { self._layout(ev); }); + }; + + this.mouseleaveFn = function(ev) { + requestAnimationFrame(function() { + for(var key in self.DOM.animatable) { + if( self.options.movement[key] == undefined ) {continue;} + anime({ + targets: self.DOM.animatable[key], + duration: self.options.movement[key].reverseAnimation != undefined ? self.options.movement[key].reverseAnimation.duration || 0 : 1, + easing: self.options.movement[key].reverseAnimation != undefined ? self.options.movement[key].reverseAnimation.easing || 'linear' : 'linear', + elasticity: self.options.movement[key].reverseAnimation != undefined ? self.options.movement[key].reverseAnimation.elasticity || null : null, + scaleX: 1, + scaleY: 1, + scaleZ: 1, + translateX: 0, + translateY: 0, + translateZ: 0, + rotateX: 0, + rotateY: 0, + rotateZ: 0 + }); + } + }); + }; + + this.DOM.el.addEventListener('mousemove', this.mousemoveFn); + this.DOM.el.addEventListener('mouseleave', this.mouseleaveFn); + this.DOM.el.addEventListener('mouseenter', this.mouseenterFn); + }; + + TiltFx.prototype._layout = function(ev) { + // Mouse position relative to the document. + var mousepos = getMousePos(ev), + // Document scrolls. + docScrolls = {left : document.body.scrollLeft + document.documentElement.scrollLeft, top : document.body.scrollTop + document.documentElement.scrollTop}, + bounds = this.DOM.el.getBoundingClientRect(), + // Mouse position relative to the main element (this.DOM.el). + relmousepos = { x : mousepos.x - bounds.left - docScrolls.left, y : mousepos.y - bounds.top - docScrolls.top }; + + // Movement settings for the animatable elements. + for(var key in this.DOM.animatable) { + if( this.DOM.animatable[key] == undefined || this.options.movement[key] == undefined ) { + continue; + } + var t = this.options.movement[key] != undefined ? this.options.movement[key].translation || {x:0,y:0,z:0} : {x:0,y:0,z:0}, + r = this.options.movement[key] != undefined ? this.options.movement[key].rotation || {x:0,y:0,z:0} : {x:0,y:0,z:0}, + setRange = function (obj) { + for(var k in obj) { + if( obj[k] == undefined ) { + obj[k] = [0,0]; + } + else if( typeof obj[k] === 'number' ) { + obj[k] = [-1*obj[k],obj[k]]; + } + } + }; + + setRange(t); + setRange(r); + + var transforms = { + translation : { + x: (t.x[1]-t.x[0])/bounds.width*relmousepos.x + t.x[0], + y: (t.y[1]-t.y[0])/bounds.height*relmousepos.y + t.y[0], + z: (t.z[1]-t.z[0])/bounds.height*relmousepos.y + t.z[0], + }, + rotation : { + x: (r.x[1]-r.x[0])/bounds.height*relmousepos.y + r.x[0], + y: (r.y[1]-r.y[0])/bounds.width*relmousepos.x + r.y[0], + z: (r.z[1]-r.z[0])/bounds.width*relmousepos.x + r.z[0] + } + }; + + this.DOM.animatable[key].style.WebkitTransform = this.DOM.animatable[key].style.transform = 'translateX(' + transforms.translation.x + 'px) translateY(' + transforms.translation.y + 'px) translateZ(' + transforms.translation.z + 'px) rotateX(' + transforms.rotation.x + 'deg) rotateY(' + transforms.rotation.y + 'deg) rotateZ(' + transforms.rotation.z + 'deg)'; + } + }; + + window.TiltFx = TiltFx; + +})(window); \ No newline at end of file