-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathhome.html
195 lines (183 loc) · 6.87 KB
/
home.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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
<!doctype html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<script>
window.globals = { }; // for interscope comms
// paperGlue uses
// window.globals.modalKey = null; set in dialog.js for modal dialogs
// window.globals.chainKey = null; which could be set in module
// moduleCmd below must be defined before any modules that use it
function moduleCmd(mod,cmd,arg0,arg1,arg2,arg3,arg4) {
// assumes that window.global[mod][cmd] exists
//console.log(cmd,arg0,arg1,arg2);//.onload(); //no use since it may not be added to globals yet
window.globals[mod][cmd](arg0,arg1,arg2,arg3,arg4);
}
var modulesLoaded = [];
function checkDependancies(nm) {
var mod = modulesLoaded[nm];
var mk = mod.dep.slice(); //shallow copy
for(var di in mk) {
var dm = mod.dep[di];
if(modulesLoaded.hasOwnProperty(dm)) {
//for(var nm2 in modulesLoaded) {
//if(nm === nm2)
//continue; // dependant on self
//console.log("Is "+nm2+" in "+mod.dep);
//console.log("nm2 in mod.dep:"+(mod.dep.indexOf(nm2)));
//var i = mod.dep.indexOf(nm2)
//if(i >= 0) { // if so, remove from dependancies
//if(modulesLoaded[dm].dep.length > 0)
//console.log("Yes but has "+modulesLoaded[dm].dep.length+" dependancies of its own.");
//else
//console.log("Yes");
if(modulesLoaded[dm].dep.length === 0) // but only if it's dependancies are met too
mod.dep.splice(di,1);
}
}
if(mod.dep.length > 0) {
//console.log(nm +" has "+ mod.dep.length + " remaining dependancies");
} else if(typeof mod.init === 'function') {
//window.globals[nm][mod.init];
console.log("Init for module " + nm);
mod.init();
delete mod.init; // only fire once
}
}
function moduleLoaded(name,dependancies,init) {
console.log(name + " module loaded.");
if(typeof dependancies === 'undefined')
dependancies = [];
modulesLoaded[name] = {dep:dependancies,init:init};
//console.log("Modules loaded:"+Object.keys(modulesLoaded));
checkDependancies(name); // if all dependancies met this init fires first
for(var i = 0; i < 10; i++) { // need to scan modules many times
// once to check for modules dependant on name
// and then once for modules dependant on that last etc
for(var nm in modulesLoaded) {
checkDependancies(nm);
}
}
}
window.globals.moduleLoaded = moduleLoaded;
</script>
<!-- Load the Paper.js library -->
<script type="text/javascript" src="js/paper.js" onload="moduleLoaded('paper')"></script>
<script type="text/javascript" src="js/nodeComms.js"></script>
<script type="text/javascript" src="js/dialog.js"></script>
<script type="text/javascript" src="js/contextMenu.js"></script>
<!-- Load external PaperScript and associate it with myCanvas -->
<script type="text/javascript" src="js/paperglue.js"></script>
<script type="text/javascript" src="js/paperGlueDialogs.js"></script>
<script type="text/javascript" src="js/paperGlueMenus.js"></script>
<script type="text/javascript" src="js/myScript.js"></script>
<!-- should have the same scope as per https://github.com/paperjs/paper.js/issues/153 -->
<script type="text/javascript" src="dorec.js"> </script>
<script type="text/javascript" src="imgavail.js"> </script>
<script>
function onload() {
//console.log("body loaded");
moduleLoaded("body"); //document body must be loaded before paperGlue init
//console.log(Object.keys(window.globals) ); //.onload(); //no use since it may not be added to globals yet
}
// function myScriptCmd(cmd, arg0,arg1,arg2,arg3,arg4) {
// //console.log(Object.keys(window.globals.myScript) );
// //console.log(cmd,arg0,arg1,arg2);//.onload(); //no use since it may not be added to globals yet
// window.globals.myScript[cmd](arg0,arg1,arg2,arg3,arg4);
// }
//
// function paperGlueCmd(cmd,arg0,arg1,arg2,arg3,arg4) {
// //console.log("PaperGlue commands:"+Object.keys(window.globals.paperGlue) );
// //console.log(cmd,arg0,arg1,arg2);//.onload(); //no use since it may not be added to globals yet
// window.globals.paperGlue[cmd](arg0,arg1,arg2,arg3,arg4);
// }
function DlgShow(Message)
{
// Change the message.
var Msg = document.getElementById('DlgContent');
Msg.innerHTML = Message;
// Display the dialog box.
var Dlg = document.getElementById('Dialog');
Dlg.style.visibility = 'visible';
}
</script>
<style>
.button {
color: white;
background-color: black;
}
#Dialog {
visibility: hidden;
position: absolute;
left: 20px;
top: 60px;
padding: 2px;
text-align:center;
border: solid;
background-color: lightgray;
}
#Dialog td {
padding:2px;
}
#contextMenu {
padding: 0;
font-size:100px;
}
#Dialog {
font-size:100px;
}
table, th, td {
border: 1px solid black;
border-collapse:collapse;
}
</style>
</head>
<body id="body" onload="onload();" >
<div id="clientArea">
<div id="statusInfo" style="display:none">STATUS LINE</div>
<div id="canvasDiv" style="height:100%;background-color:blue">
<canvas id="myCanvas" resize></canvas>
</div>
</div>
<div id="actionTableDiv" style="display:none">
<style>
table {border-collapse:collapse;}
.table{ /*height: 4em; */ /* define the height */
border:4px solid black;
}
th{margin: 0;padding: 10px;border:1px solid grey;background-color: lightblue;font-size:14px;text-overflow:ellipsis}
td{margin: 0;padding: 10px;border:1px solid black;font-size:14px;text-overflow:ellipsis}
tr:nth-child(odd){background-color:#F0F0E0;} /* no work for some reason */
</style>
<table id="actionTable" class="table">
<thead>
<tr>
<th style="width:100px">Action </th>
<th style="width:30px">Obj ID</th>
<th>Parameters</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3" style="padding:0">
<div id="actionTableBodyDiv" style="overflow:scroll;height:200px;width:100%;overflow:auto;margin:0;border:0">
<table>
<tbody id="actionTableBody">
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div style="display:none;" id="contextMenu">
<table border="0" cellpadding="0" cellspacing="0"
style="border: thin solid #808080; cursor: default; white-space: nowrap"
bgcolor="White">
</table>
</div>
<div id="Dialog"><div id="DlgContent"></div><div id="DlgReplyButtons"></div></div>
</body>
</html>