-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·123 lines (115 loc) · 4.42 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
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<html>
<head>
<meta charset="UTF-8">
<title>They Tell a Tale</title>
<!-- You can use open graph tags to customize link previews.
Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
<meta property="og:url" content="http://tzchien.com/" />
<meta property="og:type" content="website" />
<meta property="og:title" content="TzChien慈謙 - They Tell a Tale 聽說,有一個這樣的故事..." />
<meta property="og:description" content="[ 生而為人的故事 Life as an Individual ] 前傳:一棟房子,兩個相似的人。誰愛誰比較多,誰傷害誰比較多...
你來決定吧。" />
<meta property="og:image" content="http://tzchien.com/images/icon-300-tiny.png" />
<meta property="fb:app_id" content="355725254781143">
<!-- Borrow from https://github.com/kaimallea/isMobile -->
<script type='text/javascript' src='js/isMobile.js'></script>
<script type='text/javascript' src='js/main.js'></script>
<script type='text/javascript' src='js/story.js'></script>
<style>
@import url('https://fonts.googleapis.com/css?family=Vollkorn');
</style>
<link rel='stylesheet' type='text/css' href='css/story.css'>
<link rel='stylesheet' type='text/css' href='css/common.css'>
<link rel="icon" href="images/they-tell-a-tale.ico" />
<!-- Story source loaded by selected language -->
<!-- <script src="js/storyline/en-US/source.js"></script> -->
</head>
<body>
<!-- For Facebook Like/Share buttons -->
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '355725254781143',
xfbml : true,
version : 'v2.8'
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div id='story' class='story'>
<!-- Language options -->
<!-- <div class='table'>
<div class='row'>
<div class='table'>
<div class='cell'>English</div>
<div class='cell'>中文</div>
...
</div>
</div>
</div> -->
<!-- Story Music -->
<!-- <audio src='path/to/file'></audio> -->
<!-- Background video shown during prompt -->
<!-- The prompt changes over time, so it's dynamically inserted and removed.
However, the background video is always same. It only needs to be
inserted one time. That's why the background video is outside of prompt
table instead of being embedded in it. -->
<!-- <video id='video-id' src='path/to/file'></video> -->
<!-- Prompt Table -->
<!-- <div class='table'>
<div class='row'>
<div class='cell'>question</div>
</div>
<div class='row'>
<div class='table'>
<div class='cell'>ans 1</div>
<div class='cell'>ans 2</div>
...
<div class='cell'>ans n</div>
</div>
</div>
</div> -->
<!-- Story Video -->
<!-- <video id='video-id' src='path/to/file'></video> -->
</div>
<!-- Information for the they-tell-a-tale -->
<div class='footer english'>
<div>
<img src='images/brain.png'>
<span class='chinese'>生而為人的故事</span><span>Life as an Individual</span>
</div>
<div>
<img src='images/soul-eater.png'>
<a target='_blank' href='https://www.facebook.com/tzchienfans/'>
TzChien<span class='chinese'>慈謙</span>
</a>
</div>
<div style="padding-left: 20vw">
<div class="fb-like"
data-href="http://tzchien.com/"
data-layout="standard"
data-action="like"
data-size="small"
data-colorscheme="dark"
data-show-faces="true"
data-share="true">
</div>
</div>
<div class='author'>
<img src='images/fren.png'>
Designed By <a target='_blank' href='http://chunminchang.github.io/'>Chun-Min Chang</a>
<a target='_blank' href='https://github.com/ChunMinChang/they-tell-a-tale'><img src='images/feet.png'>Fork</a>
</div>
</div>
</body>
</html>