/**
 * 初始化地图缩放工具条
 * @description sd
 * @param {Object} map 地图对象
 * @param {String} ClassName 工具条添加的类名
 * 
 */
function initDraggingZoomBar(map,ClassName) {

    if (!map) {
        console.error("初始化工具条失败，原因：未找到地图对象")
        return
    }
    if (!ClassName) {
        console.warn("添加工具条失败，原因：添加工具条的元素类名为空")
        return
    }

    let htmlstr = `<div class="map_zoomcontrol">
        <div id="map_zoom_in"></div>
        <div class="map_slide_box">
            <div class="map_slide_box_before"></div>
            <div class="map_slide"></div>

        </div>
        <div id="map_zoom_out"></div>
    </div>`

    $(ClassName).append(htmlstr);
    map.on("zoomchange", function () {
        var zoomnum = map.getZoom();
        var nn = 18 - zoomnum;
        $(".map_slide").css("top", nn * 9 + "px");
        $(".map_slide_box_before").css("height", nn * 9 + "px");
    })

    AMapUI.loadUI(['control/BasicControl'], function (BasicControl) {
        var zoom = new BasicControl.Zoom({
            position: {
                top: '20px',
                right: '-40px',
            }, //隐藏原始控件
            showZoomNum: true //显示zoom值
        })

        $("#map_zoom_in").on("click", function () {
            var top = $(".map_slide").position().top;
            var height = $(".map_slide_box_before").height()
            //console.log(height)
            if (top > 0) {
                $(".map_slide").css("top", top - 9 + "px");
                $(".map_slide_box_before").css("height", height - 9 + "px");
            }
            zoom.zoomIn();//放大
            //console.log(top);
        })
        $("#map_zoom_out").on("click", function () {
            var top = $(".map_slide").position().top;
            var height = $(".map_slide_box_before").height()
            if (top < 135) {
                $(".map_slide").css("top", top + 9 + "px");
                $(".map_slide_box_before").css("height", height + 9 + "px");
            }
            zoom.zoomOut();//缩小

        })

        //初始化slide位置
        var zoomnum = map.getZoom();
        var nn = 18 - zoomnum;
        $(".map_slide").css("top", nn * 9 + "px");
        $(".map_slide_box_before").css("height", nn * 9 + "px");

        var yPage;
        var Y;//

        var mDown = false;//
        var positionY;
        var moveY;
        var slidetop;
        var slideheight;

        $(".map_slide").mousedown(function (e) {
            mDown = true;
            Y = e.pageY;
            positionY = $(this).position().top;
            slidetop = $(".map_slide").position().top;
            slideheight = $(".map_slide_box_before").height()

            return false;
        });

        $(".map_slide").mouseup(function (e) {
            yPage = e.pageY;//
            moveY = positionY + yPage - Y;

            var aa = parseInt((yPage - Y) / 9);
            if (aa > 0) {
                $(".map_slide").css("top", slidetop + aa * 9 + "px");
                $(".map_slide_box_before").css("height", slideheight + aa * 9 + "px");
                for (var i = 0; i < aa; i++) {
                    zoom.zoomOut();
                }
            } else if (aa < 0) {
                var bb = Math.abs(aa);
                $(".map_slide").css("top", slidetop + aa * 9 + "px");
                $(".map_slide_box_before").css("height", slideheight + aa * 9 + "px");
                for (var i = 0; i < bb; i++) {
                    zoom.zoomIn();
                }
            } else {
                $(".map_slide").css("top", slidetop + "px");
                $(".map_slide_box_before").css("height", slideheight + "px");
            }
            //console.log(aa)
            mDown = false;
        });

        $(".map_slide").mousemove(function (e) {

            yPage = e.pageY;//--
            moveY = positionY + yPage - Y;

            if (mDown == true) {
                $(this).css({ "top": moveY });
                $(".map_slide_box_before").css("height", moveY + "px");
            } else {
                return;
            }
            if (moveY < 0) {
                $(this).css({ "top": "0" });
                mDown = false;
            }
            if (moveY > 135) {
                $(this).css({ "top": 135 });
                mDown = false;
            }
        });

        map.addControl(zoom);//添加缩放控件


    })

}