forked from harveyaot/TravelBot
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
115 lines (98 loc) · 5.63 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="An intelligent travel guide in your pocket, based on Microsoft Bot Framework.">
<meta name="author" content="hewei">
<link rel="icon" href="pics/favicon.ico">
<title>TravelBot</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/cover.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="fb-root"></div>
<script>(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#xfbml=1&version=v2.6&appId=643664839119741";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!--Fork me ribbons-->
<a href="https://github.com/harveyaot/TravelBot">
<img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/52760788cde945287fbb584134c4cbc2bc36f904/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f77686974655f6666666666662e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png">
</a>
<div class="site-wrapper">
<div class="site-wrapper-inner">
<div class="cover-container">
<div class="masthead clearfix">
<div class="inner">
<h3 class="masthead-brand">TravelBot</h3>
<nav>
<ul class="nav masthead-nav">
<li><a href="mailto:[email protected]?Subject=Hello%20TravelBot" target="_top">[email protected]</a></li>
<li><a href="https://garagehackbox.azurewebsites.net/hackathons/761/projects/37061">Hackthon</a></li>
<li><a href="https://www.facebook.com/itravelbot">Facebook</a></li>
</ul>
</nav>
</div>
</div>
<div class="inner cover">
<h1 class="cover-heading" >Xiao Bai</h1>
<p class="lead">Is an intelligent travel guide bot in your pocket</p>
<p class="lead">It plays a role of a real companion who kindly show you around, talk you with the location-related story, answer your any questions about this place. Moreover when you want to explore more culture aspects, it can recite verse, play songs and movies for you which might be produced here.
</p>
</div>
<div class='row'>
<div class="col-md-7">
<iframe height=520 width=400 src='https://webchat.botframework.com/embed/itravelbot?s=b_sACr9G9FY.cwA.pu4.EkH-uKM8FgOoSVyQ2MAlBGnedr0ZbAYRdMwdYm_TUpA'></iframe>
</div>
<div class="col-md-5">
<p class="hint">
<font face="verdana" color="#000066"><i>Instructions:</i><br>This demo is just for showing our bot idea. The data behind it are all made up. We will connet XiaoBai with true intelligence later before July 25.<br><br>
You can say hi,chat with him on topics about forbidden city.<b>e.g.:</b><br></font>
<i>1. I am in Forbidden city now.<br>
2. How many rooms are here?<br>
3. How many emperors of qing dynasty? <br>
4. Who is CiXi? <br>
5. Are some movies related about here? <br>
6. Anything else?<br>
7. OK,Thanks. <br><br>
</i>
<font face="verdana" color="#000066">Other than Talk,You can also:<br> </font>
<i>
1. Upload an picture to let him recognize<br>
2. Talk him on <a href="https://www.facebook.com/itravelbot">Facebook </a> and Messenger (search,travelbot)<br>
</i>
</p>
</div>
</div>
<div class="mastfoot">
<div class="inner">
<!--
<div class="fb-like" data-href="https://www.facebook.com/itravelbot/" data-layout="standard" data-action="like" data-show-faces="false" data-share="true"></div>
-->
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>