mirror of
https://github.com/caojiezi2003/live2d-widget.git
synced 2024-11-10 04:49:47 +00:00
Drop jQuery in demo
This commit is contained in:
parent
e7c52d1ee9
commit
7c604ae5b7
@ -3,7 +3,6 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Live2D 看板娘 / Demo</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
|
||||
<style>
|
||||
#github svg {
|
||||
|
@ -6,7 +6,6 @@
|
||||
<title>看板娘登陆平台</title>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap/dist/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
|
||||
<script src="../live2d.min.js"></script>
|
||||
<style>
|
||||
html, body {
|
||||
@ -151,15 +150,15 @@ body {
|
||||
<p class="mt-5 mb-3 text-muted">Copyleft © Mimi 2019</p>
|
||||
</form>
|
||||
<script>
|
||||
$(function() {
|
||||
window.addEventListener("load", () => {
|
||||
"use strict";
|
||||
|
||||
if (!CSS.supports("clip-path", "circle(120px at center)") && !CSS.supports("-webkit-clip-path", "circle(120px at center)")) {
|
||||
$("#stage").html('<img src="../assets/screenshot-1.png">');
|
||||
document.getElementById("stage").innerHTML = '<img src="../assets/screenshot-1.png">';
|
||||
return;
|
||||
}
|
||||
|
||||
var apiURL = "https://live2d.fghrsh.net/api", state = 0,
|
||||
var apiPath = "https://live2d.fghrsh.net/api", state = 0,
|
||||
modelId = localStorage.getItem("modelId"),
|
||||
modelTexturesId = localStorage.getItem("modelTexturesId");
|
||||
if (modelId == null) {
|
||||
@ -172,10 +171,10 @@ $(function() {
|
||||
localStorage.setItem("modelId", modelId);
|
||||
if (modelTexturesId === undefined) modelTexturesId = 0;
|
||||
localStorage.setItem("modelTexturesId", modelTexturesId);
|
||||
loadlive2d("live2d", `${apiURL}/get/?id=${modelId}-${modelTexturesId}`, null);
|
||||
loadlive2d("live2d", `${apiPath}/get/?id=${modelId}-${modelTexturesId}`, null);
|
||||
console.log("live2d", `模型 ${modelId}-${modelTexturesId} 加载完成`);
|
||||
setTimeout(function() {
|
||||
$("#cover").css("bottom", "80%");
|
||||
setTimeout(() => {
|
||||
coverPosition("80%");
|
||||
state = 2;
|
||||
}, 2000);
|
||||
}
|
||||
@ -187,10 +186,10 @@ $(function() {
|
||||
.then(response => response.json())
|
||||
.then(result => {
|
||||
loadModel(modelId, result.textures.id);
|
||||
setTimeout(function() {
|
||||
setTimeout(() => {
|
||||
state = 2;
|
||||
$("#cover").css("bottom", "80%");
|
||||
$("#refresh").attr("href", "javascript:refresh()");
|
||||
coverPosition("80%");
|
||||
document.getElementById("refresh").setAttribute("href", "javascript:refresh()");
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
@ -204,6 +203,10 @@ $(function() {
|
||||
});
|
||||
}
|
||||
|
||||
function coverPosition(pos) {
|
||||
document.getElementById("cover").style.bottom = pos;
|
||||
}
|
||||
|
||||
window.info = function() {
|
||||
fetch("https://v1.hitokoto.cn")
|
||||
.then(response => response.json())
|
||||
@ -214,31 +217,32 @@ $(function() {
|
||||
|
||||
window.refresh = function() {
|
||||
state = 0;
|
||||
$("#cover").css("bottom", "10%");
|
||||
$("#refresh").attr("href", "javascript:void(0)");
|
||||
coverPosition("10%");
|
||||
document.getElementById("refresh").setAttribute("href", "javascript:void(0)");
|
||||
setTimeout(loadRandModel, 1000);
|
||||
}
|
||||
|
||||
$("#handle").click(function() {
|
||||
document.getElementById("handle").addEventListener("click", () => {
|
||||
if (state == 1) {
|
||||
state = 2;
|
||||
$("#cover").css("bottom", "80%");
|
||||
coverPosition("80%");
|
||||
}
|
||||
else if (state == 2) {
|
||||
state = 1;
|
||||
$("#cover").css("bottom", "20%");
|
||||
coverPosition("20%");
|
||||
}
|
||||
});
|
||||
|
||||
$("input[type=password]").focus(function() {
|
||||
document.querySelector("input[type=password]").addEventListener("focus", () => {
|
||||
if (state == 2) {
|
||||
state = 1;
|
||||
$("#cover").css("bottom", "20%");
|
||||
coverPosition("20%");
|
||||
}
|
||||
}).blur(function() {
|
||||
});
|
||||
document.querySelector("input[type=password]").addEventListener("blur", () => {
|
||||
if (state == 1) {
|
||||
state = 2;
|
||||
$("#cover").css("bottom", "80%");
|
||||
coverPosition("80%");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user