feat(showcase): rewrite the webpage using preact for future development (1/3)
This commit is contained in:
Haoyu Xu
@@ -29,6 +29,6 @@ operators:
|
|||||||
server:
|
server:
|
||||||
operator_folder: ./operator/
|
operator_folder: ./operator/
|
||||||
release_folder: ./release/
|
release_folder: ./release/
|
||||||
template_folder: ./template/operator
|
template_folder: ./template/operator/
|
||||||
index:
|
index:
|
||||||
src_folder: ./template/index/src
|
src_folder: ./template/index/src/assets
|
||||||
|
|||||||
10
template/showcase/.env
Normal file
10
template/showcase/.env
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
VITE_OPERATOR=chen
|
||||||
|
VITE_TITLE="Arknights: Ch'en/Chen the Holungday - 明日方舟：假日威龙陈"
|
||||||
|
VITE_FILENAME=dyn_illust_char_1013_chen2
|
||||||
|
VITE_LOGO=logo_rhodes_override
|
||||||
|
VITE_OPACITY=100
|
||||||
|
VITE_VIEWPORT_LEFT=0
|
||||||
|
VITE_VIEWPORT_RIGHT=0
|
||||||
|
VITE_VIEWPORT_TOP=1
|
||||||
|
VITE_VIEWPORT_BOTTOM=1
|
||||||
|
VITE_INVERT_FILTER=false
|
||||||
24
template/showcase/.gitignore
vendored
Normal file
24
template/showcase/.gitignore
vendored
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
*.local
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.vscode/*
|
||||||
|
!.vscode/extensions.json
|
||||||
|
.idea
|
||||||
|
.DS_Store
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
14
template/showcase/index.html
Normal file
14
template/showcase/index.html
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1,maximum-scale=1,user-scalable=no">
|
||||||
|
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<title>aklive2d</title>
|
||||||
|
</head>
|
||||||
|
<body style="background-image: url('./operator_bg.png');">
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.jsx"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
8
template/showcase/jsconfig.json
Normal file
8
template/showcase/jsconfig.json
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["src/*"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
18
template/showcase/package.json
Normal file
18
template/showcase/package.json
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
{
|
||||||
|
"name": "showcase",
|
||||||
|
"private": true,
|
||||||
|
"version": "0.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"preact": "^10.11.3"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@preact/preset-vite": "^2.4.0",
|
||||||
|
"vite": "^4.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
871
template/showcase/pnpm-lock.yaml
generated
Normal file
871
template/showcase/pnpm-lock.yaml
generated
Normal file
@@ -0,0 +1,871 @@
|
|||||||
|
lockfileVersion: 5.4
|
||||||
|
|
||||||
|
specifiers:
|
||||||
|
'@preact/preset-vite': ^2.4.0
|
||||||
|
preact: ^10.11.3
|
||||||
|
vite: ^4.0.0
|
||||||
|
|
||||||
|
dependencies:
|
||||||
|
preact: 10.11.3
|
||||||
|
|
||||||
|
devDependencies:
|
||||||
|
'@preact/preset-vite': 2.5.0_6lv424qzfa5w4k4pp4rg6latw4
|
||||||
|
vite: 4.0.4
|
||||||
|
|
||||||
|
packages:
|
||||||
|
|
||||||
|
/@ampproject/remapping/2.2.0:
|
||||||
|
resolution: {integrity: sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
dependencies:
|
||||||
|
'@jridgewell/gen-mapping': 0.1.1
|
||||||
|
'@jridgewell/trace-mapping': 0.3.17
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/code-frame/7.18.6:
|
||||||
|
resolution: {integrity: sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/highlight': 7.18.6
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/compat-data/7.20.10:
|
||||||
|
resolution: {integrity: sha512-sEnuDPpOJR/fcafHMjpcpGN5M2jbUGUHwmuWKM/YdPzeEDJg8bgmbcWQFUfE32MQjti1koACvoPVsDe8Uq+idg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/core/7.20.7:
|
||||||
|
resolution: {integrity: sha512-t1ZjCluspe5DW24bn2Rr1CDb2v9rn/hROtg9a2tmd0+QYf4bsloYfLQzjG4qHPNMhWtKdGC33R5AxGR2Af2cBw==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@ampproject/remapping': 2.2.0
|
||||||
|
'@babel/code-frame': 7.18.6
|
||||||
|
'@babel/generator': 7.20.7
|
||||||
|
'@babel/helper-compilation-targets': 7.20.7_@babel+core@7.20.7
|
||||||
|
'@babel/helper-module-transforms': 7.20.11
|
||||||
|
'@babel/helpers': 7.20.7
|
||||||
|
'@babel/parser': 7.20.7
|
||||||
|
'@babel/template': 7.20.7
|
||||||
|
'@babel/traverse': 7.20.10
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
convert-source-map: 1.9.0
|
||||||
|
debug: 4.3.4
|
||||||
|
gensync: 1.0.0-beta.2
|
||||||
|
json5: 2.2.3
|
||||||
|
semver: 6.3.0
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/generator/7.20.7:
|
||||||
|
resolution: {integrity: sha512-7wqMOJq8doJMZmP4ApXTzLxSr7+oO2jroJURrVEp6XShrQUObV8Tq/D0NCcoYg2uHqUrjzO0zwBjoYzelxK+sw==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
'@jridgewell/gen-mapping': 0.3.2
|
||||||
|
jsesc: 2.5.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-annotate-as-pure/7.18.6:
|
||||||
|
resolution: {integrity: sha512-duORpUiYrEpzKIop6iNbjnwKLAKnJ47csTyRACyEmWj0QdUrm5aqNJGHSSEQSUAvNW0ojX0dOmK9dZduvkfeXA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-compilation-targets/7.20.7_@babel+core@7.20.7:
|
||||||
|
resolution: {integrity: sha512-4tGORmfQcrc+bvrjb5y3dG9Mx1IOZjsHqQVUz7XCNHO+iTmqxWnVg3KRygjGmpRLJGdQSKuvFinbIb0CnZwHAQ==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': ^7.0.0
|
||||||
|
dependencies:
|
||||||
|
'@babel/compat-data': 7.20.10
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@babel/helper-validator-option': 7.18.6
|
||||||
|
browserslist: 4.21.4
|
||||||
|
lru-cache: 5.1.1
|
||||||
|
semver: 6.3.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-environment-visitor/7.18.9:
|
||||||
|
resolution: {integrity: sha512-3r/aACDJ3fhQ/EVgFy0hpj8oHyHpQc+LPtJoY9SzTThAsStm4Ptegq92vqKoE3vD706ZVFWITnMnxucw+S9Ipg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-function-name/7.19.0:
|
||||||
|
resolution: {integrity: sha512-WAwHBINyrpqywkUH0nTnNgI5ina5TFn85HKS0pbPDfxFfhyR/aNQEn4hGi1P1JyT//I0t4OgXUlofzWILRvS5w==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/template': 7.20.7
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-hoist-variables/7.18.6:
|
||||||
|
resolution: {integrity: sha512-UlJQPkFqFULIcyW5sbzgbkxn2FKRgwWiRexcuaR8RNJRy8+LLveqPjwZV/bwrLZCN0eUHD/x8D0heK1ozuoo6Q==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-module-imports/7.18.6:
|
||||||
|
resolution: {integrity: sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-module-transforms/7.20.11:
|
||||||
|
resolution: {integrity: sha512-uRy78kN4psmji1s2QtbtcCSaj/LILFDp0f/ymhpQH5QY3nljUZCaNWz9X1dEj/8MBdBEFECs7yRhKn8i7NjZgg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/helper-environment-visitor': 7.18.9
|
||||||
|
'@babel/helper-module-imports': 7.18.6
|
||||||
|
'@babel/helper-simple-access': 7.20.2
|
||||||
|
'@babel/helper-split-export-declaration': 7.18.6
|
||||||
|
'@babel/helper-validator-identifier': 7.19.1
|
||||||
|
'@babel/template': 7.20.7
|
||||||
|
'@babel/traverse': 7.20.10
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-plugin-utils/7.20.2:
|
||||||
|
resolution: {integrity: sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-simple-access/7.20.2:
|
||||||
|
resolution: {integrity: sha512-+0woI/WPq59IrqDYbVGfshjT5Dmk/nnbdpcF8SnMhhXObpTq2KNBdLFRFrkVdbDOyUmHBCxzm5FHV1rACIkIbA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-split-export-declaration/7.18.6:
|
||||||
|
resolution: {integrity: sha512-bde1etTx6ZyTmobl9LLMMQsaizFVZrquTEHOqKeQESMKo4PlObf+8+JA25ZsIpZhT/WEd39+vOdLXAFG/nELpA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-string-parser/7.19.4:
|
||||||
|
resolution: {integrity: sha512-nHtDoQcuqFmwYNYPz3Rah5ph2p8PFeFCsZk9A/48dPc/rGocJ5J3hAAZ7pb76VWX3fZKu+uEr/FhH5jLx7umrw==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-validator-identifier/7.19.1:
|
||||||
|
resolution: {integrity: sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helper-validator-option/7.18.6:
|
||||||
|
resolution: {integrity: sha512-XO7gESt5ouv/LRJdrVjkShckw6STTaB7l9BrpBaAHDeF5YZT+01PCwmR0SJHnkW6i8OwW/EVWRShfi4j2x+KQw==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/helpers/7.20.7:
|
||||||
|
resolution: {integrity: sha512-PBPjs5BppzsGaxHQCDKnZ6Gd9s6xl8bBCluz3vEInLGRJmnZan4F6BYCeqtyXqkk4W5IlPmjK4JlOuZkpJ3xZA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/template': 7.20.7
|
||||||
|
'@babel/traverse': 7.20.10
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/highlight/7.18.6:
|
||||||
|
resolution: {integrity: sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/helper-validator-identifier': 7.19.1
|
||||||
|
chalk: 2.4.2
|
||||||
|
js-tokens: 4.0.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/parser/7.20.7:
|
||||||
|
resolution: {integrity: sha512-T3Z9oHybU+0vZlY9CiDSJQTD5ZapcW18ZctFMi0MOAl/4BjFF4ul7NVSARLdbGO5vDqy9eQiGTV0LtKfvCYvcg==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
hasBin: true
|
||||||
|
dependencies:
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/plugin-syntax-jsx/7.18.6_@babel+core@7.20.7:
|
||||||
|
resolution: {integrity: sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': ^7.0.0-0
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@babel/helper-plugin-utils': 7.20.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/plugin-transform-react-jsx-development/7.18.6_@babel+core@7.20.7:
|
||||||
|
resolution: {integrity: sha512-SA6HEjwYFKF7WDjWcMcMGUimmw/nhNRDWxr+KaLSCrkD/LMDBvWRmHAYgE1HDeF8KUuI8OAu+RT6EOtKxSW2qA==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': ^7.0.0-0
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@babel/plugin-transform-react-jsx': 7.20.7_@babel+core@7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/plugin-transform-react-jsx/7.20.7_@babel+core@7.20.7:
|
||||||
|
resolution: {integrity: sha512-Tfq7qqD+tRj3EoDhY00nn2uP2hsRxgYGi5mLQ5TimKav0a9Lrpd4deE+fcLXU8zFYRjlKPHZhpCvfEA6qnBxqQ==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': ^7.0.0-0
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@babel/helper-annotate-as-pure': 7.18.6
|
||||||
|
'@babel/helper-module-imports': 7.18.6
|
||||||
|
'@babel/helper-plugin-utils': 7.20.2
|
||||||
|
'@babel/plugin-syntax-jsx': 7.18.6_@babel+core@7.20.7
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/template/7.20.7:
|
||||||
|
resolution: {integrity: sha512-8SegXApWe6VoNw0r9JHpSteLKTpTiLZ4rMlGIm9JQ18KiCtyQiAMEazujAHrUS5flrcqYZa75ukev3P6QmUwUw==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/code-frame': 7.18.6
|
||||||
|
'@babel/parser': 7.20.7
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/traverse/7.20.10:
|
||||||
|
resolution: {integrity: sha512-oSf1juCgymrSez8NI4A2sr4+uB/mFd9MXplYGPEBnfAuWmmyeVcHa6xLPiaRBcXkcb/28bgxmQLTVwFKE1yfsg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/code-frame': 7.18.6
|
||||||
|
'@babel/generator': 7.20.7
|
||||||
|
'@babel/helper-environment-visitor': 7.18.9
|
||||||
|
'@babel/helper-function-name': 7.19.0
|
||||||
|
'@babel/helper-hoist-variables': 7.18.6
|
||||||
|
'@babel/helper-split-export-declaration': 7.18.6
|
||||||
|
'@babel/parser': 7.20.7
|
||||||
|
'@babel/types': 7.20.7
|
||||||
|
debug: 4.3.4
|
||||||
|
globals: 11.12.0
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@babel/types/7.20.7:
|
||||||
|
resolution: {integrity: sha512-69OnhBxSSgK0OzTJai4kyPDiKTIe3j+ctaHdIGVbRahTLAT7L3R9oeXHC2aVSuGYt3cVnoAMDmOCgJ2yaiLMvg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dependencies:
|
||||||
|
'@babel/helper-string-parser': 7.19.4
|
||||||
|
'@babel/helper-validator-identifier': 7.19.1
|
||||||
|
to-fast-properties: 2.0.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@esbuild/android-arm/0.16.13:
|
||||||
|
resolution: {integrity: sha512-JmtqThupn9Yf+FzANE+GG73ASUkssnPwOsndUElhp23685QzRK+MO1UompOlBaXV9D5FTuYcPnw7p4mCq2YbZQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/android-arm64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-r4xetsd1ez1NF9/9R2f9Q6AlxqiZLwUqo7ICOcvEVwopVkXUcspIjEbJk0EVTgT6Cp5+ymzGPT6YNV0ievx4yA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/android-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-hKt1bFht/Vtp0xJ0ZVzFMnPy1y1ycmM3KNnp3zsyZfQmw7nhs2WLO4vxdR5YG+6RsHKCb2zbZ3VwlC0Tij0qyA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/darwin-arm64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-ogrVuNi2URocrr3Ps20f075EMm9V7IeenOi9FRj4qdbT6mQlwLuP4l90PW2iBrKERx0oRkcZprEUNsz/3xd7ww==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [darwin]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/darwin-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-Agajik9SBGiKD7FPXE+ExW6x3MgA/dUdpZnXa9y1tyfE4lKQx+eQiknSdrBnWPeqa9wL0AOvkhghmYhpVkyqkA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [darwin]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/freebsd-arm64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-KxMO3/XihBcHM+xQUM6nQZO1SgQuOsd1DCnKF1a4SIf/i5VD45vrqN3k8ePgFrEbMi7m5JeGmvNqwJXinF0a4Q==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [freebsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/freebsd-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-Ez15oqV1vwvZ30cVLeBW14BsWq/fdWNQGMOxxqaSJVQVLqHhvgfQ7gxGDiN9tpJdeQhqJO+Q0r02/Tce5+USNg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [freebsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-arm/0.16.13:
|
||||||
|
resolution: {integrity: sha512-18dLd2L3mda+iFj6sswyBMSh2UwniamD9M4DwPv8VM+9apRFlQ5IGKxBdumnTuOI4NvwwAernmUseWhYQ9k+rg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-arm64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-qi5n7KwcGViyJeZeQnu8fB6dC3Mlm5PGaqSv2HhQDDx/MPvVfQGNMcv7zcBL4qk3FkuWhGVwXkjQ76x7R0PWlA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-ia32/0.16.13:
|
||||||
|
resolution: {integrity: sha512-2489Xad9sr+6GD7nB913fUqpCsSwVwgskkQTq4Or2mZntSPYPebyJm8l1YruHo7oqYMTGV6RiwGE4gRo3H+EPQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ia32]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-loong64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-x8KplRu9Y43Px8I9YS+sPBwQ+fw44Mvp2BPVADopKDWz+h3fcj1BvRU58kxb89WObmwKX9sWdtYzepL4Fmx03A==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [loong64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-mips64el/0.16.13:
|
||||||
|
resolution: {integrity: sha512-qhhdWph9FLwD9rVVC/nUf7k2U4NZIA6/mGx0B7+O6PFV0GjmPA2E3zDQ4NUjq9P26E0DeAZy9akH9dYcUBRU7A==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [mips64el]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-ppc64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-cVWAPKsrRVxI1jCeJHnYSbE3BrEU+pZTZK2gfao9HRxuc+3m4+RLfs3EVEpGLmMKEcWfVCB9wZ3yNxnknutGKQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ppc64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-riscv64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-Agb7dbRyZWnmPn5Vvf0eyqaEUqSsaIUwwyInu2EoFTaIDRp093QU2M5alUyOooMLkRbD1WvqQNwx08Z/g+SAcQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [riscv64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-s390x/0.16.13:
|
||||||
|
resolution: {integrity: sha512-AqRBIrc/+kl08ahliNG+EyU+j41wIzQfwBTKpi80cCDiYvYFPuXjvzZsD9muiu58Isj0RVni9VgC4xK/AnSW4g==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [s390x]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-S4wn2BimuhPcoArRtVrdHUKIymCCZcYAXQE47kUiX4yrUrEX2/ifn5eKNbZ5c1jJKUlh1gC2ESIN+iw3wQax3g==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/netbsd-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-2c8JWgfUMlQHTdaR5X3xNMwqOyad8kgeCupuVkdm3QkUOzGREjlTETQsK6oHifocYzDCo9FeKcUwsK356SdR+g==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [netbsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/openbsd-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-Bwh+PmKD/LK+xBjqIpnYnKYj0fIyQJ0YpRxsn0F+WfzvQ2OA+GKDlf8AHosiCns26Q4Dje388jQVwfOBZ1GaFw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [openbsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/sunos-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-8wwk6f9XGnhrF94/DBdFM4Xm1JeCyGTCj67r516VS9yvBVQf3Rar54L+XPVDs/oZOokwH+XsktrgkuTMAmjntg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [sunos]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-arm64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-Jmwbp/5ArLCiRAHC33ODfcrlIcbP/exXkOEUVkADNJC4e/so2jm+i8IQFvVX/lA2GWvK3GdgcN0VFfp9YITAbg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-ia32/0.16.13:
|
||||||
|
resolution: {integrity: sha512-AX6WjntGjhJHzrPSVvjMD7grxt41koHfAOx6lxLorrpDwwIKKPaGDASPZgvFIZHTbwhOtILW6vAXxYPDsKpDJA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ia32]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-x64/0.16.13:
|
||||||
|
resolution: {integrity: sha512-A+U4gM6OOkPS03UgVU08GTpAAAxPsP/8Z4FmneGo4TaVSD99bK9gVJXlqUEPMO/htFXEAht2O6pX4ErtLY5tVg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@jridgewell/gen-mapping/0.1.1:
|
||||||
|
resolution: {integrity: sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
dependencies:
|
||||||
|
'@jridgewell/set-array': 1.1.2
|
||||||
|
'@jridgewell/sourcemap-codec': 1.4.14
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@jridgewell/gen-mapping/0.3.2:
|
||||||
|
resolution: {integrity: sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
dependencies:
|
||||||
|
'@jridgewell/set-array': 1.1.2
|
||||||
|
'@jridgewell/sourcemap-codec': 1.4.14
|
||||||
|
'@jridgewell/trace-mapping': 0.3.17
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@jridgewell/resolve-uri/3.1.0:
|
||||||
|
resolution: {integrity: sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@jridgewell/set-array/1.1.2:
|
||||||
|
resolution: {integrity: sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==}
|
||||||
|
engines: {node: '>=6.0.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@jridgewell/sourcemap-codec/1.4.14:
|
||||||
|
resolution: {integrity: sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@jridgewell/trace-mapping/0.3.17:
|
||||||
|
resolution: {integrity: sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==}
|
||||||
|
dependencies:
|
||||||
|
'@jridgewell/resolve-uri': 3.1.0
|
||||||
|
'@jridgewell/sourcemap-codec': 1.4.14
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@preact/preset-vite/2.5.0_6lv424qzfa5w4k4pp4rg6latw4:
|
||||||
|
resolution: {integrity: sha512-BUhfB2xQ6ex0yPkrT1Z3LbfPzjpJecOZwQ/xJrXGFSZD84+ObyS//41RdEoQCMWsM0t7UHGaujUxUBub7WM1Jw==}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': 7.x
|
||||||
|
vite: 2.x || 3.x || 4.x
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@babel/plugin-transform-react-jsx': 7.20.7_@babel+core@7.20.7
|
||||||
|
'@babel/plugin-transform-react-jsx-development': 7.18.6_@babel+core@7.20.7
|
||||||
|
'@prefresh/vite': 2.2.9_preact@10.11.3+vite@4.0.4
|
||||||
|
'@rollup/pluginutils': 4.2.1
|
||||||
|
babel-plugin-transform-hook-names: 1.0.2_@babel+core@7.20.7
|
||||||
|
debug: 4.3.4
|
||||||
|
kolorist: 1.6.0
|
||||||
|
resolve: 1.22.1
|
||||||
|
vite: 4.0.4
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- preact
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@prefresh/babel-plugin/0.4.4:
|
||||||
|
resolution: {integrity: sha512-/EvgIFMDL+nd20WNvMO0JQnzIl1EJPgmSaSYrZUww7A+aSdKsi37aL07TljrZR1cBMuzFxcr4xvqsUQLFJEukw==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@prefresh/core/1.4.1_preact@10.11.3:
|
||||||
|
resolution: {integrity: sha512-og1vaBj3LMJagVncNrDb37Gqc0cWaUcDbpVt5hZtsN4i2Iwzd/5hyTsDHvlMirhSym3wL9ihU0Xa2VhSaOue7g==}
|
||||||
|
peerDependencies:
|
||||||
|
preact: ^10.0.0
|
||||||
|
dependencies:
|
||||||
|
preact: 10.11.3
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@prefresh/utils/1.1.3:
|
||||||
|
resolution: {integrity: sha512-Mb9abhJTOV4yCfkXrMrcgFiFT7MfNOw8sDa+XyZBdq/Ai2p4Zyxqsb3EgHLOEdHpMj6J9aiZ54W8H6FTam1u+A==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@prefresh/vite/2.2.9_preact@10.11.3+vite@4.0.4:
|
||||||
|
resolution: {integrity: sha512-1ERBF85Ja9/lkrfaltmo4Gca7R2ClQPSHHDDysFgfvPzHmLUeyB0x9WHwhwov/AA1DnyPhsfYT54z3yQd8XrgA==}
|
||||||
|
peerDependencies:
|
||||||
|
preact: ^10.4.0
|
||||||
|
vite: '>=2.0.0-beta.3'
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
'@prefresh/babel-plugin': 0.4.4
|
||||||
|
'@prefresh/core': 1.4.1_preact@10.11.3
|
||||||
|
'@prefresh/utils': 1.1.3
|
||||||
|
'@rollup/pluginutils': 4.2.1
|
||||||
|
preact: 10.11.3
|
||||||
|
vite: 4.0.4
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/@rollup/pluginutils/4.2.1:
|
||||||
|
resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
|
||||||
|
engines: {node: '>= 8.0.0'}
|
||||||
|
dependencies:
|
||||||
|
estree-walker: 2.0.2
|
||||||
|
picomatch: 2.3.1
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/ansi-styles/3.2.1:
|
||||||
|
resolution: {integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dependencies:
|
||||||
|
color-convert: 1.9.3
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/babel-plugin-transform-hook-names/1.0.2_@babel+core@7.20.7:
|
||||||
|
resolution: {integrity: sha512-5gafyjyyBTTdX/tQQ0hRgu4AhNHG/hqWi0ZZmg2xvs2FgRkJXzDNKBZCyoYqgFkovfDrgM8OoKg8karoUvWeCw==}
|
||||||
|
peerDependencies:
|
||||||
|
'@babel/core': ^7.12.10
|
||||||
|
dependencies:
|
||||||
|
'@babel/core': 7.20.7
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/browserslist/4.21.4:
|
||||||
|
resolution: {integrity: sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==}
|
||||||
|
engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
|
||||||
|
hasBin: true
|
||||||
|
dependencies:
|
||||||
|
caniuse-lite: 1.0.30001441
|
||||||
|
electron-to-chromium: 1.4.284
|
||||||
|
node-releases: 2.0.8
|
||||||
|
update-browserslist-db: 1.0.10_browserslist@4.21.4
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/caniuse-lite/1.0.30001441:
|
||||||
|
resolution: {integrity: sha512-OyxRR4Vof59I3yGWXws6i908EtGbMzVUi3ganaZQHmydk1iwDhRnvaPG2WaR0KcqrDFKrxVZHULT396LEPhXfg==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/chalk/2.4.2:
|
||||||
|
resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dependencies:
|
||||||
|
ansi-styles: 3.2.1
|
||||||
|
escape-string-regexp: 1.0.5
|
||||||
|
supports-color: 5.5.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/color-convert/1.9.3:
|
||||||
|
resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
|
||||||
|
dependencies:
|
||||||
|
color-name: 1.1.3
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/color-name/1.1.3:
|
||||||
|
resolution: {integrity: sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/convert-source-map/1.9.0:
|
||||||
|
resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/debug/4.3.4:
|
||||||
|
resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
|
||||||
|
engines: {node: '>=6.0'}
|
||||||
|
peerDependencies:
|
||||||
|
supports-color: '*'
|
||||||
|
peerDependenciesMeta:
|
||||||
|
supports-color:
|
||||||
|
optional: true
|
||||||
|
dependencies:
|
||||||
|
ms: 2.1.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/electron-to-chromium/1.4.284:
|
||||||
|
resolution: {integrity: sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/esbuild/0.16.13:
|
||||||
|
resolution: {integrity: sha512-oYwFdSEIoKM1oYzyem1osgKJAvg5447XF+05ava21fOtilyb2HeQQh26/74K4WeAk5dZmj/Mx10zUqUnI14jhA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
hasBin: true
|
||||||
|
requiresBuild: true
|
||||||
|
optionalDependencies:
|
||||||
|
'@esbuild/android-arm': 0.16.13
|
||||||
|
'@esbuild/android-arm64': 0.16.13
|
||||||
|
'@esbuild/android-x64': 0.16.13
|
||||||
|
'@esbuild/darwin-arm64': 0.16.13
|
||||||
|
'@esbuild/darwin-x64': 0.16.13
|
||||||
|
'@esbuild/freebsd-arm64': 0.16.13
|
||||||
|
'@esbuild/freebsd-x64': 0.16.13
|
||||||
|
'@esbuild/linux-arm': 0.16.13
|
||||||
|
'@esbuild/linux-arm64': 0.16.13
|
||||||
|
'@esbuild/linux-ia32': 0.16.13
|
||||||
|
'@esbuild/linux-loong64': 0.16.13
|
||||||
|
'@esbuild/linux-mips64el': 0.16.13
|
||||||
|
'@esbuild/linux-ppc64': 0.16.13
|
||||||
|
'@esbuild/linux-riscv64': 0.16.13
|
||||||
|
'@esbuild/linux-s390x': 0.16.13
|
||||||
|
'@esbuild/linux-x64': 0.16.13
|
||||||
|
'@esbuild/netbsd-x64': 0.16.13
|
||||||
|
'@esbuild/openbsd-x64': 0.16.13
|
||||||
|
'@esbuild/sunos-x64': 0.16.13
|
||||||
|
'@esbuild/win32-arm64': 0.16.13
|
||||||
|
'@esbuild/win32-ia32': 0.16.13
|
||||||
|
'@esbuild/win32-x64': 0.16.13
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/escalade/3.1.1:
|
||||||
|
resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
|
||||||
|
engines: {node: '>=6'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/escape-string-regexp/1.0.5:
|
||||||
|
resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
|
||||||
|
engines: {node: '>=0.8.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/estree-walker/2.0.2:
|
||||||
|
resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/fsevents/2.3.2:
|
||||||
|
resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
|
||||||
|
engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
|
||||||
|
os: [darwin]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/function-bind/1.1.1:
|
||||||
|
resolution: {integrity: sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/gensync/1.0.0-beta.2:
|
||||||
|
resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==}
|
||||||
|
engines: {node: '>=6.9.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/globals/11.12.0:
|
||||||
|
resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/has-flag/3.0.0:
|
||||||
|
resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/has/1.0.3:
|
||||||
|
resolution: {integrity: sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==}
|
||||||
|
engines: {node: '>= 0.4.0'}
|
||||||
|
dependencies:
|
||||||
|
function-bind: 1.1.1
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/is-core-module/2.11.0:
|
||||||
|
resolution: {integrity: sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==}
|
||||||
|
dependencies:
|
||||||
|
has: 1.0.3
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/js-tokens/4.0.0:
|
||||||
|
resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/jsesc/2.5.2:
|
||||||
|
resolution: {integrity: sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
hasBin: true
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/json5/2.2.3:
|
||||||
|
resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
|
||||||
|
engines: {node: '>=6'}
|
||||||
|
hasBin: true
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/kolorist/1.6.0:
|
||||||
|
resolution: {integrity: sha512-dLkz37Ab97HWMx9KTes3Tbi3D1ln9fCAy2zr2YVExJasDRPGRaKcoE4fycWNtnCAJfjFqe0cnY+f8KT2JePEXQ==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/lru-cache/5.1.1:
|
||||||
|
resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
|
||||||
|
dependencies:
|
||||||
|
yallist: 3.1.1
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/ms/2.1.2:
|
||||||
|
resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/nanoid/3.3.4:
|
||||||
|
resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==}
|
||||||
|
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
|
||||||
|
hasBin: true
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/node-releases/2.0.8:
|
||||||
|
resolution: {integrity: sha512-dFSmB8fFHEH/s81Xi+Y/15DQY6VHW81nXRj86EMSL3lmuTmK1e+aT4wrFCkTbm+gSwkw4KpX+rT/pMM2c1mF+A==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/path-parse/1.0.7:
|
||||||
|
resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/picocolors/1.0.0:
|
||||||
|
resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/picomatch/2.3.1:
|
||||||
|
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
|
||||||
|
engines: {node: '>=8.6'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/postcss/8.4.20:
|
||||||
|
resolution: {integrity: sha512-6Q04AXR1212bXr5fh03u8aAwbLxAQNGQ/Q1LNa0VfOI06ZAlhPHtQvE4OIdpj4kLThXilalPnmDSOD65DcHt+g==}
|
||||||
|
engines: {node: ^10 || ^12 || >=14}
|
||||||
|
dependencies:
|
||||||
|
nanoid: 3.3.4
|
||||||
|
picocolors: 1.0.0
|
||||||
|
source-map-js: 1.0.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/preact/10.11.3:
|
||||||
|
resolution: {integrity: sha512-eY93IVpod/zG3uMF22Unl8h9KkrcKIRs2EGar8hwLZZDU1lkjph303V9HZBwufh2s736U6VXuhD109LYqPoffg==}
|
||||||
|
|
||||||
|
/resolve/1.22.1:
|
||||||
|
resolution: {integrity: sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==}
|
||||||
|
hasBin: true
|
||||||
|
dependencies:
|
||||||
|
is-core-module: 2.11.0
|
||||||
|
path-parse: 1.0.7
|
||||||
|
supports-preserve-symlinks-flag: 1.0.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/rollup/3.9.1:
|
||||||
|
resolution: {integrity: sha512-GswCYHXftN8ZKGVgQhTFUJB/NBXxrRGgO2NCy6E8s1rwEJ4Q9/VttNqcYfEvx4dTo4j58YqdC3OVztPzlKSX8w==}
|
||||||
|
engines: {node: '>=14.18.0', npm: '>=8.0.0'}
|
||||||
|
hasBin: true
|
||||||
|
optionalDependencies:
|
||||||
|
fsevents: 2.3.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/semver/6.3.0:
|
||||||
|
resolution: {integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==}
|
||||||
|
hasBin: true
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/source-map-js/1.0.2:
|
||||||
|
resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
|
||||||
|
engines: {node: '>=0.10.0'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/supports-color/5.5.0:
|
||||||
|
resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dependencies:
|
||||||
|
has-flag: 3.0.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/supports-preserve-symlinks-flag/1.0.0:
|
||||||
|
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
|
||||||
|
engines: {node: '>= 0.4'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/to-fast-properties/2.0.0:
|
||||||
|
resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
|
||||||
|
engines: {node: '>=4'}
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/update-browserslist-db/1.0.10_browserslist@4.21.4:
|
||||||
|
resolution: {integrity: sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==}
|
||||||
|
hasBin: true
|
||||||
|
peerDependencies:
|
||||||
|
browserslist: '>= 4.21.0'
|
||||||
|
dependencies:
|
||||||
|
browserslist: 4.21.4
|
||||||
|
escalade: 3.1.1
|
||||||
|
picocolors: 1.0.0
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/vite/4.0.4:
|
||||||
|
resolution: {integrity: sha512-xevPU7M8FU0i/80DMR+YhgrzR5KS2ORy1B4xcX/cXLsvnUWvfHuqMmVU6N0YiJ4JWGRJJsLCgjEzKjG9/GKoSw==}
|
||||||
|
engines: {node: ^14.18.0 || >=16.0.0}
|
||||||
|
hasBin: true
|
||||||
|
peerDependencies:
|
||||||
|
'@types/node': '>= 14'
|
||||||
|
less: '*'
|
||||||
|
sass: '*'
|
||||||
|
stylus: '*'
|
||||||
|
sugarss: '*'
|
||||||
|
terser: ^5.4.0
|
||||||
|
peerDependenciesMeta:
|
||||||
|
'@types/node':
|
||||||
|
optional: true
|
||||||
|
less:
|
||||||
|
optional: true
|
||||||
|
sass:
|
||||||
|
optional: true
|
||||||
|
stylus:
|
||||||
|
optional: true
|
||||||
|
sugarss:
|
||||||
|
optional: true
|
||||||
|
terser:
|
||||||
|
optional: true
|
||||||
|
dependencies:
|
||||||
|
esbuild: 0.16.13
|
||||||
|
postcss: 8.4.20
|
||||||
|
resolve: 1.22.1
|
||||||
|
rollup: 3.9.1
|
||||||
|
optionalDependencies:
|
||||||
|
fsevents: 2.3.2
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/yallist/3.1.1:
|
||||||
|
resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
|
||||||
|
dev: true
|
||||||
BIN
template/showcase/public/operator_bg.png
Normal file
BIN
template/showcase/public/operator_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
18
template/showcase/src/app.css
Normal file
18
template/showcase/src/app.css
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
#widget-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invert-filter {
|
||||||
|
filter: invert(1);
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
47
template/showcase/src/app.jsx
Normal file
47
template/showcase/src/app.jsx
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
import { useState, useEffect, useRef } from 'preact/hooks'
|
||||||
|
import '@/app.css'
|
||||||
|
import '@/libs/wallpaper_engine'
|
||||||
|
import logo from 'logo'
|
||||||
|
import check_web_gl from '@/libs/check_web_gl'
|
||||||
|
import Player from '@/components/player'
|
||||||
|
import Fallback from '@/components/fallback'
|
||||||
|
import Settings from '@/components/settings'
|
||||||
|
|
||||||
|
export function App() {
|
||||||
|
const params = new URLSearchParams(window.location.search);
|
||||||
|
const isSupportWebGL = check_web_gl()
|
||||||
|
const logoRef = useRef(null);
|
||||||
|
const [spinePlayer, setSpinePlayer] = useState(null);
|
||||||
|
|
||||||
|
const [showControls, setShowControls] = useState(params.has("controls"));
|
||||||
|
const [showSettings, setShowSettings] = useState(params.has("settings"));
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
document.title = import.meta.env.VITE_TITLE
|
||||||
|
console.log("All resources are extracted from Arknights. Github: https://github.com/Halyul/aklive2d")
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<img src={logo} class="logo invert-filter" id="logo" alt="operator logo" ref={logoRef} width={16} />
|
||||||
|
<Settings
|
||||||
|
spinePlayer={spinePlayer}
|
||||||
|
setShowSettings={setShowSettings}
|
||||||
|
hidden={!showSettings}
|
||||||
|
logoEl={logoRef.current}
|
||||||
|
/>
|
||||||
|
<div id="widget-wrapper">
|
||||||
|
{
|
||||||
|
!isSupportWebGL ? (
|
||||||
|
<Fallback />
|
||||||
|
) : (
|
||||||
|
<Player
|
||||||
|
showControls={showControls}
|
||||||
|
setSpinePlayer={setSpinePlayer}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
1
template/showcase/src/assets/assets.json
Normal file
1
template/showcase/src/assets/assets.json
Normal file
File diff suppressed because one or more lines are too long
BIN
template/showcase/src/assets/char_1013_chen2_2.png
Normal file
BIN
template/showcase/src/assets/char_1013_chen2_2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
BIN
template/showcase/src/assets/fallback.png
Normal file
BIN
template/showcase/src/assets/fallback.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
BIN
template/showcase/src/assets/logo_rhodes_override.png
Normal file
BIN
template/showcase/src/assets/logo_rhodes_override.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
8
template/showcase/src/components/fallback.css
Normal file
8
template/showcase/src/components/fallback.css
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
#fallback {
|
||||||
|
margin: auto;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
31
template/showcase/src/components/fallback.jsx
Normal file
31
template/showcase/src/components/fallback.jsx
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
import { useRef, useEffect } from 'preact/hooks'
|
||||||
|
import fallback from 'fallback'
|
||||||
|
import '@/components/fallback.css'
|
||||||
|
|
||||||
|
export default function Fallback() {
|
||||||
|
const fallbackRef = useRef(null)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
alert('WebGL is unavailable. Fallback image will be used.');
|
||||||
|
const calculateScale = (width, height) => {
|
||||||
|
return { x: window.innerWidth / width, y: window.innerHeight / height };
|
||||||
|
}
|
||||||
|
const fallback = () => {
|
||||||
|
const scale = calculateScale(2048, 2048);
|
||||||
|
fallbackRef.current.style.width = 2048 * (scale.x > scale.y ? scale.y : scale.x) + "px";
|
||||||
|
fallbackRef.current.style.height = 2048 * (scale.x > scale.y ? scale.y : scale.x) + "px";
|
||||||
|
}
|
||||||
|
fallback();
|
||||||
|
window.addEventListener('resize', fallback, true);
|
||||||
|
return () => window.removeEventListener('resize', fallback, true);
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div id="fallback"
|
||||||
|
style={{
|
||||||
|
backgroundImage: `url(${fallback})`,
|
||||||
|
}}
|
||||||
|
ref={fallbackRef}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
4
template/showcase/src/components/player.css
Normal file
4
template/showcase/src/components/player.css
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
#container {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
69
template/showcase/src/components/player.jsx
Normal file
69
template/showcase/src/components/player.jsx
Normal file
@@ -0,0 +1,69 @@
|
|||||||
|
import { useRef, useEffect } from 'preact/hooks'
|
||||||
|
import '@/libs/spine-player.css'
|
||||||
|
import spine from '@/libs/spine-player'
|
||||||
|
import assets from '@/assets/assets.json'
|
||||||
|
import '@/components/player.css'
|
||||||
|
|
||||||
|
export default function Player({ showControls, setSpinePlayer }) {
|
||||||
|
const spineRef = useRef(null)
|
||||||
|
let resetTime = window.performance.now();
|
||||||
|
let isPlayingInteract = false;
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
document.title = "Operator name";
|
||||||
|
if (spineRef.current?.children.length == 0) {
|
||||||
|
setSpinePlayer(new spine.SpinePlayer(spineRef.current, {
|
||||||
|
skelUrl: `./assets/${import.meta.env.VITE_FILENAME}.skel`,
|
||||||
|
atlasUrl: `./assets/${import.meta.env.VITE_FILENAME}.atlas`,
|
||||||
|
rawDataURIs: assets,
|
||||||
|
animation: "Idle",
|
||||||
|
premultipliedAlpha: true,
|
||||||
|
alpha: true,
|
||||||
|
backgroundColor: "#00000000",
|
||||||
|
viewport: {
|
||||||
|
debugRender: false,
|
||||||
|
padLeft: `${import.meta.env.VITE_VIEWPORT_LEFT}%`,
|
||||||
|
padRight: `${import.meta.env.VITE_VIEWPORT_RIGHT}%`,
|
||||||
|
padTop: `${import.meta.env.VITE_VIEWPORT_TOP}%`,
|
||||||
|
padBottom: `${import.meta.env.VITE_VIEWPORT_BOTTOM}%`,
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
},
|
||||||
|
showControls: showControls,
|
||||||
|
touch: showControls,
|
||||||
|
fps: 60,
|
||||||
|
defaultMix: 0,
|
||||||
|
success: function (widget) {
|
||||||
|
widget.animationState.addListener({
|
||||||
|
end: (e) => {
|
||||||
|
if (e.animation.name == "Interact") {
|
||||||
|
isPlayingInteract = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
complete: (e) => {
|
||||||
|
if (window.performance.now() - resetTime >= 8 * 1000 && Math.random() < 0.3) {
|
||||||
|
resetTime = window.performance.now();
|
||||||
|
let entry = widget.animationState.setAnimation(0, "Special", false, 0);
|
||||||
|
entry.mixDuration = 0.8;
|
||||||
|
widget.animationState.addAnimation(0, "Idle", true, 0);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
widget.canvas.onclick = function () {
|
||||||
|
if (isPlayingInteract) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
isPlayingInteract = true;
|
||||||
|
let entry = widget.animationState.setAnimation(0, "Interact", false, 0);
|
||||||
|
entry.mixDuration = 0.8;
|
||||||
|
widget.animationState.addAnimation(0, "Idle", true, 0);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div id="container" ref={spineRef}></div>
|
||||||
|
)
|
||||||
|
}
|
||||||
8
template/showcase/src/components/settings.css
Normal file
8
template/showcase/src/components/settings.css
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
.website-settings {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
background-color: white;
|
||||||
|
user-select: auto;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
280
template/showcase/src/components/settings.jsx
Normal file
280
template/showcase/src/components/settings.jsx
Normal file
@@ -0,0 +1,280 @@
|
|||||||
|
import { useState, useEffect } from 'preact/hooks'
|
||||||
|
import '@/components/settings.css'
|
||||||
|
import { subscribe, unsubscribe, publish } from '@/libs/events'
|
||||||
|
|
||||||
|
const getPercentage = (value) => parseInt(value.replace("%", ""))
|
||||||
|
const defaultBackgroundImage = getComputedStyle(document.body).backgroundImage
|
||||||
|
|
||||||
|
export default function Settings({
|
||||||
|
spinePlayer, setShowSettings, hidden, logoEl
|
||||||
|
}) {
|
||||||
|
const defaultFps = 60
|
||||||
|
const defaultRatio = 61.8
|
||||||
|
const defaultOpacity = import.meta.env.VITE_OPACITY
|
||||||
|
const defaultShowLogo = false
|
||||||
|
const defaultInvertFilter = import.meta.env.VITE_INVERT_FILTER === "true"
|
||||||
|
const [defaultLogoImage, setDefaultLogoImage] = useState(null)
|
||||||
|
const defaultPadLeft = getPercentage(`${import.meta.env.VITE_VIEWPORT_LEFT}%`)
|
||||||
|
const defaultPadRight = getPercentage(`${import.meta.env.VITE_VIEWPORT_RIGHT}%`)
|
||||||
|
const defaultPadTop = getPercentage(`${import.meta.env.VITE_VIEWPORT_TOP}%`)
|
||||||
|
const defaultPadBottom = getPercentage(`${import.meta.env.VITE_VIEWPORT_BOTTOM}%`)
|
||||||
|
const defaultViewport = {
|
||||||
|
debugRender: false,
|
||||||
|
padLeft: `${defaultPadLeft}%`,
|
||||||
|
padRight: `${defaultPadRight}%`,
|
||||||
|
padTop: `${defaultPadTop}%`,
|
||||||
|
padBottom: `${defaultPadBottom}%`,
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
}
|
||||||
|
|
||||||
|
const [fps, setFps] = useState(defaultFps)
|
||||||
|
const [ratio, setRatio] = useState(defaultRatio)
|
||||||
|
const [opacity, setOpacity] = useState(defaultOpacity)
|
||||||
|
const [padLeft, setPadLeft] = useState(defaultPadLeft)
|
||||||
|
const [padRight, setPadRight] = useState(defaultPadRight)
|
||||||
|
const [padTop, setPadTop] = useState(defaultPadTop)
|
||||||
|
const [padBottom, setPadBottom] = useState(defaultPadBottom)
|
||||||
|
|
||||||
|
const [showLogo, setShowLogo] = useState(defaultShowLogo)
|
||||||
|
const [hidePositionSettings, setHidePositionSettings] = useState(true)
|
||||||
|
const [backgroundClearDisabled, setBackgroundClearDisabled] = useState(true)
|
||||||
|
const [logoClearDisabled, setLogoClearDisabled] = useState(true)
|
||||||
|
|
||||||
|
const [isPlaying, setIsPlaying] = useState(true)
|
||||||
|
|
||||||
|
const resize = (value) => {
|
||||||
|
logoEl.width = window.innerWidth / 2 * (value || ratio) / 100
|
||||||
|
}
|
||||||
|
|
||||||
|
const readFile = (e, onload, callback) => {
|
||||||
|
const file = e.target.files[0]
|
||||||
|
if (!file) return
|
||||||
|
const reader = new FileReader()
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
reader.onload = readerEvent => onload(readerEvent)
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
|
||||||
|
const setFPS = (value) => {
|
||||||
|
setFps(value)
|
||||||
|
spinePlayer.setFps(value)
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLogoDisplay = (flag) => {
|
||||||
|
setShowLogo(flag)
|
||||||
|
logoEl.hidden = flag;
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLogoImage = (e) => {
|
||||||
|
readFile(
|
||||||
|
e,
|
||||||
|
(readerEvent) => {
|
||||||
|
const content = readerEvent.target.result;
|
||||||
|
logoEl.src = content
|
||||||
|
resize()
|
||||||
|
setLogoInvertFilter(false)
|
||||||
|
},
|
||||||
|
() => setLogoClearDisabled(false)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetLogoImage = () => {
|
||||||
|
logoEl.src = defaultLogoImage
|
||||||
|
resize()
|
||||||
|
setLogoInvertFilter(defaultInvertFilter)
|
||||||
|
setLogoClearDisabled(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLogoRatio = (value) => {
|
||||||
|
setRatio(value)
|
||||||
|
resize(value)
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLogoOpacity = (value) => {
|
||||||
|
setOpacity(value)
|
||||||
|
logoEl.style.opacity = value / 100
|
||||||
|
}
|
||||||
|
|
||||||
|
const setLogoInvertFilter = (flag) => {
|
||||||
|
if (!flag) {
|
||||||
|
logoEl.style.filter = "invert(0)"
|
||||||
|
} else {
|
||||||
|
logoEl.style.filter = "invert(1)"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const setBackground = (e) => {
|
||||||
|
readFile(
|
||||||
|
e,
|
||||||
|
(readerEvent) => {
|
||||||
|
const content = readerEvent.target.result;
|
||||||
|
document.body.style.backgroundImage = `url("${content}")`
|
||||||
|
},
|
||||||
|
() => setBackgroundClearDisabled(false)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetBackground = () => {
|
||||||
|
document.body.style.backgroundImage = defaultBackgroundImage
|
||||||
|
setBackgroundClearDisabled(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
const positionPadding = (key, value) => {
|
||||||
|
switch (key) {
|
||||||
|
case "left":
|
||||||
|
setPadLeft(value)
|
||||||
|
spinePlayer.updateViewport({
|
||||||
|
...defaultViewport,
|
||||||
|
padLeft: `${value}%`,
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case "right":
|
||||||
|
setPadRight(value)
|
||||||
|
spinePlayer.updateViewport({
|
||||||
|
...defaultViewport,
|
||||||
|
padRight: `${value}%`,
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case "top":
|
||||||
|
setPadTop(value)
|
||||||
|
spinePlayer.updateViewport({
|
||||||
|
...defaultViewport,
|
||||||
|
padTop: `${value}%`,
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case "bottom":
|
||||||
|
setPadBottom(value)
|
||||||
|
spinePlayer.updateViewport({
|
||||||
|
...defaultViewport,
|
||||||
|
padBottom: `${value}%`,
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const positionReset = () => {
|
||||||
|
setPadLeft(defaultPadLeft)
|
||||||
|
setPadRight(defaultPadRight)
|
||||||
|
setPadTop(defaultPadTop)
|
||||||
|
setPadBottom(defaultPadBottom)
|
||||||
|
spinePlayer.updateViewport(defaultViewport)
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (logoEl) {
|
||||||
|
resize()
|
||||||
|
setLogoInvertFilter(defaultInvertFilter)
|
||||||
|
setLogoOpacity(defaultOpacity)
|
||||||
|
setDefaultLogoImage(logoEl.src)
|
||||||
|
}
|
||||||
|
}, [logoEl])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.addEventListener("contextmenu", e => e.preventDefault());
|
||||||
|
document.addEventListener("gesturestart", e => e.preventDefault());
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.addEventListener("resize", resize, true);
|
||||||
|
return () => {
|
||||||
|
window.removeEventListener("resize", resize, true);
|
||||||
|
}
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div class="website-settings" hidden={hidden}>
|
||||||
|
<div>
|
||||||
|
<label for="fps">FPS</label>
|
||||||
|
<input type="range" min="1" max="60" value={fps} step="1"
|
||||||
|
onChange={(e) => setFPS(e.target.value)}
|
||||||
|
/>
|
||||||
|
<input type="number" id="fps_input" min="1" max="60" name="fps" value={fps}
|
||||||
|
onChange={(e) => setFPS(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="operator_logo">Operator Logo</label>
|
||||||
|
<input type="checkbox" name="operator_logo" checked={!showLogo} onClick={(e) => setLogoDisplay(!e.target.checked)} />
|
||||||
|
<div hidden={showLogo}>
|
||||||
|
<div>
|
||||||
|
<label for="logo_image">Logo Image (Store Locally)</label>
|
||||||
|
<input type="file" onChange={(e) => setLogoImage(e)} />
|
||||||
|
<button type="button" disabled={logoClearDisabled} onClick={() => resetLogoImage()}>Clear</button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="logo_ratio">Logo Ratio</label>
|
||||||
|
<input type="range" min="0" max="100" step="0.1" value={ratio} onChange={(e) => setLogoRatio(e.target.value)} />
|
||||||
|
<input type="number" name="logo_ratio" value={ratio} onChange={(e) => setLogoRatio(e.target.value)} />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="logo_opacity">Logo Opacity</label>
|
||||||
|
<input type="range" min="0" max="100" step="1" id="logo_opacity_slider" value={opacity} onChange={(e) => setLogoOpacity(e.target.value)} />
|
||||||
|
<input type="number" id="logo_opacity_input" name="logo_opacity" value={opacity} onOpacity={(e) => setLogoOpacity(e.target.value)} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="background_image">Background Image (Store Locally)</label>
|
||||||
|
<input type="file" onChange={(e) => setBackground(e)} />
|
||||||
|
<button type="button" disabled={backgroundClearDisabled} onClick={() => resetBackground()}>Clear</button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="position">Position</label>
|
||||||
|
<input type="checkbox" name="position" checked={!hidePositionSettings} onClick={(e) => setHidePositionSettings(!e.target.checked)} />
|
||||||
|
<div hidden={hidePositionSettings}>
|
||||||
|
<div>
|
||||||
|
<label for="position_padding_left">Padding Left</label>
|
||||||
|
<input type="range" min="-100" max="100" value={padLeft} onChange={(e) => positionPadding("left", e.target.value)} />
|
||||||
|
<input type="number" name="position_padding_left" value={padLeft} onChange={(e) => positionPadding("left", e.target.value)} />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="position_padding_right">Padding Right</label>
|
||||||
|
<input type="range" min="-100" max="100" value={padRight} onChange={(e) => positionPadding("right", e.target.value)} />
|
||||||
|
<input type="number" name="position_padding_right" value={padRight} onChange={(e) => positionPadding("right", e.target.value)} />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="position_padding_top">Padding Top</label>
|
||||||
|
<input type="range" min="-100" max="100" value={padTop} onChange={(e) => positionPadding("top", e.target.value)} />
|
||||||
|
<input type="number" name="position_padding_top" value={padTop} onChange={(e) => positionPadding("top", e.target.value)} />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label for="position_padding_bottom">Padding Bottom</label>
|
||||||
|
<input type="range" min="-100" max="100" value={padBottom} onChange={(e) => positionPadding("bottom", e.target.value)} />
|
||||||
|
<input type="number" name="position_padding_bottom" value={padBottom} onChange={(e) => positionPadding("bottom", e.target.value)} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button type="button" disabled={isPlaying}
|
||||||
|
onClick={() => {
|
||||||
|
spinePlayer.play()
|
||||||
|
setIsPlaying(true)
|
||||||
|
}}
|
||||||
|
>Play
|
||||||
|
</button>
|
||||||
|
<button type="button" disabled={!isPlaying}
|
||||||
|
onClick={() => {
|
||||||
|
spinePlayer.pause()
|
||||||
|
setIsPlaying(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Pause
|
||||||
|
</button>
|
||||||
|
<button type="button" onClick={() => {
|
||||||
|
setFPS(defaultFps)
|
||||||
|
setLogoDisplay(defaultShowLogo)
|
||||||
|
resetLogoImage()
|
||||||
|
setLogoRatio(defaultRatio)
|
||||||
|
setLogoOpacity(defaultOpacity)
|
||||||
|
resetBackground()
|
||||||
|
positionReset()
|
||||||
|
spinePlayer.play()
|
||||||
|
}}>
|
||||||
|
Reset
|
||||||
|
</button>
|
||||||
|
<button type="button" onClick={() => setShowSettings(false)}>Close</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
20
template/showcase/src/index.css
Normal file
20
template/showcase/src/index.css
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
html {
|
||||||
|
-ms-user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
body, #app {
|
||||||
|
margin: 0;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
touch-action: none;
|
||||||
|
-ms-touch-action: none;
|
||||||
|
}
|
||||||
9
template/showcase/src/libs/check_web_gl.js
Normal file
9
template/showcase/src/libs/check_web_gl.js
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
export default function check_web_gl() {
|
||||||
|
try {
|
||||||
|
const canvas = document.createElement("canvas");
|
||||||
|
const ctx = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
|
||||||
|
return ctx != null;
|
||||||
|
} catch (e) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
13
template/showcase/src/libs/events.js
Normal file
13
template/showcase/src/libs/events.js
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
export function subscribe(eventName, listener) {
|
||||||
|
document.addEventListener(eventName, listener);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function unsubscribe(eventName, listener) {
|
||||||
|
document.removeEventListener(eventName, listener);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function publish(eventName, data) {
|
||||||
|
const event = new CustomEvent(eventName, { detail: data });
|
||||||
|
document.dispatchEvent(event);
|
||||||
|
}
|
||||||
|
// https://blog.logrocket.com/using-custom-events-react/
|
||||||
408
template/showcase/src/libs/spine-player.css
Normal file
408
template/showcase/src/libs/spine-player.css
Normal file
@@ -0,0 +1,408 @@
|
|||||||
|
/** Player **/
|
||||||
|
.spine-player {
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: none;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player * {
|
||||||
|
box-sizing: border-box;
|
||||||
|
font-family: "PT Sans",Arial,"Helvetica Neue",Helvetica,Tahoma,sans-serif;
|
||||||
|
color: #dddddd;
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-khtml-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-error {
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: black;
|
||||||
|
z-index: 10;
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Slider **/
|
||||||
|
.spine-player-slider {
|
||||||
|
width: 100%;
|
||||||
|
height: 16px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-slider-value {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
height: 2px;
|
||||||
|
background: rgba(98, 176, 238, 0.6);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-slider:hover .spine-player-slider-value {
|
||||||
|
height: 4px;
|
||||||
|
background: rgba(98, 176, 238, 1);
|
||||||
|
transition: height 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-slider-value.hovering {
|
||||||
|
height: 4px;
|
||||||
|
background: rgba(98, 176, 238, 1);
|
||||||
|
transition: height 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-slider.big {
|
||||||
|
height: 12px;
|
||||||
|
background: rgb(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-slider.big .spine-player-slider-value {
|
||||||
|
height: 12px;
|
||||||
|
background: rgba(98, 176, 238, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Column and row layout elements **/
|
||||||
|
.spine-player-column {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-row {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** List **/
|
||||||
|
.spine-player-list {
|
||||||
|
list-style: none !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li {
|
||||||
|
cursor: pointer;
|
||||||
|
margin: 8px 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list .selectable {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 2px 20px 2px 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable:first-child {
|
||||||
|
margin-top: 4px !important;
|
||||||
|
}
|
||||||
|
.spine-player-list li.selectable:last-child {
|
||||||
|
margin-bottom: 4px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable:hover {
|
||||||
|
background: #6e6e6e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable .selectable-circle {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
width: 6px;
|
||||||
|
min-width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #fff;
|
||||||
|
align-self: center;
|
||||||
|
opacity: 0;
|
||||||
|
margin: 5px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable.selected .selectable-circle {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable .selectable-text {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-list li.selectable.selected .selectable-text, .spine-player-list li.selectable:hover .selectable-text {
|
||||||
|
color: #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Switch **/
|
||||||
|
.spine-player-switch {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
margin: 2px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-switch-text {
|
||||||
|
flex: 1;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-switch-knob-area {
|
||||||
|
width: 30px; /* width of the switch */
|
||||||
|
height: 10px;
|
||||||
|
display: block;
|
||||||
|
border-radius: 5px; /* must be half of height */
|
||||||
|
background: #6e6e6e;
|
||||||
|
position: relative;
|
||||||
|
align-self: center;
|
||||||
|
justify-self: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-switch.active .spine-player-switch-knob-area {
|
||||||
|
background: #5EAFF1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-switch-knob {
|
||||||
|
display: block;
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #9e9e9e;
|
||||||
|
position: absolute;
|
||||||
|
left: 0px;
|
||||||
|
top: -2px;
|
||||||
|
filter: drop-shadow(0 0 1px #333);
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
.spine-player-switch.active .spine-player-switch-knob {
|
||||||
|
background: #fff;
|
||||||
|
transform: translateX(18px);
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Popup **/
|
||||||
|
.spine-player-popup-parent {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-popup {
|
||||||
|
user-select: none;
|
||||||
|
position: absolute;
|
||||||
|
background: rgba(0, 0, 0, 0.75);
|
||||||
|
z-index: 1;
|
||||||
|
right: 2px;
|
||||||
|
bottom: 40px;
|
||||||
|
border-radius: 4px;
|
||||||
|
max-height: 400%;
|
||||||
|
overflow: auto;
|
||||||
|
font-size: 85%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-popup-title {
|
||||||
|
margin: 4px 15px 2px 15px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-popup hr {
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
border-bottom: 1px solid #cccccc70;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Canvas **/
|
||||||
|
.spine-player canvas {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Player controls **/
|
||||||
|
.spine-player-controls {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
opacity: 1;
|
||||||
|
transition: opacity 0.4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-controls-hidden {
|
||||||
|
pointer-events: none;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Player buttons **/
|
||||||
|
.spine-player-buttons {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
width: 100%;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
border-bottom-right-radius: 4px;
|
||||||
|
padding: 2px 8px 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button {
|
||||||
|
background: none;
|
||||||
|
outline: 0;
|
||||||
|
border: none;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
background-size: 20px;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 3px;
|
||||||
|
padding-bottom: 3px;
|
||||||
|
filter: drop-shadow(0 0 1px #333);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-spacer {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-play {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-play:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-play-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplay%3C%2Ftitle%3E%3Cg%20id%3D%22play%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2243%2023.3%204%2047%204%201%2043%2023.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-pause {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-pause:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-pause-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Epause%3C%2Ftitle%3E%3Cg%20id%3D%22pause%22%3E%3Crect%20class%3D%22cls-1%22%20x%3D%226%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2228%22%20y%3D%221%22%20width%3D%2213%22%20height%3D%2246%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-speed {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-speed:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-speed-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20id%3D%22playback%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eplayback%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M48%2C28V20l-4.7-1.18a20.16%2C20.16%2C0%2C0%2C0-2-4.81l2.49-4.15L38.14%2C4.2%2C34%2C6.69a20.16%2C20.16%2C0%2C0%2C0-4.81-2L28%2C0H20L18.82%2C4.7A20.16%2C20.16%2C0%2C0%2C0%2C14%2C6.7L9.86%2C4.2%2C4.2%2C9.86%2C6.69%2C14a20.16%2C20.16%2C0%2C0%2C0-2%2C4.81L0%2C20v8l4.7%2C1.18A20.16%2C20.16%2C0%2C0%2C0%2C6.7%2C34L4.2%2C38.14%2C9.86%2C43.8%2C14%2C41.31a20.16%2C20.16%2C0%2C0%2C0%2C4.81%2C2L20%2C48h8l1.18-4.7a20.16%2C20.16%2C0%2C0%2C0%2C4.81-2l4.15%2C2.49%2C5.66-5.66L41.31%2C34a20.16%2C20.16%2C0%2C0%2C0%2C2-4.81ZM24%2C38A14%2C14%2C0%2C1%2C1%2C38%2C24%2C14%2C14%2C0%2C0%2C1%2C24%2C38Z%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2234%2024%2018%2033%2018%2015%2034%2024%2034%2024%22%2F%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-animations {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-animations:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-animations-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eanimations%3C%2Ftitle%3E%3Cg%20id%3D%22animations%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M12%2C45V43.22a6.39%2C6.39%2C0%2C0%2C0%2C.63-.81%2C27.83%2C27.83%2C0%2C0%2C1%2C3.79-4.16c.93-.84%2C2.06-1.88%2C2.86-2.71a13.83%2C13.83%2C0%2C0%2C0%2C1.53-1.9l3.9-5.24c1-1.17.95-1.1%2C2.11%2C0l3%2C2.24a4%2C4%2C0%2C0%2C0-2.29%2C2.38c-1.37%2C3-2.39%2C4-2.68%2C4.22l-.23.18c-.54.39-1.81%2C1-1.7%2C1.54l.8%2C1.49a4.5%2C4.5%2C0%2C0%2C1%2C.39%2C1l.57%2C2.15a.69.69%2C0%2C0%2C0%2C.58.48c.47.08%2C1%2C.5%2C1.33.53%2C1.29.1%2C1.79%2C0%2C1.42-.54L26.7%2C42.72a.86.86%2C0%2C0%2C1-.2-.24%2C3.64%2C3.64%2C0%2C0%2C1-.42-2.2A5.39%2C5.39%2C0%2C0%2C1%2C26.61%2C39c1.84-2%2C6.74-6.36%2C6.74-6.36%2C1.71-1.81%2C1.4-2.52.81-3.84a27.38%2C27.38%2C0%2C0%2C0-2-3c-.41-.61-2.08-2.38-2.85-3.28-.43-.5.38-2.08.87-2.82.18-.12-.41.05%2C1.72.07a23.32%2C23.32%2C0%2C0%2C0%2C3.56-.19l1.63.61c.28%2C0%2C1.18-.09%2C1.31-.35l.12-.78c.18-.39.31-1.56-.05-1.75l-.6-.52a2.28%2C2.28%2C0%2C0%2C0-1.61.07l-.2.44c-.14.15-.52.37-.71.29l-2.24%2C0c-.5.12-1.18-.42-1.81-.73L32.05%2C15a8%2C8%2C0%2C0%2C0%2C.8-3.92%2C1.22%2C1.22%2C0%2C0%2C0-.28-.82%2C7.87%2C7.87%2C0%2C0%2C0-1.15-1.06l.11-.73c-.12-.49%2C1-.82%2C1.52-.82l.76-.33c.32%2C0%2C.68-.89.78-1.21L34.94%2C4a11.26%2C11.26%2C0%2C0%2C0%2C0-1.61C34.57.08%2C30.06-1.42%2C28.78%2C2c-.14.38-.62.77.34%2C3.21a1.55%2C1.55%2C0%2C0%2C1-.3%2C1.2L28.4%2C7a4%2C4%2C0%2C0%2C1-1.19.49c-.79%2C0-1.59-.75-4%2C.54C21%2C9.16%2C18.59%2C13%2C17.7%2C14.22a3.21%2C3.21%2C0%2C0%2C0-.61%2C1.58c-.05%2C1.16.7%2C3.74.87%2C5.75.13%2C1.53.21%2C2.52.72%2C3.06%2C1.07%2C1.14%2C2.1-.18%2C2.61-1a2.74%2C2.74%2C0%2C0%2C0-.14-1.86l-.74-.1c-.15-.15-.4-.42-.39-.64-.05-3.48-.22-3.14-.18-5.39%2C1.74-1.46%2C2.4-2.45%2C2.3-2-.2%2C1.15.28%2C2.83.09%2C4.35a6.46%2C6.46%2C0%2C0%2C1-.7%2C2.58s-2.11%2C4.22-2.14%2C4.27l-1.26%2C5.6-.7%2C1.44s-.71.54-1.59%2C1.21a9.67%2C9.67%2C0%2C0%2C0-2.27%2C3.18%2C20.16%2C20.16%2C0%2C0%2C1-1.42%2C2.83l-.87%2C1.31a1.72%2C1.72%2C0%2C0%2C1-.6.61l-1.83%2C1.1a1.39%2C1.39%2C0%2C0%2C0-.16.93l.68%2C1.71a4.07%2C4.07%2C0%2C0%2C1%2C.27%2C1.07l.17%2C1.56a.75.75%2C0%2C0%2C0%2C.71.59%2C18.13%2C18.13%2C0%2C0%2C0%2C3.26-.5c.27-.09-.29-.78-.53-1s-.45-.36-.45-.36A12.78%2C12.78%2C0%2C0%2C1%2C12%2C45Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-skins {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
width: 31px;
|
||||||
|
height: 31px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-skins:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-skins-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eskins%3C%2Ftitle%3E%3Cg%20id%3D%22skins%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M36%2C12.54l-6.92%2C1-.79%2C1.2c-1%2C.25-2-.62-3-.55V12.33a1.35%2C1.35%2C0%2C0%2C1%2C.55-1.07c3-2.24%2C3.28-3.75%2C3.28-5.34A5.06%2C5.06%2C0%2C0%2C0%2C24%2C.76c-2.54%2C0-4.38.71-5.49%2C2.13a5.74%2C5.74%2C0%2C0%2C0-.9%2C4.57l2.48-.61a3.17%2C3.17%2C0%2C0%2C1%2C.45-2.4c.6-.75%2C1.75-1.13%2C3.42-1.13%2C2.56%2C0%2C2.56%2C1.24%2C2.56%2C2.56%2C0%2C.92%2C0%2C1.65-2.26%2C3.34a3.92%2C3.92%2C0%2C0%2C0-1.58%2C3.12v1.86c-1-.07-2%2C.8-3%2C.55l-.79-1.2-6.92-1c-2.25%2C0-4.35%2C2.09-5.64%2C3.93L1%2C24c3.83%2C5.11%2C10.22%2C5.11%2C10.22%2C5.11V41.93c0%2C2.34%2C2.68%2C3.88%2C5.59%2C4.86a22.59%2C22.59%2C0%2C0%2C0%2C14.37%2C0c2.91-1%2C5.59-2.52%2C5.59-4.86V29.15S43.17%2C29.15%2C47%2C24l-5.33-7.57C40.38%2C14.63%2C38.27%2C12.54%2C36%2C12.54ZM23.32%2C20.09%2C21%2C17l1.8-.6a3.79%2C3.79%2C0%2C0%2C1%2C2.4%2C0L27%2C17l-2.32%2C3.09A.85.85%2C0%2C0%2C1%2C23.32%2C20.09Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-settings {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
margin-top: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-settings:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-settings-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Esettings%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M40%2C3H8A5%2C5%2C0%2C0%2C0%2C3%2C8V40a5%2C5%2C0%2C0%2C0%2C5%2C5H40a5%2C5%2C0%2C0%2C0%2C5-5V8A5%2C5%2C0%2C0%2C0%2C40%2C3ZM16%2C40H9V33h7Zm0-12H9V21h7Zm0-12H9V9h7ZM39%2C38H20V35H39Zm0-12H20V23H39Zm0-12H20V11H39Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-fullscreen {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
margin-top: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-fullscreen:hover {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-fullscreen-selected {
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2362B0EE%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eexpand%3C%2Ftitle%3E%3Cg%20id%3D%22settings%22%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2230.14%208%2040%208%2040%2017.86%2044.5%2017.86%2044.5%203.5%2030.14%203.5%2030.14%208%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%228%2017.86%208%208%2017.86%208%2017.86%203.5%203.5%203.5%203.5%2017.86%208%2017.86%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2240%2030.14%2040%2040%2030.14%2040%2030.14%2044.5%2044.5%2044.5%2044.5%2030.14%2040%2030.14%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2217.86%2040%208%2040%208%2030.14%203.5%2030.14%203.5%2044.5%2017.86%2044.5%2017.86%2040%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-spine-logo {
|
||||||
|
height: 20px;
|
||||||
|
position: relative;
|
||||||
|
top: 1px;
|
||||||
|
margin: 0 8px !important;
|
||||||
|
align-self: center;
|
||||||
|
border: none !important;
|
||||||
|
width: auto !important;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: transform 0.2s;
|
||||||
|
box-shadow: none !important;
|
||||||
|
filter: drop-shadow(0 0 1px #333);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-button-icon-spine-logo:hover {
|
||||||
|
transform: scale(1.05);
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Speed slider **/
|
||||||
|
.spine-player-speed-slider {
|
||||||
|
width: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Player editor **/
|
||||||
|
.spine-player-editor-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-editor-code {
|
||||||
|
flex: 1;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.CodeMirror {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spine-player-editor-player {
|
||||||
|
flex: 1;
|
||||||
|
border: none;
|
||||||
|
background: black;
|
||||||
|
}
|
||||||
11948
template/showcase/src/libs/spine-player.js
Normal file
11948
template/showcase/src/libs/spine-player.js
Normal file
File diff suppressed because one or more lines are too long
67
template/showcase/src/libs/wallpaper_engine.js
Normal file
67
template/showcase/src/libs/wallpaper_engine.js
Normal file
@@ -0,0 +1,67 @@
|
|||||||
|
import { publish } from '@/libs/events'
|
||||||
|
|
||||||
|
window.wallpaperPropertyListener = {
|
||||||
|
applyGeneralProperties: function (properties) {
|
||||||
|
if (properties.fps) {
|
||||||
|
// use custom event
|
||||||
|
publish('fps', properties.fps.value)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
applyUserProperties: function (properties) {
|
||||||
|
if (properties.logo) {
|
||||||
|
publish('logo', properties.logo.value)
|
||||||
|
}
|
||||||
|
if (properties.logoratio) {
|
||||||
|
if (properties.logoratio.value) {
|
||||||
|
publish('logoratio', properties.logoratio.value)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (properties.logoopacity) {
|
||||||
|
if (properties.logoopacity.value) {
|
||||||
|
publish('logoopacity', properties.logoopacity.value)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (properties.logoimage) {
|
||||||
|
if (properties.logoimage.value) {
|
||||||
|
publish('logoimage', properties.logoimage.value)
|
||||||
|
// var logoImage = 'file:///' + properties.logoimage.value;
|
||||||
|
// settings.setLogo(logoImage, true);
|
||||||
|
} else {
|
||||||
|
publish('logoimage', null)
|
||||||
|
// settings.resetLogo();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (properties.background) {
|
||||||
|
if (properties.background.value) {
|
||||||
|
publish('background', properties.background.value)
|
||||||
|
// var background = 'file:///' + properties.background.value;
|
||||||
|
// settings.setBackground(background);
|
||||||
|
} else {
|
||||||
|
publish('background', null)
|
||||||
|
// settings.resetBackground();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (properties.position) {
|
||||||
|
if (!properties.position.value) {
|
||||||
|
publish('position', null)
|
||||||
|
// settings.positionReset();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (properties.paddingleft) {
|
||||||
|
publish('paddingleft', properties.paddingleft.value)
|
||||||
|
// settings.positionPadding("padLeft", properties.paddingleft.value)
|
||||||
|
}
|
||||||
|
if (properties.paddingright) {
|
||||||
|
publish('paddingright', properties.paddingright.value)
|
||||||
|
// settings.positionPadding("padRight", properties.paddingright.value)
|
||||||
|
}
|
||||||
|
if (properties.paddingtop) {
|
||||||
|
publish('paddingtop', properties.paddingtop.value)
|
||||||
|
// settings.positionPadding("padTop", properties.paddingtop.value)
|
||||||
|
}
|
||||||
|
if (properties.paddingbottom) {
|
||||||
|
publish('paddingbottom', properties.paddingbottom.value)
|
||||||
|
// settings.positionPadding("padBottom", properties.paddingbottom.value)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
5
template/showcase/src/main.jsx
Normal file
5
template/showcase/src/main.jsx
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
import { render } from 'preact'
|
||||||
|
import { App } from './app'
|
||||||
|
import './index.css'
|
||||||
|
|
||||||
|
render(<App />, document.getElementById('app'))
|
||||||
20
template/showcase/vite.config.js
Normal file
20
template/showcase/vite.config.js
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import preact from '@preact/preset-vite'
|
||||||
|
import path from 'path'
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [preact()],
|
||||||
|
base: "",
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': path.resolve(__dirname, './src'),
|
||||||
|
'logo': path.resolve(__dirname, `./src/assets/logo_rhodes_override.png`), // TODO: use env
|
||||||
|
'fallback': path.resolve(__dirname, `./src/assets/char_1013_chen2_2.png`), // TODO
|
||||||
|
},
|
||||||
|
},
|
||||||
|
build: {
|
||||||
|
chunkSizeWarningLimit: 10000,
|
||||||
|
// outDir: path.resolve(config.basedir, config.server.release_folder),
|
||||||
|
},
|
||||||
|
})
|
||||||
Reference in New Issue
Block a user