Skip to content

Commit

Permalink
1.4.2
Browse files Browse the repository at this point in the history
增加 内置 waifu-tips.json demo
增加 不储存模型 ID 设置项 (刷新恢复)
  • Loading branch information
fghrsh committed Nov 12, 2018
1 parent 8ae7573 commit 1a7dca2
Show file tree
Hide file tree
Showing 8 changed files with 519 additions and 94 deletions.
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Live2D Demo
# Live2D demo

Live2D 看板娘插件 (https://www.fghrsh.net/post/123.html) 的前端 HTML 源码

Expand Down Expand Up @@ -134,6 +134,7 @@ try {

- 模型切换模式

- `live2d_settings['modelStorage']`,记录 ID (刷新后恢复),`true` | `false`
- `live2d_settings['modelRandMode']`,模型切换,可选 `'rand'` (随机) | `'switch'` (顺序)
- `live2d_settings['modelTexturesRandMode']`,材质切换,可选 `'rand'` | `'switch'`

Expand Down
8 changes: 5 additions & 3 deletions assets/autoload.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,13 @@
try {
$("<link>").attr({href: "assets/waifu.css", rel: "stylesheet", type: "text/css"}).appendTo('head');
$("<link>").attr({href: "assets/waifu.min.css?v=1.4.2", rel: "stylesheet", type: "text/css"}).appendTo('head');
$('body').append('<div class="waifu"><div class="waifu-tips"></div><canvas id="live2d" class="live2d"></canvas><div class="waifu-tool"><span class="fui-home"></span> <span class="fui-chat"></span> <span class="fui-eye"></span> <span class="fui-user"></span> <span class="fui-photo"></span> <span class="fui-info-circle"></span> <span class="fui-cross"></span></div></div>');
$.ajax({url: 'assets/waifu-tips.js',dataType:"script", cache: true, async: false});
$.ajax({url: 'assets/live2d.js',dataType:"script", cache: true, async: false});
$.ajax({url: 'assets/waifu-tips.min.js?v=1.4.2',dataType:"script", cache: true, async: false});
$.ajax({url: 'assets/live2d.min.js?v=1.0.5',dataType:"script", cache: true, async: false});
/* 可直接修改部分参数 */
live2d_settings['hitokotoAPI'] = 'hitokoto.cn'; // 一言 API
live2d_settings['modelId'] = 5; // 默认模型 ID
live2d_settings['modelTexturesId'] = 1; // 默认材质 ID
live2d_settings['modelStorage'] = false; // 不储存模型 ID
/* 在 initModel 前添加 */
initModel('assets/waifu-tips.json');
} catch(err) { console.log('[Error] JQuery is not defined.') }
24 changes: 12 additions & 12 deletions assets/waifu-tips.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ window.live2d_settings = Array(); /*
く__,.ヘヽ.    / ,ー、 〉
     \ ', !-─‐-i / /´
      /`ー'    L//`ヽ、 Live2D 看板娘 参数设置
     /  /,  /|  ,  ,    ', Version 1.4
   イ  / /-‐/ i L_ ハ ヽ!  i Update 2018.11.10
     /  /,  /|  ,  ,    ', Version 1.4.2
   イ  / /-‐/ i L_ ハ ヽ!  i Update 2018.11.12
    レ ヘ 7イ`ト  レ'ァ-ト、!ハ|  |
     !,/7 '0'   ´0iソ|   |   
     |.从"  _   ,,,, / |./   | 网页添加 Live2D 看板娘
Expand Down Expand Up @@ -39,6 +39,7 @@ live2d_settings['canTurnToHomePage'] = true; // 显示 返回首页
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'(顺序)

Expand All @@ -63,15 +64,14 @@ live2d_settings['waifuDraggable'] = 'disable'; // 拖拽样式,例如
live2d_settings['waifuDraggableRevert'] = true; // 松开鼠标还原拖拽位置,可选 true(真), false(假)

// 其他杂项设置
live2d_settings['l2dVersion'] = '1.4'; // 当前版本
live2d_settings['l2dVerDate'] = '2018.11.10'; // 版本更新日期
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;

Expand Down Expand Up @@ -187,19 +187,19 @@ function initModel(waifuPath, type) {
var modelId = localStorage.getItem('modelId');
var modelTexturesId = localStorage.getItem('modelTexturesId');

if (modelId == null) {
if (!live2d_settings.modelStorage || modelId == null) {
var modelId = live2d_settings.modelId;
var modelTexturesId = live2d_settings.modelTexturesId;
} loadModel(modelId, modelTexturesId);
}

function loadModel(modelId, modelTexturesId) {
localStorage.setItem('modelId', modelId);

if (modelTexturesId === undefined) modelTexturesId = 0;
localStorage.setItem('modelTexturesId', modelTexturesId);

loadlive2d('live2d', live2d_settings.modelAPI+'get/?id='+modelId+'-'+modelTexturesId, (live2d_settings.showF12Status ? console.log('[Status]','live2d','模型',modelId+'-'+modelTexturesId,'加载完成'):null));
if (live2d_settings.modelStorage) {
localStorage.setItem('modelId', modelId);
if (modelTexturesId === undefined) modelTexturesId = 0;
localStorage.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) {
Expand Down
23 changes: 0 additions & 23 deletions autoload_demo.html

This file was deleted.

55 changes: 0 additions & 55 deletions demo.html

This file was deleted.

117 changes: 117 additions & 0 deletions demo1-default.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Live2D 看板娘 v1.4 / Demo 1</title>
<link rel="stylesheet" type="text/css" href="assets/waifu.min.css?v=1.4.2"/>
</head>
<body style="font-family: 'Microsoft YaHei';">
<h2><a href="https://www.fghrsh.net/post/123.html" style="color: #38A3DB; text-decoration: none;">Live2D 看板娘 v1.4</a> / Demo 1</h2>
<h3> - 常规引用 <span style="font-size: 12px;color: #666">(常规博客引用推荐)</span></h3>
<ul>
<li><span title="常规博客引用推荐">Demo 1 (当前面页)</span></li>
<li><a href="demo2-autoload.html" style="color: #38A3DB; text-decoration: none;" title="一般网站引用推荐">Demo 2 - 自动加载 autoload.js</a></li>
<li><a href="demo3-waifu-tips.html" style="color: #38A3DB; text-decoration: none;" title="博客园等网站引用推荐">Demo 3 - 内置 waifu-tips.json</a></li>
</ul>

<code><pre>
&lt;!DOCTYPE html&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;
&lt;head&gt;
&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot; /&gt;
&lt;title&gt;Live2D 看板娘 v1.4 / Demo 1&lt;/title&gt;
&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;assets/waifu.min.css?v=1.4.2&quot;/&gt;
&lt;/head&gt;
&lt;body style=&quot;font-family: &#x27;Microsoft YaHei&#x27;;&quot;&gt;
&lt;h2&gt;&lt;a href=&quot;https://www.fghrsh.net/post/123.html&quot; style=&quot;color: #38A3DB; text-decoration: none;&quot;&gt;Live2D 看板娘 v1.4&lt;/a&gt; / Demo 1&lt;/h2&gt;
&lt;h3&gt; - 常规引用 &lt;span style=&quot;font-size: 12px;color: #666&quot;&gt;(常规博客引用推荐)&lt;/span&gt;&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;&lt;span title=&quot;常规博客引用推荐&quot;&gt;Demo 1 (当前面页)&lt;/span&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;demo2-autoload.html&quot; style=&quot;color: #38A3DB; text-decoration: none;&quot; title=&quot;一般网站引用推荐&quot;&gt;Demo 2 - 自动加载 autoload.js&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;demo3-waifu-tips.html&quot; style=&quot;color: #38A3DB; text-decoration: none;&quot; title=&quot;博客园等网站引用推荐&quot;&gt;Demo 3 - 内置 waifu-tips.json&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;!-- waifu-tips.js 依赖 JQuery 库 --&gt;
&lt;script src=&quot;assets/jquery.min.js?v=3.3.1&quot;&gt;&lt;/script&gt;

&lt;!-- 实现拖动效果,需引入 JQuery UI --&gt;
&lt;script src=&quot;assets/jquery-ui.min.js?v=1.12.1&quot;&gt;&lt;/script&gt;

&lt;div class=&quot;waifu&quot;&gt;
&lt;div class=&quot;waifu-tips&quot;&gt;&lt;/div&gt;
&lt;canvas id=&quot;live2d&quot; class=&quot;live2d&quot;&gt;&lt;/canvas&gt;
&lt;div class=&quot;waifu-tool&quot;&gt;
&lt;span class=&quot;fui-home&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-chat&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-eye&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-user&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-photo&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-info-circle&quot;&gt;&lt;/span&gt;
&lt;span class=&quot;fui-cross&quot;&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;

&lt;script src=&quot;assets/waifu-tips.min.js?v=1.4.2&quot;&gt;&lt;/script&gt;
&lt;script src=&quot;assets/live2d.min.js?v=1.0.5&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
/* 可直接修改部分参数 */
live2d_settings[&#x27;modelId&#x27;] = 1; // 默认模型 ID
live2d_settings[&#x27;modelTexturesId&#x27;] = 87; // 默认材质 ID
live2d_settings[&#x27;modelStorage&#x27;] = false; // 不储存模型 ID
live2d_settings[&#x27;canCloseLive2d&#x27;] = false; // 隐藏 关闭看板娘 按钮
live2d_settings[&#x27;canTurnToHomePage&#x27;] = false; // 隐藏 返回首页 按钮
live2d_settings[&#x27;waifuSize&#x27;] = &#x27;600x535&#x27;; // 看板娘大小
live2d_settings[&#x27;waifuTipsSize&#x27;] = &#x27;570x150&#x27;; // 提示框大小
live2d_settings[&#x27;waifuFontSize&#x27;] = &#x27;30px&#x27;; // 提示框字体
live2d_settings[&#x27;waifuToolFont&#x27;] = &#x27;36px&#x27;; // 工具栏字体
live2d_settings[&#x27;waifuToolLine&#x27;] = &#x27;50px&#x27;; // 工具栏行高
live2d_settings[&#x27;waifuToolTop&#x27;] = &#x27;-60px&#x27;; // 工具栏顶部边距
live2d_settings[&#x27;waifuDraggable&#x27;] = &#x27;axis-x&#x27;; // 拖拽样式
/* 在 initModel 前添加 */
initModel(&quot;assets/waifu-tips.json?v=1.4.2&quot;)
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre></code>

<!-- waifu-tips.js 依赖 JQuery 库 -->
<script src="assets/jquery.min.js?v=3.3.1"></script>

<!-- 实现拖动效果,需引入 JQuery UI -->
<script src="assets/jquery-ui.min.js?v=1.12.1"></script>

<div class="waifu">
<div class="waifu-tips"></div>
<canvas id="live2d" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>

<script src="assets/waifu-tips.min.js?v=1.4.2"></script>
<script src="assets/live2d.min.js?v=1.0.5"></script>
<script type="text/javascript">
/* 可直接修改部分参数 */
live2d_settings['modelId'] = 1; // 默认模型 ID
live2d_settings['modelTexturesId'] = 87; // 默认材质 ID
live2d_settings['modelStorage'] = false; // 不储存模型 ID
live2d_settings['canCloseLive2d'] = false; // 隐藏 关闭看板娘 按钮
live2d_settings['canTurnToHomePage'] = false; // 隐藏 返回首页 按钮
live2d_settings['waifuSize'] = '600x535'; // 看板娘大小
live2d_settings['waifuTipsSize'] = '570x150'; // 提示框大小
live2d_settings['waifuFontSize'] = '30px'; // 提示框字体
live2d_settings['waifuToolFont'] = '36px'; // 工具栏字体
live2d_settings['waifuToolLine'] = '50px'; // 工具栏行高
live2d_settings['waifuToolTop'] = '-60px'; // 工具栏顶部边距
live2d_settings['waifuDraggable'] = 'axis-x'; // 拖拽样式
/* 在 initModel 前添加 */
initModel("assets/waifu-tips.json?v=1.4.2")
</script>
</body>
</html>
Loading

0 comments on commit 1a7dca2

Please sign in to comment.