amass/live2d-widget
1
0
Fork 0
mirror of https://github.com/stevenjoezhang/live2d-widget.git synced 2024-11-22 12:39:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Drop jQuery in demo

Browse Source
This commit is contained in:
Mimi 2020-01-20 17:28:22 +08:00
parent e7c52d1ee9
commit 7c604ae5b7
2 changed files with 23 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
demo/demo1.html
View File

@ -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 {

42
demo/demo2.html
View File

@ -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 &copy; 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%");
}
});
});