-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathdemo.html
57 lines (55 loc) · 4.25 KB
/
demo.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
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
crossorigin=""/>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width'>
<title>Community Hero Demo</title>
<style> body { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; padding:1em; }
#mapid { height: 400px;}
</style>
</head>
<body>
<h2>Demo Instructions</h2>
<p>During the limited time that we had during the hackathon, we managed to make 4 completely different interfaces that the user can use. One is Facebook Messenger, an e-shop, an SMS service, and a Delivery Portal.</p>
<p>Even though we didn't show everything in the video, everything mentioned above is implemented and fully functional. The only limitation that we are aware of is the fact that :</p>
<ul>
<li>We do not wish to share our phone numbers in public, but the SMS gateway we are using is using our own mobile phone numbers. Therefore, we can not demo the SMS service as SMS.</li>
</ul>
<p>In order to solve this, we implemented the following:</p>
<ul>
<li>We made a different frontend for the SMS that is web-based. However, this is exactly the same as the original SMS service in terms of functionality. You can send a message from any "phone number" you want and see how the bot would respond. The backend used is exactly the same, but a JS-based frontend is used instead of a Java-based Android app acting as an SMS gateway</li>
</ul>
<p>We would recommend that you try out the different demos in the following order:</p>
<ol>
<li>Messenger chatbot: Here is the link to the chatbot: <a href="http://m.me/107990727539664">http://m.me/107990727539664</a></li>
<li>SMS chatbot: As mentioned above, for demonstration purposes this is shown as a web-app: <a href='https://sms.communityhero.live'>https://sms.communityhero.live</a></li>
<li>e-shop: <a href='https://communityhero.me'>https://communityhero.me</a> (this is not fully implemented, you may experience some issues)</li>
<li>Delivery portal: <a href="https://delivery.communityhero.live">https://delivery.communityhero.live</a> (even though a log in screen is presented, logging in is not implemented yet. You can just press log in without filling the username/password fields)</li>
</ol>
Please also note that our database is only made for testing and does not contain real data, we only have 65 products. Some of them have a product name in Greek, but they can still be found by searching because they have tags in English. Therefore, if it doesn't return any results for the query given, try with something else :)
Since our database currently only has a limited number of stores in the same city in Cyprus, we would recommend that whenever prompted, enter an address within the region below:
<div id="mapid"></div>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="
crossorigin=""></script>
<script>
var mymap = L.map('mapid').setView([35.1748, 33.3834], 13);
L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18,
id: 'mapbox/streets-v11',
tileSize: 512,
zoomOffset: -1,
accessToken: 'pk.eyJ1IjoiY2ZhbGFzIiwiYSI6ImNrOGhmZDNhNTAwN3czZm1jcjdqYnVwcTYifQ.DFTZF3tuUwz8zEJ_WczQYw'
}).addTo(mymap);
var circle = L.circle([35.1618, 33.3634], {
fillOpacity: 0.1,
radius: 5000
}).addTo(mymap);
</script>
Lastly, we as a team would like to thank you for the organisation of this event where we had lots of fun, learnt a lot and made something that can be useful to society, even though we are just a bunch of teenagers. If you find any bugs or have any ideas for future development please don't hesitate to contact us at: <a href='mailto:[email protected]'>[email protected]</a>
</body>
</html>