<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link rel="stylesheet" href="${ctx}/css/plugin/svgEditor/styles/grapheditor.css">
    <link rel="stylesheet" href="${ctx}/css/basic.css">
    <link rel="stylesheet" href="${ctx}/js/plugin/layerui/css/layui.css">
    <title>暂降域编辑</title>
    <style>
        .customMenuDiv {
            position: absolute;
            top: 0;
            right: 45px;
            height: 31px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .customSave, .customView {
            font-size: 13px;
            height: 20px;
            line-height: 20px;
            border-radius: 4px;
            border: 0;
            padding: 1px 9px;
        }


        .viewIcon {
            font-weight: bolder;
        }

        .mxPopupMenu {
            background-color: #fff !important;
        }

        .geMenubarMenu {
            border: 0 !important;
        }

    </style>
    <script>
        var urlParams = (function (url) {
            var result = {};
            var idx = url.lastIndexOf('?');

            if (idx > 0) {
                var params = url.substring(idx + 1).split('&');

                for (var i = 0; i < params.length; i++) {
                    idx = params[i].indexOf('=');

                    if (idx > 0) {
                        result[params[i].substring(0, idx)] = params[i].substring(idx + 1);
                    }
                }
            }

            return result;
        })(window.location.href);
        mxLoadResources = false;
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="col-md-12">

    </div>
</div>
<input type="hidden" id="svgIndex" value="${svgIndex}">
<%@include file="../../include/svgOpenDom.jsp" %>
<script src="${ctx}/js/plugin/jquery.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap.min.js"></script>
<script src="${ctx}/js/plugin/layerui/layer.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Init.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/deflate/pako.min.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/deflate/base64.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/jscolor/jscolor.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/sanitizer/sanitizer.min.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/mxClient.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/EditorUi.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Editor.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Sidebar.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Graph.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Format.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Shapes.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Actions.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Menus.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Toolbar.js"></script>
<script type="text/javascript" src="${ctx}/js/plugin/svgEditor/js/Dialogs.js"></script>

<script src="${ctx}/js/plugin/xss/xss.js"></script>
<script src="${ctx}/js/color.js"></script>
<script src="${ctx}/jspJS/utils/loading.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script src="${ctx}/jspJS/advanced/svg.js"></script>
<script src="${ctx}/jspJS/utils/svgAdvancedAlgorithm.js"></script>
<script src="${ctx}/jspJS/utils/getTime.js"></script>
<script>
    let editor, editorUI;
    let layerIndex;
    let xml = null;
    let svgIndex = $('#svgIndex').val()
    $(function () {
        initEditor();
    })

    function initEditor() {
        let editorUiInit = EditorUi.prototype.init;
        EditorUi.prototype.init = function () {
            editorUiInit.apply(this, arguments);
        };
        mxResources.loadDefaultBundle = false;
        let bundle = mxResources.getDefaultBundle(RESOURCE_BASE, mxLanguage) ||
            mxResources.getSpecialBundle(RESOURCE_BASE, mxLanguage);
        mxUtils.getAll([bundle, STYLE_PATH + '/default.xml'], function (xhr) {
            mxResources.parse(xhr[0].getText());
            let themes = new Object();
            themes[Graph.prototype.defaultThemeName] = xhr[1].getDocumentElement();
            editor = new Editor(urlParams['chrome'] == '0', themes);
            editorUI = new EditorUi(editor);
            backViewXmlByLineId(svgIndex);
        }, function () {
            document.body.innerHTML = '<center style="margin-top:10%;">Error loading resource files. Please check browser console.</center>';
        });
    }

    /**
     * 回显对应馈线的xml
     * */
    function backViewXmlByLineId(index) {
        $.ajax({
            url: '/pqs9200/svg/loadSvg',
            type: 'post',
            async: false,
            data: {
                index: svgIndex,
                type: '.xml'
            },
            dataType: 'json',
            success: function (data) {
                if (data.code === 200) {
                    xml = decodeURIComponent(data.body);
                    xmlFile(editorUI, xml);
                } else {
                    xmlFile(editorUI, null);
                }
                layer.closeAll('loading');
            }
        })
    }


    /* 回显xml文件 */
    function xmlFile(editorUI, data) {
        editorUI.editor.graph.model.beginUpdate();
        try {
            if (data === null) {
                //为null时，说明无绘图数据，清空画布
                editorUI.editor.setGraphXml(null);
            } else {
                editorUI.editor.setGraphXml(mxUtils.parseXml(data).documentElement);
            }
        } catch (e) {
            console.log(e)
        } finally {
            editorUI.editor.graph.model.endUpdate();
        }
    }

    //保存文件
    $("body").on('click', '#customSave', function () {
        editorUI.save(svgIndex);
        getEachCellArr();
    })


</script>

</body>
</html>