h5bp/mothereffinganimatedgif

Make your animated gifs in the browser! Oh yeah!

mothereffinganimatedgif's Issues

Large files are not being read

Is there an implicit file size limit? I'm trying to use 5mb images and when I drag and drop, nothing happens. Images do not show up in the timeline yet there are no errors in the UI or console. I tried digging into the code but I didn't see anything that stood out.

/cc @paulirish

github banner links wrong

your github watchers/watch button on http://mothereffinganimatedgif.com/ is linked to paulirish/lazyweb-requests not h5bp/mothereffinganimatedgif.

Custom background color for PNGs with transparency

The default background color is black.

Think if you could:

• Pick a color (HEX input should be fine, unless you want to add a picker).
• Select an already dragged-in image to use as a background (default behavior - stretch to fill behind the animated images).

Cheers.

'For security reasons, framing is not allowed'

Chrome on Mac OSX shows this on the website thanks to the Github buttons on the top right, redirecting to http://markdotto.github.com/github-buttons/github-btn.html?user=paulirish&repo=lazyweb-requests&type=watch&count=true afterwards. What's up, guys?

too fast

Sometimes, animated gifs can easily replace a simple slide show, which needs longer durations than 600 ms.

images overlaid, not alternating

I added a couple of static gifs, which have transparency. When I view the animation, I can still see the first image under the second, while the second image flashes on and off. I would expect the two images to alternate... is this a known problem with transparency?

Animate button is throwing JS exception

Using Chrome Version 25.0.1364.172 on Macbook Pro.

When clicking the Animate button throws the JS exception in ui.js "contentWindow" is null.

Only Modernizr.download test is used for creating the iFrame "#savesbro" , but when calling the function showDownloadLink , there are multiple in the IF condition

Modernizr.download && Modernizr.bloburls && Modernizr.blobbuilder

In chrome , the test "Modernizr.blobbuilder" is false ,hence trying the iFrame download option - then throwing JS exception.

tag soup

I hope nobody minds removing some tag soups, but it appears there are a few tags we can remove from the markup beginning with this one...God help me!

<footer id="footer" role="content-info">.....</footer>

GIFEncoder.js issues

