/*
	Author: Jeremy Espinosa
	Filename: video.js
	Description: To play the video when the play button icon is clicked
	Dependencies:
		- jQuery
*/

;(function($) {
    'use strict'

    B2C.video = {
        init: function(option) {
            // set default
            this._default = {
                target: '.js-video',
                targetVideo: 'iframe',
                targetOverlay: '.js-video-overlay',
                action: '.js-video-action'
            }

            this._option = $.extend(true, this._default, option)

            if (!$(this._option.target).length) return

            this.domCache()
            this.eventhandler()
        },

        domCache: function() {
            this.$target = $(this._option.target)
            this.$action = this.$target.find(this._option.action)
        },

        eventhandler: function() {
            let self = this

            this.$action.on('click', function() {
                self.playVideo(this)
            })
        },

        playVideo: function(element) {
            let $element = $(element)

            // hide the play button
            $element
                .parents(this._option.target)
                .find(this._option.targetOverlay)
                .addClass('d-none')
            // when play button icon is clicked automatically play the video
            $element
                .parents(this._option.target)
                .find(this._option.targetVideo)[0].src += '?autoplay=1'
        }
    }

    // initialize banner
    const defaultVideo = Object.create(B2C.video)

    defaultVideo.init()
})(jQuery)
