Topic: [Feature] User uploaded Thumbnails for Flash posts

Posted under Site Bug Reports & Feature Requests

Requested feature overview description.
Allow the user to upload a additional custom thumbnail image for the Flash File additionally.

Why would it be useful?
make searches for a particular flash video or animation easier more user friendly, tagging alone only goes so far, no thumbnails means the user has to still click thru a dozen sometimes a couple hundred flash videos on a single page till they find what their looking for.

What part(s) of the site page(s) are affected?
Post editing(upload editing only), posts

Updated by savageorange

Hudson

Former Staff

Some users only upload for the sake of getting the posts under their name and often only add 4-7 tags. They would probably not care about uploading a separate thumbnail.

I also predict that some users will upload something irrelevant as thumbnail, especially trolls.

Updated by anonymous

If users consistently upload things with only a tiny amount of tags isn't that something sorta gray area against the rules?

Also it would be useful to have SOME form of knowing what a flash is before clicking on it to find out.

Updated by anonymous

Hudson

Former Staff

GDelscribe said:
If users consistently upload things with only a tiny amount of tags isn't that something sorta gray area against the rules?

The minimum is still 4. There has been some discussing about this number, but for now, as long as uploaders add at least 4 tags on every upload, as lazy as it is, it's not against the rules.

I wish there was some kind of way e621 would automatically create a thumbnail for each GIF and WebM by randomly plucking a frame and putting it on the front as thumbnail, but I'm not sure about this either.

Updated by anonymous

Hudson said:
The minimum is still 4. There has been some discussing about this number, but for now, as long as uploaders add at least 4 tags on every upload, as lazy as it is, it's not against the rules.

I wish there was some kind of way e621 would automatically create a thumbnail for each GIF and WebM by randomly plucking a frame and putting it on the front as thumbnail, but I'm not sure about this either.

Google does it, and so does futaba clients like 4chan so its entirely possible to do on an online platform.

Might be worth looking into.

Updated by anonymous

Another solution would be to use the thumbnail of the parent post. Of course, that would require flashes to have still images as their parents, whereas usually it's the other way around.

Updated by anonymous

This has been requested many times already, I know this because I'm one who have also requested this. Problem with flash is automatic generation can be security hole as flashes have to be always executed. User submitted thumbnails comes down to legimicity and lazyness as well as site implementation of it.

Hudson said:
I wish there was some kind of way e621 would automatically create a thumbnail for each GIF and WebM by randomly plucking a frame and putting it on the front as thumbnail, but I'm not sure about this either.

Gifs already always use the first frame, but I guess this is pretty much just using same system used for every other image and being first frame is side effect of thumbnail creation.

Should be pretty easy thing to do with webm files as all you need to do is pull one of exsisting frames from animation and use that as image, where with flash you would need to generate that frame.
I remember there being debate that the tumbnails may turn out complete black or other similar, but I call bshit because gifs may also already have black thumbnails and black thumbnail is as useful as thumbnail just reading "video".

Updated by anonymous

Hudson said:
Some users only upload for the sake of getting the posts under their name and often only add 4-7 tags. They would probably not care about uploading a separate thumbnail.

Then there just won't be a difference, or you could force users to upload a thumbnail, or auto generate one if not supplied (if possible).

Hudson said:
I also predict that some users will upload something irrelevant as thumbnail, especially trolls.

Well, of course user submitted (and auto generated?) thumbnails would have to be approved, probably at the moment of regular approval. It will create more work for janitor+, but it might be minor if implemented properly.

Mario69 said:
I remember there being debate that the tumbnails may turn out complete black or other similar, but I call bshit because gifs may also already have black thumbnails and black thumbnail is as useful as thumbnail just reading "video".

Simple solutions to misleading_thumbnail-like problem:

  • Border color (confusing/messy because of other border colors?)
  • Corner ribbon overlay
  • Overlay to still say "video"

Updated by anonymous

Genjar

Former Staff

I agree that there should be some way to easily tell them apart from still images if the animation thumbnails get implemented.

Chessax said:
Simple solutions to misleading_thumbnail-like problem:

  • Border color (confusing/messy because of other border colors?)
  • Corner ribbon overlay
  • Overlay to still say "video"

1. Border colors are already distracting enough, especially for posts that have actual border. They also look rather untidy on thumbnails (which is why I avoid using those in the wiki).

2. Ribbon overlays are used by many professional sites. Not sure how easy it'd be to implement, but that's the option I'd prefer.

3. Depending on the thumbnail, text overlay might look messy and/or unreadable.

Updated by anonymous

It's possible to grab a screenshot of the flash video. I know swfchan does it. It isn't always exactly pretty but it works 99% of the time.
Although swfchan is written in PHP and PHP has the flash library built in. I am not sure if Ruby has a flash manipulation library. If not it is possible to allow the client to provide a screenshot of the flash(Not directly though, but indirectly via scripts, people found abusing(I.E. exploiting HTTP messages) this to upload dank meme screenshots instead of the actual thumbnail can be banned. :>).

Updated by anonymous

Genjar said:
1. Border colors are already distracting enough, especially for posts that have actual border. They also look rather untidy on thumbnails (which is why I avoid using those in the wiki).

Agreed

Genjar said:
2. Ribbon overlays are used by many professional sites. Not sure how easy it'd be to implement, but that's the option I'd prefer.

Example: Copy paste into developer console on index page for testing
var flash = document.createElement('div');
flash.style.position = 'relative';
flash.style.width = '149px';
flash.style.height = '0px';
flash.style.top = '-149px';
flash.style.margin = '0px auto';
flash.style.zIndex = '9';
var inner = document.createElement('div');
inner.style.position = 'absolute';
inner.style.overflow = 'hidden';
inner.style.width = '85px';
inner.style.height = '85px';
inner.style.top = '0px';
inner.style.right = '0px';
var banner = document.createElement('div');
banner.style.position = 'relative';
banner.style.top = '15px';
banner.style.left = '20px';
banner.style.zIndex = '999';
banner.style.transform = 'rotate(45deg)';
banner.style.color = 'white';
banner.style.backgroundColor = 'rgb(54, 66, 114)';
banner.style.backgroundImage = 'linear-gradient(to top, rgb(4,16,64), rgb(104,116,164))';
banner.style.textAlign = 'center';
banner.style.fontWeight = 'bold';
banner.innerHTML = 'Flash';

inner.appendChild(banner);
flash.appendChild(inner);

var video = flash.cloneNode(true);
video.childElements()[0].childElements()[0].innerHTML = 'Video';

var spans = document.getElementsByClassName('thumb');
var temp;
for (var i = 0; i < spans.length; ++i){
 var img = spans[i].getElementsByTagName('img')[0];
 if (img.src.indexOf('webm-preview') > -1){
  console.log("video");
  temp = video.cloneNode(true);
  if (img.className != 'preview'){
   temp.style.top = '-152px';
  }
  spans[i].getElementsByTagName('a')[0].appendChild(temp);
 }
 else if (img.src.indexOf('download-preview') > -1){
  console.log("flash");
  temp = flash.cloneNode(true);
  if (img.className != 'preview'){
   temp.style.top = '-152px';
  }
  spans[i].getElementsByTagName('a')[0].appendChild(temp);
 }
}

Genjar said:
3. Depending on the thumbnail, text overlay might look messy and/or unreadable.

Could easily be fixed by e.g. pinning it to bottom and using opaque background, of course this will hide some of the thumbnail, but then a ribbon is probably better anyway.

Updated by anonymous

Oh this thread, what a coincidence! I made a thing and sent the code over to Kira. She is considering it.
Demo of what it is: http://api.softhyena.com/e621_thumbnail.py?id=<put post ID or hash here> (Hash is preferred)
Example lanks:
Webms:

Flash:

