-
Notifications
You must be signed in to change notification settings - Fork 245
/
index.html
163 lines (138 loc) · 5.58 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>能不能好好说话？</title>
<link rel="stylesheet" href="document.css">
<meta name="viewport" content="width=device-width,user-scalable=0">
<meta name="description" content="拼音首字母缩写释义工具">
</head>
<body>
<div id="el">
<textarea v-model.trim="text" placeholder="输入含有首字母缩写的文字" @input="nbnhhsh"></textarea>
<div class="nbnhhsh-box nbnhhsh-box-doc">
<div class="nbnhhsh-loading" v-if="loading">
加载中…
</div>
<div class="nbnhhsh-tag-list" v-else-if="tags.length">
<div class="nbnhhsh-tag-item" v-for="tag in tags">
<h4>{{tag.name}}</h4>
<div class="nbnhhsh-tran-list" v-if="tag.trans">
<span class="nbnhhsh-tran-item" v-for="tran in transArrange(tag.trans)">
{{tran.text}}<sub v-if="tran.sub">{{tran.sub}}</sub>
</span>
</div>
<div class="nbnhhsh-notran-box" v-else-if="tag.trans===null">
无对应文字
</div>
<div v-else-if="tag.inputting && tag.inputting.length !==0">
<div class="nbnhhsh-inputting-list">
<h5>有可能是</h5>
<span class="nbnhhsh-inputting-item" v-for="input in tag.inputting">{{input}}</span>
</div>
</div>
<div class="nbnhhsh-notran-box" v-else @click.prevent="submitTran(tag.name)">
尚未录入，我来提交对应文字
</div>
<a v-if="tag.trans!==null" @click.prevent="submitTran(tag.name)" class="nbnhhsh-add-btn" title="我来提交对应文字"></a>
</div>
</div>
<div class="nbnhhsh-loading" v-else-if="text">
没有匹配到拼音首字母缩写
</div>
</div>
</div>
<div class="content-box">
<h2>为什么做这东西？</h2>
<p>社交平台上通过拼音首字母缩写指代特定词句的情况越来越多，为了让更多人能勉强理解这一门另类沟通方式、做了这一个划词转义工具。</p>
<h2>什么是用户脚本？</h2>
<p>用户脚本是一段代码，它们能够优化您的网页浏览体验。安装之后，有些脚本能为网站添加新的功能，有些能使网站的界面更加易用，有些则能隐藏网站上烦人的部分内容。用户脚本都是由用户编写并向全世界发表的，您可以免费安装，轻松体验。</p>
<p>用户脚本管理器安装过程可参考 <a href="https://greasyfork.org/zh-CN/#home-step-1" target="_blank">https://greasyfork.org/</a> 首页的，<b>安装一个用户脚本管理器</b> 章节</p>
<h2>如何安装网页划词释义用户脚本？</h2>
<p>安装好用户脚本管理器之后，访问 <a href="nbnhhsh.user.js">nbnhhsh.user.js</a> 完成脚本安装</p>
<blockquote>
<p>脚本版本目前会在 <b>微博</b>、<b>贴吧</b>、<b>哔哩哔哩</b> 页面下运行，划词时会提交所选文字以用于转义。</p>
</blockquote>
<h2>如何在更多网站上使用这个用户脚本？</h2>
<p>在对应的用户脚本配置里可以设置 <b>用户匹配</b>，添加对应 URL 规则即可。</p>
<h2>贡献词条</h2>
<p>在每一个词条右上角都有 <code>+</code> 图标的按钮，点击可以提交对应文字，审核后会整理录入。</p>
<h2>给个人网站添加划词转义？</h2>
<p>在需要划词转义的页面 <code></body></code> 前，添加如下代码即可。</p>
<pre><script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
<script src="https://lab.magiconch.com/nbnhhsh/nbnhhsh.user.js"></script></pre>
<h2>打赏</h2>
<p>
<img src="sponsor.png" alt="支付宝打赏">
</p>
<h2>仓库地址</h2>
<p><a href="https://github.com/itorr/nbnhhsh" target="_blank">https://github.com/itorr/nbnhhsh</a></p>
<h2>GreasyFork</h2>
<p><a href="https://greasyfork.org/zh-CN/scripts/398555" target="_blank">https://greasyfork.org/scripts/398555</a></p>
</div>
<script src="/vue.2.6.11.min.js"></script>
<script src="nbnhhsh.user.js"></script>
<script>
let guessTimer;
const app = new Vue({
el,
data: {
text:'',
tags:[],
waiting:false,
loading:false,
},
methods: {
...Nbnhhsh,
nbnhhsh(){
// app.tags = [];
// app.waiting = true;
clearTimeout(guessTimer);
guessTimer = setTimeout(_=>{
let text = this.text;
// app.waiting = false;
if(!text || !/[a-z0-9]{2,}/i.test(text)) return app.tags = [];
app.loading = true;
this.guess(text,data=>{
app.loading = false;
if(!data.length){
app.show = false;
}else{
app.tags = data;
}
});
},400);
// location.hash = text?'#/text/'+encodeURIComponent(text):'';
}
}
});
const searchStringArray = location.hash.substr(2).split('/');
const Search = {};
for(let i = 0;i<searchStringArray.length;i+=2){
Search[decodeURIComponent(searchStringArray[i])] = decodeURIComponent(searchStringArray[i+1]);
}
app.text = Search.text || '';
app.nbnhhsh();
const loadScript = (src,onLoad=_=>{},el) =>{
el = document.createElement('script');
el.src = src;
el.onload = onLoad;
document.body.appendChild(el);
};
window._hmt = [];
const gtmId = 'G-13BQC1VDD8';
window.dataLayer = [
['js', new Date()],
['config', gtmId]
];
window.gtag = function(){dataLayer.push(arguments)};
setTimeout(_=>{
loadScript('https://hm.baidu.com/hm.js?f4e477c61adf5c145ce938a05611d5f0');
loadScript('https://www.googletagmanager.com/gtag/js?id='+gtmId);
loadScript('https://sdk.51.la/js-sdk-pro.min.js',_=>{
LA.init({id: "JgPCvOAtY0gH7fbQ",ck: "JgPCvOAtY0gH7fbQ",autoTrack:true,hashMode:true})
})
},1400);
</script>
</body>
</html>