/**
 * 公用头部的js
 */
class mHeader {
    constructor() {
        this.$header = $('.dw-common-header')
        this.$menuWrap = this.$header.find('.tool-bar-wrap')
        this.$menu = this.$menuWrap.find('.tool-bar-menu')
        this.$detail = this.$header.find('.menu-detail')
        this.$shade = this.$header.find('.header-shade')
        this.detailOffset

        this.init()
    }
    init() {
        this.setPcUrl().detailInit().menuClick().shadeClick().setHeaderTitle()

        document.body.addEventListener('touchstart', () => { }, false);
    }
    detailInit() {
        this.detailOffset = this.$detail.height()

        this.$detail.css('transform', `translateY(-${this.detailOffset}px)`).show()

        return this
    }
    menuClick() {
        var self = this,
            height = this.$menu
        this.$menuWrap.click(function (e) {
            var _this = self.$menu

            if (_this.hasClass('close')) {
                _this.removeClass('close').addClass('open')
                self.$detail.css('transform', 'translateY(0px)')
                self.$shade.show()
            } else {
                _this.removeClass('open').addClass('close')
                self.$detail.css('transform', `translateY(-${self.detailOffset}px)`)
                self.$shade.hide()
            }

            e.stopPropagation()
        });
        return this
    }
    shadeClick() {
        $('.header-shade').click(() => {
            this.$menu.click()
        })
        return this
    }
    setHeaderTitle() {
        var title = $('body').data('title')

        if (title) {
            var $title = $(`<span>${title}</span>`)
            this.$header.find('.dw-link').append($title)
        }
        return this
    }
    setPcUrl() {
        var pcUrl = $('html').attr('data-pcurl');
        if (pcUrl)
            $('.pc-icon').attr('href', pcUrl)

        return this
    }
}

$(() => {
    new mHeader
})