0 votes
by (1.4k points)

Hello my friends!

Using SugarCube 2.21, and I am using this JavaScript:

postdisplay['gif-reloader'] = function (t) {
    var el = $('.gif-reload img').toArray();
    var i, source;

    for (i = 0; i < el.length; i++) {
        var source = $(el[i]).attr('src');
        $(el[i]).attr('src', source + '?' + Date.now());

I am using it to reload a gif image wrapped like so: @@.gif-reload;[img[image.url]]@@, so that a non-looping gif will play over again. However, since this is tied to entering the passage, it does not reload the gif when it is displayed by <<linkreplace>>:

<<linkreplace "text">>[img[gif.url]]<</linkreplace>>

I hope this is a simple problem, I do not know JavaScript.

Thank you all!

1 Answer

0 votes
by (67.7k points)
selected by
Best answer

You should simply be able to do the following:

<<linkreplace "text">>[img["animated-gif-url.gif?" + Date.now()]]<</linkreplace>>

Though, to make that simpler to use, you could make a widget out of it.  For example:

<<widget "agif">>[img[$args[0] + "?" + Date.now()]]<</widget>>


<<linkreplace "text">><<agif "animated-gif-url.gif">><</linkreplace>>


PS: Your postdisplay task is more complicated, and less thorough, than it needs to be.  It would be better as:

postdisplay['gif-reloader'] = function () {
	$('.gif-reload img').attr('src', function (i, src) {
		return src.replace(/\?.*$/, '') + '?' + i + Date.now();


by (1.4k points)
Yes! This definitely works. Thank you very much!
Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.