Known issues:
Its FUCKING SLOW (this is because of my internet)
Some flash shows as white/black
Some flash will crash the thumbnailer resulting in an error page(This is because non-existent frames on weird flash files), solution would to display stock flash thumbnail.
No id->hash caching, this won't be a problem on e621
If two requests get sent out at once, it may result in the full image being the thumbnail. again this wont be a problem on e621 as it will only post the file once a thumbnail has been made(be it successful or not).

A small icon should probably be added to the thumbnail to indicate that it is a flash or webm, since there is no telling if a image is a flash or webm just by looking at the thumbnail.

IMPORTANT: This does not mean it will be added to e621, but we are a step closer to potentially having a webm/flash thumbnailer!

Updated by anonymous

This would be awesome, a thumbnail for flash would be a great addition even if the user has to manually upload a thumbnail, :D

Updated by anonymous

I'm for it as long as there's something still indicating it's a Flash regardless of the thumbnail.

Updated by anonymous

savageorange said:
Looks like the appropriate icon for indicating 'flash' would be a slanted f ; either white f on red bg or vice versa.

Here's a little 16x16 icon I put together.

Why does that matter? The thumbnail already says "Flash". The request is for a still image that represents the content of the swf.

Updated by anonymous

Lance_Armstrong said:
Why does that matter? The thumbnail already says "Flash". The request is for a still image that represents the content of the swf.

The point was to still differenciate the content after they get working thumbnails and the best way to do that is to include small icon over the thumbnail.

Which would also be great for gif and apng content as well.

Updated by anonymous

Mario69 said:
The point was to still differenciate the content after they get working thumbnails and the best way to do that is to include small icon over the thumbnail.

Which would also be great for gif and apng content as well.

Can our system detect if gifs and png's have layers?

Updated by anonymous

Yes, if, and the keyword here is if, this gets added, there will be a ribbon or type symbol shown on the image, such as: https://snapshots.softhyena.com/ca23ecdef8987bf262d4cf1bcc0e0605.png

Mario69 said:
The point was to still differenciate the content after they get working thumbnails and the best way to do that is to include small icon over the thumbnail.

Which would also be great for gif and apng content as well.

apng is a non-www format and makes me cry.

Furrin_Gok said:
Can our system detect if gifs and png's have layers?

Gifs cannot have layers, but if you mean how many frames/duration, a pending change is coming to add this! (except not for apng)

Updated by anonymous

Chaser said:
Gifs cannot have layers, but if you mean how many frames/duration, a pending change is coming to add this! (except not for apng)

The whole reason animated gifs work is that they do have "layers." This is what image editing programs will refer to the "Frames" as, is "Layers."

Unfortunately, a symbol for an APNG won't be possible if it cannot recognize it as having more than one frame, unless you look specifically for the apng tag to add it.

Updated by anonymous

Furrin_Gok said:
The whole reason animated gifs work is that they do have "layers." This is what image editing programs will refer to the "Frames" as, is "Layers."

Yes, but this is just because layers are an ok way to express simple, 'one image per frame' animations, not because layers -are- frames. GIF frames can be used in the manner of layers , but they only share one feature with actual layers (the concept of transparent pixels)

This fallacy is made quite clear when you look at programs with proper animation support, where each frame can have multiple layers. (Flash, GIMP-GAP, Asesprite, TVPaint, etc.).
In some cases, these layers are even shared between frames.

Unfortunately, a symbol for an APNG won't be possible if it cannot recognize it as having more than one frame, unless you look specifically for the apng tag to add it.

Not sure what you mean here? APNGs can be distinguished by the presence of acTl, fcTl, and fdAT chunks . Because of the chunked structure of PNGs, it's easy for any system that can read binary data and seek through a file [1] to quickly scan for these, without any libraries needed. Simplest approach would probably be to just check for 1 fdAT chunk (implying APNG + at least 2 frames total)

[1] ie. pretty much any non-toy language.

GIFs are less easy to hack support for -- you have to check for the presence of >1 Graphic Control Extension blocks , which is also possible without any support libraries, but a little more hairy since GIF structure is more minimal.

Updated by anonymous

  • 1