source: trunk/FACT++/www/index.js@ 13650

Last change on this file since 13650 was 13642, checked in by tbretz, 13 years ago
Another update to the resizing; a fix to the debug line display.
File size: 37.1 KB
Line 
1var debug = false;
2
3var map = [ 393, 390, 391, 394, 1098, 395, 392, 389, 387, 388, 386,
41001, 1004, 1099, 1101, 1100, 1111, 1108, 286, 283, 377, 375, 376, 383,
5384, 999, 1002, 1005, 1007, 1102, 1104, 1103, 1114, 1113, 1110, 1107,
6285, 282, 280, 374, 372, 373, 380, 381, 382, 385, 1000, 1003, 1006,
7990, 992, 1105, 1089, 1106, 1126, 1125, 1115, 1112, 1109, 287, 284,
8281, 279, 277, 371, 369, 370, 413, 378, 379, 422, 425, 428, 431, 983,
9986, 991, 993, 995, 1090, 1092, 1091, 1129, 1128, 1127, 1138, 1135,
101150, 1147, 1144, 259, 256, 278, 276, 274, 368, 366, 367, 410, 411,
11412, 419, 420, 423, 426, 429, 981, 984, 987, 989, 994, 996, 998, 1093,
121095, 1094, 1132, 1131, 1130, 1141, 1140, 1137, 1134, 1149, 1146, 1143,
13258, 255, 253, 275, 273, 271, 365, 363, 364, 407, 408, 409, 416, 417,
14418, 421, 424, 427, 430, 982, 985, 988, 972, 974, 997, 1035, 1037,
151096, 1080, 1097, 1117, 1116, 1133, 1234, 1233, 1142, 1139, 1136, 1151,
161148, 1145, 260, 257, 254, 252, 268, 272, 270, 322, 362, 360, 361, 404,
17405, 406, 521, 414, 415, 512, 533, 536, 539, 920, 923, 926, 911, 914,
18973, 975, 977, 1036, 1038, 1040, 1081, 1083, 1082, 1120, 1119, 1118,
191237, 1236, 1235, 1228, 1225, 1258, 1255, 1252, 205, 202, 199, 196,
20193, 269, 267, 265, 323, 321, 319, 359, 357, 358, 401, 402, 403, 518,
21519, 520, 509, 510, 531, 534, 537, 918, 921, 924, 909, 912, 915, 917,
22976, 978, 980, 1039, 1041, 1043, 1084, 1086, 1085, 1123, 1122, 1121,
231240, 1239, 1238, 1231, 1230, 1227, 1224, 1257, 1254, 1251, 204, 201,
24198, 195, 192, 190, 266, 264, 262, 320, 318, 316, 356, 354, 355, 398,
25399, 400, 515, 516, 517, 506, 507, 508, 511, 532, 535, 538, 919, 922,
26925, 910, 913, 916, 900, 902, 979, 963, 965, 1042, 1026, 1028, 1087,
271071, 1088, 1180, 1179, 1124, 1216, 1215, 1241, 1288, 1287, 1232, 1229,
281226, 1259, 1256, 1253, 206, 203, 200, 197, 194, 191, 189, 187, 263,
29261, 250, 317, 315, 313, 353, 351, 352, 467, 396, 397, 503, 513, 514,
30575, 504, 505, 611, 524, 527, 530, 929, 932, 935, 848, 851, 854, 821,
31824, 901, 903, 905, 964, 966, 968, 1027, 1029, 1031, 1072, 1074, 1073,
321183, 1182, 1181, 1219, 1218, 1217, 1291, 1290, 1289, 1327, 1324, 1249,
331246, 1243, 214, 211, 208, 142, 139, 136, 106, 103, 188, 186, 184, 251,
34249, 247, 314, 312, 310, 350, 348, 349, 464, 465, 466, 500, 501, 502,
35572, 573, 574, 608, 609, 522, 525, 528, 927, 930, 933, 846, 849, 852,
36819, 822, 825, 827, 904, 906, 908, 967, 969, 971, 1030, 1032, 1034,
371075, 1077, 1076, 1186, 1185, 1184, 1222, 1221, 1220, 1294, 1293, 1292,
381330, 1329, 1326, 1323, 1248, 1245, 1242, 213, 210, 207, 141, 138, 135,
39105, 102, 100, 185, 183, 181, 248, 246, 244, 311, 309, 307, 347, 345,
40346, 461, 462, 463, 497, 498, 499, 569, 570, 571, 605, 606, 607, 610,
41523, 526, 529, 928, 931, 934, 847, 850, 853, 820, 823, 826, 810, 812,
42907, 891, 893, 970, 954, 956, 1033, 1017, 1019, 1078, 1062, 1079, 1171,
431170, 1187, 1207, 1206, 1223, 1279, 1278, 1295, 1315, 1314, 1331, 1328,
441325, 1250, 1247, 1244, 215, 212, 209, 143, 140, 137, 107, 104, 101,
4599, 97, 182, 180, 178, 245, 243, 241, 308, 306, 304, 344, 342, 343,
46458, 459, 460, 494, 495, 496, 566, 567, 568, 602, 603, 604, 647, 650,
47653, 656, 659, 662, 665, 857, 860, 863, 839, 842, 845, 830, 833, 811,
48813, 815, 892, 894, 896, 955, 957, 959, 1018, 1020, 1022, 1063, 1065,
491064, 1174, 1173, 1172, 1210, 1209, 1208, 1282, 1281, 1280, 1318, 1317,
501316, 1363, 1360, 1375, 1372, 1369, 1384, 1381, 1378, 133, 130, 127,
51124, 121, 118, 115, 112, 98, 96, 94, 179, 177, 175, 242, 240, 238, 305,
52303, 301, 332, 330, 331, 455, 456, 457, 491, 492, 493, 563, 564, 565,
53599, 600, 601, 644, 645, 648, 651, 654, 657, 660, 663, 855, 858, 861,
54837, 840, 843, 828, 831, 834, 836, 814, 816, 818, 895, 897, 899, 958,
55960, 962, 1021, 1023, 1025, 1066, 1068, 1067, 1177, 1176, 1175, 1213,
561212, 1211, 1285, 1284, 1283, 1321, 1320, 1319, 1366, 1365, 1362, 1359,
571374, 1371, 1368, 1383, 1380, 1377, 132, 129, 126, 123, 120, 117, 114,
58111, 109, 95, 93, 91, 176, 174, 172, 239, 237, 235, 302, 300, 298, 329,
59327, 328, 452, 453, 454, 488, 489, 490, 560, 561, 562, 596, 597, 598,
60641, 642, 643, 646, 649, 652, 655, 658, 661, 664, 856, 859, 862, 838,
61841, 844, 829, 832, 835, 756, 758, 817, 792, 794, 898, 882, 884, 961,
62945, 947, 1024, 1008, 1010, 1069, 1044, 1070, 1162, 1161, 1178, 1198,
631197, 1214, 1270, 1269, 1286, 1306, 1305, 1322, 1342, 1341, 1367, 1364,
641361, 1376, 1373, 1370, 1385, 1382, 1379, 134, 131, 128, 125, 122, 119,
65116, 113, 110, 108, 43, 92, 90, 79, 173, 171, 169, 236, 234, 232, 299,
66297, 295, 326, 324, 325, 449, 450, 451, 485, 486, 487, 557, 558, 559,
67593, 594, 595, 629, 639, 640, 638, 695, 698, 701, 668, 671, 674, 677,
68680, 683, 749, 752, 755, 740, 743, 746, 775, 777, 757, 759, 761, 793,
69795, 797, 883, 885, 887, 946, 948, 950, 1009, 1011, 1013, 1045, 1047,
701046, 1165, 1164, 1163, 1201, 1200, 1199, 1273, 1272, 1271, 1309, 1308,
711307, 1345, 1344, 1343, 1353, 1351, 1420, 1417, 1414, 1393, 1390, 1387,
721402, 1399, 1396, 34, 31, 28, 25, 22, 19, 62, 60, 44, 42, 40, 80, 78,
7376, 170, 168, 166, 233, 231, 229, 296, 294, 292, 341, 339, 340, 446,
74447, 448, 482, 483, 484, 554, 555, 556, 590, 591, 592, 626, 627, 628,
75636, 637, 693, 696, 699, 666, 669, 672, 675, 678, 681, 747, 750, 753,
76738, 741, 744, 774, 776, 778, 779, 760, 762, 764, 796, 798, 800, 886,
77888, 890, 949, 951, 953, 1012, 1014, 1016, 1054, 1057, 1048, 1168,
781167, 1166, 1204, 1203, 1202, 1276, 1275, 1274, 1312, 1311, 1310, 1348,
791347, 1346, 1355, 1354, 1352, 1350, 1419, 1416, 1413, 1392, 1389, 1386,
801401, 1398, 1395, 33, 30, 27, 24, 21, 18, 61, 59, 58, 41, 39, 37, 77,
8175, 73, 167, 165, 163, 230, 228, 226, 293, 291, 289, 338, 336, 337,
82443, 444, 445, 479, 480, 481, 551, 552, 553, 587, 588, 589, 623, 624,
83625, 634, 635, 684, 687, 694, 697, 700, 667, 670, 673, 676, 679, 682,
84748, 751, 754, 739, 742, 745, 787, 789, 791, 780, 765, 763, 769, 770,
85799, 801, 803, 889, 875, 864, 952, 936, 938, 1015, 1053, 1055, 1058,
861061, 1059, 1050, 1049, 1169, 1153, 1152, 1205, 1188, 1260, 1277, 1297,
871296, 1313, 1337, 1336, 1349, 1332, 1356, 1412, 1410, 1408, 1421, 1418,
881415, 1394, 1391, 1388, 1403, 1400, 1397, 35, 32, 29, 26, 23, 20, 65,
8963, 56, 55, 53, 38, 36, 48, 74, 72, 161, 164, 162, 152, 227, 225, 224,
90290, 288, 219, 335, 333, 334, 435, 441, 442, 440, 477, 478, 476, 549,
91550, 548, 585, 586, 615, 621, 622, 620, 631, 632, 633, 685, 688, 691,
92709, 706, 703, 718, 715, 712, 736, 733, 730, 727, 724, 721, 783, 785,
93788, 790, 781, 782, 766, 767, 771, 773, 802, 804, 873, 874, 865, 866,
94937, 939, 940, 942, 1056, 1060, 1052, 1051, 1157, 1156, 1155, 1154,
951190, 1189, 1262, 1261, 1299, 1298, 1339, 1338, 1334, 1333, 1358, 1357,
961411, 1409, 1406, 1404, 1424, 1427, 1430, 1433, 1436, 1439, 11, 14, 17,
972, 5, 8, 69, 67, 64, 57, 54, 52, 51, 50, 47, 89, 88, 84, 160, 159, 151,
98150, 148, 223, 222, 221, 218, 216, 433, 434, 437, 438, 439, 473, 474,
99475, 546, 547, 579, 583, 584, 614, 617, 618, 619, 630, 686, 689, 692,
100708, 705, 702, 717, 714, 711, 735, 732, 729, 726, 723, 720, 784, 786,
101768, 772, 805, 806, 808, 880, 877, 876, 867, 869, 871, 941, 943, 944,
1021160, 1159, 1158, 1194, 1192, 1191, 1263, 1265, 1264, 1302, 1301, 1300,
1031340, 1335, 1407, 1405, 1422, 1425, 1428, 1431, 1434, 1437, 9, 12, 15,
1040, 3, 6, 71, 68, 66, 49, 46, 45, 87, 83, 82, 158, 156, 149, 147, 146,
105144, 220, 217, 432, 436, 469, 470, 471, 472, 543, 545, 577, 578, 582,
106612, 613, 616, 710, 707, 704, 719, 716, 713, 737, 734, 731, 728, 725,
107722, 807, 809, 878, 879, 881, 868, 870, 872, 1196, 1195, 1193, 1268,
1081267, 1266, 1304, 1303, 1423, 1426, 1429, 1432, 1435, 1438, 10, 13, 16,
1091, 4, 7, 86, 85, 81, 157, 155, 154, 153, 145, 468, 540, 541, 542, 544,
110576, 580, 581, 70, 690 ];
111
112/*
113
114<a href="#" onMouseover="playsound(soundfile)">Example 1</a>
115<a href="#" onMouseover="playsound('different.wav')">Example 2</a>
116
117<div id="coolmenu" onMouseover="bindsound('A', soundfile, this)">
118
119<script type="text/javascript">
120
121//
122// JavaScript Sound effect- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
123// Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
124// This notice must stay intact for legal use
125//
126
127var soundfile="sidebar.wav" //path to sound file, or pass in filename directly into playsound()
128
129function playsound(soundfile){
130if (document.all && document.getElementById){
131document.getElementById("soundeffect").src="" //reset first in case of problems
132document.getElementById("soundeffect").src=soundfile
133}
134}
135
136function bindsound(tag, soundfile, masterElement){
137if (!window.event) return
138var source=event.srcElement
139while (source!=masterElement && source.tagName!="HTML"){
140if (source.tagName==tag.toUpperCase()){
141playsound(soundfile)
142break
143}
144source=source.parentElement
145}
146}
147
148</script>
149
150Function "bindsound()" accepts 3 parameters- 1) The tag name of the element to bind the sound to ("A" for <a>, "SPAN" for <span> etc), 2) the sound file to play, whether a variable or path to sound file, and finally, 3), the keyword "this", which should never be modified.
151
152// -----------------------
153<audio controls="controls" height="50px" width="100px">
154 <source src="song.mp3" type="audio/mpeg" />
155 <source src="song.ogg" type="audio/ogg" />
156<embed height="50px" width="100px" src="song.mp3" />
157</audio>
158// ------------------------
159
160*/
161function $(id) { return document.getElementById(id); }
162function trim(str) { return str.replace("/^\s\s*/", '').replace("/\s\s*$/", ''); }
163function valid(str) { if (str==undefined) return false; if (str.length==0) return false; return true;}
164function isSliding() { var z = $("body").getAttribute("data-visible"); return $("table"+z).offsetLeft!=0; }
165
166function cycleCol(el)
167{
168 var col = el.getAttribute("data-color");
169 col++;
170 col %= 31;
171 el.setAttribute("data-color", col);
172 if (col>16)
173 col = 31-col;
174 var hex = col.toString(16);
175 el.style.color = "#"+hex+"0"+hex+"0"+hex+"f";
176}
177
178/*
179function newWindow(newContent)
180{
181 if (document.referrer != "http://www.referringPageName.html")
182 return;
183
184 winContent = window.open(newContent,
185 'nextWin',
186 'right=0,top=20,width=350,height=350,toolbar=no,scrollbars=no,resizable=no');
187 }*/
188
189function onload()
190{
191 var xmlHttp = null;
192
193 try { xmlHttp = new XMLHttpRequest(); }
194 catch(e)
195 {
196 alert("Your browser doesn't support dynamic reload.");
197 return;
198 }
199
200 var name = location.hash.length==0 ? "fact" : location.hash.substr(1);
201
202 /*
203 alert("0 -- "+navigator.appCodeName+"\n"+
204 "1 -- "+navigator.appName+"\n"+
205 "2 -- "+navigator.appVersion+"\n"+
206 "3 -- "+navigator.platform+"\n"+
207 "4 -- "+navigator.userAgent);
208 */
209 loadPage(name, 0, 0);
210}
211
212function onresize()
213{
214 var z = $("body").getAttribute("data-visible");
215 doresize(z);
216}
217
218function loadPage(name, z, dz)
219{
220 var xmlHttp = new XMLHttpRequest();
221 xmlHttp.open('POST', name+'.table', true);
222 xmlHttp.onload = function ()
223 {
224 if (xmlHttp.status!=200)
225 {
226 alert("ERROR[0] - HTTP request '"+name+".table': "+xmlHttp.statusText+" ["+xmlHttp.status+"]");
227 //setTimeout("loadPage('+name+')", 5000);
228 /****** invalidate ******/
229 return;
230 }
231
232 buildPage(name, xmlHttp.responseText, z, dz);
233 changePage(z, z+dz);
234
235 //changePage(name, xmlHttp.resposeText);
236 //slideOut(name, xmlHttp.responseText);
237 //displayPage(name, xmlHttp.responseText);
238 //onresize(true);
239 };
240
241 xmlHttp.send(null);
242
243 location.hash = name;
244}
245
246
247function buildPage(name, text, oldz, dz)
248{
249 var fname = dz==0 ? "fact" : $("table"+oldz).getAttribute("data-file");
250
251 var z = oldz + dz;
252
253 var lines = text.split('\n');
254
255 if (lines.length==0)
256 {
257 alert("buildPage - received data empty.");
258 return;
259 }
260
261 var table = $("table"+z);
262 if (table != undefined)
263 $("body").removeChild(table);
264
265 table = document.createElement("table");
266 table.setAttribute("class", "tborder");
267 table.setAttribute("id", "table"+z);
268 table.setAttribute("border", "0");
269 table.setAttribute("cellspacing", "0");
270 table.setAttribute("cellpadding", "6");
271 table.setAttribute("width", "100%");
272 table.setAttribute("style", "overflow:hidden;position:fixed;top:0px;left:"+window.innerWidth+"px;");
273
274 // -----------------------------------------------------
275
276 var th = document.createElement("thead");
277 th.setAttribute("colspan", "3");
278 th.setAttribute("width", "100%");
279 table.appendChild(th);
280
281 var htr = document.createElement("tr");
282 th.appendChild(htr);
283
284 var htd = document.createElement("td");
285 htd.setAttribute("class", "thead");
286 htd.setAttribute("colspan", "3");
287 htd.setAttribute("width", "100%");
288 htr.appendChild(htd);
289
290 // -------------
291
292 var htab = document.createElement("table");
293 htab.setAttribute("width", "100%");
294 htd.appendChild(htab);
295
296 var hhtr = document.createElement("tr");
297 htab.appendChild(hhtr);
298
299 var htd0 = document.createElement("td");
300 var htd1 = document.createElement("td");
301 var htd2 = document.createElement("td");
302 var htd3 = document.createElement("td");
303 htd0.setAttribute("class", "tcell1");
304 htd1.setAttribute("class", "tcell2");
305 htd2.setAttribute("class", "tcell1");
306 htd2.setAttribute("width", "1px");
307 htd3.setAttribute("class", "tcell1");
308 htd3.setAttribute("width", "1px");
309 hhtr.appendChild(htd3);
310 hhtr.appendChild(htd0);
311 hhtr.appendChild(htd1);
312 hhtr.appendChild(htd2);
313
314 var div0 = document.createElement("div");
315 var div1 = document.createElement("div");
316 var div2 = document.createElement("div");
317 var div3 = document.createElement("div");
318 div0.setAttribute("style", "font-size:x-large;");
319 div2.setAttribute("class", "icon_white");
320 div2.setAttribute("onclick","this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('"+fname+"',"+z+","+(-dz)+");");
321 div2.setAttribute("style", "background-position:-396px 50%;");
322 div3.setAttribute("class", "icon_white");
323 div3.setAttribute("onclick","this.style.backgroundColor='rgba(0,0,0,0.77)'; loadPage('fact',"+z+","+(-z)+");");
324 div3.setAttribute("style", "background-position:-575px 50%;");
325
326 var sp0 = document.createElement("span");
327 var sp1 = document.createElement("span");
328 var sp2 = document.createElement("span");
329 sp0.setAttribute("id", "ldot" +z);
330 sp1.setAttribute("id", "title"+z);
331 sp2.setAttribute("id", "rdot" +z);
332 sp0.setAttribute("data-color", "3");
333 sp2.setAttribute("data-color", "3");
334 sp0.appendChild(document.createTextNode(" \u2022 "));
335 sp1.appendChild(document.createTextNode(lines[0]));
336 sp2.appendChild(document.createTextNode(" \u2022 "));
337
338 div0.appendChild(sp0);
339 div0.appendChild(sp1);
340 div0.appendChild(sp2);
341
342 div1.setAttribute("style", "font-size:small;");
343 div1.setAttribute("id", "reporttime"+z);
344 div1.appendChild(document.createTextNode("---"));
345
346 htd0.appendChild(div0);
347 htd1.appendChild(div1);
348 if (dz!=0/* && z+dz!=0*/)
349 htd2.appendChild(div2); // back
350 if (lines[0]!="FACT")
351 htd3.appendChild(div3); // home
352
353 // -----------------------------------------------------
354
355 var tbody = document.createElement("tbody");
356 table.appendChild(tbody);
357
358 // -----------------------------------------------------
359
360 var tf = document.createElement("tfoot");
361 table.appendChild(tf);
362
363 var ftr = document.createElement("tr");
364 tf.appendChild(ftr);
365
366 var ftd = document.createElement("td");
367 ftd.setAttribute("class", "tfoot");
368 ftd.setAttribute("width", "100%");
369 ftd.setAttribute("colspan", "3");
370 ftr.appendChild(ftd);
371
372 var ftab = document.createElement("table");
373 ftab.setAttribute("width", "100%");
374 ftd.appendChild(ftab);
375
376 var ftd0 = document.createElement("td");
377 var ftd1 = document.createElement("td");
378
379 ftd0.setAttribute("class", "tcell1");
380 ftd1.setAttribute("class", "tcell2");
381
382 ftab.appendChild(ftd0);
383 ftab.appendChild(ftd1);
384
385 var fdiv0 = document.createElement("div");
386 var fdiv1 = document.createElement("div");
387
388 fdiv0.setAttribute("style", "font-size:x-large;");
389 fdiv1.setAttribute("style", "font-size:small;");
390 fdiv1.setAttribute("id", "localtime"+z);
391
392 fdiv0.appendChild(document.createTextNode("logbook"));
393 fdiv1.appendChild(document.createTextNode("loading..."));
394
395 ftd0.appendChild(fdiv0);
396 ftd1.appendChild(fdiv1);
397
398 $("body").appendChild(table);
399
400 var counter = 1;
401 for (var i=1; i<lines.length; i++)
402 {
403 lines[i] = trim(lines[i]);
404
405 if (lines[i].length==0 || lines[i][0] == '#')
406 continue;
407
408 var cols = lines[i].split(':');
409 if (cols.length != 3 && cols.length !=4)
410 {
411 alert("Size mismatch #"+i+": '"+lines[i]+"' N(cols)="+cols.length);
412 continue;
413 }
414
415 var check = cols[1].split("=");
416
417 if (check.length>1 && (check[0]=="camera" || check[0]=="hist"))
418 {
419 var data = cols[1].substring(check[0].length+1).split("/");
420
421 var tr = document.createElement("tr");
422 tr.setAttribute("class", "row");
423 //tr.setAttribute("style", "margin:0;padding:0;");
424
425 var td = document.createElement("td");
426 td.setAttribute("class", "container");
427 td.setAttribute("id", "container");
428 //td.setAttribute("onclick", "save();");
429 td.setAttribute("colspan", "3");
430 tr.appendChild(td);
431
432 var canv = document.createElement("canvas");
433 canv.setAttribute("id", "canvas"+z);
434 canv.setAttribute("width", "1");
435 canv.setAttribute("height", "1");
436 canv.setAttribute("data-type", check[0]);
437 canv.setAttribute("data-file", data[0]);
438 canv.setAttribute("data-data", cols[1].substring(check[0].length+data[0].length+2));
439 canv.setAttribute("style", "display:none;");
440 td.appendChild(canv);
441
442 var img = document.createElement("img");
443 img.src = "dummy.png";//needed in firefox
444 img.setAttribute("id", "image"+z);
445 img.setAttribute("style", "width:1px;height:1px;");
446 td.appendChild(img);
447
448 tbody.appendChild(tr);
449 continue;
450 }
451
452 var tr = document.createElement("tr");
453 tr.setAttribute("class", "row");
454 if (valid(cols[0]))
455 tr.setAttribute("onclick", "this.style.background='#ccb'; loadPage('"+cols[0]+"',"+z+",-1);");
456 if (valid(cols[3]))
457 tr.setAttribute("onclick", "this.style.background='#ccb'; loadPage('"+cols[3]+"',"+z+",+1);");
458 //tr.setAttribute("id", cols[0]+"_row");
459
460 var td0 = document.createElement("td");
461 td0.setAttribute("class", "tcol0");
462 if (valid(cols[0]))
463 {
464 var sp = document.createElement("div");
465 sp.setAttribute("class", "icon_black");
466 sp.setAttribute("style", "background-position: -144px 50%;");
467 td0.appendChild(sp);
468 }
469 tr.appendChild(td0);
470
471 var td1 = document.createElement("td");
472 td1.setAttribute("class", "tcol1");
473 td1.setAttribute("width", "100%");
474 tr.appendChild(td1);
475
476 var td2 = document.createElement("td");
477 td2.setAttribute("class", "tcol2");
478 td2.setAttribute("width", "18px");
479 if (valid(cols[3]))
480 {
481 var sp = document.createElement("div");
482 sp.setAttribute("class", "icon_black");
483 sp.setAttribute("style", "background-position: -108px 50%;");
484 td2.appendChild(sp);
485 }
486 tr.appendChild(td2);
487
488 var tab = document.createElement("table");
489 tab.setAttribute("width", "100%");
490 td1.appendChild(tab);
491
492 var innertr = document.createElement("tr");
493 tab.appendChild(innertr);
494
495 var cell1 = document.createElement("td");
496 cell1.setAttribute("class", "tcell1");
497 //cell1.setAttribute("id", cols[0]+"_title");
498 cell1.appendChild(document.createTextNode(cols[1]));
499
500 var cell2 = document.createElement("td");
501 cell2.setAttribute("class", "tcell2");
502 cell2.setAttribute("id", "data"+counter);
503 cell2.setAttribute("data-form", cols[2]);
504 cell2.appendChild(document.createTextNode("---"));
505
506 innertr.appendChild(cell1);
507 innertr.appendChild(cell2);
508
509 tbody.appendChild(tr);
510
511 counter++;
512 }
513
514 // ---------------------------------------
515 if (debug == true)
516 {
517
518 tr = document.createElement("tr");
519 tr.setAttribute("class", "row");
520
521 td = document.createElement("td");
522 td.setAttribute("id", "debug"+z);
523 td.setAttribute("colspan", "3");
524 tr.appendChild(td);
525
526 tbody.appendChild(tr);
527 }
528
529 // ---------------------------------------
530
531 table.setAttribute("data-file", name);
532 doresize(z);
533}
534
535function resizeimpl(z, cnt)
536{
537 // 393 / 482 488/482 / 200 200+482-488
538 var img = $("image"+z);
539 var canv = $("canvas"+z);
540 if (img == undefined || canv == undefined)
541 return;
542
543 var h = $("table"+z).offsetHeight;
544 if (h == 0)
545 return;
546
547 var W = window.innerWidth;
548 var H = window.innerHeight;
549
550 var x = parseInt(img.style.height, 10);
551
552 var ih = H - h + parseInt(img.style.height, 10);
553
554 img.style.width = W +"px";
555 img.style.height= ih+"px";
556
557 canv.width = W;
558 canv.height = ih;
559
560 if ($("table"+z).offsetHeight == H || cnt==2)
561 return;
562
563 resizeimpl(z, ++cnt);
564}
565
566function doresize(z)
567{
568 resizeimpl(z, 0);
569
570 // ------ debug -----
571 if (debug == true)
572 {
573 $('debug'+z).innerHTML = "";
574 $('debug'+z).innerHTML += "|W="+W +"/"+H;
575 $('debug'+z).innerHTML += "|H="+h+"/"+$("table"+z).offsetHeight+"/"+img.offsetHeight;
576 $('debug'+z).innerHTML += "|I="+img.style.height+"+"+H+"-"+h;
577 }
578}
579
580var intervalSlide = null;
581
582function changePage(oldz, newz)
583{
584 // No page displayed yet
585 if (oldz==newz)
586 {
587 $("table"+newz).style.left="0px";
588 $("body").setAttribute("data-visible", newz);
589
590 doresize(0);
591
592 //setInterval(refresh_text, 1000);
593 //setInterval(refresh_graphics, 5000);
594
595 refresh_text();
596 refresh_graphics();
597 return;
598 }
599
600 //intervalSlide = setInterval("doSlideOut("+z+")", 25);
601
602 //var k = (z+1)%2;
603 //$("table"+k).style.display="";
604 //$("table"+z).style.display="";
605 //$("table"+k).style.zIndex="0";
606 //$("table"+z).style.zIndex="1";
607 //$("table"+k).style.left=0;
608 //$("table"+z).style.left=0;
609 //$("table"+k).style.backgroundColor = "#ffffff";
610 //$("table"+z).style.backgroundColor = "#ffffff";
611 //doresize(k);
612 //intervalSlide = setInterval("doSlide("+z+",1)", 50);
613
614 if (newz>oldz)
615 $("table"+newz).style.left=window.innerWidth+"px";
616 else
617 $("table"+newz).style.left=(-window.innerWidth-1)+"px";
618
619 //window.clearTimeout(timeoutText);
620 //window.clearTimeout(timeoutGraphics);
621
622 $("body").setAttribute("data-visible", newz);
623 intervalSlide = setInterval(function(){doShift(oldz,newz)}, 75);
624}
625
626function doShift(oldz, newz)
627{
628 var t0 = $("table"+oldz);
629 var t1 = $("table"+newz);
630
631 if (t0.style.display=="none")
632 {
633 clearInterval(intervalSlide);
634 $("body").removeChild(t0);
635 return;
636 }
637
638 var x0 = t0.offsetLeft;
639 var x1 = t1.offsetLeft;
640
641 var W = window.innerWidth;
642
643 if (newz<oldz)
644 {
645 x0 += W/5;
646 x1 += W/5;
647 }
648
649 if (newz>oldz)
650 {
651 x0 -= W/5;
652 x1 -= W/5;
653 }
654
655 if ((newz<oldz && x1>=0) || (newz>oldz && x1<=0))
656 {
657 t0.style.display="none";
658 x1 = 0;
659 }
660
661 t0.style.left = x0+"px";
662 t1.style.left = x1+"px";
663}
664
665/*
666function doSlide(z, dir)
667{
668 var k = (z+1)%2;
669
670 var W = window.innerWidth;
671
672 var tz = $("table"+z);
673 var tk = $("table"+k);
674
675 var xz = tz.offsetLeft;
676 var xk = tk.offsetLeft;
677
678 var ixz = parseInt(xz, 10);
679 var ikz = parseInt(xk, 10);
680
681 ixz += dir*W/10;
682 ikz -= dir*W/10;
683
684 tz.style.left = parseInt(ixz, 10)+"px";
685 tk.style.left = parseInt(ikz, 10)+"px";
686
687 if (ixz>W/2)
688 {
689 clearInterval(intervalSlide);
690
691 $("table"+k).style.zIndex="1";
692 $("table"+z).style.zIndex="0";
693
694 $("body").setAttribute("data-visible", k);
695 doresize(k);
696
697 intervalSlide = setInterval("doSlide("+z+",-1)", 50);
698 }
699 if (ikz>0)
700 {
701 clearInterval(intervalSlide);
702
703 tz.style.left = 0;
704 tk.style.left = 0;
705
706 tz.style.display="none";
707 }
708}
709
710
711function doSlideOut(z)
712{
713 var table = $("table"+z);
714
715 var W = window.innerWidth;
716 var x = table.offsetLeft;
717
718 var ix = parseInt(x, 10);
719 if (ix>W)
720 {
721 clearInterval(intervalSlide);
722
723 table.style.display="none";
724
725 z = (z+1)%2;
726 table = $("table"+z);
727
728 table.style.display="";
729 table.style.left = window.innerWidth+"px";
730
731 $("body").setAttribute("data-visible", z);
732 doresize(z);
733
734 intervalSlide = setInterval("doSlideIn("+z+")", 25);
735 return;
736 }
737
738 ix += W/10;
739 table.style.left=ix+"px";
740}
741
742function doSlideIn(z)
743{
744 var table = $("table"+z);
745
746 var W = window.innerWidth;
747 var x = table.offsetLeft;
748
749 var ix = parseInt(x, 10);
750
751 ix -= W/10;
752 if (ix<0)
753 ix = 0;
754
755 table.style.left=ix+"px";
756
757 if (ix<=0)
758 {
759 clearInterval(intervalSlide);
760 return;
761 }
762}
763*/
764
765var timeoutText = null;
766var timeoutGraphics = null;
767
768function refresh_text()
769{
770 var z=$("body").getAttribute("data-visible");
771 var table = $("table"+z);
772
773 // Is sliding or no file defined?
774 var fname = table.getAttribute("data-file");
775 if (isSliding() || !valid(fname))
776 {
777 timeoutText = setTimeout(refresh_text, 1000);
778 return;
779 }
780
781 var xmlHttp = new XMLHttpRequest();
782 xmlHttp.open('POST', fname+'.txt', true);
783 xmlHttp.onload = function ()
784 {
785 if (xmlHttp.status!=200)
786 {
787 alert("ERROR[1] - HTTP request '"+fname+".txt': "+xmlHttp.statusText+" ["+xmlHttp.status+"]");
788 timeoutText = setTimeout(refresh_text, 10000);
789 return;
790 }
791
792 if (!isSliding())
793 {
794 cycleCol($("ldot"+z));
795 update_text(fname, xmlHttp.responseText);
796 }
797 timeoutText = setTimeout(refresh_text, 3000);
798 };
799 xmlHttp.send(null);
800}
801
802function strike(e, status)
803{
804 if (!e)
805 return;
806
807 if (!status)
808 e.style.textDecoration="line-through";
809 else
810 e.style.textDecoration="";
811}
812
813function gray(id, str)
814{
815 var e = $(id);
816 if (!e)
817 return;
818
819 if (valid(str))
820 {
821 e.style.color="#000";
822 e.style.textDecoration="";
823 }
824 else
825 {
826 e.style.color="#daa";
827 e.style.textDecoration="line-through";
828 }
829
830}
831
832var date0 = null;
833
834function update_text(fname, result)
835{
836 var z=$("body").getAttribute("data-visible");
837 var table = $("table"+z);
838
839 if (table.getAttribute("data-file") != fname)
840 return;
841
842 var tokens = result.split('\n');
843
844 // ----------------------------------------------------
845
846 var time = $("reporttime"+z);
847 var ltime = $("localtime"+z);
848
849 var date1 = new Date();
850
851 if (tokens[0].length!=13)
852 {
853 if (date0 != null)
854 strike(time, date0.getTime()+60000>date1.getTime());
855 // FIXME: Reset display to "---" values -- no connection
856 return;
857 }
858
859 var date2 = new Date();
860 date2.setTime(tokens[0]);
861
862 strike(time, date2.getTime()+60000>date1.getTime());
863
864 date0 = date2;
865
866 var utc = date0.toUTCString();
867
868 time.innerHTML =
869 "&#8226;&nbsp;"+utc.substr(utc.length-12, 8)+"&nbsp;UTC&nbsp;&#8226;"
870 ltime.innerHTML =
871 "&#8226;&nbsp;"+date1.toLocaleString()+"&nbsp;&#8226;";
872
873 // ----------------------------------------------------
874
875 var p = table.tBodies.length==3 ? 1 : 0;
876 var tbody = table.tBodies[p];
877
878 for (var line=1; line<tokens.length; line++)
879 {
880 var c = tbody.rows[line-1].cells[1];
881 if (c == undefined)
882 continue;
883
884 var e = c.childNodes[0].rows[0].cells[1];
885 if (e == undefined)
886 continue;
887
888 var form = e.getAttribute("data-form");
889 if (form==undefined)
890 continue;
891
892 var cols = tokens[line].split('\t');
893 for (var col=1; col<cols.length; col++)
894 form = form.replace("\$"+(col-1), cols[col].length==0 ? "--" : cols[col]);
895
896 if (cols.length<=1)
897 form = "---";
898
899 var newe = document.createElement("div");
900 newe.innerHTML = form;
901 e.replaceChild(newe, e.lastChild);
902
903 e.parentNode.parentNode.parentNode.parentNode.style.background=cols[0];
904 }
905}
906
907// http://billmill.org/static/canvastutorial/index.html
908// http://www.netmagazine.com/tutorials/learning-basics-html5-canvas
909// http://www.alistapart.com/articles/responsive-web-design/
910
911function refresh_graphics()
912{
913 var z = $("body").getAttribute("data-visible");
914
915 var canvas = $("canvas"+z);
916
917 // Is sliding or no data file defined?
918 var fname = canvas==null ? "" : canvas.getAttribute("data-file");
919 if (isSliding() || !valid(fname))
920 {
921 timeoutGraphics = setTimeout(refresh_graphics, 1000);
922 return;
923 }
924
925 var xmlHttp = new XMLHttpRequest();
926 xmlHttp.open('POST', fname, true);
927 xmlHttp.onload = function()
928 {
929 if (xmlHttp.status!=200)
930 {
931 alert("ERROR[2] - Request '"+fname+"': "+xmlHttp.statusText+" ["+xmlHttp.status+"]");
932 timeoutGraphics = setTimeout(refresh_graphics, 10000);
933 //****** invalidate ******
934 return;
935 }
936
937 if (!isSliding())
938 {
939 cycleCol($("rdot"+z));
940 process_eventdata(xmlHttp.responseText);
941 }
942 timeoutGraphics = setTimeout(refresh_graphics, 5000)
943 };
944 xmlHttp.send(null);
945}
946
947
948function hueToRGB(hue)
949{
950 hue /= 3;
951 hue %= 6;
952
953 if (hue<1) return parseInt(255*hue, 10);
954 if (hue<3) return parseInt(255, 10);
955 if (hue<4) return parseInt(255*(4-hue), 10);
956
957/*
958 if (hue<1*5/4) return parseInt(255*hue*4/5);
959 if (hue<2*5/4) return parseInt(255);
960 if (hue<3*5/4) return parseInt(255*(3*5/4-hue)*4/5);
961*/
962/*
963 if (hue<1.5) return parseInt(255*hue/1.5);
964 if (hue<3.0) return parseInt(255);
965 if (hue<4.5) return parseInt(255*(4.5-hue)/1.5);
966*/
967 return 0.
968}
969
970function hueToHex(flt)
971{
972 var s = hueToRGB(flt).toString(16);
973 return s.length==2 ? s : "0"+s;
974}
975
976function HLStoRGB(hue)
977{
978 hue *= 14;
979
980 var sr = hueToHex(20-hue);
981 var sg = hueToHex(14-hue);
982 var sb = hueToHex(26-hue);
983
984 return sr+sg+sb;
985}
986
987
988function color(col)
989{
990 if (col==65533)
991 col = 0;
992
993 var hue = col/128;
994 return HLStoRGB(hue);
995}
996
997function toHex(str, idx)
998{
999 var ch = str[idx].toString(16);
1000 return ch.length==2 ? ch : "0"+ch;
1001}
1002
1003function drawHex(ctx, x, y, col)
1004{
1005 ctx.fillStyle = "#"+color(col);
1006
1007 ctx.save();
1008
1009 ctx.translate(x, y);
1010 ctx.scale(1/2, 1/3);
1011
1012 ctx.beginPath();
1013 ctx.moveTo( 1, 1);
1014 ctx.lineTo( 0, 2);
1015 ctx.lineTo(-1, 1);
1016 ctx.lineTo(-1, -1);
1017 ctx.lineTo( 0, -2);
1018 ctx.lineTo( 1, -1);
1019 ctx.fill();
1020
1021 ctx.restore();
1022}
1023
1024function drawDisc(ctx, x, y, r, col)
1025{
1026 ctx.fillStyle = "#"+color(col);
1027
1028 ctx.save();
1029
1030 ctx.translate(x, y);
1031
1032 ctx.beginPath();
1033 ctx.arc(0, 0, r, 0, Math.PI*2, true);
1034 ctx.fill();
1035
1036 ctx.restore();
1037}
1038
1039function beginDrawCam(scale)
1040{
1041 var z = $("body").getAttribute("data-visible");
1042 var canv = $("canvas"+z);
1043
1044 var w = Math.min(canv.width/scale, canv.height/scale);
1045
1046 var ctx = canv.getContext("2d");
1047
1048 ctx.save();
1049 ctx.translate(canv.width/2, canv.height/2);
1050 ctx.scale(w*2, w*2);
1051
1052 return ctx;
1053}
1054
1055/**
1056 * @constructor
1057 */
1058function position(s, ring, i)
1059{
1060 switch (s)
1061 {
1062 case 1: this.x = ring - i*0.5; this.y = + i; break;
1063 case 2: this.x = ring*0.5 - i; this.y = ring ; break;
1064 case 3: this.x = -ring*0.5 - i*0.5; this.y = ring - i; break;
1065 case 4: this.x = -ring + i*0.5; this.y = - i; break;
1066 case 5: this.x = -ring*0.5 + i; this.y = -ring ; break;
1067 case 0: this.x = ring*0.5 + i*0.5; this.y = -ring + i; break;
1068 }
1069 this.d = function() { return this.x*this.x + this.y*this.y*3/4; }
1070}
1071
1072function drawFullCam(data)
1073{
1074 if (data.length!=40 && data.length!=160 && data.length!=320 && data.length!=1440)
1075 {
1076 alert("Data length mismatch ("+data.length+")");
1077 return;
1078 }
1079
1080 var div = map.length/data.length;
1081 var off = data.length==320 ? 0.2 : 0;
1082
1083 var ctx = beginDrawCam(83);
1084 // ctx.rotate(Math.PI/3);
1085
1086 ctx.scale(1, Math.sqrt(3)/2);
1087 ctx.translate(-0.5, 0);
1088
1089 drawHex(ctx, 0, 0, data.charCodeAt(parseInt(map[0]/div+off, 10)));
1090
1091 var cnt = 1;
1092 for (var ring=1; ring<24; ring++)
1093 {
1094 for (var s=0; s<6; s++)
1095 {
1096 for (var i=1; i<=ring; i++)
1097 {
1098 var pos = new position(s, ring, i);
1099 if (pos.d() - pos.x > 395.75)
1100 continue;
1101
1102 var p = parseInt(map[cnt]/div+off, 10);
1103
1104 drawHex(ctx, pos.x, pos.y, data.charCodeAt(p));
1105 cnt++;
1106 }
1107 }
1108 }
1109
1110 drawHex(ctx, 7, -22, data.charCodeAt(parseInt(map[1438]/div+off, 10)));
1111 drawHex(ctx, 7, 22, data.charCodeAt(parseInt(map[1439]/div+off, 10)));
1112
1113 ctx.restore();
1114}
1115
1116function drawCam(data)
1117{
1118 var ctx = beginDrawCam(27);
1119 ctx.rotate(Math.PI/6);
1120 ctx.scale(1, Math.sqrt(3)/2);
1121
1122 drawHex(ctx, 0, 0, data.charCodeAt(0));
1123
1124 var cnt = 1;
1125 for (var ring=1; ring<=7; ring++)
1126 {
1127 for (var s=0; s<6; s++)
1128 {
1129 for (var i=1; i<=ring; i++)
1130 {
1131 var pos = new position(s, ring, i);
1132 if (pos.d() > 44)
1133 continue;
1134
1135 if (ring==7)
1136 {
1137 if (i==6 && (s==0 || s==3))
1138 continue;
1139 if (i==1 && (s==1 || s==4))
1140 continue;
1141 }
1142
1143 drawHex(ctx, pos.x, pos.y, data.charCodeAt(cnt++));
1144 }
1145 }
1146 }
1147
1148 ctx.restore();
1149}
1150
1151function drawCamLegend(canv)
1152{
1153 var vals = canv.getAttribute("data-data").split("/");
1154
1155 var v0 = parseFloat(vals[0]);
1156 var v1 = parseFloat(vals[1]);
1157
1158 var diff = v1-v0;
1159
1160 var cw = canv.width;
1161 var ch = canv.height;
1162
1163 var ctx = canv.getContext("2d");
1164
1165 ctx.font = "8pt Arial";
1166 ctx.textAlign = "right";
1167 ctx.textBaseline = "top";
1168
1169 for (var i=0; i<9; i++)
1170 {
1171 ctx.strokeStyle = "#"+color(16*i);
1172 ctx.strokeText((v0+diff*i/8)+vals[2], cw-5, 135-i*15);
1173 }
1174}
1175
1176function drawGraph(canv, data)
1177{
1178 var cw = canv.width;
1179 var ch = canv.height;
1180
1181 var ctx = canv.getContext("2d");
1182
1183 var vals = canv.getAttribute("data-data").split("/");
1184
1185 var dw = 3; // tick width
1186
1187 var fs = 8; // font size
1188
1189 ctx.font = fs+"pt Arial";
1190 ctx.textAlign = "right";
1191
1192 var dim0 = ctx.measureText(vals[0]);
1193 var dim1 = ctx.measureText(vals[1]);
1194
1195 var tw = vals.length>=2 ? Math.max(dim0.width, dim1.width)+dw+2 : 0;
1196
1197 var ml = vals.length>=2 ? 5+tw : 10; // margin left
1198 var mr = 10; // margin right
1199
1200 var mt = vals.length>=2 ? fs/2+5 : 5; // margin top
1201 var mb = vals.length>=2 ? fs/2+4 : 5; // margin bottom
1202
1203 var nx = 20;
1204 var ny = 10;
1205
1206 var w = cw-ml-mr;
1207 var h = ch-mt-mb;
1208
1209 ctx.strokeStyle = "#666";
1210
1211 // --- data ---
1212 ctx.beginPath();
1213 ctx.moveTo(ml, ch-mb-data.charCodeAt(0)/128*h);
1214 for (var i=1; i<data.length; i++)
1215 ctx.lineTo(ml+w/(data.length-1)*i, ch-mb-data.charCodeAt(i)/128*h);
1216
1217 // --- finalize data ---
1218 ctx.lineTo(cw-mr, ch-mb);
1219 ctx.lineTo(ml, ch-mb);
1220 ctx.fillStyle = "#"+color(100);
1221 ctx.stroke();
1222 ctx.fill();
1223
1224 ctx.beginPath();
1225
1226 // --- grid ---
1227
1228 ctx.strokeStyle = "#eee";
1229
1230 for (var i=1; i<=nx; i++)
1231 {
1232 ctx.moveTo(ml+w/nx*i, ch-mb);
1233 ctx.lineTo(ml+w/nx*i, mt);
1234 }
1235 for (var i=0; i<ny; i++)
1236 {
1237 ctx.moveTo(ml, mb+h/ny*i);
1238 ctx.lineTo(ml+w, mb+h/ny*i);
1239 }
1240 ctx.stroke();
1241 ctx.closePath();
1242 ctx.beginPath();
1243
1244 ctx.strokeStyle = "#000";
1245
1246 // --- axes ---
1247 ctx.moveTo(ml, mt);
1248 ctx.lineTo(ml, ch-mb);
1249 ctx.lineTo(cw-mr, ch-mb);
1250
1251 for (var i=1; i<=nx; i++)
1252 {
1253 ctx.moveTo(ml+w/nx*i, ch-mb-dw);
1254 ctx.lineTo(ml+w/nx*i, ch-mb+dw);
1255 }
1256 for (var i=0; i<ny; i++)
1257 {
1258 ctx.moveTo(ml-dw, mb+h/ny*i);
1259 ctx.lineTo(ml+dw, mb+h/ny*i);
1260 }
1261 ctx.stroke();
1262 ctx.closePath();
1263
1264 if (vals.length>=2)
1265 {
1266 ctx.textBaseline = "bottom";
1267 ctx.strokeText(vals[0], ml-dw-2, ch-1);
1268
1269 ctx.textBaseline = "top";
1270 ctx.strokeText(vals[1], ml-dw-2, 0);
1271 }
1272}
1273
1274function process_eventdata(result)
1275{
1276 var z = $("body").getAttribute("data-visible");
1277 var canv = $("canvas"+z);
1278 if (canv == undefined)
1279 return;
1280
1281 var type = canv.getAttribute("data-type");
1282
1283 var ctx = canv.getContext("2d");
1284 ctx.clearRect(0, 0, canv.width, canv.height);
1285
1286 switch (type)
1287 {
1288 case "hist": drawGraph(canv, result); break;
1289 //case "camera": drawCam(result); break;
1290 case "camera": drawFullCam(result); drawCamLegend(canv); break;
1291 }
1292
1293 $("image"+z).src = canv.toDataURL("image/png");
1294}
1295
1296/*
1297function save()
1298{
1299 var z = $("body").getAttribute("data-visible");
1300
1301 var canvas = $("canvas"+z);
1302 var img = canvas.toDataURL("image/png");
1303
1304 img = img.replace("image/png", "image/octet-stream");
1305
1306 document.location.href = img;
1307}
1308*/
1309window['onload'] = onload;
Note: See TracBrowser for help on using the repository browser.