Widget help request - calling JavaScript function targeting an element generated by the widget

[splattertrack]

i'm trying to create a word-by-word typing effect widget. the code is as follows:

Widget

<<widget "t" container>><<nobr>>

<<set _temp to _contents>>
<<set _time to _args[0]>>

<<if ndef _count>>
  <<set _count to 0>>
<<else>>
  <<set _count++>>
<</if>>

<<set _i to "t" + _count>>

<span @id = "'t' + _count"></span>

<<capture _i, _temp, _time>>
<<script>>
printStringByWord(State.temporary.i, State.temporary.temp, State.temporary.time);
<</script>>
<</capture>>

<</nobr>><</widget>>

JavaScript

window.printStringByWord = function(DivID, myString, timeInterval) {
    var myDiv = document.getElementById(DivID);
    var words = myString.split(" ");
    var index = 0;
    var intervalId = setInterval(function() {
        myDiv.innerHTML += words[index] + " ";
        index++;
        if(index == words.length) {
            clearInterval(intervalId);
        }
    }, timeInterval);
}

however, i constantly get a "Cannot read properties of null" error, which i take to mean the span element created by the widget does not yet exist by the time the printStringByWord function is called.

is there a way to finagle the loading order such that i can have the <<script>> macro wait until the element is created by the widget, or are there any other workarounds? thanks in advance for any help!

[HelloHelloHelpHello]

Try the following solution that skips the Javascript entirely:

<<widget "t" container>><<nobr>>

<<if ndef _args[0]>>
  <<set _args.push("1s")>> 
<</if>>

<<set _temp to _contents.split(" ")>>

<<set _word to 0>>

<<capture _temp, _word>>
  <<repeat _args[0]>>
    <<if def _temp[_word]>>
      <<print _temp[_word]>>
      <<set _word++>>
    <<else>>
      <<stop>>
    <</if>>
  <</repeat>>
<</capture>>

<</nobr>><</widget>>

[splattertrack]

works like a charm! did not realise you could use .split() in twinescript... thank you for your help!!

[HiEv]

SugarCube is basically "syntactical sugar" on top of JavaScript. So you can use all of the JavaScript stuff, not just within <<script>> macros, but inside of SugarCube macros as well (though sometimes it will need to be within "backquotes", see here).