/*
	Author: Jeremy Espinosa
	Filename: card.js
	Description:
	Dependencies: 
		- B2C.htmlTemplate
	How to use: 
*/

;(function($) {
    'use strict'

    B2C.card = {
        init: function(option) {
            this._default = {
                target: '.js-card-colorpicker'
            }

            this._option = $.extend({}, this._default, option)

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

            this.domCache()
            this.eventHandler()
        },

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

        eventHandler: function() {
            let self = this

            this.$jsCardColorpicker.on('click', 'li', async function() {
                let data = await self.getData(this)

                // render template
                B2C.htmlTemplate.renderTemplate({
                    element: this,
                    data: data,
                    container: '.js-template-container',
                    wrapper: '.js-template-wrapper',
                    template: $(this).data('template')
                })
            })
        },

        getData: async function(element) {
            let dataUrl = $(element).data('url')

            return await new Promise(function(resolve) {
                $.ajax({
                    url: dataUrl,
                    success: function(data) {
                        resolve(data)
                    }
                })
            })
        }
    }

    B2C.card.init()
})(jQuery)
