Changing a repeater box background color based on what URL source is in the video player

Ask the community
, ,
7

Try this:

import wixData from 'wix-data'

$w.onReady(async () => {
  let results

  try {
    results = await wixData.query('OrchestralXylophone').find()
  } catch (error) {
    console.log(error)
  }

  $w('#listRepeater').data = results.items

  $w('#container1').onClick(({ context }) => {
    let data = $w('#listRepeater').data
    let clickedItemData = data.find((item) => item._id === context.itemId)

    $w('#videoPlayer1').src = clickedItemData.videoUrl
    $w('#videoPlayer1').togglePlay()

    $w('#listRepeater').forEachItem(($item) => {
      $item('#box1').style.backgroundColor =
        clickedItemData.videoUrl === $w('#videoPlayer1').videoUrl
          ? '#ffffff'
          : '#ffcc37'
    })
  })
})