Need some help with a carousel like function

mumblebaj

Hey guys.

I have a question for fellow module devs out there.

I have 3 data sources which I want to rotate to the Dom after a set period of time. I.e. have the data displayed from the first source for say 2 minutes then rotate and display the data from the second data set etc. Right now I have a simple Dom object

 getDom: function() {
const wrapper = document.createElement("div");
        if(this.apiData) {

            const word = document.createElement("div");
            word.innerHTML = this.apiData[0].word
            word.className = "bold large"
            wrapper.appendChild(word);

            const translation = document.createElement("div")
            translation.innerHTML = this.apiData[0].translation
            translation.className = "bright medium"
            wrapper.appendChild(translation);

            if(this.config.showExamples) {
                const list = document.createElement('ol')
                list.className = "small"

                const listItem = document.createElement('li')

                const wr = document.createElement('div')
                wr.innerHTML = this.apiData[0].examples.wordex
                listItem.appendChild(wr)

                if(this.config.showExampleTranslations) {
                    const we = document.createElement('div')
                    we.innerHTML = this.apiData[0].examples.wordextr
                    listItem.appendChild(we)

                }
                list.appendChild(listItem)

                wrapper.appendChild(list)
            }
        } else {
            wrapper.innerHTML = "Loading..."
        }
        return wrapper
    }

I want to swap out this.apiData at a set interval/ Any suggestions welcome.

sdetweil

@mumblebaj ok…

so, you have the other source info?

start an interval timer

setInterval(routine, time_in_ms_til_next_routine_invocation)

function routine(){
   // whatever logic to decide
  // change the pointer of the data
  this.apiData = data_to_show_now
  // tell MM content has changed
  this.updateDom()
}

make sure u stop the timer on suspend()
and restart the timer on resume()

mumblebaj

@sdetweil Thanks Sam. Will give that a go.