import { Component} from '@angular/core'
import { isPlatformBrowser } from '@angular/common'

import { PriceComponent } from '@k-core/modules/configurator/components/price/cmp.price'

@Component({
    moduleId: module.id+ '',
    selector: 'configurator-price',
    templateUrl: './tpl.price.pug',
    styleUrls: ['sty.price.scss']
})

export class Gardinbuscom_PriceComponent extends PriceComponent {

    // ---- Variables ---- \\
    headerHeight: number = 136
    headerHeights = {
        default: 168,
        tablet: 57,
        device: 57
    }
    fixedBottomSpacing = 22

    // States
    fixed: boolean = false
    isPalm: boolean
    isLap: boolean


    // ---- Functions ---- \\

    /**
     * Finds the container position from top, and when position
     * is equal to or below `0 + offset` basket is set to fixed
     */
    setFixedState() {
        if(isPlatformBrowser && typeof window !== 'undefined') {
            let offset = this.headerHeights.default + this.fixedBottomSpacing

            // When palm, make a bigger offset
            if(this.isPalm || this.isLap) {
                offset = this.headerHeights.tablet + this.fixedBottomSpacing 
            }
            

            if(document.querySelector('.js-basket')) {
                let basket_container = document.querySelector('.js-basket').getBoundingClientRect(),
                    pos = basket_container.top
    
                // Fixed check
                if(pos <= 0 + offset) {
                    this.fixed = true
                }
                else {
                    this.fixed = false
                }
            }
        }
    }

    // ---- Listeners ---- \\

}