❤
npm
Sign UpSign In

aframe-gif-component

0.2.0 • Public • Published

AFrame GIF Component

A gif controller for A-Frame VR. Requires aframe-gif-shader. Inspired by @gtk2k's awesome sample.

DEMO

example

Method

Global method

play()

Play gif animation

entity.play()

pause()

Pause gif animation

entity.pause()

Custom method

togglePlayback()

Toggle playback. if the gif is paused, play and pause if it's playing.

entity.components.gif.togglePlayback()

nextFrame()

Go to next frame. Useful if it's paused.

entity.components.gif.nextFrame()

paused()

Returns if it is paused.

const paused = entity.components.gif.paused() // true or false

Usage

Browser Installation

Install and use by directly including the browser files:

<head>
  <title>My A-Frame Scene</title>
  <script src="https://aframe.io/releases/0.2.0/aframe.min.js"></script> 
  <script src="https://rawgit.com/mayognaise/aframe-gif-shader/master/dist/aframe-gif-shader.min.js"></script> 
  <script src="https://rawgit.com/mayognaise/aframe-gif-component/master/dist/aframe-gif-component.min.js"></script> 
</head>
 
<body>
  <a-scene>
    <a-entity geometry="primitive:box" material="shader:gif;src:url(nyancat.gif);" gif=""></a-entity>
  </a-scene>
</body>

NPM Installation

Install via NPM:

npm i -D aframe-gif-shader aframe-gif-component

Then register and use.

import 'aframe'
import 'aframe-gif-shader'
import 'aframe-gif-component'

Readme

Keywords

Package Sidebar

Install

npm i aframe-gif-component

Repository

github.com/mayognaise/aframe-gif-component

Homepage

github.com/mayognaise/aframe-gif-component#readme

Weekly Downloads

5

Version

0.2.0

License

MIT

Last publish

Collaborators

  • mayognaise
Try on RunKit
Report malware