-
Notifications
You must be signed in to change notification settings - Fork 3
/
api.html
121 lines (93 loc) · 5.28 KB
/
api.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
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="/help/stylesheets/stylesheet.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/help/stylesheets/pygment_trac.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/help/stylesheets/print.css" media="print" />
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<title> 在网页里嵌入名字竞技场 </title>
</head>
<body>
<header>
<div class="inner">
<h2 class="innerTitle">名字竞技场</h2>
</div>
<div class="ad">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:inline-block;width:320px;height:100px"
data-ad-client="ca-pub-3283235194066083"
data-ad-slot="1387164256"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</header>
<div id="content-wrapper">
<div class="inner clearfix">
<section id="main-content">
<h2>在网页里嵌入名字竞技场</h2>
<p>名字竞技场支持以iframe形式嵌入其他网页。</p>
<h3 id="section">调用</h3>
<p>嵌入iframe时只需要在网址后面将对战者的名字用Base64编码加在url里就可以。</p>
<div class="language-javascript highlighter-rouge"><pre class="highlight"><code><span class="kd">function</span> <span class="nx">run</span><span class="p">(</span><span class="nx">names</span><span class="p">){</span>
<span class="kd">var</span> <span class="nx">base64</span> <span class="o">=</span> <span class="nb">window</span><span class="p">.</span><span class="nx">btoa</span><span class="p">(</span>
<span class="nx">unescape</span><span class="p">(</span><span class="nb">encodeURIComponent</span><span class="p">(</span><span class="nx">names</span><span class="p">))</span>
<span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/</span><span class="se">\+</span><span class="sr">/g</span><span class="p">,</span><span class="s1">'-'</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/</span><span class="se">\/</span><span class="sr">/g</span><span class="p">,</span><span class="s1">'_'</span><span class="p">);</span>
<span class="nx">iframe</span><span class="p">.</span><span class="nx">src</span> <span class="o">=</span> <span class="s1">'http://namerena.github.io/#n='</span> <span class="o">+</span> <span class="nx">base64</span><span class="p">;</span>
<span class="p">}</span>
</code></pre>
</div>
<h3 id="section-1">回调</h3>
<p>名字竞技场程序会将结果以postMessage方式发送到调用网页。</p>
<p>可以在网页中监听message事件得到战斗结果。</p>
<div class="language-javascript highlighter-rouge"><pre class="highlight"><code><span class="kd">function</span> <span class="nx">onMessage</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">winners</span><span class="p">);</span>
<span class="p">}</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s1">'message'</span><span class="p">,</span> <span class="nx">onMessage</span><span class="p">);</span>
</code></pre>
</div>
<p>回调参数</p>
<ul>
<li>data.winners: 数组，获胜队伍所有成员名字</li>
<li>data.all: 二维数组，以队伍划分的所有名字</li>
</ul>
<h3 id="section-2">示例</h3>
<p><a href="api_test.html" target="_blank">api_test.html</a></p>
</section>
<aside id="sidebar">
<a href="http://namerena.github.io" class="button" target="_blank">
<small>名字竞技场</small>
进入游戏
</a>
<a href="http://www.weibo.com/rinick" class="link" target="_blank">
<div style="background-image: url(http://weibo.com/favicon.ico);"></div>
我的微博
</a>
<a href="https://github.com/rinick" class="link" target="_blank">
<div style="background-image: url(https://github.com/favicon.ico);"></div>
GitHub
</a>
<ul>
<li><a href="http://www.deepmess.com/" >首页</a></li>
<br/>
<li><a href="index.html" >名字竞技场</a></li>
<br/>
<li><a href="naming.html" >命名规则</a></li>
<li><a href="attribute.html" >属性说明</a></li>
<li><a href="skill.html" >技能列表</a></li>
<li><a href="special.html" >特殊名字</a></li>
<li><a href="testing.html" >测号技巧</a></li>
<li><a href="custom_lan.html" >语言包</a></li>
<li><a href="about.html" >关于</a></li>
</ul>
</aside>
</div>
</div>
</body>
</html>