<script src="https://unpkg.com/oh-my-live2d@latest"></script>
<script>
	OML2D.loadOml2d({
		models: [
			{
				path: "https://model.oml2d.com/HK416-1-normal/model.json",
				position: [0, 60],
				scale: 0.08,
				stageStyle: {
					height: 450,
				},
			},
		],
	});
</script>

function setupModelLoader(oml2d) {
    // 获取当前模型的索引
    var currentIndex = oml2d.modelIndex;
    // 获取当前模型的可点击状态
    if (oml2d.options.models.length > 0)
        var currentShowHitAreaFrames = oml2d.options.models[currentIndex].showHitAreaFrames;
    //监听模型选择框的变化
    document.getElementById('modelIndexSelect').addEventListener('change', function () {
        var selectedIndex = modelIndexSelect.value;
        oml2d.loadModelByIndex(selectedIndex);
    });
    document.getElementById('loadModelHitAreaFramesButton').addEventListener('click', function () {
        currentShowHitAreaFrames ? oml2d.hideModelHitAreaFrames() : oml2d.showModelHitAreaFrames();
        currentShowHitAreaFrames = !currentShowHitAreaFrames;
    });
}

async function loadModelsJson() {
    try {
        const response = await fetch('/l2d/models.json');
        const omModels = await response.json();
        console.log(omModels);
        // 现在 models 数组包含了 JSON 文件中的数据
        return omModels; // 返回模型数组
    } catch (error) {
        console.error('Error loading models:', error);
        return []; // 在出错时返回空数组
    }
}

async function OML2DInit() {
    const omModels = await loadModelsJson(); // 等待 loadModelsJson 执行完毕
    const oml2d = OML2D.loadOml2d({
		//其他公共选项配置
        models: omModels,
    });
    setupModelLoader(oml2d);
}

window._iconfont_svg_string_3847283 =
<svg>
<symbol id="icon-rest" viewBox="0 0 1280 1024">
<path d="M352 512c88.22 0 160-71.78 160-160s-71.78-160-160-160-160 71.78-160 160 71.78 160 160 160z m704-256H608c-17.68 0-32 14.32-32 32v288H128V160c0-17.68-14.32-32-32-32H32C14.32 128 0 142.32 0 160v704c0 17.68 14.32 32 32 32h64c17.68 0 32-14.32 32-32v-96h1024v96c0 17.68 14.32 32 32 32h64c17.68 0 32-14.32 32-32V480c0-123.72-100.28-224-224-224z"  >
</path>
</symbol>


<symbol id="icon-about" viewBox="0 0 1024 1024">
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272z m-32-344c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48z"  >
</path>
</symbol>
...


</svg>


