//*
// 控制UI界面的模块
// */

import Loger from "../Loger";
import Ape from "./Ape";
import $ from "jquery";
import ClassDataProxy from "proxy/ClassDataProxy";
let loger = Loger.getLoger('PC-UIMagnifyApe');

class UIMagnifyApe extends Ape {
    constructor() {
        super();
        this.parentBox = null;
      //  this.init();
    }
    init(_box){
        if(_box){
            this.parentBox=_box;
        }else {
            console.error("没有父级盒子");
            return;
        }

        let newDiv = document.createElement('div');
        newDiv.className = 'imagesLargerBox';

        let magnifyHeadline = document.createElement('div');
        magnifyHeadline.className = 'magnifyHeadline';
        newDiv.appendChild(magnifyHeadline);

        let magnifyHeadlineA = document.createElement('a');
        magnifyHeadlineA.innerHTML = "";
        magnifyHeadlineA.className = 'magnifyHeadlineA iconfont';
        magnifyHeadlineA.setAttribute('href','javascript: void(0)')
        magnifyHeadline.appendChild(magnifyHeadlineA);

        let magnifyImgBox = document.createElement('div');
        magnifyImgBox.className = 'magnifyImgBox';
        newDiv.appendChild(magnifyImgBox);

        let magnifyImg = document.createElement('img');
        magnifyImg.className = 'magnifyImg';
        magnifyImg.setAttribute('src',"")
        magnifyImgBox.appendChild(magnifyImg);

        this.parentBox.append(newDiv);
        //添加关闭事件
        $('.magnifyHeadlineA').on('click',this.hide.bind(this));
    }


    show(_url){
        $('#magnifyBox').show();
        this._showImagesLarger(_url);
    }
    //隐藏图片大图
    hide(){
        $('#magnifyBox').hide();
        $('.magnifyImg').attr('src','')
    }

    //显示图片大图
    _showImagesLarger(_url){
       $('.magnifyImg').attr('src',_url)
    }

}

export default new UIMagnifyApe;