Add Custom Content

支持自定义选择器与提示内容，并完善了部分细节
Dreamer-Paul · Feb 1, 2019 · bb7eb8f · bb7eb8f
1 parent 6bb82fd
commit bb7eb8f
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 13 deletions.
diff --git a/Plugin.php b/Plugin.php
@@ -4,7 +4,7 @@
  *
  * @package Pio
  * @author Dreamer-Paul
- * @version 2.1.5
+ * @version 2.2
  * @link https://paugram.com
  */
 
@@ -39,7 +39,7 @@ function paul_update($name, $version){
 
             echo "</div>";
         }
-        paul_update("Pio", "2.1.5");
+        paul_update("Pio", "2.2");
 
         // 读取模型文件夹
         $models = array();
@@ -214,7 +214,7 @@ function getLoader(){
 
             $config["model"] = $model;
 
-            return '<script>var pio = new Paul_Girl(' . json_encode($config, JSON_UNESCAPED_SLASHES) . ');</script>';
+            return '<script>var pio = new Paul_Pio(' . json_encode($config, JSON_UNESCAPED_SLASHES) . ');</script>';
         }
 
         $canvas = getCanvas();

diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 # Pio
-一个支持换模型的 Live2D 插件，供 Typecho 使用。
+一个支持更换 Live2D 模型的 Typecho 插件。
 
-本插件不存在任何依赖的样式和库，在后续版本当中我会逐渐实现一些交互功能。
+本插件不存在任何依赖的样式和库，在后续版本当中我会逐渐实现一些有趣的功能。
 
 ## 使用方法
 1. Star 本项目
@@ -13,7 +13,7 @@
 7. 保罗自己搭建了一个模型资源收集站点 - [梦象](https://mx-model.ga)，你可以在这里下载到更多的模型，如果你有能力的话欢迎为我提供更多资源~
 
 ## 项目故事
-详见我的博文：[给你的博客增加动态看板娘](https://paugram.com/coding/add-poster-girl-with-plugin.html)
+详见我的博文：[给你的博客增加动态看板娘](https://paugram.com/coding/add-poster-girl-with-plugin.html)，帮助文档及常见问题均在这里即时更新。
 
 ## 开源协议
 由于原项目使用 GPL 2.0 协议，故本项目也采用相同的开源协议进行授权。

diff --git a/static/pio.css b/static/pio.css
@@ -2,9 +2,9 @@
 
 # Pio Plugin
 # By: Dreamer-Paul
-# Last Update: 2018.12.30
+# Last Update: 2019.2.1
 
-一个支持换模型的 Live2D 插件，供 Typecho 使用。
+一个支持更换 Live2D 模型的 Typecho 插件。
 
 本代码为奇趣保罗原创，并遵守 MIT 开源协议。欢迎访问我的博客：https://paugram.com
 
@@ -23,11 +23,12 @@
 
 .pio-container .pio-action{
     top: 3em;
-    right: 0;
     opacity: 0;
     position: absolute;
     transition: opacity .3s;
 }
+.pio-container.left .pio-action{ right: 0 }
+.pio-container.right .pio-action{ left: 0 }
 .pio-container:hover .pio-action{ opacity: 1 }
 
 .pio-action span{

diff --git a/static/pio.js b/static/pio.js
@@ -2,15 +2,15 @@
 
 # Pio Plugin
 # By: Dreamer-Paul
-# Last Update: 2019.1.2
+# Last Update: 2019.2.1
 
-一个支持换模型的 Live2D 插件，供 Typecho 使用。
+一个支持更换 Live2D 模型的 Typecho 插件。
 
 本代码为奇趣保罗原创，并遵守 MIT 开源协议。欢迎访问我的博客：https://paugram.com
 
 ---- */
 
-var Paul_Girl = function (prop) {
+var Paul_Pio = function (prop) {
     var current = {
         idol: 0,
         menu: document.querySelector(".pio-container .pio-action"),
@@ -79,7 +79,7 @@ var Paul_Girl = function (prop) {
             if(document.referrer !== "" && document.referrer.indexOf(current.root) === -1){
                 var referrer = document.createElement('a');
                 referrer.href = document.referrer;
-                prop.content.referer ? modules.render(prop.content.referer.replace(/%t/, "“" + referrer.hostname + "”")) : modules.render("欢迎来自 “" + document.referrer + "” 的朋友！");
+                prop.content.referer ? modules.render(prop.content.referer.replace(/%t/, "“" + referrer.hostname + "”")) : modules.render("欢迎来自 “" + referrer.hostname + "” 的朋友！");
             }
             else if(prop.tips){
                 var text, hour = new Date().getHours();
@@ -194,6 +194,23 @@ var Paul_Girl = function (prop) {
             };
             current.menu.appendChild(elements.close);
             document.cookie = "posterGirl=false;" + "path=/";
+        },
+        custom: function () {
+            for(var i = 0; i < prop.content.custom.length; i++){
+                var e = document.querySelectorAll(prop.content.custom[i].s);
+                var c = prop.content.custom[i].t;
+
+                if(e[0]){
+                    for(var j = 0; j < e.length; j++){
+                        e[j].onmouseover = function () {
+                            modules.render(c);
+                        }
+                    }
+                }
+                else{
+                    console.error("Custom Element Not Found!");
+                }
+            }
         }
     };
 
@@ -244,6 +261,8 @@ var Paul_Girl = function (prop) {
                 case "draggable": begin.draggable(); break;
             }
 
+            if(prop.content.custom) action.custom();
+
             loadlive2d("pio", prop.model[0]);
         }
     };