This repository has been archived by the owner on Nov 23, 2017. It is now read-only.
/
scan_medical.html
119 lines (106 loc) · 4.31 KB
/
scan_medical.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
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8" />
<!--meta content- width, and scale; for touchscreen do I want this to be scalable?-->
<title>m3Dical</title>
<link rel="stylesheet" href="reset.css" type="text/css" />
<link rel="stylesheet" href="app.css" type="text/css" />
<script src="app.js"></script>
</head>
<body>
<script type="text/javascript">
var sprout = require('sprout');
var matHandle = sprout.openMat('mat.html'); // program to scan medical paperwork
</script>
<div id="outer_wrapper">
<div id="content">
<div class="spacer"></div>
<h1 id="continue">Please place your insurance card and drivers license on the pad below.</h1> <!-- what documents do we need? Also, continue should not appear untile documents are scanned-->
<!-- maybe condtional formatting of the box, red you haven't scaned documents, green you're good to go-->
<div id="selection">
<div class="svg-wrapper" id="login">
<svg height="60" width="20em" xmlns="http://www.w3.org/2000/svg">
<rect class="shape" height="60" width="320" />
<div class="text">
<a href="Nurse_notes.html" onclick="global.openPage()"><span></span>Continue</a>
</div>
</svg>
</div>
<div class="text" style="margin-top:5em;">
<a onclick="segment(); global.show_object();"><span></span>Scan Insurance Card and Drivers License</a>
</div>
</div>
<div id="txt_upload">
<div id="dlicense"></div>
<div id="personaltext">
<p>Name: Tyler Peterson</p>
<p>Licence State: Utah</p>
<p>DOB: XX/XX/XXXX</p>
<p>License #: ############</p>
<p>Weight: 195lbs</p>
<p>Height: 6'0</p>
<p>Hair: Red</p>
<p>Eyes: Blue</p>
</div>
</div>
</div>
</div>
</body>
</html>
<script>
/*
function capture() {
sprout.capture().then(function (id) {
return sprout.getPicture(id, sprout.SNAPSHOT);
}).then(function (object) {
var image = document.createElement("img");
image.src = "data:image/png;base64," + object.picture.Image;
image.width = 1024;
image.height = 720;
var result = document.getElementById("txt_upload");
result.appendChild(image);
}).then(function () {
}).fail(function (e) {
alert(e);
});
}
global.image1 = function () {
var img1 = document.localName.object.picture.children[1].image;
var result = img1;
result = document.gedtElementById("txt_upload");
alert("hello");
}
*/
// need to acesss the image array to put the two images in the div. May need to put them in seperate div's.
// global.image2 = function () {
// var result = document.getElementById("txt_upload");
// }
global.show_object = function () {
// css for txt_upload id
setTimeout(function () { document.getElementById('txt_upload').style.display = 'block'; }, 3000);
}
function segment() {
sprout.capture().then(function (id) {
return sprout.getPicture(id);
}).then(function (object) {
for (var i = 0; i < object.picture.Children.length; i++) {
var image = document.createElement("img");
image.src = "data:image/png;base64," + object.picture.Children[i].Image;
image.width = object.picture.Children[i].PhysicalBoundaries.Size.Width * 2;
image.height = object.picture.Children[i].PhysicalBoundaries.Size.Height * 2;
image.className = "segment img-thumbnail";
var result = document.getElementById("result");
result.appendChild(image);
}
global.image1();
console.log(object);
}).then(function () {
ls.stop();
showImage();
}).fail(function (e) {
ls.stop();
showError(e);
});
}
</script>