|
288
|
1 var isInProgress=0;
|
|
|
2
|
|
|
3 var MAX_DUMP_DEPTH = 10;
|
|
|
4 var inkscape;
|
|
|
5
|
|
|
6
|
|
|
7
|
|
|
8 function dumpObj(obj, name, indent, depth) {
|
|
|
9 if (depth > MAX_DUMP_DEPTH) {
|
|
|
10 return indent + name + ": <Maximum Depth Reached>\n";
|
|
|
11 }
|
|
|
12 if (typeof obj == "object") {
|
|
|
13 var child = null;
|
|
|
14 var output = indent + name + "\n";
|
|
|
15 indent += "\t";
|
|
|
16 for (var item in obj)
|
|
|
17 {
|
|
|
18 try {
|
|
|
19 child = obj[item];
|
|
|
20 } catch (e) {
|
|
|
21 child = "<Unable to Evaluate>";
|
|
|
22 }
|
|
|
23 if (typeof child == "object") {
|
|
|
24 output += dumpObj(child, item, indent, depth + 1);
|
|
|
25 } else {
|
|
|
26 output += indent + item + ": " + child + "\n";
|
|
|
27 }
|
|
|
28 }
|
|
|
29 return output;
|
|
|
30 } else {
|
|
|
31 return obj;
|
|
|
32 }
|
|
|
33 }
|
|
|
34 function dumpObjItem(obj, name, indent, depth) {
|
|
|
35 if (depth > MAX_DUMP_DEPTH) {
|
|
|
36 return indent + name + ": <Maximum Depth Reached>\n";
|
|
|
37 }
|
|
|
38 if (typeof obj == "object") {
|
|
|
39 var child = null;
|
|
|
40 var output = indent + name + "\n";
|
|
|
41 indent += "\t";
|
|
|
42 for (var item in obj)
|
|
|
43 {
|
|
|
44 try {
|
|
|
45 child = obj[item];
|
|
|
46 } catch (e) {
|
|
|
47 child = "<Unable to Evaluate>";
|
|
|
48 }
|
|
|
49 if (typeof child == "object") {
|
|
|
50 output += dumpObjItem(child, item, indent, depth + 1);
|
|
|
51 } else {
|
|
|
52 output += indent + item + ":\n";
|
|
|
53 }
|
|
|
54 }
|
|
|
55 return output;
|
|
|
56 } else {
|
|
|
57 return obj;
|
|
|
58 }
|
|
|
59 }
|
|
|
60 /**
|
|
|
61 * Inkscape class
|
|
|
62 *
|
|
|
63 */
|
|
|
64 function Inkscape(file)
|
|
|
65 {
|
|
|
66 var ink = document.getElementById('inkscape');
|
|
352
|
67 ink.innerHTML = "<embed src="+file+" width=700 height=700 />";
|
|
288
|
68 this.isInProgress = 0;
|
|
|
69
|
|
|
70 setTimeout("inkscape.fetchDocument()",4000);
|
|
|
71 }
|
|
|
72
|
|
|
73 Inkscape.prototype.gotoScene = function (n)
|
|
|
74 {
|
|
|
75 nextScene = n;
|
|
|
76 var soapBody = new SOAPObject("START");
|
|
|
77 var sr = new SOAPRequest("START", soapBody);
|
|
|
78 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
79 SOAPClient.SendRequest(sr, function (resp,arg) {arg.gotoScene1(resp);},this);
|
|
|
80 this.isInProgress++;
|
|
|
81 }
|
|
|
82 Inkscape.prototype.gotoScene1 = function (resp,n)
|
|
|
83 {
|
|
|
84 var soapBody = new SOAPObject("SCENE");
|
|
|
85 var v1 = new SOAPObject("v1");
|
|
|
86 v1.val(nextScene);
|
|
|
87 soapBody.appendChild(v1);
|
|
|
88 var sr = new SOAPRequest("SCENE", soapBody);
|
|
|
89 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
90 SOAPClient.SendRequest(sr, function (resp,arg) {arg.gotoScene2(resp);},this);
|
|
|
91 }
|
|
|
92 Inkscape.prototype.gotoScene2 = function (resp)
|
|
|
93 {
|
|
|
94 var soapBody = new SOAPObject("PUBLISH");
|
|
|
95 var sr = new SOAPRequest("PUBLISH", soapBody);
|
|
|
96 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
97 SOAPClient.SendRequest(sr, function (resp,arg) {arg.gotoScene3(resp);},this);
|
|
|
98 }
|
|
|
99
|
|
|
100 Inkscape.prototype.gotoScene3 = function (resp)
|
|
|
101 {
|
|
|
102 this.isInProgress--;
|
|
|
103 }
|
|
|
104 Inkscape.prototype.publishDocument= function(resp)
|
|
|
105 {
|
|
|
106 mbsvg = new MBSVGString(resp.Body[0].GETDOCResponse[0].Result[0].Text);
|
|
|
107 mbsvg.renderUI();
|
|
|
108
|
|
|
109 var soapBody = new SOAPObject("PUBLISH");
|
|
|
110 var sr = new SOAPRequest("PUBLISH", soapBody);
|
|
|
111 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
112 SOAPClient.SendRequest(sr, function(resp,arg) {arg.operationDone(resp);},this);
|
|
|
113 }
|
|
|
114
|
|
|
115 Inkscape.prototype.refreshDocument = function(resp)
|
|
|
116 {
|
|
|
117 var soapBody = new SOAPObject("GETDOC");
|
|
|
118 var sr = new SOAPRequest("GETDOC", soapBody);
|
|
|
119 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
120 SOAPClient.SendRequest(sr, function(resp,arg) { arg.publishDocument(resp);},this);
|
|
|
121 }
|
|
|
122
|
|
|
123 Inkscape.prototype.operationDone = function (res)
|
|
|
124 {
|
|
|
125 this.isInProgress--;
|
|
|
126 }
|
|
|
127 Inkscape.prototype.insertKey= function(n)
|
|
|
128 {
|
|
|
129 nextScene = n;
|
|
|
130 var soapBody = new SOAPObject("START");
|
|
|
131 var sr = new SOAPRequest("START", soapBody);
|
|
|
132 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
133 SOAPClient.SendRequest(sr, function (resp,arg) {arg.insertKey1(resp);},this);
|
|
|
134 this.isInProgress++;
|
|
|
135 }
|
|
|
136 Inkscape.prototype.insertKey1 = function(resp)
|
|
|
137 {
|
|
|
138 var soapBody = new SOAPObject("INSERTKEY");
|
|
|
139 var v1 = new SOAPObject("v1");
|
|
|
140 v1.attr('type','string');
|
|
|
141 v1.val(currentLayer);
|
|
|
142 soapBody.appendChild(v1);
|
|
|
143 var v2 = new SOAPObject("v2");
|
|
|
144 v2.val(nextScene);
|
|
|
145 soapBody.appendChild(v2);
|
|
|
146 var sr = new SOAPRequest("INSERTKEY", soapBody);
|
|
|
147 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
148 SOAPClient.SendRequest(sr, function (resp,arg) {arg.refreshDocument(resp);},this);
|
|
|
149 }
|
|
|
150
|
|
|
151 Inkscape.prototype.extendScene=function()
|
|
|
152 {
|
|
|
153 var soapBody = new SOAPObject("START");
|
|
|
154 var sr = new SOAPRequest("START", soapBody);
|
|
|
155 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
156 SOAPClient.SendRequest(sr, function (resp,arg) {arg.extendScene1(resp);},this);
|
|
|
157 this.isInProgress++;
|
|
|
158 }
|
|
|
159
|
|
|
160
|
|
|
161 Inkscape.prototype.extendScene1 = function(resp)
|
|
|
162 {
|
|
|
163 var soapBody = new SOAPObject("EXTENDSCENE");
|
|
|
164 var v1 = new SOAPObject("v1");
|
|
|
165 v1.attr('type','string');
|
|
|
166 v1.val(currentLayer);
|
|
|
167 soapBody.appendChild(v1);
|
|
|
168 var v2 = new SOAPObject("v2");
|
|
|
169 v2.val(currentScene);
|
|
|
170 soapBody.appendChild(v2);
|
|
|
171 var sr = new SOAPRequest("EXTENDSCENE", soapBody);
|
|
|
172 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
173 SOAPClient.SendRequest(sr, function (resp,arg) {arg.refreshDocument(resp);},this);
|
|
|
174 }
|
|
|
175
|
|
|
176
|
|
|
177 Inkscape.prototype.deleteScene=function()
|
|
|
178 {
|
|
|
179 var soapBody = new SOAPObject("START");
|
|
|
180 var sr = new SOAPRequest("START", soapBody);
|
|
|
181 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
182 SOAPClient.SendRequest(sr, function (resp,arg) {arg.deleteScene1(resp);},this);
|
|
|
183 this.isInProgress++;
|
|
|
184 }
|
|
|
185
|
|
|
186 Inkscape.prototype.deleteScene1=function(resp)
|
|
|
187 {
|
|
|
188 var soapBody = new SOAPObject("DELETESCENE");
|
|
|
189 var v1 = new SOAPObject("v1");
|
|
|
190 v1.attr('type','string');
|
|
|
191 v1.val(currentLayer);
|
|
|
192 soapBody.appendChild(v1);
|
|
|
193 var v2 = new SOAPObject("v2");
|
|
|
194 v2.val(currentScene);
|
|
|
195 soapBody.appendChild(v2);
|
|
|
196 var sr = new SOAPRequest("EXTENDSCENE", soapBody);
|
|
|
197 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
198 SOAPClient.SendRequest(sr, function (resp,arg) {arg.refreshDocument(resp);},this);
|
|
|
199 }
|
|
|
200
|
|
|
201 Inkscape.prototype.fetchDocument = function()
|
|
|
202 {
|
|
|
203 var soapBody = new SOAPObject("START");
|
|
|
204 var sr = new SOAPRequest("START", soapBody);
|
|
|
205 SOAPClient.Proxy = "http://localhost:19192/";
|
|
|
206 SOAPClient.SendRequest(sr,function(resp,arg) {arg.refreshDocument(resp);},this);
|
|
|
207 this.isInProgress++;
|
|
|
208 }
|
|
|
209
|
|
|
210
|
|
|
211
|
|
|
212 function MBSVG(file)
|
|
|
213 {
|
|
|
214 var xmlDoc=document.implementation.createDocument("http://madbutterfly.sourceforge.net/DTD/madbutterfly.dtd","",null);
|
|
|
215 xmlDoc.async=false;
|
|
|
216 xmlDoc.load(file);
|
|
|
217 MBSVG_loadFromDoc(this,xmlDoc);
|
|
|
218
|
|
|
219 }
|
|
|
220 function MBSVGString(xml)
|
|
|
221 {
|
|
|
222 var xmlParser = new DOMParser();
|
|
|
223 var xmlDoc = xmlParser.parseFromString( xml, 'text/xml');
|
|
|
224 MBSVG_loadFromDoc(this,xmlDoc);
|
|
|
225 }
|
|
|
226
|
|
|
227
|
|
|
228
|
|
|
229 function MBSVG_loadFromDoc(self,xmlDoc)
|
|
|
230 {
|
|
|
231 var scenesNode = xmlDoc.getElementsByTagNameNS("http://madbutterfly.sourceforge.net/DTD/madbutterfly.dtd","scene");
|
|
|
232 if (scenesNode == null) {
|
|
|
233 alert('This is not a valid scene file');
|
|
|
234 }
|
|
|
235 var len = scenesNode.length;
|
|
|
236 var i,j;
|
|
|
237 var max = 0;
|
|
|
238 var scenes = new Array();
|
|
|
239
|
|
|
240 // Get the length of scenes
|
|
|
241 for(i=0;i<len;i++) {
|
|
|
242 var s = scenesNode[i];
|
|
|
243 var start = s.getAttribute("start");
|
|
|
244 var end = s.getAttribute("end");
|
|
|
245 var ref = s.getAttribute("ref");
|
|
|
246 var ss = new Object();
|
|
|
247
|
|
|
248 if (end == null) end = start
|
|
|
249 if (max <end) max = end;
|
|
|
250 ss.node = s;
|
|
|
251 ss.start = start;
|
|
|
252 ss.end = end;
|
|
|
253 ss.ref = ref;
|
|
|
254 ss.layer = null;
|
|
|
255 scenes.push(ss);
|
|
|
256 }
|
|
|
257 if (max < 20) max = 20;
|
|
|
258 // Collect all layers
|
|
|
259 var nodes = xmlDoc.getElementsByTagNameNS("http://www.w3.org/2000/svg","svg")[0].childNodes;
|
|
|
260 var layers = new Array();
|
|
|
261 len = nodes.length;
|
|
|
262 for(i=0;i<len;i++) {
|
|
|
263 if (nodes[i].localName == 'g') {
|
|
|
264 var subnodes = nodes[i].childNodes;
|
|
|
265 for(j=0;j<subnodes.length;j++) {
|
|
|
266 if (subnodes[j].localName == 'g') {
|
|
|
267 for(var k=0;k<scenes.length;k++) {
|
|
|
268 if (scenes[k].ref == subnodes[j].getAttribute('id')) {
|
|
|
269 scenes[k].layer = nodes[i].getAttribute('id');
|
|
|
270 break;
|
|
|
271 }
|
|
|
272 }
|
|
|
273 }
|
|
|
274 }
|
|
|
275 layers.push(nodes[i]);
|
|
|
276 }
|
|
|
277 }
|
|
|
278 self.layers = layers;
|
|
|
279 self.scenes = scenes;
|
|
|
280 self.maxframe = max;
|
|
|
281 }
|
|
|
282
|
|
|
283 MBSVGString.prototype=MBSVG.prototype;
|
|
|
284 MBSVG.prototype.renderUI=function()
|
|
|
285 {
|
|
|
286 var layers = this.layers;
|
|
|
287 var scenes = this.scenes;
|
|
|
288 var max = this.maxframe;
|
|
|
289 var cmd = "<table border=1>\n";
|
|
|
290 cmd = cmd + "<tr><td></td>";
|
|
|
291 for(var j=1;j<=max;j++)
|
|
|
292 cmd = cmd + "<td>"+j+"</td>";
|
|
|
293
|
|
|
294 for(var i=layers.length-1;i>=0;i--) {
|
|
|
295 var l = layers[i];
|
|
|
296 var id = l.getAttribute('id');
|
|
|
297 var label = l.getAttribute('inkscape:label');
|
|
|
298 cmd = cmd + "<tr><td>"+label+"</td>";
|
|
|
299 for(j=0;j<max;j++) {
|
|
|
300 var empty = 1;
|
|
|
301 var n = j +1;
|
|
|
302 var id_str = id+"#"+n
|
|
|
303 for(var k=0;k<scenes.length;k++) {
|
|
|
304 if (id != scenes[k].layer) continue;
|
|
|
305 if (n == scenes[k].start) {
|
|
|
306 cmd = cmd + "<td><img class='normal' src=start.png id='"+id_str+"' onClick='selectCell(this)' /></td>";
|
|
|
307 empty = 0;
|
|
|
308 break;
|
|
|
309 } else if ((n>scenes[k].start)&&(n <= scenes[k].end)) {
|
|
|
310 cmd = cmd + "<td><img class='normal' src=fill.png id='"+id_str+"' onClick='selectCell(this)' /></td>";
|
|
|
311 empty = 0;
|
|
|
312 break;
|
|
|
313 }
|
|
|
314 }
|
|
|
315 if (empty) {
|
|
|
316 cmd = cmd + "<td><img class='normal' src=empty.png id='"+id_str+"'onClick='selectCell(this)' /></td>";
|
|
|
317 }
|
|
|
318
|
|
|
319 }
|
|
|
320 cmd = cmd + "</tr>\n";
|
|
|
321 }
|
|
|
322 cmd = cmd + "</table>\n";
|
|
|
323 var frame = document.getElementById('frame');
|
|
|
324 frame.innerHTML=cmd;
|
|
|
325 }
|
|
|
326
|
|
|
327
|
|
|
328
|
|
|
329 /**
|
|
|
330 * UI for madbuilder.html to build the scene editor
|
|
|
331 */
|
|
|
332
|
|
|
333 function selectCell(obj)
|
|
|
334 {
|
|
|
335 var id = obj.getAttribute('id');
|
|
|
336 var layer,n;
|
|
|
337 var f = id.split('#');
|
|
|
338 layer=f[0];
|
|
|
339 n = f[1];
|
|
|
340 var img = obj.getAttribute('src');
|
|
|
341 var f = img.split('-');
|
|
|
342
|
|
|
343 if (f[0] == 'active')
|
|
|
344 return;
|
|
|
345 else {
|
|
|
346 obj.setAttribute('src', 'active-'+img);
|
|
|
347 }
|
|
|
348
|
|
|
349 if (last_select != null) {
|
|
|
350 f = last_select.getAttribute('src').split('-');
|
|
|
351 last_select.setAttribute('src', f[1]);
|
|
|
352 }
|
|
|
353 last_select = obj;
|
|
|
354 currentScene = n;
|
|
|
355 currentLayer = layer;
|
|
|
356 }
|
|
|
357
|
|
|
358
|
|
|
359 function onButtonClick(obj)
|
|
|
360 {
|
|
|
361 if (inkscape.isInProgress != 0) return;
|
|
|
362 var id = obj.getAttribute('id');
|
|
|
363 if (id == 'Jump') {
|
|
|
364 if (currentScene != 0)
|
|
|
365 inkscape.gotoScene(currentScene);
|
|
|
366 } else if (id == 'InsertKey') {
|
|
|
367 inkscape.insertKey(currentScene);
|
|
|
368 } else if (id == 'ExtendScene') {
|
|
|
369 inkscape.extendScene(currentScene);
|
|
|
370 } else if (id == 'DeleteScene') {
|
|
|
371 inkscape.deleteScene(currentScene);
|
|
|
372 } else {
|
|
|
373 alert(id+' has not been implemented yet');
|
|
|
374 }
|
|
|
375 }
|
|
|
376
|
|
|
377 function gotoScene_cb(resObj)
|
|
|
378 {
|
|
|
379
|
|
|
380 }
|
|
|
381 var nextScene;
|
|
|
382 var currentScene = 0;
|
|
|
383 var currentLayer = '';
|
|
|
384
|
|
357
|
385
|
|
|
386 function dump(n)
|
|
|
387 {
|
|
|
388 cmd = "";
|
|
|
389 for(k in n) {
|
|
|
390 cmd = cmd + k+"="+n[k]+"\n";
|
|
|
391 }
|
|
|
392 alert(cmd);
|
|
|
393 }
|
|
288
|
394
|
|
|
395
|
|
357
|
396 function openFile()
|
|
|
397 {
|
|
|
398 alert('bug');
|
|
|
399 $.modal('<div>My data</div>');
|
|
|
400 alert('done');
|
|
|
401 }
|
|
|
402
|
|
|
403
|
|
|
404 var last_select = null;
|
|
|
405
|
|
|
406 $('#inkscape').html('Please select the project file<br>');
|
|
|
407 $('#inkscape').append('<input type=file value="Select the project file" id="mbsvg" accept="image/png">');
|
|
|
408 $('#inkscape').append('<input type=button value="Load" onclick="loadFile()">');
|
|
|
409
|
|
|
410
|
|
|
411 function loadFile()
|
|
|
412 {
|
|
|
413 ele = $('#mbsvg');
|
|
|
414 file = ele.attr('value');
|
|
|
415 inkscape = new Inkscape("file://"+file);
|
|
|
416
|
|
|
417 var tree = $.tree_create();
|
|
352
|
418 file1_animation = [
|
|
|
419 {
|
|
|
420 attributes: {id:"an1-1"},
|
|
|
421 data: "animation1"
|
|
|
422 },
|
|
|
423 {
|
|
|
424 attributes: {id:"an1-2"},
|
|
|
425 data: "animation2"
|
|
|
426 }
|
|
|
427 ];
|
|
|
428 file1 = {
|
|
|
429 attributes:{id:"file1"},
|
|
|
430 data: "scene1.mbsvg",
|
|
|
431 children: file1_animation
|
|
|
432 };
|
|
|
433 file2 = {
|
|
|
434 attributes:{id:"file2"},
|
|
|
435 data: "scene2.mbsvg",
|
|
|
436 };
|
|
|
437 file3 = {
|
|
|
438 attributes:{id:"file3"},
|
|
|
439 data: "scene3.mbsvg",
|
|
|
440 };
|
|
|
441
|
|
|
442 scenes = [ file1,file2,file3];
|
|
|
443 src1 = {attributes:{id:"src1"},data:"src1.c"};
|
|
|
444 src2 = {attributes:{id:"src1"},data:"src2.c"};
|
|
|
445 src3 = {attributes:{id:"src1"},data:"src3.c"};
|
|
|
446
|
|
|
447 sources = [src1,src2,src3];
|
|
|
448
|
|
|
449 tree.init($("#filelist"), {
|
|
|
450 data: {
|
|
|
451 type: "json",
|
|
|
452 json : {
|
|
357
|
453 attributes: {id: "prj"}, state: "open", data: "Project",
|
|
|
454 children: [
|
|
352
|
455 { attributes:{id:"scenes"}, data:"scene", children: scenes},
|
|
|
456 { attributes:{id:"sources"},data:"sources",children: sources}
|
|
|
457 ]
|
|
|
458 }
|
|
357
|
459 },
|
|
|
460 ui : {
|
|
|
461 context : [
|
|
|
462 {
|
|
|
463 id: "Open",
|
|
|
464 label: "Open",
|
|
|
465 icon: "open.png",
|
|
|
466 visible: function(NODE,TREE_OBJ) { if(NODE.length != 1) return false; return NODE[0].id == "prj";},
|
|
|
467 action: function(NODE,TREE_OBJ) { openFile(TREE_OBJ);}
|
|
|
468 },
|
|
|
469 {
|
|
|
470 id: "New",
|
|
|
471 label: "New",
|
|
|
472 icon: "create.png",
|
|
|
473 visible: function(NODE,TREE_OBJ) { if(NODE.length != 1) return false; return NODE[0].id == "prj";},
|
|
|
474 action: function(NODE,TREE_OBJ) { alert("open is not support yet");}
|
|
|
475 },
|
|
|
476 {
|
|
|
477 id: "Rename",
|
|
|
478 label: "Rename",
|
|
|
479 icon: "rename.png",
|
|
|
480 visible: function(NODE,TREE_OBJ) { if(NODE.length != 1) return false; return NODE[0].id == "prj";},
|
|
|
481 action: function(NODE,TREE_OBJ) { alert("open is not support yet");}
|
|
|
482 },
|
|
|
483 ]
|
|
|
484 },
|
|
|
485
|
|
352
|
486 });
|
|
357
|
487 }
|
