{"_id":"a-animation","_rev":"2-ba54e88e9dcfc305ea244794e4585a00","name":"a-animation","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"a-animation","version":"1.0.0","description":"Home for A-Frame's deprecated a-animation for legacy code, now replaced by a component.","main":"index.js","scripts":{"build":"webpack index.js -o dist/a-animation.js","dist":"npm run build && uglifyjs dist/a-animation.js > dist/a-animation.min.js"},"repository":{"type":"git","url":"git+https://github.com/ngokevin/a-animation.git"},"author":{"name":"A-Frame Authors"},"license":"MIT","bugs":{"url":"https://github.com/ngokevin/a-animation/issues"},"homepage":"https://github.com/ngokevin/a-animation#readme","dependencies":{"@tweenjs/tween.js":"^16.8.0","webpack-cli":"^3.1.0"},"devDependencies":{"uglify-es":"github:mishoo/UglifyJS2#harmony","webpack":"^4.16.5"},"gitHead":"818095cbe23694dc93c34ce4c75c16f1fb0c0ee6","_id":"a-animation@1.0.0","_npmVersion":"6.1.0","_nodeVersion":"10.5.0","_npmUser":{"name":"ngokevin","email":"me@ngokevin.com"},"dist":{"integrity":"sha512-d4qrae+qYAIVWw8yD5zjY7nzSnBcJYsdsDINdnB74suOwm+7FlIwFZhTNv4eYkDI4Ub1h5E1TzlCi88DZHRYbQ==","shasum":"37f91e224ea8a85ffa38e25dac7a6c2813512cee","tarball":"https://registry.npmjs.org/a-animation/-/a-animation-1.0.0.tgz","fileCount":7,"unpackedSize":68800,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbc2p+CRA9TVsSAnZWagAAN/kP/iwGx+b8LsRtJONXvMRd\nYub+wZCdR80j+ffXw83Sc20SAsJ3D1H3rbps9zyHShHcNFw6FP46GDvnkxVo\nv4C14gHrDA7c1kaY5wl3Xzm3QHWDy3E8RCe4OVMb0ZYMrfnuocOdoLtGwsOb\nXO18xNVBZKVzvIVU9WYFyWYBSGpemu3RNEKyKBnVbfvSXXF5oPgj6jpAxKrO\nmbpvAp3gIc9oJimE7T/+6JbJOGFL++xZUYI6SEUYpd+dMW4dzBELiYqOGPMP\nmNUrHnRxfVkpQyYDfd3jTAjCx1gjHGIWRWeHLnlBtF6bX4rO5fkhDYC98dtS\nMdHSNCqgZr0NqecLHC28OPTgOTIPJdOgmuQsPfeIo9I84K998tPqanMdLBEN\nLc3Q26HY5dq3UngHMq63qd57jIyAY2rM8XR8sVWHxI10gIGVWeAxMsqemPuh\nveLckOJz6n3a+BkHe2R/sBmvgJUUgYAprCfJv8fOOXMVNLSxyksSXkqws9MD\n90es8dVbkFlgqzcLH7EKz37+uKMiyaVcDsUmYiyiuKdjD6IclyuxxVCDaq5E\nLieryWx6b+VGSjIgM3P0YS5PnEM+4TR3lrHAZzn+00TfaAhAh6XLFpLa04si\n1tQBnt+359DaOfCSn9+2FRklcTAyI5hauQBVZrGGPm9EGL9qcNMuT5YQAwaJ\n/Ohv\r\n=mzSM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDiCetoh7Ga0E9FSxTQR/kUC+IBl3RQfZbwDRwewMEYqgIhALuZZEfepT96aWvPsY/VzUBsc3/lD2vYVKMt2ndydIBq"}]},"maintainers":[{"name":"ngokevin","email":"me@ngokevin.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/a-animation_1.0.0_1534290558324_0.8972760824236317"},"_hasShrinkwrap":false},"1.0.1":{"name":"a-animation","version":"1.0.1","description":"Home for A-Frame's deprecated a-animation for legacy code, now replaced by a component.","main":"index.js","scripts":{"build":"webpack index.js -o dist/a-animation.js","dist":"npm run build && uglifyjs dist/a-animation.js > dist/a-animation.min.js"},"repository":{"type":"git","url":"git+https://github.com/ngokevin/a-animation.git"},"author":{"name":"A-Frame Authors"},"license":"MIT","bugs":{"url":"https://github.com/ngokevin/a-animation/issues"},"homepage":"https://github.com/ngokevin/a-animation#readme","dependencies":{"@tweenjs/tween.js":"^16.8.0","webpack-cli":"^3.1.0"},"devDependencies":{"uglify-es":"github:mishoo/UglifyJS2#harmony","webpack":"^4.16.5"},"gitHead":"dd302a2ea002289a8ff6ba0b77d8801c70455899","_id":"a-animation@1.0.1","_npmVersion":"6.1.0","_nodeVersion":"10.5.0","_npmUser":{"name":"ngokevin","email":"me@ngokevin.com"},"dist":{"integrity":"sha512-rXUlPTfB0Bv8MrqMIUX/RUodGyNCUEeUC2ixC8HdQvMWm0fJg6yYa87s4ZnhkiA0PzxyKQH+4kGNB24ytSvzdw==","shasum":"5e4619c29be731722471dd3abc62c251f5d6575d","tarball":"https://registry.npmjs.org/a-animation/-/a-animation-1.0.1.tgz","fileCount":7,"unpackedSize":68668,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbc2tuCRA9TVsSAnZWagAAw/oP/2ygB/58jgjhrrISDEiX\nDt2dKoVzJEG+WL2WzGSNl6EW4MCFvhmn97Lx8QSBiX1E0bjPydgkEfTSw+Uw\n4Kfaz2yIxaeDwmyyB8PwAi2S189kRUFklp/qABm7xkg7rW6HEeIu5zpSM60X\nqgTakXJTMSYR3OzL/wlDdxXFjAEivy7eUbWJQofkAkMsm+2tyQjDaHNmYeZo\nQo7SM9F6i/1Ybt0HsK0ybkqdfv6IzYmcDde7zmLow0k8R8XfXpG+B0dj7JjU\nkLOr8TvuofB4spmQxazNCT6ipn55/g0Y9EkKQjCWyozk9TU1IXGjfG9qArbx\nEUdBZpueB1VYgapt48PYVbsNeA6zILugMQgnubuBlfRpVV5Xtovc9MKZAxQn\nKARAkb+RyzsksBJp6aPLEtrLM0coxevBHl5Di4zkwUu0JFS+IRFhjUt30V3J\nCupNBSxpsCp8BaCzDuZd3f5F0QrJdnDjP/WZ8xA6iRVb1UBDO6rnMQsA5bqm\nvdnz6ISBB3YkkNLWHugQmJi57TdjeUTXFsD32NinpagwNIh3kVEYWoaNKSQ8\nvy89D/u/RE2Imkym7plQ0ChHzrrOvlLmHo29qSs1rXb7ujbUKsASWztlYT65\nwNQ6i0tluh0pTD41C48WWAL90X6HCsv1NekaZ9NT6i2dhuNB2M541zYeLOPE\nUW2H\r\n=TAxe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCEqOZdh4GarKz7t046EdcjDD7R19MnfaTtwWg0pDOwCAIhAPD0lgeF/hQyzPyOaVM3/lPWDej0Ib8VAfZvUUFXoJXC"}]},"maintainers":[{"name":"ngokevin","email":"me@ngokevin.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/a-animation_1.0.1_1534290798400_0.03938177413641952"},"_hasShrinkwrap":false}},"time":{"created":"2018-08-14T23:49:18.323Z","1.0.0":"2018-08-14T23:49:18.452Z","modified":"2022-04-11T12:17:28.132Z","1.0.1":"2018-08-14T23:53:18.461Z"},"maintainers":[{"name":"ngokevin","email":"me@ngokevin.com"}],"description":"Home for A-Frame's deprecated a-animation for legacy code, now replaced by a component.","homepage":"https://github.com/ngokevin/a-animation#readme","repository":{"type":"git","url":"git+https://github.com/ngokevin/a-animation.git"},"author":{"name":"A-Frame Authors"},"bugs":{"url":"https://github.com/ngokevin/a-animation/issues"},"license":"MIT","readme":"# a-animation\n\n> Deprecated. Do not use unless using temporarily for old projects migrating.\n\nHome for A-Frame's **deprecated** a-animation. No longer officially supported\nfor A-Frame going forward. Migrate to the new `animation` component introduced\nin A-Frame 0.9.0+ which originally lived in [K-Frame](https://github.com/ngokevin/kframe/tree/master/components/animation).\n\nBuild lives at [`dist/a-animation.min.js`](dist/a-animation.min.js). Drop it in\nafter A-Frame.\n\n## Old Documentation\n\nWe can add animations in A-Frame attaching an `` element as a\nchild of the entity to animate.\n\nAs an introductory example, to define a 5-meter orbit on an entity about the\nY-axis that takes 10 seconds, we can offset its position and animate the\nrotation of a parent entity. This animation starts with the initial rotation\nabout the Y-axis of 0 degrees and goes around to 360 degrees. It's defined with\na duration of 10000 milliseconds, maintains the final value on each cycle of\nthe animation, and loops indefinitely.\n\n```html\n\n \n \n\n```\n\n## Attributes\n\nHere is an overview of animation attributes. We'll go into more detail below.\n\n| Attribute | Description | Default Value |\n|-----------|------------------------------------------------------------------------------------------------------------------------|----------------|\n| attribute | Attribute to animate. To specify a component attribute, use `componentName.property` syntax (e.g., `light.intensity`). | rotation |\n| begin | Event name to wait on before beginning animation. | '' |\n| delay | Delay (in milliseconds) or event name to wait on before beginning animation. | 0 |\n| direction | Direction of the animation (between `from` and `to`). One of `alternate`, `alternateReverse`, `normal`, `reverse`. | normal |\n| dur | Duration in (milliseconds) of the animation. | 1000 |\n| easing | Easing function of the animation. There are very many to choose from. | ease |\n| end | Event name to wait on before stopping animation. | '' |\n| fill | Determines effect of animation when not actively in play. One of `backwards`, `both`, `forwards`, `none`. | forwards |\n| from | Starting value. | Current value. |\n| repeat | Repeat count or `indefinite`. | 0 |\n| to | Ending value. Must be specified. | None |\n\n## Animating Different Types of Properties\n\nA-Frame's animation system can animate different types of properties.\n\n### vec3 Properties\n\nA-Frame has standard `vec3` components (i.e., `position`, `rotation`,\nand `scale`). These components consist of three factors: X, Y, and Z. We can\npass three space-delimited numbers to the `from` and `to` attributes just as we\nwould define them on an entity. In this case, the animation system will assume\nwe are animating a `vec3` value.\n\nFor example, if we want to animate an entity going from one spot to another, we\ncan animate the `position` component.\n\n```html\n\n \n\n```\n\n### Boolean Properties\n\nA-Frame has standard components that accept a single boolean value. Boolean\nvalues can be \"animated\" as well by flipping the boolean at the end of each\nanimation cycle.\n\nFor example, we can define an animation that toggles off the visibility of an\nentity after 5 seconds.\n\n```html\n\n \n\n```\n\n### Numeric Properties\n\nWe can animate numeric attributes as well. For example, we can animate the\nintensity of the light primitive.\n\n```html\n\n \n\n```\n\n### Color Properties\n\nWe can animate any component property that has a color type. For example, we\ncan animate a box from white to red.\n\n```html\n\n \n\n```\n\n### Component Properties\n\nWe can animate a certain property of a multi-property component. To do so, we\nselect the component property using the dot syntax:\n`componentName.propertyName`.\n\nFor example, to animate a cone's top radius, we can select the `radiusTop`\nvalue with `geometry.radiusTop`.\n\n```html\n\n \n\n```\n\n## Begin\n\nThe `begin` attribute defines when the animation should start playing.\n\nThis can either be a *number*, representing milliseconds to wait, or an *event\nname* to wait for. For example, we can define an animation that waits 2 seconds\nbefore scaling an entity.\n\n```html\n\n \n\n```\n\nOr we can define an animation that waits for the parent element to trigger an\nevent named `fade` before fading an entity.\n\n```html\n\n \n\n```\n\n```js\n// Trigger an event to begin fading.\ndocument.querySelector('#fading-cube').emit('fade');\n```\n\n## Direction\n\nThe `direction` attribute defines which way to animate between the starting\nvalue and the final value.\n\nWhen we define an alternating direction, the animation will go back and forth\nbetween the `from` and `to` values like a yo-yo. Alternating directions only\ntake affect when we repeat the animation.\n\n| Value | Description |\n|-------------------|-------------------------------------------------------------------------------------------------------------|\n| alternate | On even-numbered cycles, animate from `from` to `to`. On odd-numbered cycles, animation from `to` to `from` |\n| alternate-reverse | On odd-numbered cycles, animate from `from` to `to`. On even-numbered cycles, animation from `to` to `from` |\n| normal | Animate from `from` to `to`. |\n| reverse | Animate from `to` to `from`. |\n\n## Easing\n\nThe `easing` attribute defines the easing function of the animation, which\ndefaults to `ease`. There are too many easing functions to list, but we can\nimplicitly explain them.\n\nOne possible value is `linear`. And the basic easing functions are `ease`,\n`ease-in`, `ease-out`, and `ease-in-out`.\n\nThen there are more groups of easing functions. The above basic easing\nfunctions prefix each group of easing functions. The groups of easing functions\nare `cubic`, `quad`, `quart`, `quint`, `sine`, `expo`, `circ`, `elastic`,\n`back`, and `bounce`.\n\nFor example, the `cubic` group of easing functions would consist of\n`ease-cubic`, `ease-in-cubic`, `ease-out-cubic`, `ease-in-out-cubic`.\n\n## Fill\n\nThe `fill` attribute defines the effect of animation when not actively in play.\nThink of `fill` as what values the animation sets on the entity *before* and/or\n*after* each animation cycle. Below are the possible values for `fill` and\ntheir effects.\n\n| Value | Description |\n|-----------|-----------------------------------------------------------------------------------------------------------------------------------------------|\n| backwards | Before the animation starts, set the starting value to the `from` value. |\n| both | Combine the effects of both backwards fill and forwards fill. |\n| forwards | After the animation finishes, the final value will stay at the `to` value. The default fill. |\n| none | Before the animation starts, set the starting value to the initial value. After the animation finishes, reset the value to the initial value. |\n\n## Repeat\n\nThe `repeat` attribute defines how often the animation repeats. We call each\nrepeat of the animation a cycle. Repeat can either be a number that counts down\non each animation cycle until it reaches `0` at which point the animation will\nend, or we can set `repeat` to `indefinite` and the animation will loop\ncontinuously until the animation is manually removed or stopped.\n\n## Events\n\nThe `` element emits a couple of events.\n\n| Event Name | Description |\n|----------------|-----------------------------------------------------------------------------------------------------------------------------------------|\n| animationend | Emitted when the animation finishes. In case of repeats, emitted when the repeat count reaches `0`. Not emitted for indefinite repeats. |\n| animationstart | Emitted immediately when the animation begins playing. |\n","readmeFilename":"README.md"}