Skip to content

Commit

Permalink
hue-shift-pulse now uses a bezier curve
Browse files Browse the repository at this point in the history
  • Loading branch information
MikeyBurkman committed Jan 6, 2024
1 parent d91251a commit eaef7c3
Show file tree
Hide file tree
Showing 13 changed files with 40 additions and 26 deletions.
20 changes: 10 additions & 10 deletions docs/asset-manifest.json
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
{
"files": {
"main.js": "/partymoji/static/js/main.34197c14.chunk.js",
"main.js.map": "/partymoji/static/js/main.34197c14.chunk.js.map",
"main.js": "/partymoji/static/js/main.cb120b0a.chunk.js",
"main.js.map": "/partymoji/static/js/main.cb120b0a.chunk.js.map",
"runtime-main.js": "/partymoji/static/js/runtime-main.39af959e.js",
"runtime-main.js.map": "/partymoji/static/js/runtime-main.39af959e.js.map",
"static/css/2.a5ca4c85.chunk.css": "/partymoji/static/css/2.a5ca4c85.chunk.css",
"static/js/2.6eae5b00.chunk.js": "/partymoji/static/js/2.6eae5b00.chunk.js",
"static/js/2.6eae5b00.chunk.js.map": "/partymoji/static/js/2.6eae5b00.chunk.js.map",
"static/js/2.d0aef49f.chunk.js": "/partymoji/static/js/2.d0aef49f.chunk.js",
"static/js/2.d0aef49f.chunk.js.map": "/partymoji/static/js/2.d0aef49f.chunk.js.map",
"index.html": "/partymoji/index.html",
"static/css/2.a5ca4c85.chunk.css.map": "/partymoji/static/css/2.a5ca4c85.chunk.css.map",
"static/js/2.6eae5b00.chunk.js.LICENSE.txt": "/partymoji/static/js/2.6eae5b00.chunk.js.LICENSE.txt",
"static/js/effect.worker.c57a2be0.worker.js": "/partymoji/static/js/effect.worker.c57a2be0.worker.js",
"static/js/effect.worker.c57a2be0.worker.js.LICENSE.txt": "/partymoji/static/js/effect.worker.c57a2be0.worker.js.LICENSE.txt",
"static/js/effect.worker.c57a2be0.worker.js.map": "/partymoji/static/js/effect.worker.c57a2be0.worker.js.map"
"static/js/2.d0aef49f.chunk.js.LICENSE.txt": "/partymoji/static/js/2.d0aef49f.chunk.js.LICENSE.txt",
"static/js/effect.worker.2897f54a.worker.js": "/partymoji/static/js/effect.worker.2897f54a.worker.js",
"static/js/effect.worker.2897f54a.worker.js.LICENSE.txt": "/partymoji/static/js/effect.worker.2897f54a.worker.js.LICENSE.txt",
"static/js/effect.worker.2897f54a.worker.js.map": "/partymoji/static/js/effect.worker.2897f54a.worker.js.map"
},
"entrypoints": [
"static/js/runtime-main.39af959e.js",
"static/css/2.a5ca4c85.chunk.css",
"static/js/2.6eae5b00.chunk.js",
"static/js/main.34197c14.chunk.js"
"static/js/2.d0aef49f.chunk.js",
"static/js/main.cb120b0a.chunk.js"
]
}
2 changes: 1 addition & 1 deletion docs/index.html
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/partymoji/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="description" content="App for creating animated gifs and emojis"/><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/><script>window.ENV="PROD"</script><script src="https://unpkg.com/@material-ui/core@latest/umd/material-ui.production.min.js"></script><link rel="manifest" href="/partymoji/manifest.json"/><title>Partymoji</title><script>!function(e,a,t,n,g,c,o){e.GoogleAnalyticsObject=g,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),o=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",o.parentNode.insertBefore(c,o)}(window,document,"script",0,"ga"),ga("create","UA-XXXXX-Y","auto"),ga("send","pageview")</script><script async src="https://www.googletagmanager.com/gtag/js?id=G-DG40RRJF9R"></script><script>function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","G-DG40RRJF9R")</script><link href="/partymoji/static/css/2.a5ca4c85.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div style="background-color:#effffd" id="root"/><script>!function(e){function r(r){for(var n,i,a=r[0],l=r[1],p=r[2],c=0,s=[];c<a.length;c++)i=a[c],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&s.push(o[i][0]),o[i]=0;for(n in l)Object.prototype.hasOwnProperty.call(l,n)&&(e[n]=l[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,p||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var l=t[a];0!==o[l]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="/partymoji/";var a=this.webpackJsonppartymoji=this.webpackJsonppartymoji||[],l=a.push.bind(a);a.push=r,a=a.slice();for(var p=0;p<a.length;p++)r(a[p]);var f=l;t()}([])</script><script src="/partymoji/static/js/2.6eae5b00.chunk.js"></script><script src="/partymoji/static/js/main.34197c14.chunk.js"></script></body><footer><div style="font-size:.7rem">Built: 01/05/24 10:22:31 PM EST</div></footer></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/partymoji/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="description" content="App for creating animated gifs and emojis"/><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/><script>window.ENV="PROD"</script><script src="https://unpkg.com/@material-ui/core@latest/umd/material-ui.production.min.js"></script><link rel="manifest" href="/partymoji/manifest.json"/><title>Partymoji</title><script>!function(e,a,t,n,g,c,o){e.GoogleAnalyticsObject=g,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),o=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",o.parentNode.insertBefore(c,o)}(window,document,"script",0,"ga"),ga("create","UA-XXXXX-Y","auto"),ga("send","pageview")</script><script async src="https://www.googletagmanager.com/gtag/js?id=G-DG40RRJF9R"></script><script>function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","G-DG40RRJF9R")</script><link href="/partymoji/static/css/2.a5ca4c85.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div style="background-color:#effffd" id="root"/><script>!function(e){function r(r){for(var n,i,a=r[0],l=r[1],p=r[2],c=0,s=[];c<a.length;c++)i=a[c],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&s.push(o[i][0]),o[i]=0;for(n in l)Object.prototype.hasOwnProperty.call(l,n)&&(e[n]=l[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,p||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var l=t[a];0!==o[l]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="/partymoji/";var a=this.webpackJsonppartymoji=this.webpackJsonppartymoji||[],l=a.push.bind(a);a.push=r,a=a.slice();for(var p=0;p<a.length;p++)r(a[p]);var f=l;t()}([])</script><script src="/partymoji/static/js/2.d0aef49f.chunk.js"></script><script src="/partymoji/static/js/main.cb120b0a.chunk.js"></script></body><footer><div style="font-size:.7rem">Built: 01/05/24 10:32:45 PM EST</div></footer></html>

