Play Video Inside Repeater Container on Mouse Hover

To play a video (trailer) embedded inside repeater video container, you must write code on video container's onMouseIn() and onMouseOut() events.

For example, I have below repeater which is tied to a dataset that contains trailer videos for each course. I would like to play the trailer video when user hovers mouse on specific course

Video Container onMouseIn()

This function will play the trailer video once mouse pointer enters the video container

export function trailerPlayer_mouseIn(event) {

    $w("#repeater1").onItemReady(($item, itemData, index) => {
        if (event.context.itemId === itemData._id) {
            $item("#trailerPlayer").play();
        }else{
            $item("#trailerPlayer").stop();
        }
    })

}

Video Container onMouseOut()

This function will stop the trailer video once mouse pointer leaves the video container

export function trailerPlayer_mouseOut(event) {

    $w("#repeater1").onItemReady(($item, itemData, index) => {
        if (event.context.itemId === itemData._id) {
            $item("#trailerPlayer").stop();
        }
    })

}

Enjoy 😅😅😅