-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
80 lines (68 loc) · 2.94 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
<!DOCTYPE html>
<html>
<head>
<title>Braille</title>
<link href="https://fonts.googleapis.com/css?family=Amatic+SC|Raleway:100,200,600,700" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<meta charset="UTF-8">
<script type="text/javascript">
function point_it(event){
pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
document.getElementById("cross").style.left = (pos_x-1) ;
document.getElementById("cross").style.top = (pos_y-15) ;
document.getElementById("cross").style.visibility = "visible" ;
document.pointform.form_x.value = pos_x;
document.pointform.form_y.value = pos_y;
}
</script>
</head>
<body>
<div class="header">
<h1>Braille</h1>
</div>
<div>
<nav class="navigation">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="#main">About Us</a></li>
<li><a href="#contacts">Contact</a></li>
<li><a href="login.html">Login</a></li>
<li><a href="signup.html">Sign up</a></li>
</ul>
</nav>
</div>
<div class="content">
<h1>Point around this image to see what the app does </h1>
</div>
<form name="pointform" method="post">
<div id="pointer_div" onclick="point_it(event)" >
<img src = "boston.jpg" id = "cross" class = "center">
<p style= "text-align: center">You pointed on x = <input type="text" name="form_x" size="4" /> - y = <input type="text" name="form_y" size="4">
</p></form></div>
<div id="main">
<h3>What is braille? </h3>
<span class="byline">Created by: Kunal, Vignesh, Asif, and Abi</span>
<p> We just wanted to create an application dedicated to help the blind. Why not have a tool that aids them with navigation? Our application allows users to take pictures of their surrounding and intelligently detect and recognize the objects infront of them. Our application uses available AI tools to convert recognized objects from a text name into verbal commands. </p>
<div class="pull-quote">
<h2>"Our technology helps people see with their ears"</h2>
</div>
<div class="share">
<a href="#">SHARE</a>
<a href="#">FAVORITE</a>
<a href="#">DOWNLOAD</a>
</div>
<div class = "contactUs">
<p> We are currently open source.</p>
<nav class="navigation" id= "contacts">
<ul>
<li> <a href= "https://github.com/">Github </a> </li>
<li> <a href = "https://www.facebook.com/">Facebook</a></li>
<li> <a href = "https://hackumass.com/">HackUmass</a> </li>
</ul>
</nav>
</div>
</body>
</html>