// * Quantity selector *

// Global strings
const DYN_ITEM = '.w-dyn-item'
const MINUS = '.quantity_minus'
const PLUS = '.quantity_plus'
const NUMBER = '.quantity_number'

// Global css
const CSS_SHOW = {
    'opacity': '100%',
    'transition-property': 'opacity',
    'transition-duration': '350ms',
    'transition-timing-function': 'ease',
    'pointer-events': 'auto'
}
const CSS_HIDE = {
    'opacity': '50%',
    'transition-property': 'opacity',
    'transition-duration': '350ms',
    'transition-timing-function': 'ease',
    'pointer-events': 'none'
}
$( MINUS ).css( CSS_HIDE )


// Main function
$( DYN_ITEM ).each(function(index) {

    // Local elements
    let $_this_minus = $(this).find( MINUS )
    let $_this_plus = $(this).find( PLUS )
    let $_this_number = $(this).find( NUMBER )

    // Calc values
    let min_number = 1
    let max_number = 10
    let this_number = parseInt( $_this_number.first().text() )


    // Local main function's
    $_this_minus.click(function() {

        this_number--
        if( this_number <= min_number ) {
            this_number = min_number
            $_this_minus.css( CSS_HIDE )
        } else {
            $_this_plus.css( CSS_SHOW )
        }
        $_this_number.text( this_number )
        
    })

    $_this_plus.click(function() {

        this_number++
        if( this_number >= max_number ) {
            this_number = max_number
            $_this_plus.css( CSS_HIDE )
        } else {
            $_this_minus.css( CSS_SHOW )
        }
        $_this_number.text( this_number )
        
    }) 
    
})