UNPKG

lisn.js

Version:

Simply handle user gestures and actions. Includes widgets.

1 lines 9.39 kB
{"version":3,"file":"animate-play.cjs","names":["MC","_interopRequireWildcard","require","_animations","_cssAlter","_action","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_defineProperty","_toPropertyKey","value","enumerable","configurable","writable","_toPrimitive","Symbol","toPrimitive","TypeError","String","Number","AnimatePlay","register","registerAction","element","constructor","_play","_pause","_toggle","getMethods","animate","PAUSE","do","undo","S_TOGGLE","exports","AnimatePause","PLAY","TOGGLE","action","isInitial","iterateAnimations","animation","isPaused","playState","play","pause","resetCssAnimationsNow","hasClass","PREFIX_ANIMATE_PAUSE","removeClassesNow","addClassesNow"],"sources":["../../../src/ts/actions/animate-play.ts"],"sourcesContent":["/**\n * @module Actions\n *\n * @categoryDescription Animation\n * {@link AnimatePlay} and {@link AnimatePause} resume or pause all animations\n * on the given element. They work with CSS or Web Animations.\n *\n * {@link Actions.Animate | Animate} plays or reverses all animations on the\n * given element. It works with CSS or Web Animations.\n */\n\nimport * as MC from \"@lisn/globals/minification-constants\";\n\nimport {\n iterateAnimations,\n resetCssAnimationsNow,\n} from \"@lisn/utils/animations\";\nimport {\n hasClass,\n addClassesNow,\n removeClassesNow,\n} from \"@lisn/utils/css-alter\";\n\nimport { Action, registerAction } from \"@lisn/actions/action\";\n\n/**\n * Resumes or pauses all animations on the given element.\n *\n * It works with CSS or Web Animations.\n *\n * **IMPORTANT:** When constructed, it resets and pauses the animations as a\n * form of initialization.\n *\n * -------\n *\n * To use with auto-widgets (HTML API) as part of a trigger specification:\n * - Action name: \"animate-play\".\n * - Accepted string arguments: none\n * - Accepted options: none\n *\n * @example\n * ```html\n * <button id=\"btn\">Play/pause</button>\n * <div data-lisn-on-click=\"@animate-play +target=#btn\"></div>\n * ```\n *\n * @category Animation\n */\nexport class AnimatePlay implements Action {\n /**\n * Resumes the animations without resetting them.\n */\n readonly do: () => Promise<void>;\n\n /**\n * Pauses the animations without resetting them.\n */\n readonly undo: () => Promise<void>;\n\n /**\n * Resumes the animations if paused, otherwise pauses them.\n */\n readonly toggle: () => Promise<void>;\n\n static register() {\n registerAction(\"animate-play\", (element) => new AnimatePlay(element));\n }\n\n constructor(element: Element) {\n const { _play, _pause, _toggle } = getMethods(element);\n\n // initial state is 0% and paused\n animate(element, PAUSE, true);\n\n this.do = _play;\n this.undo = _pause;\n this[MC.S_TOGGLE] = _toggle;\n }\n}\n\n/**\n * Pauses or resumes all animations on the given element.\n *\n * It works with CSS or Web Animations.\n *\n * **IMPORTANT:** When constructed, it plays the animations as a form of\n * initialization.\n *\n * -------\n *\n * To use with auto-widgets (HTML API) as part of a trigger specification:\n * - Action name: \"animate-pause\".\n * - Accepted string arguments: none\n * - Accepted options: none\n *\n * @example\n * ```html\n * <button id=\"btn\">Play/pause</button>\n * <div data-lisn-on-click=\"@animate-pause +target=#btn\"></div>\n * ```\n *\n * @category Animation\n */\nexport class AnimatePause implements Action {\n /**\n * Pauses the animations without resetting them.\n */\n readonly do: () => Promise<void>;\n\n /**\n * Resumes the animations without resetting them.\n */\n readonly undo: () => Promise<void>;\n\n /**\n * Resumes the animations if paused, otherwise pauses them.\n */\n readonly toggle: () => Promise<void>;\n\n static register() {\n registerAction(\"animate-pause\", (element) => new AnimatePause(element));\n }\n\n constructor(element: Element) {\n const { _play, _pause, _toggle } = getMethods(element);\n\n // Initial state is playing\n _play();\n\n this.do = _pause;\n this.undo = _play;\n this[MC.S_TOGGLE] = _toggle;\n }\n}\n\n// --------------------\n\ntype AnimateAction = typeof PLAY | typeof PAUSE | typeof TOGGLE;\n\nconst PLAY = 0;\nconst PAUSE = 1;\nconst TOGGLE = 2;\n\nconst getMethods = (element: Element) => {\n return {\n _play: () => animate(element, PLAY),\n _pause: () => animate(element, PAUSE),\n _toggle: () => animate(element, TOGGLE),\n };\n};\n\nconst animate = (\n element: Element,\n action: AnimateAction,\n isInitial = false,\n) => {\n return iterateAnimations(\n element,\n /* istanbul ignore next */ // jsdom doesn't support Web Animations\n (animation) => {\n const isPaused = animation.playState === \"paused\";\n if (action === PLAY || (isPaused && action === TOGGLE)) {\n animation.play();\n } else {\n animation.pause();\n }\n },\n (element) => {\n if (isInitial) {\n resetCssAnimationsNow(element);\n }\n\n const isPaused = hasClass(element, MC.PREFIX_ANIMATE_PAUSE);\n if (action === PLAY || (isPaused && action === TOGGLE)) {\n removeClassesNow(element, MC.PREFIX_ANIMATE_PAUSE);\n } else {\n addClassesNow(element, MC.PREFIX_ANIMATE_PAUSE);\n }\n },\n isInitial,\n );\n};\n"],"mappings":";;;;;;AAWA,IAAAA,EAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,WAAA,GAAAD,OAAA;AAIA,IAAAE,SAAA,GAAAF,OAAA;AAMA,IAAAG,OAAA,GAAAH,OAAA;AAA8D,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAkB,gBAAAnB,CAAA,EAAAG,CAAA,EAAAF,CAAA,YAAAE,CAAA,GAAAiB,cAAA,CAAAjB,CAAA,MAAAH,CAAA,GAAAgB,MAAA,CAAAC,cAAA,CAAAjB,CAAA,EAAAG,CAAA,IAAAkB,KAAA,EAAApB,CAAA,EAAAqB,UAAA,MAAAC,YAAA,MAAAC,QAAA,UAAAxB,CAAA,CAAAG,CAAA,IAAAF,CAAA,EAAAD,CAAA;AAAA,SAAAoB,eAAAnB,CAAA,QAAAM,CAAA,GAAAkB,YAAA,CAAAxB,CAAA,uCAAAM,CAAA,GAAAA,CAAA,GAAAA,CAAA;AAAA,SAAAkB,aAAAxB,CAAA,EAAAE,CAAA,2BAAAF,CAAA,KAAAA,CAAA,SAAAA,CAAA,MAAAD,CAAA,GAAAC,CAAA,CAAAyB,MAAA,CAAAC,WAAA,kBAAA3B,CAAA,QAAAO,CAAA,GAAAP,CAAA,CAAAe,IAAA,CAAAd,CAAA,EAAAE,CAAA,uCAAAI,CAAA,SAAAA,CAAA,YAAAqB,SAAA,yEAAAzB,CAAA,GAAA0B,MAAA,GAAAC,MAAA,EAAA7B,CAAA,KAvB9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAM8B,WAAW,CAAmB;EAgBzC,OAAOC,QAAQA,CAAA,EAAG;IAChB,IAAAC,sBAAc,EAAC,cAAc,EAAGC,OAAO,IAAK,IAAIH,WAAW,CAACG,OAAO,CAAC,CAAC;EACvE;EAEAC,WAAWA,CAACD,OAAgB,EAAE;IAnB9B;AACF;AACA;IAFEf,eAAA;IAKA;AACF;AACA;IAFEA,eAAA;IAKA;AACF;AACA;IAFEA,eAAA;IAUE,MAAM;MAAEiB,KAAK;MAAEC,MAAM;MAAEC;IAAQ,CAAC,GAAGC,UAAU,CAACL,OAAO,CAAC;;IAEtD;IACAM,OAAO,CAACN,OAAO,EAAEO,KAAK,EAAE,IAAI,CAAC;IAE7B,IAAI,CAACC,EAAE,GAAGN,KAAK;IACf,IAAI,CAACO,IAAI,GAAGN,MAAM;IAClB,IAAI,CAAC3C,EAAE,CAACkD,QAAQ,CAAC,GAAGN,OAAO;EAC7B;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBAO,OAAA,CAAAd,WAAA,GAAAA,WAAA;AAuBO,MAAMe,YAAY,CAAmB;EAgB1C,OAAOd,QAAQA,CAAA,EAAG;IAChB,IAAAC,sBAAc,EAAC,eAAe,EAAGC,OAAO,IAAK,IAAIY,YAAY,CAACZ,OAAO,CAAC,CAAC;EACzE;EAEAC,WAAWA,CAACD,OAAgB,EAAE;IAnB9B;AACF;AACA;IAFEf,eAAA;IAKA;AACF;AACA;IAFEA,eAAA;IAKA;AACF;AACA;IAFEA,eAAA;IAUE,MAAM;MAAEiB,KAAK;MAAEC,MAAM;MAAEC;IAAQ,CAAC,GAAGC,UAAU,CAACL,OAAO,CAAC;;IAEtD;IACAE,KAAK,CAAC,CAAC;IAEP,IAAI,CAACM,EAAE,GAAGL,MAAM;IAChB,IAAI,CAACM,IAAI,GAAGP,KAAK;IACjB,IAAI,CAAC1C,EAAE,CAACkD,QAAQ,CAAC,GAAGN,OAAO;EAC7B;AACF;;AAEA;AAAAO,OAAA,CAAAC,YAAA,GAAAA,YAAA;AAIA,MAAMC,IAAI,GAAG,CAAC;AACd,MAAMN,KAAK,GAAG,CAAC;AACf,MAAMO,MAAM,GAAG,CAAC;AAEhB,MAAMT,UAAU,GAAIL,OAAgB,IAAK;EACvC,OAAO;IACLE,KAAK,EAAEA,CAAA,KAAMI,OAAO,CAACN,OAAO,EAAEa,IAAI,CAAC;IACnCV,MAAM,EAAEA,CAAA,KAAMG,OAAO,CAACN,OAAO,EAAEO,KAAK,CAAC;IACrCH,OAAO,EAAEA,CAAA,KAAME,OAAO,CAACN,OAAO,EAAEc,MAAM;EACxC,CAAC;AACH,CAAC;AAED,MAAMR,OAAO,GAAGA,CACdN,OAAgB,EAChBe,MAAqB,EACrBC,SAAS,GAAG,KAAK,KACd;EACH,OAAO,IAAAC,6BAAiB,EACtBjB,OAAO,EACP,2BAA2B;EAC1BkB,SAAS,IAAK;IACb,MAAMC,QAAQ,GAAGD,SAAS,CAACE,SAAS,KAAK,QAAQ;IACjD,IAAIL,MAAM,KAAKF,IAAI,IAAKM,QAAQ,IAAIJ,MAAM,KAAKD,MAAO,EAAE;MACtDI,SAAS,CAACG,IAAI,CAAC,CAAC;IAClB,CAAC,MAAM;MACLH,SAAS,CAACI,KAAK,CAAC,CAAC;IACnB;EACF,CAAC,EACAtB,OAAO,IAAK;IACX,IAAIgB,SAAS,EAAE;MACb,IAAAO,iCAAqB,EAACvB,OAAO,CAAC;IAChC;IAEA,MAAMmB,QAAQ,GAAG,IAAAK,kBAAQ,EAACxB,OAAO,EAAExC,EAAE,CAACiE,oBAAoB,CAAC;IAC3D,IAAIV,MAAM,KAAKF,IAAI,IAAKM,QAAQ,IAAIJ,MAAM,KAAKD,MAAO,EAAE;MACtD,IAAAY,0BAAgB,EAAC1B,OAAO,EAAExC,EAAE,CAACiE,oBAAoB,CAAC;IACpD,CAAC,MAAM;MACL,IAAAE,uBAAa,EAAC3B,OAAO,EAAExC,EAAE,CAACiE,oBAAoB,CAAC;IACjD;EACF,CAAC,EACDT,SACF,CAAC;AACH,CAAC","ignoreList":[]}