GIFEncoder.js has some issues with color and transparency (I'm using it as well here: cam->gif Meemoo app). Has anybody been looking into making the output higher-quality?

we got featured on thrillist

https://twitter.com/#!/Thrillist/status/177504811602821120

http://www.thrillist.com/entertainment/nation/mother-effin-animated-gif_time-wasters_websites

cool.

(and yes i'm using issues as a mailing list. :)

Not able to generate animated gifs

Busted in chrome atm :(

Uncaught TypeError: Cannot read property 'contentWindow' of null ui.js:91

I dropped in two jpg images (645px square) and it threw this error consistently.

Add watermark to animated GIF

Is this at all possible ?

I was looking at : http://www.patrick-wied.at/static/watermarkjs/

and adding class="watermark" to <img id="animresult" ... but its not playing ball.

So wondered, is it possible to add hidden image to the animation sequence that is say 48px by 48px ( transparent png ) with watermark on it, that when user renders the animation is displayed as a watermark overlay ?

If you visit the website in a browser without ad blocker goes to spam websites!

Possibly everyone has an ad blocker that didn't notice this but visiting http://mothereffinganimatedgif.com/ will get redirected to http://saveasbro.com/ that is a spam website I believe

Cache Manifest -Google Analytics utm.gif

If anyone notices this failed resource below please let me know what a good solution would be to manifest this resource properly. It has been placed in the Network section previously and was unsuccessful in the results.

Currently chrome caches the entries, but Firefox will not display resources with offline content under about:cache. This does not hinder the offline ability though with Firefox -very strange.

http://www.google-analytics.com/__utm.gif?utmwv=5.2.5&utms=2&utmn=1205207997&utmhn=mothereffinganimatedgif.com&utmcs=UTF-8&utmsr=1280x1024&utmvp=1143x778&utmsc=24-bit&utmul=en-us&utmje=1&utmfl=11.1%20r102&utmdt=Mothereffing%20animated%20gif&utmhid=605837725&utmr=-&utmp=%2F&utmac=UA-18857974-3&utmcc=__utma%3D57817526.1952415057.1332005253.1332005253.1332005253.1%3B%2B__utmz%3D57817526.1332005253.1.1.utmcsr%3D(direct)%7Cutmccn%3D(direct)%7Cutmcmd%3D(none)%3B&utmu=q~

Unresponsive script message

When I added 7 pictures to the app and clicked on "animate" button it prompted an "unresponsive script" message.
Tested in Firefox 10.0.2 Windows 7.

Rotatey speed banner causes screen flash

Hovering over that speed banner graphic in the footer - which transitions a rotation - causes the screen to flash in Chrome / OSX.

saveasbro.com/gif source code

Is GIF generator script published? Where can I find script of server side "saveasbro.com/gif"?

Offline Functionality

When is this suckah gonna work offline using the super awesome cache manifest like sprite cow?

Click should trigger an alternate file upload strategy

Drag and drop is great and all, but is it really easier / better? I have to resize all my windows and drag stuff around to even get to the point where I can drag more stuff into the window, and all I want to do is make a gif out of some files. I know the original intent was to mimic dropmocks, which I think it does a good job of, but it's clunky for "file structure first" folks

Intended behavior: if the page is empty and has no gif on it already, anything you click that isn't an obvious link fires a multiple file upload prompt. It would also be cool if it knew which probable order the image files should go in

Moving domain to ghpages

cloudflare is set up but pointing via CNAME to github pages.

https://mothereffinganimatedgif.com/

if you see saveasbro issues in the console then it hasn't been updated. But i THINK i have the configuration of everything set up... just waiting for propagation..

interesting drop zone bug

On: Chrome 18.0.1025.33 beta

The dragleave event gets fire when you drag over the image inside the div class="col". Which essentially removed the 'over' class on the current block you are hovering over.

ability to add sound

You should make the ability to add a short sound file. That would be great!

The hosted site needs a shorter domain name

Hey guys,

I love the site. But remembering a huge domain name is a pain.

HashNuke
mothereffinganimatedgifFan

making upload photo button instead of drag and drop ..for mobile using

Web Workers

Today I tried to implement web workers. It wasn't possible with my try because jsgif is mainly relied on canvas and we don't have document in a worker to create an canvas and draw images on it.
Docs at jsgif are saying author couldn't use web workers in his project too.
Does anyone have a suggestion or trick for this?

Thanks

no license

I want to make a html5 animated gif desktop app but no license for this project means unclear copyright terms.

Watch button goes to wrong repo

GitHub watch button url on http://mothereffinganimatedgif.com/ goes to Paul's lazy requests rather than this repo. Would fix myself but about to head out when I noticed.

Suggestion: Blob download for chrome

inside omggif-worker.js
add this

var getGifBuffer = function(gif,buffer) {
    var l = gif.end();
    var uInt8View = new Uint8Array(new ArrayBuffer( l ));
    //var viewLength = uInt8View.length;
    var i;
    for (i = 0; i < l; i++) {
      uInt8View[i] = buffer[i];
    }
    return uInt8View;
  };

  var gifBuffer = getGifBuffer(gif,buffer);

and then add this line to the postMessage

self.postMessage({
    type: "gif",
    //*here*
    buffer: gifBuffer,
    data: gifString,
    frameCount: framesLength,
    encodeTime: Date.now()-startTime
});

here is code that invoke download :)

//http://stackoverflow.com/questions/19327749/javascript-blob-filename-without-link
var saveData = (function () {
  var a = document.createElement('a');
  document.body.appendChild(a);
  a.style = 'display: none';
  return function (data, fileName) {
    // var json = JSON.stringify(data),
    // var blob = new Blob([json], {type: 'octet/stream'}),
    var blob = new Blob([data], {type: 'octet/stream'}),
    url = window.URL.createObjectURL(blob);
    a.href = url;
    a.download = fileName;
    a.click();
    window.URL.revokeObjectURL(url);
    a = null;
  };
}());

            var fileName = 'gif.gif';
                        //*added buffer param*
            saveData(info.buffer, fileName);

Footer doesn't stick to bottom when creating large dimensioned images

Chrome 17.0.963.46

http://imgur.com/YhauH

Download

Just playing with the scripts, and download link never displays for us.

Also , can we not write the created gifs to our own directory and do away with saveasbro.com ?

Not entirely sure what the saveasbro.com is... aside from analytic gathering

On src inspection, download link always has display:none

Apologies for sounding like a total tit.

Add a favicon.ico

Development discussed elsewhere!!

Just go here

paulirish/lazyweb-requests#53