LayX
/
template.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <title><%=htmlWebpackPlugin.options.title %></title>
</head>

<body>
    <button id="create">Create</button>
    <button id="create2">Create2</button>
    <button id="create3">Create3</button>
    <button id="create4">Create4</button>
    <button id="create5">Create5</button>
    <button id="create6">Create6</button>
    <button id="notice">Info</button>
    <button id="notice2">Success</button>
    <button id="notice3">Warning</button>
    <button id="notice4">Error</button>
    <div id="about-layx" style="display:none;padding: 10px;line-height: 1.5;">
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
        <h2>Layx 一个神奇的UI窗口</h2>
        <p>Layx
            诞生于一次C/S架构系统往B/S架构系统迁移项目中。起初，我们想在B/S架构上实现类C/S架构窗口功能，但百度、谷歌过后依然没能找到合适的Javascript插件。于是乎在2018年05月01日五一劳动节期间连夜赶工创造出了
            Layx 。</p>
        <p>目前 Layx 拥有和C/S架构一样灵活的操作方式，支持网页多窗口、多任务协同操作，支持窗口各种事件。</p>
    </div>
    <script type="text/javascript">
        document.getElementById("create").onclick = function () {
            layx.open({
                id: "hello-world",
                content: {
                    type: 'html',
                    value: document.getElementById("about-layx")
                },
                toolBar: {
                    titleBar: {
                        title: "Layx - Create1."
                    }
                },
                topMenu: [
                    {
                        id: 'file',
                        label: '文件(F)',
                        items: [
                            {
                                id: 'new-file',
                                label: '新建文件'
                            },
                            {
                                id: 'new-window',
                                label: '新建窗口'
                            },
                            {
                                id: 'open-file',
                                label: '打开文件'
                            },
                            {
                                id: 'open-window',
                                label: '打开窗口'
                            }
                        ]
                    },
                    {
                        id: 'edit',
                        label: '编辑(E)',
                        items: [
                            {
                                id: 'child-one',
                                label: '点击我',
                                handler: function (ev, win) {
                                    alert("谢谢支持。");
                                },
                                items: [
                                    {
                                        id: 'new-file',
                                        label: '新建文件'
                                    },
                                    {
                                        id: 'new-window',
                                        label: '新建窗口'
                                    },
                                    {
                                        id: 'open-file',
                                        label: '打开文件'
                                    },
                                    {
                                        id: 'open-window',
                                        label: '打开窗口'
                                    }
                                ]
                            },
                            {
                                id: 'child-two',
                                label: '子菜单二'
                            },
                            {
                                id: 'child-three',
                                label: '子菜单三'
                            },
                            {
                                id: 'child-four',
                                label: '子菜单四'
                            },
                            {
                                id: 'child-five',
                                label: '子菜单五'
                            }
                        ]
                    },
                    {
                        id: 'view',
                        label: '查看(V)'
                    },
                    {
                        id: 'other',
                        label: '其他(T)'
                    },
                    {
                        id: 'help',
                        label: '帮助(H)'
                    }
                ],
                contextMenu: [{
                    id: 'create',
                    label: '新增窗口',
                    handler: function (ev, win) {
                        alert("点击了新增，窗口句柄为：" + win.id);
                    },
                    items: [
                        {
                            id: 'child-one',
                            label: '子菜单一'
                        },
                        {
                            id: 'child-two',
                            label: '子菜单二',
                            items: [
                                {
                                    id: 'child-one',
                                    label: '点击我',
                                    handler: function (ev, win) {
                                        alert("谢谢支持。");
                                    }
                                },
                                {
                                    id: 'child-two',
                                    label: '子菜单二'
                                },
                                {
                                    id: 'child-three',
                                    label: '子菜单三'
                                },
                                {
                                    id: 'child-four',
                                    label: '子菜单四'
                                },
                                {
                                    id: 'child-five',
                                    label: '子菜单五'
                                }
                            ]
                        },
                        {
                            id: 'child-three',
                            label: '子菜单三'
                        }
                    ]
                },
                {
                    id: 'edit',
                    label: '编辑窗口',
                    handler: function (ev, win) {
                        alert("点击了编辑，窗口句柄为：" + win.id);
                    }
                },
                {
                    id: 'del',
                    label: '关闭窗口',
                    handler: function (ev, win) {
                        layx.destroy(win.id);
                    }
                },
                {
                    id: 'about',
                    label: '关于...',
                    handler: function (ev, win) {
                        alert("点击了关于，窗口句柄为：" + win.id);
                    }
                }]
            });
        }
        document.getElementById("create2").onclick = function () {
            layx.open({
                id: "hello-world2",
                content: {
                    type: 'local-url',
                    value: '../local.html'
                },
                toolBar: {
                    background: "#f5f5f5",
                    titleBar: {
                        title: "Layx - Create2.",
                        useSubTitle: true
                    }
                },
                offset: [100, 50],
                topMenu: [
                    {
                        id: 'file',
                        label: '文件2(F)',
                        items: [
                            {
                                id: 'new-file',
                                label: '新建文件'
                            },
                            {
                                id: 'new-window',
                                label: '新建窗口'
                            },
                            {
                                id: 'open-file',
                                label: '打开文件'
                            },
                            {
                                id: 'open-window',
                                label: '打开窗口'
                            }
                        ]
                    },
                    {
                        id: 'edit',
                        label: '编辑(E)',
                        items: [
                            {
                                id: 'child-one',
                                label: '点击我',
                                handler: function (ev, win) {
                                    alert("谢谢支持。");
                                },
                                items: [
                                    {
                                        id: 'new-file',
                                        label: '新建文件'
                                    },
                                    {
                                        id: 'new-window',
                                        label: '新建窗口'
                                    },
                                    {
                                        id: 'open-file',
                                        label: '打开文件'
                                    },
                                    {
                                        id: 'open-window',
                                        label: '打开窗口'
                                    }
                                ]
                            },
                            {
                                id: 'child-two',
                                label: '子菜单二'
                            },
                            {
                                id: 'child-three',
                                label: '子菜单三'
                            },
                            {
                                id: 'child-four',
                                label: '子菜单四'
                            },
                            {
                                id: 'child-five',
                                label: '子菜单五'
                            }
                        ]
                    },
                    {
                        id: 'view',
                        label: '查看(V)'
                    },
                    {
                        id: 'other',
                        label: '其他(T)'
                    },
                    {
                        id: 'help',
                        label: '帮助(H)'
                    }
                ],
                contextMenu: [
                    {
                        id: 'refresh',
                        label: '刷新IFrame',
                        handler: function (ev, win) {
                            var frameContent = win.getComponent("content-container/content");
                            if (frameContent.contentWindow) {
                                frameContent.contentWindow.location.reload();
                            }
                        }
                    },
                    {
                        id: 'del',
                        label: '关闭窗口',
                        handler: function (ev, win) {
                            layx.destroy(win.id);
                        }
                    },
                    {
                        id: 'about',
                        label: '关于...',
                        handler: function (ev, win) {
                            alert("点击了关于，窗口句柄为：" + win.id);
                        }
                    }]
            });
        }
        document.getElementById("create3").onclick = function () {
            layx.open({
                id: "hello-world3",
                content: {
                    type: 'html',
                    value: '一个神奇的UI窗口'
                },
                parclose: true,
                toolBar: {
                    titleBar: {
                        title: "Layx - Create3."
                    }
                },
                offset: "rightBottom"
            });
        }
        document.getElementById("create4").onclick = function () {
            layx.open({
                id: "hello-world4",
                content: {
                    type: 'html',
                    value: '一个神奇的UI窗口'
                },
                toolBar: {
                    titleBar: {
                        title: "Layx - Create4."
                    }
                },
                offset: "bottomCenter"
            });
        }
        document.getElementById("create5").onclick = function () {
            layx.open({
                id: "hello-world5",
                content: {
                    type: 'html',
                    value: '一个神奇的UI窗口'
                },
                toolBar: {
                    titleBar: {
                        title: "Layx - Create5."
                    }
                },
                offset: "leftTop"
            });
        }
        document.getElementById("create6").onclick = function () {
            layx.open({
                id: "hello-world6",
                content: {
                    type: 'html',
                    value: '一个神奇的UI窗口'
                },
                toolBar: {
                    titleBar: {
                        title: "Layx - Create6."
                    }
                },
                statuBar: {
                    content: '状态栏'
                },
                offset: "rightTop"
            });
        }
        document.getElementById("notice").onclick = function () {
            layx.notice({
                title: '消息提示',
                message: '我是消息提示消息提示消息提示消息提示'
            });
        }
        document.getElementById("notice2").onclick = function () {
            layx.notice({
                title: '成功提示',
                type: 'success',
                message: '我是消息提示消息提示消息提示消息提示'
            });
        }
        document.getElementById("notice3").onclick = function () {
            layx.notice({
                title: '警告提示',
                type: 'warning',
                message: '我是消息提示消息提示消息提示消息提示'
            });
        }
        document.getElementById("notice4").onclick = function () {
            layx.notice({
                title: '错误提示',
                type: 'error',
                message: '我是消息提示消息提示消息提示消息提示'
            });
        }
    </script>
</body>

</html>