showLoading() {
            this.open(`
      <div style="margin-bottom:3px;">${this.statusBarOptions.loadingMessage}</div>
      <svg class="oml2d-icon oml2d-loading" aria-hidden="true">
        <use xlink:href=#${this.statusBarOptions.loadingIcon}></use>
      </svg>
    `)

unorderedlist  //...
like
like1
like-fill
calendar
sound-fill
bilibili-fill 
snippets-fill  //cv
folder-fill
folder-open-fill
container-fill
arrow-down
menu
appstore-fill
home-fill
api-fill
tag-fill
tags-fill
file-text-fill
github-fill
QQ-circle-fill

class rA {
    constructor(t) {
        Nt(this, "globalStyle");
        Nt(this, "stage");
        Nt(this, "statusBar");
        Nt(this, "tips");
        Nt(this, "menus");
        Nt(this, "models");
        Nt(this, "pixiApp");
        Nt(this, "_modelIndex", 0);
        Nt(this, "_modelClothesIndex", 0);
        Nt(this, "version", "0.19.3");
        Nt(this, "options");
        Nt(this, "events");
        this.events = new L2,
            this.options = W2(ma, t),
            this.globalStyle = new Q2(this.options),
            this.stage = new ZT(this.options,this.events),
            this.statusBar = new tA(this.options),
            this.tips = new eA(this.options,this),
            this.menus = new J2(this.options,this),
            this.models = new B4(this.options,this.events),
            this.modelIndex = QT(),
            this.modelClothesIndex = qT(),
            this.initialize()
    }
    set modelIndex(t) {
        t > this.options.models.length - 1 && (t = 0),
            this._modelIndex = t,
            this.stage.modelIndex = t,
            this.models.modelIndex = t,
            jT(t)
    }
    get modelIndex() {
        return this._modelIndex
    }
    set modelClothesIndex(t) {
        this._modelClothesIndex = t,
            this.models.modelClothesIndex = t,
            JT(t)
    }
    get modelClothesIndex() {
        return this._modelClothesIndex
    }
    showModelHitAreaFrames() {
        this.models.addHitAreaFrames()
    }
    hideModelHitAreaFrames() {
        this.models.removeHitAreaFrames()
    }
    setModelScale(t) {
        this.models.setScale(t)
    }
    stopTipsIdle() {
        var t;
        (t = this.tips.idlePlayer) == null || t.stop()
    }
    startTipsIdle() {
        var t;
        (t = this.tips.idlePlayer) == null || t.start()
    }
    statusBarPopup(t, e, a) {
        this.statusBar.popup(t, e, a)
    }
    setStatusBarHoverEvent(t) {
        this.statusBar.setHoverEvent(t)
    }
    tipsMessage(t, e, a) {
        this.tips.notification(t, e, a)
    }
    setStageStyle(t) {
        this.stage.setStyle(Vr(t))
    }
    setModelPosition(t) {
        const {x: e=0, y: a=0} = t;
        this.models.setPosition(e, a)
    }
    get mobileHidden() {
        return !this.options.mobileDisplay && ga() === rr.mobile
    }
    create() {
        this.stage.create(),
            this.pixiApp = new WT(this.stage),
            this.statusBar.create(),
            this.statusBar.initializeStyle()
    }
    mount() {
        this.stage.mount(),
            this.statusBar.mount()
    }
    loadModel() {
        return ur(this, null, function*() {
            if (this.tips.clear(),
                yield this.stage.slideOut(),
                !(!this.options.models || !this.options.models.length)) {
                if (this.mobileHidden) {
                    this.statusBar.rest();
                    return
                }
                return this.statusBar.showLoading(),
                    this.models.create().catch( () => {
                    this.statusBar.loadingError( () => void this.reloadModel())
                }
                                              ).then( () => {
                    var t, e;
                    (t = this.pixiApp) == null || t.mount(this.models.model),
                        this.menus.reload(this.stage.element),
                        this.tips.reload(this.stage.element),
                        this.models.settingModel(),
                        this.stage.reloadStyle(this.models.modelSize),
                        (e = this.pixiApp) == null || e.resize(),
                        this.statusBar.hideLoading()
                }
                                                    )
            }
        })
    }
    reloadModel() {
        return ur(this, null, function*() {
            var t;
            yield this.loadModel(),
                yield this.stage.slideIn(),
                (t = this.tips.idlePlayer) == null || t.start()
        })
    }
    loadRandomModel() {
        return ur(this, null, function*() {
            var t;
            this.modelIndex = j2(this.options.models.length, this.modelIndex),
                this.modelClothesIndex = 0,
                this.statusBar.open(this.options.statusBar.switchingMessage),
                yield this.loadModel(),
                yield this.stage.slideIn(),
                (t = this.tips.idlePlayer) == null || t.start()
        })
    }
    loadNextModel() {
        return ur(this, null, function*() {
            var t;
            ++this.modelIndex >= this.options.models.length && (this.modelIndex = 0),
                this.modelClothesIndex = 0,
                this.statusBar.open(this.options.statusBar.switchingMessage),
                yield this.loadModel(),
                yield this.stage.slideIn(),
                (t = this.tips.idlePlayer) == null || t.start()
        })
    }
    loadModelByIndex(t, e) {
        return ur(this, null, function*() {
            var a;
            t >= 0 && t < this.options.models.length && (this.modelIndex = t,
                                                         this.modelClothesIndex = e || 0,
                                                         this.statusBar.open(this.options.statusBar.switchingMessage),
                                                         yield this.loadModel(),
                                                         yield this.stage.slideIn(),
                                                         (a = this.tips.idlePlayer) == null || a.start())
        })
    }
    loadModelByName(t, e) {
        return ur(this, null, function*() {
            var n;
            const a = this.options.models.findIndex(s => s.name === t);
            a > 0 && (this.modelIndex = a,
                      this.modelClothesIndex = e || 0,
                      this.statusBar.open(this.options.statusBar.switchingMessage),
                      yield this.loadModel(),
                      yield this.stage.slideIn(),
                      (n = this.tips.idlePlayer) == null || n.start())
        })
    }
    loadNextModelClothes() {
        return ur(this, null, function*() {
            const t = this.options.models[this.modelIndex].path;
            Xr(this.options.models[this.modelIndex].path) && this.options.models.length ? (++this.modelClothesIndex >= t.length && (this.modelClothesIndex = 0),
                                                                                           yield this.loadModel(),
                                                                                           yield this.stage.slideIn()) : this.tips.notification("该模型没有其他衣服~", 5e3, 3)
        })
    }
    setModelRotation(t) {
        this.models.setRotation(t)
    }
    setModelAnchor(t) {
        const {x: e, y: a} = t;
        this.models.setAnchor(e, a)
    }
    initialize() {
        z2(),
            this.options.sayHello && V2(),
            this.registerGlobalEvent(),
            this.globalStyle.initialize(),
            this.create(),
            this.mount(),
            this.loadModel().then( () => {
            const t = i2() || this.options.initialStatus;
            i2() || gl(this.options.initialStatus),
                t === "sleep" ? (this.tips.clear(),
                                 this.statusBar.open(this.options.statusBar.restMessage),
                                 this.statusBar.setClickEvent( () => {
                var e;
                this.stage.slideIn(),
                    (e = this.tips.idlePlayer) == null || e.start(),
                    this.statusBar.close(),
                    this.statusBar.clearHoverEvent(),
                    this.statusBar.clearClickEvent()
            }
                                                             )) : this.stage.slideIn()
        }
                                 )
    }
    stageSlideIn() {
        return ur(this, null, function*() {
            yield this.stage.slideIn()
        })
    }
    stageSlideOut() {
        return ur(this, null, function*() {
            yield this.stage.slideOut()
        })
    }
    statusBarOpen(t, e) {
        this.statusBar.open(t, e)
    }
    clearTips() {
        this.tips.clear()
    }
    setStatusBarClickEvent(t) {
        this.statusBar.setClickEvent(t)
    }
    statusBarClose(t, e, a) {
        this.statusBar.close(t, a, e)
    }
    statusBarClearEvents() {
        this.statusBar.clearClickEvent(),
            this.statusBar.clearHoverEvent()
    }
    onStageSlideIn(t) {
        this.events.add("stageSlideIn", t)
    }
    onStageSlideOut(t) {
        this.events.add("stageSlideOut", t)
    }
    onLoad(t) {
        this.events.add("load", t)
    }
    registerGlobalEvent() {
        K2( () => {
            this.reloadModel()
        }
          ),
            this.onStageSlideIn( () => {
            this.tips.welcome()
        }
                               ),
            window.document.oncopy = () => {
            this.tips.copy()
        }
    }
}
const iA = i => new rA(i);
Me.loadOml2d = iA,
    Object.defineProperty(Me, Symbol.toStringTag, {
    value: "Module"
})