search

kittsville / GifSound-2

Abandoned remake of gifsound.com with modular media plugins and no server-side code
https://sci1.uk/GifSound-2/
GNU General Public License v2.0
4 stars 1 forks source link

Add display of gif/sound loading/ready/error states #4

Closed kittsville closed 8 years ago

kittsville commented 8 years ago

Currently there's no way of knowing what's happening until things start loading, if they load at all. Nielsen's heuristics 1 etc. etc. so this needs sorting soon. Simple loading and loaded colours/animations for gif and sound would be sufficient.

kittsville commented 8 years ago

I'd consider this closed, although I'm sure improvements could be made.

Fuck that, there's no way of knowing which media source is waiting for which. There should be a 'waiting' or similar display that indicates one source is ready but waiting for the other.

kittsville commented 8 years ago

It could still have some further improvements but I'll work towards getting all basic functionality in place.

Any forks that improve these features would be welcome.

kittsville commented 8 years ago

The sound ready text doesn't sit on top of the embed so the embed's forced underneath. The 'ready' code for the sound needs to borrow appropriate CSS from the 'loading' spinner.

kittsville commented 8 years ago

Additionally, the gif loading and ready stuff will need to match the sound's CSS because any video embed for a gif (gifv, giphy, etc.) will have the same problems as the YouTube embed.

I've checked and I can solve it by hiding both until they're ready. I kind of want to have them displaying though so that people can see the progress of things. Something to get feedback on I guess.

kittsville commented 8 years ago

If the gif/sound is changed while it is still loading the text overlaps because it is not hidden.

kittsville commented 8 years ago

Think that's everything fixed. I'll re-open this if anything else crops up.

kittsville commented 8 years ago

Related to #10 but more appropriate to this issue is the handling of failure. Since #10 has added proper error handling it's now possible for the gif/sound display to show an error state, as reported by the current plugin.

I would suggest creating two methods for GifSound: setGifState and setSoundState that toggle between 'blank', 'loading', 'ready', 'display' and 'error', where 'blank' is nothing showing (e.g. on page load). The current state could be monitored so that when the state is changed only the necessary DOM interactions to change state are performed. A simple switch could implement the method.

I'd do it right now but I have a 10am tomorrow.

kittsville commented 8 years ago

I didn't end up implementing an error state, although I may add one tomorrow

kittsville commented 8 years ago

The HTML/CSS for blank/loading/ready/displaying needs a revamp before I can consider #7. Much of the display CSS was added at the beginning as a bare-minimum placeholder to demonstrate gif/sound syncing. I'll probably work on it a little while solving this issue (and thus help #9) along.