Gifshot: JS library to create animated GIFs from media streams, videos, images | Hacker News Reader

Gifshot: JS library to create animated GIFs from media streams, videos, images

yahoo.github.io

72 pointsgregfranko17 comments

I wish we could move away from the awful format that is animated gif and use something much better in terms of compression, color support and frame rate. Like webm.[1][2]

[1]http://blog.4chan.org/post/81896300203/webm-support-on-4chan

[2]http://blog.smartbear.com/devops/gif-is-dead-long-live-webm/

[3]http://motherboard.vice.com/read/what-is-webm-and-can-it-det...

At least we have http://gfycat.com/ now. WebM for those who can, original gif for those who can't.

I personally think http://mediacru.sh is a better choice. Free and open source. I'm not sure if it display a .gif if the user doesn't have HTML5 video compatibility.

This looks really awesome - nice work Greg and team. It's depressing when someone releases an open source library that does something novel using interesting technologies, has a lot of potential real-world use cases, and clearly took a TON of work, and the responses range from 'I don't like GIFs' to 'There's already a library that has GIF in the name so I'm going to assume this is redundant and leave a passive-aggressive comment'. What's wrong with you people?!

Rich, you are the best

Related, and pre-existing.

http://jnordberg.github.io/gif.js/

http://hdragomir.github.io/facetogif/

http://gifmebro.com/

etc.

Gifshot also includes getUserMedia (webcam) functionality, is a full client-side solution, and has a simple API (easier to use than gif.js)

I was really hoping this would work on the server-side, too. It didn't. :-( Or maybe I configured something wrong?

Here's what I found:

    $ git clone https://github.com/yahoo/gifshot.git
    $ cd gifshot
    $ npm install
    $ node
    
    > var gifshot = require('./build/gifshot')
    
    > gifshot.createGIF(
    ...   {'images':['random-image.png'],
    .....    'text': 'Test'},
    ...    function(obj) { 
    .....      console.log('Done!');
    .....      console.log(obj);
    ..... })
    Done!
    { errorCode: 'canvas',
      errorMsg: 'Canvas elements are not supported in your browser',
      error: true }

Obviously, the getUserMedia aspect of the project can't be done server-side, but we can look into supporting the existing video->GIF and images->GIF logic.

Right, I don't care so much about the getUserMedia part at the moment. But what you've done is totally awesome, by the way! With that said, I was looking for "take an array of images, spit out a gif file, and, oh yeah, put this text along the bottom."

Isn't this kind of backwards when we have tools like http://gfycat.com/ that can make MP4/WebM?

Animated GIFs are HORRIBLE in terms of file size and quality compared to actual MP4/WebM video files, which are supported by all modern browsers.

This is client-side JS solution. Completely different.

Very cool project! Is there any word on getUserMedia for IOS Safari?

Currently there's no word on support for IOS8 Safari that I've seen...here's to hoping that it'll come along soon though :D

Too cool.

i love this! laptop camera to gif? yes please

so nice

Reply on news.ycombinator.com