https://github.com/adzialocha/gif-stream

Client: Take pictures from peoples cameras in intervals, make a .gif, upload it to S3, make a massive collage out of this
https://github.com/adzialocha/gif-stream

aws-s3 collage gif image-processing

Last synced: 25 days ago
JSON representation

Client: Take pictures from peoples cameras in intervals, make a .gif, upload it to S3, make a massive collage out of this

• Host: GitHub
• URL: https://github.com/adzialocha/gif-stream
• Owner: adzialocha
• License: mit
• Created: 2017-05-24T23:13:26.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2019-03-25T22:35:17.000Z (about 6 years ago)
• Last Synced: 2025-02-14T22:29:28.032Z (3 months ago)
• Topics: aws-s3, collage, gif, image-processing
• Language: JavaScript
• Homepage:
• Size: 4.47 MB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-starred - adzialocha/gif-stream - Client: Take pictures from peoples cameras in intervals, make a .gif, upload it to S3, make a massive collage out of this (image-processing)

README

        
gif-stream

===

Simple client to take, resize and upload single images to `gif-stream-server`. Go to https://github.com/adzialocha/gif-stream-server for server-side code.

## Example

![A gif-stream example](https://raw.githubusercontent.com/adzialocha/gif-stream/master/example.gif)

## Usage

```html



Start

Stop


  const container = document.getElementById('image-container')

  const startButton = document.getElementById('start')

  const stopButton = document.getElementById('stop')

  const options = {

    callback: (data) => {

      const image = document.createElement('img')

      image.setAttribute('src', data.imageData)

      container.appendChild(image)

    },

    interval: 2500,

    serverUrl: 'https://your-gif-stream-server.herokuapp.com',

  }

  const stream = new GifStream(options)

  function enableStart() {

    startButton.disabled = false

    stopButton.disabled = true

  }

  function enableStop() {

    startButton.disabled = true

    stopButton.disabled = false

  }

  function start() {

    stream.start()

      .then(() => {

        enableStop()

      })

      .catch((err) => {

        window.alert('An error occurred.')

        enableStart()

      })

  }

  function stop() {

    stream.stop()

    enableStart()

  }

  startButton.addEventListener('click', start)

  stopButton.addEventListener('click', stop)

  enableStart()

```