Statiq.Framework
Statiq.Framework copied to clipboard
Feature Request: Stoppable Gifs
I managed to implement stoppable gifs in my site (still on Wyam) and realised I could likely achieve a better workflow if I integrate it into Wyam's build process (which would be pointless if I upgrade to Statiq soon anyway).
What I've Got
- Save the first frame of each gif as a png with the same name.
- Have a javascript file referenced in my
_Footer.cshtmlwith a function to swap an<img>source between png and gif:
function pngif(item) {
var src = item.getAttribute("src");
var name = src.slice(0, -3);
if (src[src.length - 1] == "g")
name += "gif";
else
name += "png";
item.setAttribute("src", name);
}
- Use that function for the
onclickevent in the<img>:
<img onclick="pngif(this);" src="Test.png" >
What I'd Like
Statiq's Modules sound like a good way to implement something like this, though I haven't looked into what they actually do in detail. Here's what I'm thinking:
onclick="pngif(this);" is a bit longer than I'd like, so it would be nice if I could use something like class="pngif" or even just <img pngif on its own (as long as that's still valid syntax if this module were missing) and have the module automatically:
- Reference the javascript file in the header.
- No need to reference the file on a page that doesn't use it. That seems like an optimization to me, but I'm not a web dev. Maybe it'd be more efficient to just include that function in a larger file that's already being loaded?
- Assign the
onclickfunction. - Generate the actual png and save it next to the gif. This is fairly quick, but it can be skipped if there's already a png file at the destination with a date modified later than the gif.
- This might actually mean the png doesn't need to be in the input folder cluttering up my workspace, it can just go straight into the output folder. Or maybe in a separate pngif folder so it doesn't clutter up the input but also doesn't need to be regenerated if the gif hasn't changed.
If the answer to my question about the current state of Statiq relative to Wyam is that I should switch over now/soon, then I'd be happy to try my hand at implementing such a module and contribute it to your repo.
Also, the license page has a missing [:
