//百度地图网格类
function SquareOverlay(center, size, name, data, type = 'admin', is_select = 0)
{
    this._id = data.id;  // 地图位置对应的数据库id
    this._village_id = data.village_id;  // 地图位置对应的数据库id
    this._group_id  = data.group_id;  // 地图位置对应的数据库id
    this._center = center;  //地图经纬度
    this._size = size;      //覆盖物大小
    this._name = name;      //覆盖物名称
    this._content = data;   //覆盖物内容信息
    this._over = data.alarmStatus ?? 0;  //报警级别
    this._type = type;  // 地图类型
    this._is_select = is_select;  // 地图类型
}
SquareOverlay.prototype = new BMap.Overlay();
SquareOverlay.prototype.initialize = function (map) {
    // 保存map对象实例
    this._map = map;
    // 创建div元素，作为自定义覆盖物的容器
    let div = document.createElement("div");
    div.style.position = "absolute";
    div.className = "map-tip";
    let image = document.createElement("img")
    let span = document.createElement("span");
    if (this._is_select == 1) {
        image.src = "/assets/admin/img/point-selected.png";
        image.style.width = 1 * this._size + "px";
    } else {
        image.src = "/assets/admin/img/point" + this._over + ".png";
        image.style.width = this._size + "px";
    }
    image.style.display = "inline-block";

    let color = getLevel(this._over);

    let html  = "<a onclick='getMapInfoForSpan("+this._id+",0,0,\""+this._type+"\",\""+this._name+"\")' data-id=this._id><span map-id=" + this._content.id + " class='item' style='color:" + color + "'>" + this._name + "</span></a>";
    span.innerHTML = html;
    console.log("_is_select == " + this._is_select)
    if (this._is_select == 1) {
            span.style.display = "inline-block";
            span.style.fontWeight = "normal";
            span.style.padding = "8px 12px";
            span.style.borderRadius = "3px";
            span.style.backgroundColor = "rgba(255,255,255,0.8)";
            div.style.zIndex = 1000;
            div.style.width = "3000px";
    } else {
        span.style.display = "none";
    }
    span.style.position = "absolute";
    span.style.fontSize = "16px";
    span.style.color = "#fff";
    image.style.cursor = "pointer";
    //span.setAttribute("content", JSON.stringify(this._content));
    //image.setAttribute("content", JSON.stringify(this._content));
    div.setAttribute("content", JSON.stringify(this._content));
    div.appendChild(image);
    div.appendChild(span);
    //div.style.width = "fit-content";
    div.style.zIndex = 100 - this._isOver;
    this._image = image;
    //console.log(this._image);
    this._span = span;

    // 可以根据参数设置元素外观
    // 将div添加到覆盖物容器中
    map.getPanes().markerPane.appendChild(div);
    // 保存div实例
    this._div = div;
    // 需要将div元素作为方法的返回值，当调用该覆盖物的show、
    // hide方法，或者对覆盖物进行移除时，API都将操作此元素。
    return div;
}
SquareOverlay.prototype.draw = function () {
    // 根据地理坐标转换为像素坐标，并设置给容器
    var position = this._map.pointToOverlayPixel(this._center);
    this._div.style.left = position.x - this._size / 2 + "px";
    this._div.style.top = position.y - this._size + "px";
}
SquareOverlay.prototype.show = function () {
    if (this._div) {
        this._div.style.display = "";
    }
}
// 实现隐藏方法
SquareOverlay.prototype.hide = function () {
    if (this._div) {
        this._div.style.display = "none";
    }
}
SquareOverlay.prototype.toggle = function () {
    if (this._div) {
        if (this._div.style.display == "") {
            this.hide();
        } else {
            this.show();
        }
    }
};
//添加到百度地图
SquareOverlay.prototype.addMap = function (map) {
    map.addOverlay(this);
}
// 标注大小改变
SquareOverlay.prototype.changeSize = function (zoom) {
    // console.info(zoom);
    this._image.style.width = this._size + (zoom - 15) * 4 + "px";
    //this._image.style.position = "absolute";
    //this._image.style.bottom = "0";
    this._span.style.fontSize = 20 + (zoom - 14) * 4 + "px";
}
//添加监听事件
SquareOverlay.prototype.addEventListener = function (el, event, func) {
    this[el]['on' + event] = func;
}
SquareOverlay.prototype.getContent = function () {
    return this._content;
}
SquareOverlay.prototype.changeBig = function () {
    this._image.src = "/assets/admin/img/point-selected.png?v=1.202105";
    this._image.style.width = 1 * this._size + "px";
    this._span.style.display = "inline-block";
    this._span.style.fontWeight = "normal";
    this._span.style.padding = "8px 12px";
    this._span.style.borderRadius = "3px";
    this._span.style.backgroundColor = "rgba(255,255,255,0.8)";
    this._div.style.zIndex = 1000;
    this._div.style.width = "3000px";
}
SquareOverlay.prototype.changeSmall = function () {
    this._image.src = "/assets/admin/img/point" + this._over + ".png";
    this._image.style.width = 1 * this._size + "px";
    this._span.style.display = "none";
    this._div.style.zIndex = 10;
    this._div.style.width = this._size + "px";
}

//获取元素属性content
var getContent = function (_this) {
    return JSON.parse(_this.getAttribute("content"));
}
//根据值获取颜色
/*不同的数值代表不同的颜色
*绿色（#00ff00） v = 0
*蓝色（#0000ff）0 < v <= 40
*黄色（#ffff00）40 < v <= 80
*橙色（#ffaa00）80 < v <= 120
*紫色（#ff00ff）120 < v <= 160
*红色（#ff0000）160 < v <= 200
*深红（#8b0000）200 < v
*/
var getColor = function (num) {
    var colors = ["#00FF00", "#0000ff", "#ffff00", "#ffaa00", "#ff00ff", "#ff0000", "#8b0000"]
    var color;
    if (num == 0) {
        color = colors[0];
    } else if (num <= 40) {
        color = colors[1];
    } else if (num <= 80) {
        color = colors[2];
    } else if (num <= 120) {
        color = colors[3];
    } else if (num <= 160) {
        color = colors[4];
    } else if (num <= 200) {
        color = colors[5];
    } else {
        color = colors[6];
    }
    return color;
}

/**
 * 根据值获取红黄绿牌
 * 2 红
 * 1 黄
 * 0 绿
 * */
function getLevel(l)
{
    let text = "#3399FF";
    switch (l) {
        case "4":
            text = "red";
            break;
        case "3":
            text = "#FF4D4D";
            break;
        case "2":
            text = "#FFA54D";
            break
        case "1":
            text = "#FFD1A5";
            break
    }
    return text;
}
// 获取地图信息
// 弹窗展示房间的详细信息
function getMapInfoForSpan(id,longitude,latitude, type, name)
{
    if (type === 'web') {
        $("#alertTitle").text(name);
        // 获取数据
        $.ajax(
            {
                url:  '/statistics/building-data?id='+id,
                dataType : "json",
                success: function (data) {
                    $("#alertBox_smoke").text(data.smoke_count);
                    $("#alertBox_smoke_abnormal").text(data.smoke_abnormal_count);
                    $("#alertBox_lock").text(data.lock_count);
                    $("#alertBox_lock_abnormal").text(data.lock_abnormal_count);
                    $("#alertBox").show();
                },
                error: function (data) {
                }
            }
        );
        //
    } else {
        layer_iframe('/admin/map/room?room_id=' + id,'房间',2,0.8,['1200px', '600px'], true)

        return false;
        setMarket(id);
        const point = new BMap.Point(longitude,latitude);
        // const marker = new BMap.Marker(point); // 创建标注
        // map.addOverlay(marker); // 将标注添加到地图中
        map.panTo(point); //转到该点位置
        return;
        // const point = new BMap.Point(longitude,latitude);
        // var icon = new BMap.Icon('/assets/admin/img/point-selected.png', new BMap.Size(20, 32), {
        //     anchor: new BMap.Size(10, 30)
        // });

        // // map.clearOverlays(longitude,latitude);
        // var new_point = new BMap.Point(longitude,latitude);
        // var marker = new BMap.Marker(new_point); // 创建标注
        // map.addOverlay(marker); // 将标注添加到地图中
        // map.panTo(new_point); //转到该点位置

        return;

//创建一个图像标注实例。point参数指定了图像标注所在的地理位置
        var mkr = new BMap.Marker(new BMap.Point(longitude,latitude), {
            icon: icon
        });
//将覆盖物添加到地图中
        map.addOverlay(mkr);

        map.panTo(point); //转到该点位置
        return;

        // 创建div元素，作为自定义覆盖物的容器
        let div = document.createElement("div");
        div.style.position = "absolute";
        div.className = "map-tip";
        let image = document.createElement("img")
        let span = document.createElement("span");
        image.src = "/assets/admin/img/point-selected.png";
        image.style.display = "inline-block";
        image.style.width = "60px";
        let color = getLevel(4);
        let html  = "<a onclick='getMapInfoForSpan("+id+")' data-id=this._id><span map-id=" + id + " class='item' style='color:" + color + "'>" + name + "</span></a>";
        span.innerHTML = html;
        span.style.display = "none";
        span.style.position = "absolute";
        span.style.fontSize = "16px";
        span.style.color = "#fff";
        image.style.cursor = "pointer";
        //span.setAttribute("content", JSON.stringify(this._content));
        //image.setAttribute("content", JSON.stringify(this._content));
        div.setAttribute("content", JSON.stringify('sw'));
        div.appendChild(image);
        div.appendChild(span);
        //div.style.width = "fit-content";
        div.style.zIndex = 100;
        //console.log(this._image);
        // 可以根据参数设置元素外观
        // 将div添加到覆盖物容器中
        map.getPanes().markerPane.appendChild(div);
        // point.getPanelRect.
        map.panTo(point); //转到该点位置
        // layer_iframe('/admin/map/room?room_id=' + id,'房间',2,0.8,['1200px', '600px'], true)
    }
}