forked from renevanderark/altoedit-2.0
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
86 lines (83 loc) · 3.01 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
<!doctype html>
<html lang="nl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Alto Edit</title>
<link media="screen" type="text/css" href="css/reset.css" rel="stylesheet">
<link media="screen" type="text/css" href="css/style.css" rel="stylesheet">
<script type='text/javascript' src='js/jquery-vendor.js'></script>
<script type='text/javascript' src='js/jquery.imageviewerclient.js'></script>
<script type="text/javascript" src="js/altoedit.js"></script>
</head>
<body>
<canvas id="canvas"></canvas>
<canvas id="overlay"></canvas>
<input id="input" onfocus="this.setSelectionRange(0, this.value.length);" />
<div id="alto-string">
<String
<span>ID=</span>
<input type="text" name="ID" disabled />
<span>HPOS=</span>
<input type="text" name="HPOS" class="number" />
<span>VPOS=</span>
<input type="text" name="VPOS" class="number" />
<span>WIDTH=</span>
<input type="text" name="WIDTH" class="number" />
<span>HEIGHT=</span>
<input type="text" name="HEIGHT" class="number" />
<span>CONTENT=</span>
<input type="text" name="CONTENT" disabled />
<span>SUBS_CONTENT=</span>
<input type="text" name="SUBS_CONTENT" disabled />
<span>SUBS_TYPE=</span>
<input type="text" name="SUBS_TYPE" disabled />
<span>WC=</span>
<input type="text" name="WC" disabled />
<span>CC=</span>
<input type="text" name="CC" disabled />
/>
</div>
<div id="alto-line">
<TextLine
<span>ID=</span>
<input type="text" name="ID" disabled />
<span>HPOS=</span>
<input type="text" name="HPOS" class="number" />
<span>VPOS=</span>
<input type="text" name="VPOS" class="number" />
<span>WIDTH=</span>
<input type="text" name="WIDTH" class="number" />
<span>HEIGHT=</span>
<input type="text" name="HEIGHT" class="number" />
/>
</div>
<div id="buttons">
<button onclick="altoedit.save()">Opslaan</button>
<input id="wheelMode-scroll" onchange="altoedit.setWheelMode(this.value)" type="radio" name="wheelMode" value="scroll" checked />
<label for="wheelMode-scroll">Scrollen</label>
<input id="wheelMode-zoom" onchange="altoedit.setWheelMode(this.value)" type="radio" name="wheelMode" value="zoom" />
<label for="wheelMode-zoom">Zoomen</label>
</div>
<script type="text/javascript">
$.ajax("alto.xml", {
success: function(alto) {
altoedit
.setCanvas($("#canvas"), $("#overlay"))
.init("ddd:010707698:mpeg21:p001", alto, $("#input"), $("#alto-string"), $("#alto-line"));
}
});
$(document).on("keydown", function(e) {
if(e.keyCode === 17) { altoedit.ctrlDown = true; }
if(e.keyCode === 16) { altoedit.shiftDown = true; }
if(altoedit.ctrlDown && e.keyCode === 83) {
altoedit.save();
altoedit.ctrlDown = false;
return e.preventDefault();
}
}).on("keyup", function(e) {
if(e.keyCode === 17) { altoedit.ctrlDown = false; }
if(e.keyCode === 16) { altoedit.shiftDown = false; }
});
</script>
</body>
</html>