创建
This commit is contained in:
commit
a41b1bf8f0
3
.browserslistrc
Normal file
3
.browserslistrc
Normal file
@ -0,0 +1,3 @@
|
||||
> 1%
|
||||
last 2 versions
|
||||
not dead
|
||||
5
.editorconfig
Normal file
5
.editorconfig
Normal file
@ -0,0 +1,5 @@
|
||||
[*.{js,jsx,ts,tsx,vue}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
17
.eslintrc.js
Normal file
17
.eslintrc.js
Normal file
@ -0,0 +1,17 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
extends: [
|
||||
'plugin:vue/essential',
|
||||
'@vue/standard'
|
||||
],
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
|
||||
}
|
||||
}
|
||||
23
.gitignore
vendored
Normal file
23
.gitignore
vendored
Normal file
@ -0,0 +1,23 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
24
README.md
Normal file
24
README.md
Normal file
@ -0,0 +1,24 @@
|
||||
# code
|
||||
|
||||
## Project setup
|
||||
```
|
||||
npm install
|
||||
```
|
||||
|
||||
### Compiles and hot-reloads for development
|
||||
```
|
||||
npm run serve
|
||||
```
|
||||
|
||||
### Compiles and minifies for production
|
||||
```
|
||||
npm run build
|
||||
```
|
||||
|
||||
### Lints and fixes files
|
||||
```
|
||||
npm run lint
|
||||
```
|
||||
|
||||
### Customize configuration
|
||||
See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||
5
babel.config.js
Normal file
5
babel.config.js
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
]
|
||||
}
|
||||
11157
package-lock.json
generated
Normal file
11157
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
22
package.json
Normal file
22
package.json
Normal file
@ -0,0 +1,22 @@
|
||||
{
|
||||
"name": "code",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint",
|
||||
"start": "node index.js",
|
||||
"server": "nodemon index.js --ignore client"
|
||||
},
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"vue": "^2.6.11",
|
||||
"element-ui": "^2.15.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
"@vue/cli-service": "~4.5.0",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
}
|
||||
}
|
||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
18
public/index.html
Normal file
18
public/index.html
Normal file
@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
16
src/App.vue
Normal file
16
src/App.vue
Normal file
@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<live2d/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Live2d from '@/components/Live2d/index'
|
||||
export default {
|
||||
components: {
|
||||
Live2d
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less">
|
||||
|
||||
</style>
|
||||
6387
src/assets/live2d.js
Normal file
6387
src/assets/live2d.js
Normal file
File diff suppressed because it is too large
Load Diff
407
src/assets/waifu-tips.js
Normal file
407
src/assets/waifu-tips.js
Normal file
@ -0,0 +1,407 @@
|
||||
window.live2d_settings = Array(); /*
|
||||
|
||||
く__,.ヘヽ. / ,ー､ 〉
|
||||
＼ ', !-─‐-i / /´
|
||||
／｀ｰ' L/／｀ヽ､ Live2D 看板娘 参数设置
|
||||
/ ／, /| , , ', Version 1.4.2
|
||||
ｲ / /-‐/ ｉ L_ ﾊ ヽ! i Update 2018.11.12
|
||||
ﾚ ﾍ 7ｲ｀ﾄ ﾚ'ｧ-ﾄ､!ハ| |
|
||||
!,/7 '0' ´0iソ| |
|
||||
|.从" _ ,,,, / |./ | 网页添加 Live2D 看板娘
|
||||
ﾚ'| i＞.､,,__ _,.イ / .i | https://www.fghrsh.net/post/123.html
|
||||
ﾚ'| | / k_７_/ﾚ'ヽ, ﾊ. |
|
||||
| |/i 〈|/ i ,.ﾍ | i | Thanks
|
||||
.|/ / ｉ： ﾍ! ＼ | journey-ad / https://github.com/journey-ad/live2d_src
|
||||
kヽ>､ﾊ _,.ﾍ､ /､! xiazeyu / https://github.com/xiazeyu/live2d-widget.js
|
||||
!'〈//｀Ｔ´', ＼ ｀'7'ｰr' Live2d Cubism SDK WebGL 2.1 Projrct & All model authors.
|
||||
ﾚ'ヽL__|___i,___,ンﾚ|ノ
|
||||
ﾄ-,/ |___./
|
||||
'ｰ' !_,.:*********************************************************************************/
|
||||
|
||||
|
||||
// 后端接口
|
||||
live2d_settings['modelAPI'] = '//live2d.fghrsh.net/api/'; // 自建 API 修改这里
|
||||
live2d_settings['tipsMessage'] = 'waifu-tips.json'; // 同目录下可省略路径
|
||||
live2d_settings['hitokotoAPI'] = 'lwl12.com'; // 一言 API，可选 'lwl12.com', 'hitokoto.cn', 'jinrishici.com'(古诗词)
|
||||
|
||||
// 默认模型
|
||||
live2d_settings['modelId'] = 1; // 默认模型 ID，可在 F12 控制台找到
|
||||
live2d_settings['modelTexturesId'] = 53; // 默认材质 ID，可在 F12 控制台找到
|
||||
|
||||
// 工具栏设置
|
||||
live2d_settings['showToolMenu'] = true; // 显示 工具栏 ，可选 true(真), false(假)
|
||||
live2d_settings['canCloseLive2d'] = true; // 显示 关闭看板娘 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canSwitchModel'] = true; // 显示 模型切换 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canSwitchTextures'] = true; // 显示 材质切换 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canSwitchHitokoto'] = true; // 显示 一言切换 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canTakeScreenshot'] = true; // 显示 看板娘截图 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canTurnToHomePage'] = true; // 显示 返回首页 按钮，可选 true(真), false(假)
|
||||
live2d_settings['canTurnToAboutPage'] = true; // 显示 跳转关于页 按钮，可选 true(真), false(假)
|
||||
|
||||
// 模型切换模式
|
||||
live2d_settings['modelStorage'] = true; // 记录 ID (刷新后恢复)，可选 true(真), false(假)
|
||||
live2d_settings['modelRandMode'] = 'switch'; // 模型切换，可选 'rand'(随机), 'switch'(顺序)
|
||||
live2d_settings['modelTexturesRandMode']= 'rand'; // 材质切换，可选 'rand'(随机), 'switch'(顺序)
|
||||
|
||||
// 提示消息选项
|
||||
live2d_settings['showHitokoto'] = true; // 显示一言
|
||||
live2d_settings['showF12Status'] = true; // 显示加载状态
|
||||
live2d_settings['showF12Message'] = false; // 显示看板娘消息
|
||||
live2d_settings['showF12OpenMsg'] = true; // 显示控制台打开提示
|
||||
live2d_settings['showCopyMessage'] = true; // 显示 复制内容 提示
|
||||
live2d_settings['showWelcomeMessage'] = true; // 显示进入面页欢迎词
|
||||
|
||||
//看板娘样式设置
|
||||
live2d_settings['waifuSize'] = '280x250'; // 看板娘大小，例如 '280x250', '600x535'
|
||||
live2d_settings['waifuTipsSize'] = '250x70'; // 提示框大小，例如 '250x70', '570x150'
|
||||
live2d_settings['waifuFontSize'] = '12px'; // 提示框字体，例如 '12px', '30px'
|
||||
live2d_settings['waifuToolFont'] = '14px'; // 工具栏字体，例如 '14px', '36px'
|
||||
live2d_settings['waifuToolLine'] = '20px'; // 工具栏行高，例如 '20px', '36px'
|
||||
live2d_settings['waifuToolTop'] = '0px' // 工具栏顶部边距，例如 '0px', '-60px'
|
||||
live2d_settings['waifuMinWidth'] = '768px'; // 面页小于 指定宽度 隐藏看板娘，例如 'disable'(禁用), '768px'
|
||||
live2d_settings['waifuEdgeSide'] = 'left:0'; // 看板娘贴边方向，例如 'left:0'(靠左 0px), 'right:30'(靠右 30px)
|
||||
live2d_settings['waifuDraggable'] = 'disable'; // 拖拽样式，例如 'disable'(禁用), 'axis-x'(只能水平拖拽), 'unlimited'(自由拖拽)
|
||||
live2d_settings['waifuDraggableRevert'] = true; // 松开鼠标还原拖拽位置，可选 true(真), false(假)
|
||||
|
||||
// 其他杂项设置
|
||||
live2d_settings['l2dVersion'] = '1.4.2'; // 当前版本
|
||||
live2d_settings['l2dVerDate'] = '2018.11.12'; // 版本更新日期
|
||||
live2d_settings['homePageUrl'] = 'auto'; // 主页地址，可选 'auto'(自动), '{URL 网址}'
|
||||
live2d_settings['aboutPageUrl'] = 'https://www.fghrsh.net/post/123.html'; // 关于页地址, '{URL 网址}'
|
||||
live2d_settings['screenshotCaptureName']= 'live2d.png'; // 看板娘截图文件名，例如 'live2d.png'
|
||||
|
||||
/****************************************************************************************************/
|
||||
|
||||
String.prototype.render = function(context) {
|
||||
var tokenReg = /(\\)?\{([^\{\}\\]+)(\\)?\}/g;
|
||||
|
||||
return this.replace(tokenReg, function (word, slash1, token, slash2) {
|
||||
if (slash1 || slash2) { return word.replace('\\', ''); }
|
||||
|
||||
var variables = token.replace(/\s/g, '').split('.');
|
||||
var currentObject = context;
|
||||
var i, length, variable;
|
||||
|
||||
for (i = 0, length = variables.length; i < length; ++i) {
|
||||
variable = variables[i];
|
||||
currentObject = currentObject[variable];
|
||||
if (currentObject === undefined || currentObject === null) return '';
|
||||
}
|
||||
return currentObject;
|
||||
});
|
||||
};
|
||||
|
||||
var re = /x/;
|
||||
console.log(re);
|
||||
|
||||
function empty(obj) {return typeof obj=="undefined"||obj==null||obj==""?true:false}
|
||||
function getRandText(text) {return Array.isArray(text) ? text[Math.floor(Math.random() * text.length + 1)-1] : text}
|
||||
|
||||
function showMessage(text, timeout, flag) {
|
||||
if(flag || sessionStorage.getItem('waifu-text') === '' || sessionStorage.getItem('waifu-text') === null){
|
||||
if(Array.isArray(text)) text = text[Math.floor(Math.random() * text.length + 1)-1];
|
||||
if (live2d_settings.showF12Message) console.log('[Message]', text.replace(/<[^<>]+>/g,''));
|
||||
|
||||
if(flag) sessionStorage.setItem('waifu-text', text);
|
||||
|
||||
$('.waifu-tips').stop();
|
||||
$('.waifu-tips').html(text).fadeTo(200, 1);
|
||||
if (timeout === undefined) timeout = 5000;
|
||||
hideMessage(timeout);
|
||||
}
|
||||
}
|
||||
|
||||
function hideMessage(timeout) {
|
||||
$('.waifu-tips').stop().css('opacity',1);
|
||||
if (timeout === undefined) timeout = 5000;
|
||||
window.setTimeout(function() {sessionStorage.removeItem('waifu-text')}, timeout);
|
||||
$('.waifu-tips').delay(timeout).fadeTo(200, 0);
|
||||
}
|
||||
|
||||
const initModel = function initModel(waifuPath, type) {
|
||||
/* console welcome message */
|
||||
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('8.d(" ");8.d("\\U,.\\y\\5.\\1\\1\\1\\1/\\1,\\u\\2 \\H\\n\\1\\1\\1\\1\\1\\b \', !-\\r\\j-i\\1/\\1/\\g\\n\\1\\1\\1 \\1 \\a\\4\\f\'\\1\\1\\1 L/\\a\\4\\5\\2\\n\\1\\1 \\1 /\\1 \\a,\\1 /|\\1 ,\\1 ,\\1\\1\\1 \',\\n\\1\\1\\1\\q \\1/ /-\\j/\\1\\h\\E \\9 \\5!\\1 i\\n\\1\\1\\1 \\3 \\6 7\\q\\4\\c\\1 \\3\'\\s-\\c\\2!\\t|\\1 |\\n\\1\\1\\1\\1 !,/7 \'0\'\\1\\1 \\X\\w| \\1 |\\1\\1\\1\\n\\1\\1\\1\\1 |.\\x\\"\\1\\l\\1\\1 ,,,, / |./ \\1 |\\n\\1\\1\\1\\1 \\3\'| i\\z.\\2,,A\\l,.\\B / \\1.i \\1|\\n\\1\\1\\1\\1\\1 \\3\'| | / C\\D/\\3\'\\5,\\1\\9.\\1|\\n\\1\\1\\1\\1\\1\\1 | |/i \\m|/\\1 i\\1,.\\6 |\\F\\1|\\n\\1\\1\\1\\1\\1\\1.|/ /\\1\\h\\G \\1 \\6!\\1\\1\\b\\1|\\n\\1\\1\\1 \\1 \\1 k\\5>\\2\\9 \\1 o,.\\6\\2 \\1 /\\2!\\n\\1\\1\\1\\1\\1\\1 !\'\\m//\\4\\I\\g\', \\b \\4\'7\'\\J\'\\n\\1\\1\\1\\1\\1\\1 \\3\'\\K|M,p,\\O\\3|\\P\\n\\1\\1\\1\\1\\1 \\1\\1\\1\\c-,/\\1|p./\\n\\1\\1\\1\\1\\1 \\1\\1\\1\'\\f\'\\1\\1!o,.:\\Q \\R\\S\\T v"+e.V+" / W "+e.N);8.d(" ");',60,60,'|u3000|uff64|uff9a|uff40|u30fd|uff8d||console|uff8a|uff0f|uff3c|uff84|log|live2d_settings|uff70|u00b4|uff49||u2010||u3000_|u3008||_|___|uff72|u2500|uff67|u30cf|u30fc||u30bd|u4ece|u30d8|uff1e|__|u30a4|k_|uff17_|u3000L_|u3000i|uff1a|u3009|uff34|uff70r|u30fdL__||___i|l2dVerDate|u30f3|u30ce|nLive2D|u770b|u677f|u5a18|u304f__|l2dVersion|FGHRSH|u00b40i'.split('|'),0,{}));
|
||||
|
||||
/* 判断 JQuery */
|
||||
if (typeof($.ajax) != 'function') typeof(jQuery.ajax) == 'function' ? window.$ = jQuery : console.log('[Error] JQuery is not defined.');
|
||||
|
||||
/* 加载看板娘样式 */
|
||||
live2d_settings.waifuSize = live2d_settings.waifuSize.split('x');
|
||||
live2d_settings.waifuTipsSize = live2d_settings.waifuTipsSize.split('x');
|
||||
live2d_settings.waifuEdgeSide = live2d_settings.waifuEdgeSide.split(':');
|
||||
|
||||
$("#live2d").attr("width",live2d_settings.waifuSize[0]);
|
||||
$("#live2d").attr("height",live2d_settings.waifuSize[1]);
|
||||
$(".waifu-tips").width(live2d_settings.waifuTipsSize[0]);
|
||||
$(".waifu-tips").height(live2d_settings.waifuTipsSize[1]);
|
||||
$(".waifu-tips").css("top",live2d_settings.waifuToolTop);
|
||||
$(".waifu-tips").css("font-size",live2d_settings.waifuFontSize);
|
||||
$(".waifu-tool").css("font-size",live2d_settings.waifuToolFont);
|
||||
$(".waifu-tool span").css("line-height",live2d_settings.waifuToolLine);
|
||||
|
||||
if (live2d_settings.waifuEdgeSide[0] == 'left') $(".waifu").css("left",live2d_settings.waifuEdgeSide[1]+'px');
|
||||
else if (live2d_settings.waifuEdgeSide[0] == 'right') $(".waifu").css("right",live2d_settings.waifuEdgeSide[1]+'px');
|
||||
|
||||
window.waifuResize = function() { $(window).width() <= Number(live2d_settings.waifuMinWidth.replace('px','')) ? $(".waifu").hide() : $(".waifu").show(); };
|
||||
if (live2d_settings.waifuMinWidth != 'disable') { waifuResize(); $(window).resize(function() {waifuResize()}); }
|
||||
|
||||
try {
|
||||
if (live2d_settings.waifuDraggable == 'axis-x') $(".waifu").draggable({ axis: "x", revert: live2d_settings.waifuDraggableRevert });
|
||||
else if (live2d_settings.waifuDraggable == 'unlimited') $(".waifu").draggable({ revert: live2d_settings.waifuDraggableRevert });
|
||||
else $(".waifu").css("transition", 'all .3s ease-in-out');
|
||||
} catch(err) { console.log('[Error] JQuery UI is not defined.') }
|
||||
|
||||
live2d_settings.homePageUrl == 'auto' ? window.location.protocol+'//'+window.location.hostname+'/' : live2d_settings.homePageUrl;
|
||||
if (window.location.protocol == 'file:' && live2d_settings.modelAPI.substr(0,2) == '//') live2d_settings.modelAPI = 'http:'+live2d_settings.modelAPI;
|
||||
|
||||
$('.waifu-tool .fui-home').click(function (){
|
||||
//window.location = 'https://www.fghrsh.net/';
|
||||
window.location = live2d_settings.homePageUrl;
|
||||
});
|
||||
|
||||
$('.waifu-tool .fui-info-circle').click(function (){
|
||||
//window.open('https://imjad.cn/archives/lab/add-dynamic-poster-girl-with-live2d-to-your-blog-02');
|
||||
window.open(live2d_settings.aboutPageUrl);
|
||||
});
|
||||
|
||||
if (typeof(waifuPath) == "object") loadTipsMessage(waifuPath); else {
|
||||
$.ajax({
|
||||
cache: true,
|
||||
url: waifuPath == '' ? live2d_settings.tipsMessage : (waifuPath.substr(waifuPath.length-15)=='waifu-tips.json'?waifuPath:waifuPath+'waifu-tips.json'),
|
||||
dataType: "json",
|
||||
success: function (result){ loadTipsMessage(result); }
|
||||
});
|
||||
}
|
||||
|
||||
if (!live2d_settings.showToolMenu) $('.waifu-tool').hide();
|
||||
if (!live2d_settings.canCloseLive2d) $('.waifu-tool .fui-cross').hide();
|
||||
if (!live2d_settings.canSwitchModel) $('.waifu-tool .fui-eye').hide();
|
||||
if (!live2d_settings.canSwitchTextures) $('.waifu-tool .fui-user').hide();
|
||||
if (!live2d_settings.canSwitchHitokoto) $('.waifu-tool .fui-chat').hide();
|
||||
if (!live2d_settings.canTakeScreenshot) $('.waifu-tool .fui-photo').hide();
|
||||
if (!live2d_settings.canTurnToHomePage) $('.waifu-tool .fui-home').hide();
|
||||
if (!live2d_settings.canTurnToAboutPage) $('.waifu-tool .fui-info-circle').hide();
|
||||
|
||||
if (waifuPath === undefined) waifuPath = '';
|
||||
var modelId = localStorage.getItem('modelId');
|
||||
var modelTexturesId = localStorage.getItem('modelTexturesId');
|
||||
|
||||
if (!live2d_settings.modelStorage || modelId == null) {
|
||||
var modelId = live2d_settings.modelId;
|
||||
var modelTexturesId = live2d_settings.modelTexturesId;
|
||||
} loadModel(modelId, modelTexturesId);
|
||||
}
|
||||
|
||||
export { initModel }
|
||||
|
||||
function loadModel(modelId, modelTexturesId=0) {
|
||||
if (live2d_settings.modelStorage) {
|
||||
localStorage.setItem('modelId', modelId);
|
||||
localStorage.setItem('modelTexturesId', modelTexturesId);
|
||||
} else {
|
||||
sessionStorage.setItem('modelId', modelId);
|
||||
sessionStorage.setItem('modelTexturesId', modelTexturesId);
|
||||
} loadlive2d('live2d', live2d_settings.modelAPI+'get/?id='+modelId+'-'+modelTexturesId, (live2d_settings.showF12Status ? console.log('[Status]','live2d','模型',modelId+'-'+modelTexturesId,'加载完成'):null));
|
||||
}
|
||||
|
||||
function loadTipsMessage(result) {
|
||||
window.waifu_tips = result;
|
||||
|
||||
$.each(result.mouseover, function (index, tips){
|
||||
$(document).on("mouseover", tips.selector, function (){
|
||||
var text = getRandText(tips.text);
|
||||
text = text.render({text: $(this).text()});
|
||||
showMessage(text, 3000);
|
||||
});
|
||||
});
|
||||
$.each(result.click, function (index, tips){
|
||||
$(document).on("click", tips.selector, function (){
|
||||
var text = getRandText(tips.text);
|
||||
text = text.render({text: $(this).text()});
|
||||
showMessage(text, 3000, true);
|
||||
});
|
||||
});
|
||||
$.each(result.seasons, function (index, tips){
|
||||
var now = new Date();
|
||||
var after = tips.date.split('-')[0];
|
||||
var before = tips.date.split('-')[1] || after;
|
||||
|
||||
if((after.split('/')[0] <= now.getMonth()+1 && now.getMonth()+1 <= before.split('/')[0]) &&
|
||||
(after.split('/')[1] <= now.getDate() && now.getDate() <= before.split('/')[1])){
|
||||
var text = getRandText(tips.text);
|
||||
text = text.render({year: now.getFullYear()});
|
||||
showMessage(text, 6000, true);
|
||||
}
|
||||
});
|
||||
|
||||
if (live2d_settings.showF12OpenMsg) {
|
||||
re.toString = function() {
|
||||
showMessage(getRandText(result.waifu.console_open_msg), 5000, true);
|
||||
return '';
|
||||
};
|
||||
}
|
||||
|
||||
if (live2d_settings.showCopyMessage) {
|
||||
$(document).on('copy', function() {
|
||||
showMessage(getRandText(result.waifu.copy_message), 5000, true);
|
||||
});
|
||||
}
|
||||
|
||||
$('.waifu-tool .fui-photo').click(function(){
|
||||
showMessage(getRandText(result.waifu.screenshot_message), 5000, true);
|
||||
window.Live2D.captureName = live2d_settings.screenshotCaptureName;
|
||||
window.Live2D.captureFrame = true;
|
||||
});
|
||||
|
||||
$('.waifu-tool .fui-cross').click(function(){
|
||||
sessionStorage.setItem('waifu-dsiplay', 'none');
|
||||
showMessage(getRandText(result.waifu.hidden_message), 1300, true);
|
||||
window.setTimeout(function() {$('.waifu').hide();}, 1300);
|
||||
});
|
||||
|
||||
window.showWelcomeMessage = function(result) {
|
||||
var text;
|
||||
if (window.location.href == live2d_settings.homePageUrl) {
|
||||
var now = (new Date()).getHours();
|
||||
if (now > 23 || now <= 5) text = getRandText(result.waifu.hour_tips.t23-5);
|
||||
else if (now > 5 && now <= 7) text = getRandText(result.waifu.hour_tips.t5-7);
|
||||
else if (now > 7 && now <= 11) text = getRandText(result.waifu.hour_tips.t7-11);
|
||||
else if (now > 11 && now <= 14) text = getRandText(result.waifu.hour_tips.t11-14);
|
||||
else if (now > 14 && now <= 17) text = getRandText(result.waifu.hour_tips.t14-17);
|
||||
else if (now > 17 && now <= 19) text = getRandText(result.waifu.hour_tips.t17-19);
|
||||
else if (now > 19 && now <= 21) text = getRandText(result.waifu.hour_tips.t19-21);
|
||||
else if (now > 21 && now <= 23) text = getRandText(result.waifu.hour_tips.t21-23);
|
||||
else text = getRandText(result.waifu.hour_tips.default);
|
||||
} else {
|
||||
var referrer_message = result.waifu.referrer_message;
|
||||
if (document.referrer !== '') {
|
||||
var referrer = document.createElement('a');
|
||||
referrer.href = document.referrer;
|
||||
var domain = referrer.hostname.split('.')[1];
|
||||
if (window.location.hostname == referrer.hostname)
|
||||
text = referrer_message.localhost[0] + document.title.split(referrer_message.localhost[2])[0] + referrer_message.localhost[1];
|
||||
else if (domain == 'baidu')
|
||||
text = referrer_message.baidu[0] + referrer.search.split('&wd=')[1].split('&')[0] + referrer_message.baidu[1];
|
||||
else if (domain == 'so')
|
||||
text = referrer_message.so[0] + referrer.search.split('&q=')[1].split('&')[0] + referrer_message.so[1];
|
||||
else if (domain == 'google')
|
||||
text = referrer_message.google[0] + document.title.split(referrer_message.google[2])[0] + referrer_message.google[1];
|
||||
else {
|
||||
$.each(result.waifu.referrer_hostname, function(i,val) {if (i==referrer.hostname) referrer.hostname = getRandText(val)});
|
||||
text = referrer_message.default[0] + referrer.hostname + referrer_message.default[1];
|
||||
}
|
||||
} else text = referrer_message.none[0] + document.title.split(referrer_message.none[2])[0] + referrer_message.none[1];
|
||||
}
|
||||
showMessage(text, 6000);
|
||||
}; if (live2d_settings.showWelcomeMessage) showWelcomeMessage(result);
|
||||
|
||||
var waifu_tips = result.waifu;
|
||||
|
||||
function loadOtherModel() {
|
||||
var modelId = modelStorageGetItem('modelId');
|
||||
var modelRandMode = live2d_settings.modelRandMode;
|
||||
|
||||
$.ajax({
|
||||
cache: modelRandMode == 'switch' ? true : false,
|
||||
url: live2d_settings.modelAPI+modelRandMode+'/?id='+modelId,
|
||||
dataType: "json",
|
||||
success: function(result) {
|
||||
loadModel(result.model['id']);
|
||||
var message = result.model['message'];
|
||||
$.each(waifu_tips.model_message, function(i,val) {if (i==result.model['id']) message = getRandText(val)});
|
||||
showMessage(message, 3000, true);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function loadRandTextures() {
|
||||
var modelId = modelStorageGetItem('modelId');
|
||||
var modelTexturesId = modelStorageGetItem('modelTexturesId');
|
||||
var modelTexturesRandMode = live2d_settings.modelTexturesRandMode;
|
||||
|
||||
$.ajax({
|
||||
cache: modelTexturesRandMode == 'switch' ? true : false,
|
||||
url: live2d_settings.modelAPI+modelTexturesRandMode+'_textures/?id='+modelId+'-'+modelTexturesId,
|
||||
dataType: "json",
|
||||
success: function(result) {
|
||||
if (result.textures['id'] == 1 && (modelTexturesId == 1 || modelTexturesId == 0))
|
||||
showMessage(waifu_tips.load_rand_textures[0], 3000, true);
|
||||
else showMessage(waifu_tips.load_rand_textures[1], 3000, true);
|
||||
loadModel(modelId, result.textures['id']);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function modelStorageGetItem(key) { return live2d_settings.modelStorage ? localStorage.getItem(key) : sessionStorage.getItem(key); }
|
||||
|
||||
/* 检测用户活动状态，并在空闲时显示一言 */
|
||||
if (live2d_settings.showHitokoto) {
|
||||
window.getActed = false; window.hitokotoTimer = 0; window.hitokotoInterval = false;
|
||||
$(document).mousemove(function(e){getActed = true;}).keydown(function(){getActed = true;});
|
||||
setInterval(function(){ if (!getActed) ifActed(); else elseActed(); }, 1000);
|
||||
}
|
||||
|
||||
function ifActed() {
|
||||
if (!hitokotoInterval) {
|
||||
hitokotoInterval = true;
|
||||
hitokotoTimer = window.setInterval(showHitokotoActed, 30000);
|
||||
}
|
||||
}
|
||||
|
||||
function elseActed() {
|
||||
getActed = hitokotoInterval = false;
|
||||
window.clearInterval(hitokotoTimer);
|
||||
}
|
||||
|
||||
function showHitokotoActed() {
|
||||
if ($(document)[0].visibilityState == 'visible') showHitokoto();
|
||||
}
|
||||
|
||||
function showHitokoto() {
|
||||
switch(live2d_settings.hitokotoAPI) {
|
||||
case 'lwl12.com':
|
||||
$.getJSON('https://api.lwl12.com/hitokoto/v1?encode=realjson',function(result){
|
||||
if (!empty(result.source)) {
|
||||
var text = waifu_tips.hitokoto_api_message['lwl12.com'][0];
|
||||
if (!empty(result.author)) text += waifu_tips.hitokoto_api_message['lwl12.com'][1];
|
||||
text = text.render({source: result.source, creator: result.author});
|
||||
window.setTimeout(function() {showMessage(text+waifu_tips.hitokoto_api_message['lwl12.com'][2], 3000, true);}, 5000);
|
||||
} showMessage(result.text, 5000, true);
|
||||
});break;
|
||||
case 'fghrsh.net':
|
||||
$.getJSON('https://api.fghrsh.net/hitokoto/rand/?encode=jsc&uid=3335',function(result){
|
||||
if (!empty(result.source)) {
|
||||
var text = waifu_tips.hitokoto_api_message['fghrsh.net'][0];
|
||||
text = text.render({source: result.source, date: result.date});
|
||||
window.setTimeout(function() {showMessage(text, 3000, true);}, 5000);
|
||||
showMessage(result.hitokoto, 5000, true);
|
||||
}
|
||||
});break;
|
||||
case 'jinrishici.com':
|
||||
$.ajax({
|
||||
url: 'https://v2.jinrishici.com/one.json',
|
||||
xhrFields: {withCredentials: true},
|
||||
success: function (result, status) {
|
||||
if (!empty(result.data.origin.title)) {
|
||||
var text = waifu_tips.hitokoto_api_message['jinrishici.com'][0];
|
||||
text = text.render({title: result.data.origin.title, dynasty: result.data.origin.dynasty, author:result.data.origin.author});
|
||||
window.setTimeout(function() {showMessage(text, 3000, true);}, 5000);
|
||||
} showMessage(result.data.content, 5000, true);
|
||||
}
|
||||
});break;
|
||||
default:
|
||||
$.getJSON('https://v1.hitokoto.cn',function(result){
|
||||
if (!empty(result.from)) {
|
||||
var text = waifu_tips.hitokoto_api_message['hitokoto.cn'][0];
|
||||
text = text.render({source: result.from, creator: result.creator});
|
||||
window.setTimeout(function() {showMessage(text, 3000, true);}, 5000);
|
||||
}
|
||||
showMessage(result.hitokoto, 5000, true);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$('.waifu-tool .fui-eye').click(function (){loadOtherModel()});
|
||||
$('.waifu-tool .fui-user').click(function (){loadRandTextures()});
|
||||
$('.waifu-tool .fui-chat').click(function (){showHitokoto()});
|
||||
}
|
||||
101
src/assets/waifu-tips.json
Normal file
101
src/assets/waifu-tips.json
Normal file
@ -0,0 +1,101 @@
|
||||
{
|
||||
"waifu": {
|
||||
"console_open_msg": ["哈哈，你打开了控制台，是想要看看我的秘密吗？"],
|
||||
"copy_message": ["你都复制了些什么呀，转载要记得加上出处哦"],
|
||||
"screenshot_message": ["照好了嘛，是不是很可爱呢？"],
|
||||
"hidden_message": ["我们还能再见面的吧…"],
|
||||
"load_rand_textures": ["我还没有其他衣服呢", "我的新衣服好看嘛"],
|
||||
"hour_tips": {
|
||||
"t5-7": ["早上好！一日之计在于晨，美好的一天就要开始了"],
|
||||
"t7-11": ["上午好！工作顺利嘛，不要久坐，多起来走动走动哦！"],
|
||||
"t11-14": ["中午了，工作了一个上午，现在是午餐时间！"],
|
||||
"t14-17": ["午后很容易犯困呢，今天的运动目标完成了吗？"],
|
||||
"t17-19": ["傍晚了！窗外夕阳的景色很美丽呢，最美不过夕阳红~"],
|
||||
"t19-21": ["晚上好，今天过得怎么样？"],
|
||||
"t21-23": ["已经这么晚了呀，早点休息吧，晚安~"],
|
||||
"t23-5": ["你是夜猫子呀？这么晚还不睡觉，明天起的来嘛"],
|
||||
"default": ["嗨~ 快来逗我玩吧！"]
|
||||
},
|
||||
"referrer_message": {
|
||||
"localhost": ["欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "],
|
||||
"baidu": ["Hello! 来自 百度搜索 的朋友<br>你是搜索 <span style=\"color:#0099cc;\">", "</span> 找到的我吗？"],
|
||||
"so": ["Hello! 来自 360搜索 的朋友<br>你是搜索 <span style=\"color:#0099cc;\">", "</span> 找到的我吗？"],
|
||||
"google": ["Hello! 来自 谷歌搜索 的朋友<br>欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "],
|
||||
"default": ["Hello! 来自 <span style=\"color:#0099cc;\">", "</span> 的朋友"],
|
||||
"none": ["欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "]
|
||||
},
|
||||
"referrer_hostname": {
|
||||
"example.com": ["示例网站"],
|
||||
"www.fghrsh.net": ["FGHRSH 的博客"]
|
||||
},
|
||||
"model_message": {
|
||||
"1": ["来自 Potion Maker 的 Pio 酱 ~"],
|
||||
"2": ["来自 Potion Maker 的 Tia 酱 ~"]
|
||||
},
|
||||
"hitokoto_api_message": {
|
||||
"lwl12.com": ["这句一言来自 <span style=\"color:#0099cc;\">『{source}』</span>", "，是 <span style=\"color:#0099cc;\">{creator}</span> 投稿的", "。"],
|
||||
"fghrsh.net": ["这句一言出处是 <span style=\"color:#0099cc;\">『{source}』</span>，是 <span style=\"color:#0099cc;\">FGHRSH</span> 在 {date} 收藏的！"],
|
||||
"jinrishici.com": ["这句诗词出自 <span style=\"color:#0099cc;\">《{title}》</span>，是 {dynasty}诗人 {author} 创作的！"],
|
||||
"hitokoto.cn": ["这句一言来自 <span style=\"color:#0099cc;\">『{source}』</span>，是 <span style=\"color:#0099cc;\">{creator}</span> 在 hitokoto.cn 投稿的。"]
|
||||
}
|
||||
},
|
||||
"mouseover": [
|
||||
{ "selector": ".container a[href^='http']", "text": ["要看看 <span style=\"color:#0099cc;\">{text}</span> 么？"] },
|
||||
{ "selector": ".fui-home", "text": ["点击前往首页，想回到上一页可以使用浏览器的后退功能哦"] },
|
||||
{ "selector": ".fui-chat", "text": ["一言一语，一颦一笑。一字一句，一颗赛艇。"] },
|
||||
{ "selector": ".fui-eye", "text": ["嗯··· 要切换 看板娘 吗？"] },
|
||||
{ "selector": ".fui-user", "text": ["喜欢换装 Play 吗？"] },
|
||||
{ "selector": ".fui-photo", "text": ["要拍张纪念照片吗？"] },
|
||||
{ "selector": ".fui-info-circle", "text": ["这里有关于我的信息呢"] },
|
||||
{ "selector": ".fui-cross", "text": ["你不喜欢我了吗..."] },
|
||||
{ "selector": "#tor_show", "text": ["翻页比较麻烦吗，点击可以显示这篇文章的目录呢"] },
|
||||
{ "selector": "#comment_go", "text": ["想要去评论些什么吗？"] },
|
||||
{ "selector": "#night_mode", "text": ["深夜时要爱护眼睛呀"] },
|
||||
{ "selector": "#qrcode", "text": ["手机扫一下就能继续看，很方便呢"] },
|
||||
{ "selector": ".comment_reply", "text": ["要吐槽些什么呢"] },
|
||||
{ "selector": "#back-to-top", "text": ["回到开始的地方吧"] },
|
||||
{ "selector": "#author", "text": ["该怎么称呼你呢"] },
|
||||
{ "selector": "#mail", "text": ["留下你的邮箱，不然就是无头像人士了"] },
|
||||
{ "selector": "#url", "text": ["你的家在哪里呢，好让我去参观参观"] },
|
||||
{ "selector": "#textarea", "text": ["认真填写哦，垃圾评论是禁止事项"] },
|
||||
{ "selector": ".OwO-logo", "text": ["要插入一个表情吗"] },
|
||||
{ "selector": "#csubmit", "text": ["要[提交]^(Commit)了吗，首次评论需要审核，请耐心等待~"] },
|
||||
{ "selector": ".ImageBox", "text": ["点击图片可以放大呢"] },
|
||||
{ "selector": "input[name=s]", "text": ["找不到想看的内容？搜索看看吧"] },
|
||||
{ "selector": ".previous", "text": ["去上一页看看吧"] },
|
||||
{ "selector": ".next", "text": ["去下一页看看吧"] },
|
||||
{ "selector": ".dropdown-toggle", "text": ["这里是菜单"] },
|
||||
{ "selector": "c-player a.play-icon", "text": ["想要听点音乐吗"] },
|
||||
{ "selector": "c-player div.time", "text": ["在这里可以调整<span style=\"color:#0099cc;\">播放进度</span>呢"] },
|
||||
{ "selector": "c-player div.volume", "text": ["在这里可以调整<span style=\"color:#0099cc;\">音量</span>呢"] },
|
||||
{ "selector": "c-player div.list-button", "text": ["<span style=\"color:#0099cc;\">播放列表</span>里都有什么呢"] },
|
||||
{ "selector": "c-player div.lyric-button", "text": ["有<span style=\"color:#0099cc;\">歌词</span>的话就能跟着一起唱呢"] },
|
||||
{ "selector": ".waifu #live2d", "text": ["干嘛呢你，快把手拿开", "鼠…鼠标放错地方了！"] }
|
||||
],
|
||||
"click": [
|
||||
{
|
||||
"selector": ".waifu #live2d",
|
||||
"text": [
|
||||
"是…是不小心碰到了吧",
|
||||
"萝莉控是什么呀",
|
||||
"你看到我的小熊了吗",
|
||||
"再摸的话我可要报警了！⌇●﹏●⌇",
|
||||
"110吗，这里有个变态一直在摸我(ó﹏ò｡)"
|
||||
]
|
||||
}
|
||||
],
|
||||
"seasons": [
|
||||
{ "date": "01/01", "text": ["<span style=\"color:#0099cc;\">元旦</span>了呢，新的一年又开始了，今年是{year}年~"] },
|
||||
{ "date": "02/14", "text": ["又是一年<span style=\"color:#0099cc;\">情人节</span>，{year}年找到对象了嘛~"] },
|
||||
{ "date": "03/08", "text": ["今天是<span style=\"color:#0099cc;\">妇女节</span>！"] },
|
||||
{ "date": "03/12", "text": ["今天是<span style=\"color:#0099cc;\">植树节</span>，要保护环境呀"] },
|
||||
{ "date": "04/01", "text": ["悄悄告诉你一个秘密~<span style=\"background-color:#34495e;\">今天是愚人节，不要被骗了哦~</span>"] },
|
||||
{ "date": "05/01", "text": ["今天是<span style=\"color:#0099cc;\">五一劳动节</span>，计划好假期去哪里了吗~"] },
|
||||
{ "date": "06/01", "text": ["<span style=\"color:#0099cc;\">儿童节</span>了呢，快活的时光总是短暂，要是永远长不大该多好啊…"] },
|
||||
{ "date": "09/03", "text": ["<span style=\"color:#0099cc;\">中国人民抗日战争胜利纪念日</span>，铭记历史、缅怀先烈、珍爱和平、开创未来。"] },
|
||||
{ "date": "09/10", "text": ["<span style=\"color:#0099cc;\">教师节</span>，在学校要给老师问声好呀~"] },
|
||||
{ "date": "10/01", "text": ["<span style=\"color:#0099cc;\">国庆节</span>，新中国已经成立69年了呢"] },
|
||||
{ "date": "11/05-11/12", "text": ["今年的<span style=\"color:#0099cc;\">双十一</span>是和谁一起过的呢~"] },
|
||||
{ "date": "12/20-12/31", "text": ["这几天是<span style=\"color:#0099cc;\">圣诞节</span>，主人肯定又去剁手买买买了~"] }
|
||||
]
|
||||
}
|
||||
253
src/assets/waifu.css
Normal file
253
src/assets/waifu.css
Normal file
@ -0,0 +1,253 @@
|
||||
.waifu {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
font-size: 0;
|
||||
-webkit-transform: translateY(3px);
|
||||
transform: translateY(3px);
|
||||
}
|
||||
.waifu:hover {
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
}
|
||||
.waifu-tips {
|
||||
opacity: 0;
|
||||
margin: -20px 20px;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid rgba(224, 186, 140, 0.62);
|
||||
border-radius: 12px;
|
||||
background-color: rgba(236, 217, 188, 0.5);
|
||||
box-shadow: 0 3px 15px 2px rgba(191, 158, 118, 0.2);
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
animation-delay: 5s;
|
||||
animation-duration: 50s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-name: shake;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
.waifu-tool {
|
||||
display: none;
|
||||
color: #aaa;
|
||||
top: 50px;
|
||||
right: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
.waifu:hover .waifu-tool {
|
||||
display: block;
|
||||
}
|
||||
.waifu-tool span {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
color: #5b6c7d;
|
||||
transition: 0.2s;
|
||||
}
|
||||
.waifu-tool span:hover {
|
||||
color: #34495e;
|
||||
}
|
||||
.waifu #live2d{
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@keyframes shake {
|
||||
2% {
|
||||
transform: translate(0.5px, -1.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
4% {
|
||||
transform: translate(0.5px, 1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
6% {
|
||||
transform: translate(1.5px, 1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
8% {
|
||||
transform: translate(2.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
10% {
|
||||
transform: translate(0.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
12% {
|
||||
transform: translate(1.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
14% {
|
||||
transform: translate(0.5px, 0.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
16% {
|
||||
transform: translate(-1.5px, -0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
18% {
|
||||
transform: translate(0.5px, 0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
20% {
|
||||
transform: translate(2.5px, 2.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
22% {
|
||||
transform: translate(0.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
24% {
|
||||
transform: translate(-1.5px, 1.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
26% {
|
||||
transform: translate(1.5px, 0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
28% {
|
||||
transform: translate(-0.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
30% {
|
||||
transform: translate(1.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
32% {
|
||||
transform: translate(2.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
34% {
|
||||
transform: translate(2.5px, 2.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
36% {
|
||||
transform: translate(0.5px, -1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
38% {
|
||||
transform: translate(2.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
40% {
|
||||
transform: translate(-0.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
42% {
|
||||
transform: translate(-1.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
44% {
|
||||
transform: translate(-1.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
46% {
|
||||
transform: translate(1.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
48% {
|
||||
transform: translate(2.5px, -0.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(-1.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
52% {
|
||||
transform: translate(-0.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
54% {
|
||||
transform: translate(-1.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
56% {
|
||||
transform: translate(0.5px, 2.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
58% {
|
||||
transform: translate(2.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translate(2.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
62% {
|
||||
transform: translate(-1.5px, 0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
64% {
|
||||
transform: translate(-1.5px, 1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
66% {
|
||||
transform: translate(0.5px, 2.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
68% {
|
||||
transform: translate(2.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: translate(2.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
72% {
|
||||
transform: translate(-0.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
74% {
|
||||
transform: translate(-1.5px, 2.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
76% {
|
||||
transform: translate(-1.5px, 2.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
78% {
|
||||
transform: translate(-1.5px, 2.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
80% {
|
||||
transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
82% {
|
||||
transform: translate(-1.5px, 0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
84% {
|
||||
transform: translate(-0.5px, 0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
86% {
|
||||
transform: translate(2.5px, 1.5px) rotate(0.5deg);
|
||||
}
|
||||
|
||||
88% {
|
||||
transform: translate(-1.5px, 0.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: translate(-1.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
92% {
|
||||
transform: translate(-1.5px, -1.5px) rotate(1.5deg);
|
||||
}
|
||||
|
||||
94% {
|
||||
transform: translate(0.5px, 0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
96% {
|
||||
transform: translate(2.5px, -0.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
98% {
|
||||
transform: translate(-1.5px, -1.5px) rotate(-0.5deg);
|
||||
}
|
||||
|
||||
0%, 100% {
|
||||
transform: translate(0, 0) rotate(0);
|
||||
}
|
||||
}
|
||||
68
src/components/Live2d/index.vue
Normal file
68
src/components/Live2d/index.vue
Normal file
@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="index">
|
||||
<div class="waifu">
|
||||
|
||||
<!-- 提示框 -->
|
||||
<div class="waifu-tips"></div>
|
||||
|
||||
<!-- 看板娘画布 -->
|
||||
<canvas id="live2d" class="live2d"/>
|
||||
|
||||
<!-- 工具栏 -->
|
||||
<div class="waifu-tool">
|
||||
<p class="fui-home">
|
||||
<i class="el-icon-s-home"/>
|
||||
</p>
|
||||
<p class="fui-chat">
|
||||
<i class="el-icon-upload"/>
|
||||
</p>
|
||||
<p class="fui-eye">
|
||||
<i class="el-icon-share"/>
|
||||
</p>
|
||||
<p class="fui-user">
|
||||
<i class="el-icon-warning"/>
|
||||
</p>
|
||||
<p class="fui-photo">
|
||||
<i class="el-icon-camera-solid"/>
|
||||
</p>
|
||||
<p class="fui-info-circle">
|
||||
<i class="el-icon-s-comment"/>
|
||||
</p>
|
||||
<p class="fui-cross">
|
||||
<i class="el-icon-error"/>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import '@/assets/waifu-tips'
|
||||
import '@/assets/live2d'
|
||||
import '@/assets/waifu.css'
|
||||
import { initModel } from '@/assets/waifu-tips'
|
||||
export default {
|
||||
name: 'PhyLive2d',
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
live2d_settings['modelId'] = 5; // 默认模型 ID
|
||||
live2d_settings['modelTexturesId'] = 1; // 默认材质 ID
|
||||
/* 在 initModel 前添加 */
|
||||
initModel(require("@/assets/waifu-tips.json"))
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.waifu-tool p i {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
10
src/main.js
Normal file
10
src/main.js
Normal file
@ -0,0 +1,10 @@
|
||||
import Vue from 'vue';
|
||||
import App from './App.vue';
|
||||
import ElementUI from 'element-ui';
|
||||
import 'element-ui/lib/theme-chalk/index.css';
|
||||
Vue.use(ElementUI);
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
new Vue({
|
||||
render: h => h(App)
|
||||
}).$mount('#app');
|
||||
55
vue.config.js
Normal file
55
vue.config.js
Normal file
@ -0,0 +1,55 @@
|
||||
module.exports = {
|
||||
// 基本路径
|
||||
publicPath: '/',
|
||||
// 输出文件目录
|
||||
outputDir: 'dist',
|
||||
// eslint-loader 是否在保存的时候检查
|
||||
lintOnSave: false,
|
||||
// use the full build with in-browser compiler?
|
||||
// https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
|
||||
runtimeCompiler: false,
|
||||
// webpack配置
|
||||
// see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
|
||||
chainWebpack: () => {},
|
||||
configureWebpack: () => {},
|
||||
// vue-loader 配置项
|
||||
// https://vue-loader.vuejs.org/en/options.html
|
||||
// vueLoader: {},
|
||||
// 生产环境是否生成 sourceMap 文件
|
||||
productionSourceMap: false,
|
||||
// css相关配置
|
||||
/*css: {
|
||||
// 是否使用css分离插件 ExtractTextPlugin
|
||||
extract: true,
|
||||
// 开启 CSS source maps?
|
||||
sourceMap: false,
|
||||
// css预设器配置项
|
||||
loaderOptions: {},
|
||||
// 启用 CSS modules for all css / pre-processor files.
|
||||
modules: false
|
||||
},*/
|
||||
// use thread-loader for babel & TS in production build
|
||||
// enabled by default if the machine has more than 1 cores
|
||||
parallel: require('os').cpus().length > 1,
|
||||
// 是否启用dll
|
||||
// See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#dll-mode
|
||||
// dll: false,
|
||||
// PWA 插件相关配置
|
||||
// see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
|
||||
pwa: {},
|
||||
// webpack-dev-server 相关配置
|
||||
devServer: {
|
||||
// open: process.platform === 'darwin',
|
||||
//将服务启动后默认打开浏览器
|
||||
open: true,
|
||||
host: '0.0.0.0',
|
||||
port: 8080,
|
||||
https: false,
|
||||
hotOnly: false,
|
||||
before: app => {}
|
||||
},
|
||||
// 第三方插件配置
|
||||
pluginOptions: {
|
||||
// ...
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user