Large diffs are not rendered by default.

Large diffs are not rendered by default.

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions docs/static/js/effect.worker.2897f54a.worker.js.map

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion docs/static/js/effect.worker.c57a2be0.worker.js.map

This file was deleted.

1 change: 0 additions & 1 deletion docs/static/js/main.34197c14.chunk.js.map

This file was deleted.

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions docs/static/js/main.cb120b0a.chunk.js.map

Large diffs are not rendered by default.

22 changes: 18 additions & 4 deletions src/effects/hue-shift-pulse.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import { buildEffect } from '../domain/types';
import { shiftTowardsHue } from '../domain/utils/color';
import { mapImage } from '../domain/utils/image';
import { huePickerParam } from '../params/huePickerParam';
import { bezierCurve } from '../domain/utils/misc';
import { huePickerParam, bezierParam } from '../params';

export const hueShiftPulse = buildEffect({
name: 'Hue Shift Pulse',
Expand All @@ -11,10 +12,23 @@ export const hueShiftPulse = buildEffect({
name: 'Hue',
defaultValue: 180,
}),
],
bezierParam({
name: 'Easing',
defaultValue: [
[0.25, 0.75],
[0.75, 0.25],
],
}),
] as const,
fn: mapImage(
({ coord, getSrcPixel, frameCount, frameIndex, parameters: [hue] }) => {
const amount = Math.abs(Math.sin(Math.PI * (frameIndex / frameCount)));
({
coord,
getSrcPixel,
frameCount,
frameIndex,
parameters: [hue, easing],
}) => {
const amount = bezierCurve(easing, true)(frameIndex / frameCount);
return shiftTowardsHue(getSrcPixel(coord), hue, amount * 360);
}
),
Expand Down

0 comments on commit eaef7c3

Please sign in to comment.