box-client/packages/build-helper/panel/assets-hotupdate-setting.js

const utils = Editor.require('packages://build-helper/core/libs/utils.js');

let ListItem;

(() => {
    'use strict';

    return function init ( panel ) {
        let viewEL = panel.$.view;

        let tmpl = 'packages://build-helper/panel/assets-hotupdate-setting.tmpl';
        Editor.import(tmpl).then(content => {
            viewEL.innerHTML = content;

            let assetsHotUpdate = `assetsHotUpdate`;
            let update = panel.getSettingItem(assetsHotUpdate) || {};

            // 热更开关
            let enableCheckboxEle = viewEL.querySelector('#enableCheckbox');
            enableCheckboxEle.value = update.enable;
            enableCheckboxEle.addEventListener('change', (event) => {
                update.enable = event.target.value;
                panel.setSettingItem(assetsHotUpdate, update);
            });

            // 热更远程URL
            let remoteUrlEle = viewEL.querySelector('#remoteUrl');
            remoteUrlEle.value = update.remoteUrl;
            remoteUrlEle.addEventListener('confirm', e => {
                if (!utils.isURL(event.target.value)) {
                    Editor.error('请输入正确的URL');
                    return;
                }
                update.remoteUrl = event.target.value;
                panel.setSettingItem(assetsHotUpdate, update);
            });

            // 支持平台
            let platformEle = viewEL.querySelector('#platform');
            platformEle.value = update.platform;
            platformEle.addEventListener('confirm', e => {
                update.platform = event.target.value;
                panel.setSettingItem(assetsHotUpdate, update);
            });

            // 检查manifest文件
            function checkManifest (relative) {
                let root = Editor.Project.path + '/' + relative;
                let assetsdb = 'db://';
                let assetsIdx = root.indexOf('assets');
                if (assetsIdx !== -1) {
                    assetsdb += root.substr(assetsIdx, root.length);
                } else {
                    assetsdb += '/assets';
                }

                let host = remoteUrlEle.value || 'http://localhost';
                let projectManifestPath = root + '/project.manifest';
                utils.accessPath(projectManifestPath, (err)=> {
                    if (err && err.code === 'ENOENT') {
                        let assetsdbProjectManifestPath = assetsdb + '/project.manifest';
                        utils.createProjectManifestAssets(assetsdbProjectManifestPath, host, (err, results) => {
                            if (err) {
                                Editor.error(err);
                                return;
                            }
                        });
                    }
                });

                let versionManifestPath = root + '/version.manifest';
                utils.accessPath(versionManifestPath, (err)=> {
                    if (err && err.code === 'ENOENT') {
                        let assetsdbVersionManifestPath = assetsdb + '/version.manifest';
                        utils.createVersionManifestAssets(assetsdbVersionManifestPath, host, (err, results) => {
                            if (err) {
                                Editor.error(err);
                                return;
                            }
                        });
                    }
                });
            }
            // 源码目录
            let srcEle = viewEL.querySelector('#src');
            srcEle.value = update.src;
            if (update.src) {
                checkManifest(update.src);
            }

            // 源码目录选择按钮
            let srcSelectBtnEle = viewEL.querySelector('#srcSelectBtn');
            srcSelectBtnEle.addEventListener('click', (event) => {
                let res = Editor.Dialog.openFile({
                    title: '选择源码根目录',
                    defaultPath: Editor.Project.path + '/assets',
                    properties: ['openDirectory', 'createDirectory']
                });
                if (res !== -1) {
                    let newPath = res[0];
                    let projectPathIdx = newPath.indexOf(Editor.Project.path);
                    if (projectPathIdx === -1) {
                        srcEle.value = '';
                        update.src = '';
                        update.versionManifestUUID = '';
                        Editor.warn('源码目录必须在本工程' + Editor.Project.path + '中');
                        return;
                    }

                    let assetsIdx = newPath.indexOf('assets');
                    if (assetsIdx === -1) {
                        srcEle.value = '';
                        update.src = '';
                        update.versionManifestUUID = '';
                        Editor.warn('源码目录必须在' + Editor.Project.path + '/assets中');
                        return;
                    }

                    let relative = utils.getRelative(Editor.Project.path, newPath);
                    srcEle.value = relative;
                    checkManifest(relative);

                    update.src = relative;
                    panel.setSettingItem(assetsHotUpdate, update);
                }
            });


            // 目标目录
            let destEle = viewEL.querySelector('#dest');
            if (update.dest) {
                destEle.value = update.dest;
            }
            // 目标目录选择按钮
            let destSelectBtnEle = viewEL.querySelector('#destSelectBtn');
            destSelectBtnEle.addEventListener('click', (event) => {
                let res = Editor.Dialog.openFile({
                    title: '选择目标根目录',
                    defaultPath: Editor.Project.path,
                    properties: ['openDirectory', 'createDirectory']
                });
                if (res !== -1) {
                    let newPath = res[0];

                    let relative = utils.getRelative(Editor.Project.path, newPath);
                    destEle.value = relative;

                    update.dest = relative;
                    panel.setSettingItem(assetsHotUpdate, update);
                }
            });


            let ignores = update.ignores || [];
            let listEle = viewEL.querySelector('#list');
            if (!ListItem) {
                ListItem = Editor.UI.registerElement('update-ignore-list-item', {
                    template: `
                        <div class="item"">
                            <ui-input id="path" class="path" disabled></ui-input>
                            <ui-button id="del" class="tiny red">删除</ui-button>
                        </div>
                    `,

                    style: `
                        .item {
                            display: flex;
                            background-color: black;
                            padding: 2px;
                        }

                        .path {
                            flex: 1;
                        }
                    `,

                    factoryImpl ( text ) {
                        this.$ = {
                            path: this.shadowRoot.querySelector('#path'),
                            del: this.shadowRoot.querySelector('#del')
                        };

                        this.$.path.value = text;

                        this.$.del.addEventListener('click', (event) => {
                            listEle.removeChild(this);

                            // 配置中删除
                            for (let i = 0; i < ignores.length; i++) {
                                const path = ignores[i];
                                if (path == text) {
                                    ignores.splice(i, 1);
                                    break;
                                }
                            }
                        });
                    }
                });
            }

            // 资源列表
            ignores.forEach(path => {
                let el = new ListItem(path);
                listEle.appendChild(el);
            });

            // 添加资源
            let addEle = viewEL.querySelector('#add');
            addEle.addEventListener('click', (event) => {
                event.stopPropagation();

                let res = Editor.Dialog.openFile({
                    title: '选择需要忽略的资源目录文件',
                    defaultPath: Editor.Project.path + '/assets',
                    properties: ['openDirectory', 'openFile']
                });
                if (res !== -1) {
                    let newPath = res[0];
                    let relative = utils.getRelative(Editor.Project.path, newPath);
                    for (const path of ignores) {
                        if (path === relative) {
                            Editor.log(relative + '已经存在！');
                            return;
                        }
                    }

                    let el = new ListItem(relative);
                    listEle.appendChild(el);

                    ignores.push(relative);
                    update.ignores = ignores;
                    panel.setSettingItem(assetsHotUpdate, update);
                }
            });
        });
    };
})();