Project

General

Profile

offscreenBuffer_5.txt

Sergey Ivanovskiy, 12/10/2015 01:33 PM

Download (60.6 KB)

 
1
=== modified file 'src/com/goldencode/p2j/ui/client/driver/web/index.html'
2
--- src/com/goldencode/p2j/ui/client/driver/web/index.html	2015-09-08 16:51:50 +0000
3
+++ src/com/goldencode/p2j/ui/client/driver/web/index.html	2015-12-10 15:02:20 +0000
4
@@ -4,6 +4,9 @@
5
       <title>P2J ${client_title} Web Client</title>
6
       
7
       <link rel="stylesheet" type="text/css" href="/dojo-toolkit/dijit/themes/claro/claro.css">
8
+      <style type="text/css">
9
+         .wait, .wait * { cursor: wait !important; }
10
+      </style>
11
       <!-- load dojo -->      
12
       <script src="/dojo-toolkit/dojo/dojo.js" data-dojo-config="async: true"></script>  
13
             
14

    
15
=== modified file 'src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js'
16
--- src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js	2015-10-22 23:14:19 +0000
17
+++ src/com/goldencode/p2j/ui/client/driver/web/res/p2j.js	2015-12-10 18:12:39 +0000
18
@@ -96,9 +96,25 @@
19
       
20
       // save off our client mode type
21
       p2j.isGui = cfg.isGui;
22
-
23
+      /** the body html css class name to display wait cursor */
24
+      p2j.waitCursorClass = " wait";
25
+      /** the body html css class name to display default cursor */
26
+      p2j.bodyHtmlClass = document.body.className;
27
+      /** to display the wait cursor for the document */
28
+      p2j.displayWaitCursor = function ()
29
+      {
30
+         if (document.body.className === p2j.bodyHtmlClass)
31
+         {
32
+            document.body.className += p2j.waitCursorClass;
33
+         }
34
+      }
35
+      /** to restore the cursor for the document */
36
+      p2j.restoreCursor = function ()
37
+      {
38
+         document.body.className = p2j.bodyHtmlClass;
39
+      }
40
       // init modules (don't change the order here!)
41
-      p2j.logger.init(4096);
42
+      p2j.logger.init(4096, true);
43
       p2j.sound.init(cfg);
44
       p2j.fonts.init();
45
       p2j.screen.init(cfg);
46

    
47
=== modified file 'src/com/goldencode/p2j/ui/client/driver/web/res/p2j.logger.js'
48
--- src/com/goldencode/p2j/ui/client/driver/web/res/p2j.logger.js	2015-09-05 16:09:44 +0000
49
+++ src/com/goldencode/p2j/ui/client/driver/web/res/p2j.logger.js	2015-12-10 15:02:20 +0000
50
@@ -24,15 +24,21 @@
51
    
52
    /** The stack capacity, the last visible history.*/
53
    var maxStackSize;
54
+
55
+   /** The stack capacity, the last visible history.*/
56
+   var isOn;
57
    /**
58
     * Initialize the logger with the storage capacity.
59
     * 
60
     * @param    {Number}
61
     *           The log stack capacity.
62
+    * @param    {boolean}
63
+    *           The boolean value that indicates the log is on/off.
64
     */
65
-   me.init = function(capacity)
66
+   me.init = function(capacity, on)
67
    {
68
       maxStackSize = capacity;
69
+      isOn = on;
70
    };
71
 
72
    /**
73
@@ -43,7 +49,10 @@
74
     */
75
    me.log = function(msg)
76
    {
77
-      save(msg);
78
+      if (isOn)
79
+      {
80
+         save(msg);
81
+      }
82
    };
83
    
84
    /*
85
@@ -56,19 +65,22 @@
86
     */
87
    me.logFormatted = function(format, parameters)
88
    {
89
-      save(format.split("%d").map(
90
-            function(currValue, index, arr)
91
-            {
92
-               if (this[index] === undefined)
93
+      if (isOn)
94
+      {
95
+         save(format.split("%d").map(
96
+               function(currValue, index, arr)
97
                {
98
-                  return currValue;
99
-               }
100
-               return currValue + this[index];
101
-            }, parameters).reduce(
102
-                  function(prevValue, currValue)
103
+                  if (this[index] === undefined)
104
                   {
105
-                     return prevValue + currValue;
106
-                  }, ""));
107
+                     return currValue;
108
+                  }
109
+                  return currValue + this[index];
110
+               }, parameters).reduce(
111
+                     function(prevValue, currValue)
112
+                     {
113
+                        return prevValue + currValue;
114
+                     }, ""));
115
+      }
116
    };
117
    
118
    /**
119

    
120
=== modified file 'src/com/goldencode/p2j/ui/client/driver/web/res/p2j.socket.js'
121
--- src/com/goldencode/p2j/ui/client/driver/web/res/p2j.socket.js	2015-11-26 10:46:59 +0000
122
+++ src/com/goldencode/p2j/ui/client/driver/web/res/p2j.socket.js	2015-12-10 18:20:00 +0000
123
@@ -403,6 +403,511 @@
124
             me.sendNotification(0xff);
125
          };
126
 
127
+         /** Web socket message handler */
128
+         var messageHandler = function(message)
129
+         {
130
+            switch (message[0])
131
+            {
132
+               case 0x80:
133
+                  // clear screen 
134
+                  p2j.screen.clear();                        
135
+                  break;
136
+               case 0x81:
137
+                  // draw screen
138
+                  var t1 = (new Date()).getTime();
139
+                  p2j.screen.drawRectangles(message);
140
+                  var t2 = (new Date()).getTime();
141
+                  // console.log("message: " + message.length + " done in " + (t2 - t1));
142
+                  break;
143
+               case 0x82:
144
+                  // set cursor position
145
+                  p2j.screen.setCursorPosition(message[1], message[2]);                        
146
+                  break;
147
+               case 0x83:
148
+                  // show cursor
149
+                  p2j.screen.setCursorStatus(message[1]);                        
150
+                  break;
151
+               case 0x84:
152
+                  // message beep
153
+                  p2j.sound.beep();                        
154
+                  break;
155
+               case 0x85:
156
+                  // quit
157
+                  window.location.replace(referrer);                        
158
+                  break;
159
+               case 0x86:
160
+                  // switch mode p2j/vt100
161
+                  p2j.keyboard.vt100 = (message[1] == 0) ? false : true;          
162
+                  break;
163
+               case 0x87:
164
+                  // server-driven request for clipboard contents
165
+                  p2j.clipboard.sendClipboardContents();          
166
+                  break;
167
+               case 0x88:
168
+                  // The clipboard is changed.
169
+                  var text = me.readStringBinaryMessage(message, 1);
170
+                  p2j.clipboard.writeClipboard(text);
171
+                  break;
172
+               case 0x89:
173
+                  // create a top-level window with the given id
174
+                  var id = me.readInt32BinaryMessage(message, 1);
175
+                  p2j.screen.createWindow(id);
176
+                  break;
177
+               case 0x8A:
178
+                  // create a child window with the given id, owner and title
179
+                  var id    = me.readInt32BinaryMessage(message, 1);
180
+                  var owner = me.readInt32BinaryMessage(message, 5);
181
+                  var title = me.readStringBinaryMessage(message, 9);
182
+                  p2j.screen.createChildWindow(id, owner);
183
+                  break;
184
+               case 0x8B:
185
+                  // destroy top-level or child window
186
+                  var id = me.readInt32BinaryMessage(message, 1);
187
+                  var numberImages = me.readInt32BinaryMessage(message, 5);
188
+                  var images = [];
189
+                  for (var i = 0; i < numberImages; i++)
190
+                  {
191
+                     images[i] = me.readInt32BinaryMessage(message, 9 + (i * 4));
192
+                  }
193
+                  p2j.screen.destroyWindow(id, images);
194
+                  break;
195
+               case 0x8C:
196
+                  // change visibility for top-level or child window
197
+                  var id = me.readInt32BinaryMessage(message, 1);
198
+                  var visible = message[5] === 0 ? false : true;
199
+                  p2j.screen.setWindowVisible(id, visible);
200
+                  break;
201
+                  
202
+               // font and metrics related requests
203
+               case 0x8D:
204
+                  // paragraph height
205
+                  
206
+                  var offset = 1;
207
+                  
208
+                  var msgId = me.readInt32BinaryMessage(message, offset);
209
+                  offset = offset + 4;
210
+                  
211
+                  var textLength = me.readInt32BinaryMessage(message, offset);
212
+                  offset = offset + 4;
213
+
214
+                  var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
215
+                  offset = offset + textLength * 2;
216
+                  
217
+                  var font = me.readInt32BinaryMessage(message, offset);
218
+                  offset = offset + 4;
219
+
220
+                  var maxWidth = me.readInt16BinaryMessage(message, offset);
221
+                  offset = offset + 2;
222
+
223
+                  var pheight = p2j.screen.layoutParagraphWorker(null,
224
+                                                                 text,
225
+                                                                 font, 
226
+                                                                 0,
227
+                                                                 0, 
228
+                                                                 maxWidth);
229
+
230
+                  me.sendInt16BinaryMessage(0x06, msgId, pheight);
231
+                  break;
232
+               case 0x8E:
233
+                  // text height
234
+                  
235
+                  var offset = 1;
236
+
237
+                  var msgId = me.readInt32BinaryMessage(message, offset);
238
+                  offset = offset + 4;
239
+                  
240
+                  var textLength = me.readInt32BinaryMessage(message, offset);
241
+                  offset = offset + 4;
242
+
243
+                  var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
244
+                  offset = offset + textLength * 2;
245
+
246
+                  var font = me.readInt32BinaryMessage(message, offset);
247
+                  
248
+                  var theight = p2j.fonts.getTextHeight(font, text);
249
+
250
+                  me.sendInt8BinaryMessage(0x07, msgId, theight);
251
+                  break;
252
+               case 0x8F:
253
+                  // text width
254
+
255
+                  var offset = 1;
256
+                  
257
+                  var msgId = me.readInt32BinaryMessage(message, offset);
258
+                  offset = offset + 4;
259
+                  
260
+                  var textLength = me.readInt32BinaryMessage(message, offset);
261
+                  offset = offset + 4;
262
+
263
+                  var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
264
+                  offset = offset + textLength * 2;
265
+
266
+                  var font = me.readInt32BinaryMessage(message, offset);
267
+                  offset = offset + 4;
268
+                  
269
+                  var twidth = p2j.fonts.getTextWidth(font, text);
270
+                  
271
+                  me.sendInt16BinaryMessage(0x08, msgId, twidth);
272
+                  break;
273
+               case 0x90:
274
+                  // font height
275
+
276
+                  var offset = 1;
277
+
278
+                  var msgId = me.readInt32BinaryMessage(message, offset);
279
+                  offset = offset + 4;
280
+
281
+                  var font = me.readInt32BinaryMessage(message, offset);
282
+                  offset = offset + 4;
283
+                  
284
+                  var fheight = p2j.fonts.getFontHeight(font);
285
+                  
286
+                  me.sendInt8BinaryMessage(0x09, msgId, fheight);
287
+                  break;
288
+               case 0x91:
289
+                  // font widths
290
+
291
+                  var offset = 1;
292
+                  
293
+                  var msgId = me.readInt32BinaryMessage(message, offset);
294
+                  offset = offset + 4;
295
+                  
296
+                  var font = me.readInt32BinaryMessage(message, offset);
297
+                  offset = offset + 4;
298
+                  
299
+                  var fwidths = p2j.fonts.getFontWidths(font);
300
+                  
301
+                  me.sendByteArrayBinaryMessage(0x0A, msgId, fwidths);
302
+                  break;
303
+               case 0x92:
304
+                  // create font
305
+
306
+                  var offset = 1;
307
+                  
308
+                  var msgId = me.readInt32BinaryMessage(message, offset);
309
+                  offset = offset + 4;
310
+                  
311
+                  var font = me.readInt32BinaryMessage(message, offset);
312
+                  offset = offset + 4;
313
+                  
314
+                  var nameLength = me.readInt16BinaryMessage(message, offset);
315
+                  offset = offset + 2;
316
+
317
+                  var name  = me.readStringBinaryMessageByLength(message, offset, nameLength);
318
+                  offset = offset + nameLength * 2;
319
+                  
320
+                  var size = message[offset];
321
+                  offset = offset + 1;
322
+                  
323
+                  var style = message[offset];
324
+                  offset = offset + 1;
325
+                  
326
+                  var defLength = me.readInt32BinaryMessage(message, offset);
327
+                  offset = offset + 4;
328
+                  
329
+                  var b64font = "";
330
+                  if (defLength > 0)
331
+                  {
332
+                     var binFont = '';
333
+                     for (var i = 0; i < defLength; i++)
334
+                     {
335
+                        binFont += String.fromCharCode(message[offset]);
336
+                        offset = offset + 1;
337
+                     }
338
+                     b64font = window.btoa(binFont);
339
+                  }
340
+
341
+                  var fontId = p2j.fonts.createFont(font, name, size, style, b64font);
342
+                  
343
+                  me.sendInt32BinaryMessage(0x0B, msgId, fontId);
344
+                  break;
345
+               case 0x93:
346
+                  // derive font
347
+
348
+                  var offset = 1;
349
+                  
350
+                  var msgId = me.readInt32BinaryMessage(message, offset);
351
+                  offset = offset + 4;
352
+                  
353
+                  var font = me.readInt32BinaryMessage(message, offset);
354
+                  offset = offset + 4;
355
+
356
+                  p2j.fonts.deriveFont(font);
357
+                   
358
+                  me.sendInt8BinaryMessage(0x0C, msgId, 1);
359
+                  break;
360
+               case 0x94:
361
+                  // set cursor style
362
+                  var styleId = me.readInt32BinaryMessage(message, 1);
363
+                  var wid = me.readInt32BinaryMessage(message, 5);
364
+                  p2j.screen.setCursorStyle(styleId, wid);
365
+                  break;
366
+               case 0x95:
367
+                  // restack windows
368
+                  var num = me.readInt32BinaryMessage(message, 1);
369
+                  var winids = [];
370
+                  for (var i = 0; i < num; i++)
371
+                  {
372
+                     winids.push(me.readInt32BinaryMessage(message, 5 + (i * 4)));
373
+                  }
374
+                  p2j.screen.restackZOrderEntries(winids);
375
+                  break;
376
+               case 0x96:
377
+                   // register/deregister widgets for mouse actions
378
+                   
379
+                   var offset = 1;
380
+                   
381
+                   // the number of windows with new widgets
382
+                   var windowNo = me.readInt16BinaryMessage(message, offset);
383
+                   offset = offset + 2;
384
+                   
385
+                   for (var j = 0; j < windowNo; j++)
386
+                   {
387
+                      // the window ID
388
+                      var windowID = me.readInt32BinaryMessage(message, offset);
389
+                      offset = offset + 4;
390
+                      
391
+                      if (!p2j.screen.isExistingWindowId(windowID))
392
+                      {
393
+                         console.log("undefined window " + windowID);
394
+                         continue;
395
+                      }
396
+                      
397
+                      var theWindow = p2j.screen.getWindow(windowID);
398
+                      
399
+                      // the number of new widgets in this window
400
+                      var widgetNo = me.readInt16BinaryMessage(message, offset);
401
+                      offset = offset + 2;
402
+                      
403
+                      for (var k = 0; k < widgetNo; k++)
404
+                      {
405
+                         // the widget ID
406
+                         var wid = me.readInt32BinaryMessage(message, offset);
407
+                         offset = offset + 4;
408
+
409
+                         // the coordinates
410
+                         var x = me.readInt16BinaryMessage(message, offset);
411
+                         offset = offset + 2;
412
+                         
413
+                         var y = me.readInt16BinaryMessage(message, offset);
414
+                         offset = offset + 2;
415
+         
416
+                         // the size
417
+                         var width = me.readInt16BinaryMessage(message, offset);
418
+                         offset = offset + 2;
419
+         
420
+                         var height = me.readInt16BinaryMessage(message, offset);
421
+                         offset = offset + 2;
422
+         
423
+                         // bit-encoded mouse ops: each bit from 1 to 11, if set, represents a mouse
424
+                         // operation as defined in p2j.screen.mouseOps
425
+                         var actions = me.readInt32BinaryMessage(message, offset);
426
+                         offset = offset + 4;
427
+                         theWindow.deregisterMouseWidget(wid);
428
+                         theWindow.registerMouseWidget(wid, x, y, width, height, actions);
429
+                      }
430
+                      
431
+                      var allWNo = me.readInt16BinaryMessage(message, offset);
432
+                      offset = offset + 2;
433
+                      var zOrder = [];
434
+                      
435
+                      for (var k = 0; k < allWNo; k++)
436
+                      {
437
+                        zOrder[k] = me.readInt32BinaryMessage(message, offset);
438
+                        offset = offset + 4;
439
+                      }
440
+                      
441
+                      theWindow.setWidgetZOrder(zOrder);
442
+                   }
443
+   
444
+                   // the number of windows with dead widgets
445
+                   windowNo = me.readInt16BinaryMessage(message, offset);
446
+                   offset = offset + 2;
447
+                   
448
+                   for (var j = 0; j < windowNo; j++)
449
+                   {
450
+                      // the window ID
451
+                      var windowID = me.readInt32BinaryMessage(message, offset);
452
+                      offset = offset + 4;
453
+                      
454
+                      var theWindow = p2j.screen.getWindow(windowID);
455
+                      
456
+                      if (theWindow == undefined)
457
+                      {
458
+                         console.log("undefined window" + windowID);
459
+                         continue;
460
+                      }
461
+                      
462
+                      // the number of dead widgets in this window
463
+                      var widgetNo = me.readInt16BinaryMessage(message, offset);
464
+                      offset = offset + 2;
465
+                      
466
+                      for (var k = 0; k < widgetNo; k++)
467
+                      {
468
+                         // the widget ID
469
+                         var wid = me.readInt32BinaryMessage(message, offset);
470
+                         offset = offset + 4;
471
+
472
+                         theWindow.deregisterMouseWidget(wid);
473
+                      }
474
+                   }
475
+
476
+                   // the number of windows with new "any widgets"
477
+                   windowNo = me.readInt16BinaryMessage(message, offset);
478
+                   offset = offset + 2;
479
+                   
480
+                   for (var j = 0; j < windowNo; j++)
481
+                   {
482
+                      // the window ID
483
+                      var windowID = me.readInt32BinaryMessage(message, offset);
484
+                      offset = offset + 4;
485
+                      
486
+                      if (!p2j.screen.isExistingWindowId(windowID))
487
+                      {
488
+                         console.log("undefined window " + windowID);
489
+                         continue;
490
+                      }
491
+                      
492
+                      var theWindow = p2j.screen.getWindow(windowID);
493
+                      
494
+                      // the number of new "any widgets" in this window
495
+                      var widgetNo = me.readInt16BinaryMessage(message, offset);
496
+                      offset = offset + 2;
497
+                      
498
+                      for (var k = 0; k < widgetNo; k++)
499
+                      {
500
+                         // the widget ID
501
+                         var wid = me.readInt32BinaryMessage(message, offset);
502
+                         offset = offset + 4;
503
+                         theWindow.deregisterAnyMouseWidget(wid);
504
+                         theWindow.registerAnyMouseWidget(wid);
505
+                      }
506
+                   }
507
+   
508
+                   // the number of windows with dead "any widgets"
509
+                   windowNo = me.readInt16BinaryMessage(message, offset);
510
+                   offset = offset + 2;
511
+                   
512
+                   for (var j = 0; j < windowNo; j++)
513
+                   {
514
+                      // the window ID
515
+                      var windowID = me.readInt32BinaryMessage(message, offset);
516
+                      offset = offset + 4;
517
+                      
518
+                      var theWindow = p2j.screen.getWindow(windowID);
519
+                      
520
+                      if (theWindow == undefined)
521
+                      {
522
+                         console.log("undefined window" + windowID);
523
+                         continue;
524
+                      }
525
+                      
526
+                      // the number of dead "any widgets" in this window
527
+                      var widgetNo = me.readInt16BinaryMessage(message, offset);
528
+                      offset = offset + 2;
529
+                      
530
+                      for (var k = 0; k < widgetNo; k++)
531
+                      {
532
+                         // the widget ID
533
+                         var wid = me.readInt32BinaryMessage(message, offset);
534
+                         offset = offset + 4;
535
+
536
+                         theWindow.deregisterAnyMouseWidget(wid);
537
+                      }
538
+                   }
539
+
540
+                   break;
541
+               case 0x97:
542
+                  // enable/disable mouse events
543
+                  p2j.screen.captureMouseEvents(message[1] == 1);
544
+                  break;
545
+               case 0x98:
546
+                  // enable/disable OS events
547
+                  var wid = me.readInt32BinaryMessage(message, 1);
548
+                  p2j.screen.enableOsEvents(wid, message[5] == 1);
549
+                  break;
550
+               case 0x99:
551
+                  // set window iconification state
552
+                  var offset = 1;
553
+
554
+                  var windowID = me.readInt32BinaryMessage(message, offset);
555
+                  offset = offset + 4;
556
+                  
557
+                  var iconified = (message[offset] == 1);
558
+                  offset = offset + 1;
559
+                  
560
+                  var theWindow = p2j.screen.getWindow(windowID);
561
+                  //p2j.logger.log("recieved 0x99: iconified = " + iconified + " windowId=" + windowID);
562
+                  if (iconified)
563
+                  {
564
+                     theWindow.iconify();
565
+                  }
566
+                  else
567
+                  {
568
+                     theWindow.deiconify();
569
+                  }
570
+
571
+                  break;
572
+               case 0x9A:
573
+                  // resizeable window
574
+                  var offset = 1;
575
+                  
576
+                  var windowID = me.readInt32BinaryMessage(message, offset);
577
+                  offset = offset + 4;
578
+                  
579
+                  var theWindow = p2j.screen.getWindow(windowID);
580
+
581
+                  theWindow.resizeable = (message[offset] == 1);
582
+                  offset = offset + 1;
583
+                  
584
+                  if (theWindow.resizeable)
585
+                  {
586
+                     theWindow.minWidth = me.readInt16BinaryMessage(message, offset);
587
+                     offset = offset + 2;
588
+                     theWindow.minHeight = me.readInt16BinaryMessage(message, offset);
589
+                     offset = offset + 2;
590
+                     
591
+                     theWindow.maxWidth = me.readInt16BinaryMessage(message, offset);
592
+                     offset = offset + 2;
593
+                     theWindow.maxHeight = me.readInt16BinaryMessage(message, offset);
594
+                     offset = offset + 2;
595
+                  }
596
+                  else
597
+                  {
598
+                     var rect = theWindow.canvas.getBoundingClientRect();
599
+
600
+                     var rwidth  = rect.right - rect.left + 1;
601
+                     var rheight = rect.bottom - rect.top + 1;
602
+                     
603
+                     theWindow.minWidth = rwidth;
604
+                     theWindow.minHeight = rheight;
605
+
606
+                     theWindow.maxWidth = rwidth;
607
+                     theWindow.maxHeight = rheight;
608
+                  }
609
+                  
610
+                  break;
611
+               case 0x9B:
612
+                  // current editors selection is changed
613
+                  var text = me.readStringBinaryMessage(message, 1);
614
+                  p2j.clipboard.setSelection(text);
615
+                  break;
616
+               case 0x9C:
617
+                  var id = me.readInt32BinaryMessage(message, 1);
618
+                  p2j.screen.moveToTop(id);
619
+                  break;
620
+               case 0x9D:
621
+                  var id = me.readInt32BinaryMessage(message, 1);
622
+                  p2j.screen.moveToBottom(id);
623
+                  break;
624
+               case 0x9E:
625
+                  // change sensitivity for top-level or child window
626
+                  var id = me.readInt32BinaryMessage(message, 1);
627
+                  var enabled  = message[5] === 0 ? false : true;
628
+                  p2j.screen.setWindowEnabled(id, enabled);
629
+                  break;
630
+            };
631
+         };
632
          // on web socket message
633
          ws.onmessage = function(evt)
634
          {
635
@@ -412,523 +917,42 @@
636
             {
637
                // binary messages
638
                var message = new Uint8Array(data);
639
-               
640
-               switch (message[0])
641
-               {
642
-                  case 0x80:
643
-                     // clear screen 
644
-                     p2j.screen.clear();                        
645
-                     break;
646
-                  case 0x81:
647
-                     // draw screen
648
-                     var t1 = (new Date()).getTime();
649
-                     p2j.screen.drawRectangles(message);
650
-                     var t2 = (new Date()).getTime();
651
-                     // console.log("message: " + message.length + " done in " + (t2 - t1));
652
-                     break;
653
-                  case 0x82:
654
-                     // set cursor position
655
-                     p2j.screen.setCursorPosition(message[1], message[2]);                        
656
-                     break;
657
-                  case 0x83:
658
-                     // show cursor
659
-                     p2j.screen.setCursorStatus(message[1]);                        
660
-                     break;
661
-                  case 0x84:
662
-                     // message beep
663
-                     p2j.sound.beep();                        
664
-                     break;
665
-                  case 0x85:
666
-                     // quit
667
-                     window.location.replace(referrer);                        
668
-                     break;
669
-                  case 0x86:
670
-                     // switch mode p2j/vt100
671
-                     p2j.keyboard.vt100 = (message[1] == 0) ? false : true;          
672
-                     break;
673
-                  case 0x87:
674
-                     // server-driven request for clipboard contents
675
-                     p2j.clipboard.sendClipboardContents();          
676
-                     break;
677
-                  case 0x88:
678
-                     // The clipboard is changed.
679
-                     var text = me.readStringBinaryMessage(message, 1);
680
-                     p2j.clipboard.writeClipboard(text);
681
-                     break;
682
-                  case 0x89:
683
-                     // create a top-level window with the given id
684
-                     var id = me.readInt32BinaryMessage(message, 1);
685
-                     p2j.screen.createWindow(id);
686
-                     break;
687
-                  case 0x8A:
688
-                     // create a child window with the given id, owner and title
689
-                     var id    = me.readInt32BinaryMessage(message, 1);
690
-                     var owner = me.readInt32BinaryMessage(message, 5);
691
-                     var title = me.readStringBinaryMessage(message, 9);
692
-                     p2j.screen.createChildWindow(id, owner);
693
-                     break;
694
-                  case 0x8B:
695
-                     // destroy top-level or child window
696
-                     var id = me.readInt32BinaryMessage(message, 1);
697
-                     var numberImages = me.readInt32BinaryMessage(message, 5);
698
-                     var images = [];
699
-                     for (var i = 0; i < numberImages; i++)
700
-                     {
701
-                        images[i] = me.readInt32BinaryMessage(message, 9 + (i * 4));
702
-                     }
703
-                     p2j.screen.destroyWindow(id, images);
704
-                     break;
705
-                  case 0x8C:
706
-                     // change visibility for top-level or child window
707
-                     var id = me.readInt32BinaryMessage(message, 1);
708
-                     var visible = message[5] === 0 ? false : true;
709
-                     p2j.screen.setWindowVisible(id, visible);
710
-                     break;
711
-                     
712
-                  // font and metrics related requests
713
-                  case 0x8D:
714
-                     // paragraph height
715
-                     
716
-                     var offset = 1;
717
-                     
718
-                     var msgId = me.readInt32BinaryMessage(message, offset);
719
-                     offset = offset + 4;
720
-                     
721
-                     var textLength = me.readInt32BinaryMessage(message, offset);
722
-                     offset = offset + 4;
723
-
724
-                     var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
725
-                     offset = offset + textLength * 2;
726
-                     
727
-                     var font = me.readInt32BinaryMessage(message, offset);
728
-                     offset = offset + 4;
729
-
730
-                     var maxWidth = me.readInt16BinaryMessage(message, offset);
731
-                     offset = offset + 2;
732
-
733
-                     var pheight = p2j.screen.layoutParagraphWorker(null,
734
-                                                                    text,
735
-                                                                    font, 
736
-                                                                    0,
737
-                                                                    0, 
738
-                                                                    maxWidth);
739
-
740
-                     me.sendInt16BinaryMessage(0x06, msgId, pheight);
741
-                     break;
742
-                  case 0x8E:
743
-                     // text height
744
-                     
745
-                     var offset = 1;
746
-
747
-                     var msgId = me.readInt32BinaryMessage(message, offset);
748
-                     offset = offset + 4;
749
-                     
750
-                     var textLength = me.readInt32BinaryMessage(message, offset);
751
-                     offset = offset + 4;
752
-
753
-                     var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
754
-                     offset = offset + textLength * 2;
755
-
756
-                     var font = me.readInt32BinaryMessage(message, offset);
757
-                     
758
-                     var theight = p2j.fonts.getTextHeight(font, text);
759
-
760
-                     me.sendInt8BinaryMessage(0x07, msgId, theight);
761
-                     break;
762
-                  case 0x8F:
763
-                     // text width
764
-
765
-                     var offset = 1;
766
-                     
767
-                     var msgId = me.readInt32BinaryMessage(message, offset);
768
-                     offset = offset + 4;
769
-                     
770
-                     var textLength = me.readInt32BinaryMessage(message, offset);
771
-                     offset = offset + 4;
772
-
773
-                     var text  = me.readStringBinaryMessageByLength(message, offset, textLength);
774
-                     offset = offset + textLength * 2;
775
-
776
-                     var font = me.readInt32BinaryMessage(message, offset);
777
-                     offset = offset + 4;
778
-                     
779
-                     var twidth = p2j.fonts.getTextWidth(font, text);
780
-                     
781
-                     me.sendInt16BinaryMessage(0x08, msgId, twidth);
782
-                     break;
783
-                  case 0x90:
784
-                     // font height
785
-
786
-                     var offset = 1;
787
-
788
-                     var msgId = me.readInt32BinaryMessage(message, offset);
789
-                     offset = offset + 4;
790
-
791
-                     var font = me.readInt32BinaryMessage(message, offset);
792
-                     offset = offset + 4;
793
-                     
794
-                     var fheight = p2j.fonts.getFontHeight(font);
795
-                     
796
-                     me.sendInt8BinaryMessage(0x09, msgId, fheight);
797
-                     break;
798
-                  case 0x91:
799
-                     // font widths
800
-
801
-                     var offset = 1;
802
-                     
803
-                     var msgId = me.readInt32BinaryMessage(message, offset);
804
-                     offset = offset + 4;
805
-                     
806
-                     var font = me.readInt32BinaryMessage(message, offset);
807
-                     offset = offset + 4;
808
-                     
809
-                     var fwidths = p2j.fonts.getFontWidths(font);
810
-                     
811
-                     me.sendByteArrayBinaryMessage(0x0A, msgId, fwidths);
812
-                     break;
813
-                  case 0x92:
814
-                     // create font
815
-
816
-                     var offset = 1;
817
-                     
818
-                     var msgId = me.readInt32BinaryMessage(message, offset);
819
-                     offset = offset + 4;
820
-                     
821
-                     var font = me.readInt32BinaryMessage(message, offset);
822
-                     offset = offset + 4;
823
-                     
824
-                     var nameLength = me.readInt16BinaryMessage(message, offset);
825
-                     offset = offset + 2;
826
-
827
-                     var name  = me.readStringBinaryMessageByLength(message, offset, nameLength);
828
-                     offset = offset + nameLength * 2;
829
-                     
830
-                     var size = message[offset];
831
-                     offset = offset + 1;
832
-                     
833
-                     var style = message[offset];
834
-                     offset = offset + 1;
835
-                     
836
-                     var defLength = me.readInt32BinaryMessage(message, offset);
837
-                     offset = offset + 4;
838
-                     
839
-                     var b64font = "";
840
-                     if (defLength > 0)
841
-                     {
842
-                        var binFont = '';
843
-                        for (var i = 0; i < defLength; i++)
844
+               var isDrawing = message[0] === 0x81;
845
+               if (isDrawing)
846
+               {
847
+                  p2j.displayWaitCursor();
848
+               }
849
+               setTimeout(
850
+                     function()
851
+                     {
852
+                        messageHandler(message);
853
+                     }, 1);
854
+               if (isDrawing)
855
+               {
856
+                  setTimeout(
857
+                        function()
858
                         {
859
-                           binFont += String.fromCharCode(message[offset]);
860
-                           offset = offset + 1;
861
-                        }
862
-                        b64font = window.btoa(binFont);
863
-                     }
864
-
865
-                     var fontId = p2j.fonts.createFont(font, name, size, style, b64font);
866
-                     
867
-                     me.sendInt32BinaryMessage(0x0B, msgId, fontId);
868
-                     break;
869
-                  case 0x93:
870
-                     // derive font
871
-
872
-                     var offset = 1;
873
-                     
874
-                     var msgId = me.readInt32BinaryMessage(message, offset);
875
-                     offset = offset + 4;
876
-                     
877
-                     var font = me.readInt32BinaryMessage(message, offset);
878
-                     offset = offset + 4;
879
-
880
-                     p2j.fonts.deriveFont(font);
881
-                      
882
-                     me.sendInt8BinaryMessage(0x0C, msgId, 1);
883
-                     break;
884
-                  case 0x94:
885
-                     // set cursor style
886
-                     var styleId = me.readInt32BinaryMessage(message, 1);
887
-                     var wid = me.readInt32BinaryMessage(message, 5);
888
-                     p2j.screen.setCursorStyle(styleId, wid);
889
-                     break;
890
-                  case 0x95:
891
-                     // restack windows
892
-                     var num = me.readInt32BinaryMessage(message, 1);
893
-                     var winids = [];
894
-                     for (var i = 0; i < num; i++)
895
-                     {
896
-                        winids.push(me.readInt32BinaryMessage(message, 5 + (i * 4)));
897
-                     }
898
-                     p2j.screen.restackZOrderEntries(winids);
899
-                     break;
900
-                  case 0x96:
901
-                      // register/deregister widgets for mouse actions
902
-                      
903
-                      var offset = 1;
904
-                      
905
-                      // the number of windows with new widgets
906
-                      var windowNo = me.readInt16BinaryMessage(message, offset);
907
-                      offset = offset + 2;
908
-                      
909
-                      for (var j = 0; j < windowNo; j++)
910
-                      {
911
-                         // the window ID
912
-                         var windowID = me.readInt32BinaryMessage(message, offset);
913
-                         offset = offset + 4;
914
-                         
915
-                         if (!p2j.screen.isExistingWindowId(windowID))
916
-                         {
917
-                            console.log("undefined window " + windowID);
918
-                            continue;
919
-                         }
920
-                         
921
-                         var theWindow = p2j.screen.getWindow(windowID);
922
-                         
923
-                         // the number of new widgets in this window
924
-                         var widgetNo = me.readInt16BinaryMessage(message, offset);
925
-                         offset = offset + 2;
926
-                         
927
-                         for (var k = 0; k < widgetNo; k++)
928
-                         {
929
-                            // the widget ID
930
-                            var wid = me.readInt32BinaryMessage(message, offset);
931
-                            offset = offset + 4;
932
-
933
-                            // the coordinates
934
-                            var x = me.readInt16BinaryMessage(message, offset);
935
-                            offset = offset + 2;
936
-                            
937
-                            var y = me.readInt16BinaryMessage(message, offset);
938
-                            offset = offset + 2;
939
-            
940
-                            // the size
941
-                            var width = me.readInt16BinaryMessage(message, offset);
942
-                            offset = offset + 2;
943
-            
944
-                            var height = me.readInt16BinaryMessage(message, offset);
945
-                            offset = offset + 2;
946
-            
947
-                            // bit-encoded mouse ops: each bit from 1 to 11, if set, represents a mouse
948
-                            // operation as defined in p2j.screen.mouseOps
949
-                            var actions = me.readInt32BinaryMessage(message, offset);
950
-                            offset = offset + 4;
951
-                            theWindow.deregisterMouseWidget(wid);
952
-                            theWindow.registerMouseWidget(wid, x, y, width, height, actions);
953
-                         }
954
-                         
955
-                         var allWNo = me.readInt16BinaryMessage(message, offset);
956
-                         offset = offset + 2;
957
-                         var zOrder = [];
958
-                         
959
-                         for (var k = 0; k < allWNo; k++)
960
-                         {
961
-                           zOrder[k] = me.readInt32BinaryMessage(message, offset);
962
-                           offset = offset + 4;
963
-                         }
964
-                         
965
-                         theWindow.setWidgetZOrder(zOrder);
966
-                      }
967
-      
968
-                      // the number of windows with dead widgets
969
-                      windowNo = me.readInt16BinaryMessage(message, offset);
970
-                      offset = offset + 2;
971
-                      
972
-                      for (var j = 0; j < windowNo; j++)
973
-                      {
974
-                         // the window ID
975
-                         var windowID = me.readInt32BinaryMessage(message, offset);
976
-                         offset = offset + 4;
977
-                         
978
-                         var theWindow = p2j.screen.getWindow(windowID);
979
-                         
980
-                         if (theWindow == undefined)
981
-                         {
982
-                            console.log("undefined window" + windowID);
983
-                            continue;
984
-                         }
985
-                         
986
-                         // the number of dead widgets in this window
987
-                         var widgetNo = me.readInt16BinaryMessage(message, offset);
988
-                         offset = offset + 2;
989
-                         
990
-                         for (var k = 0; k < widgetNo; k++)
991
-                         {
992
-                            // the widget ID
993
-                            var wid = me.readInt32BinaryMessage(message, offset);
994
-                            offset = offset + 4;
995
-
996
-                            theWindow.deregisterMouseWidget(wid);
997
-                         }
998
-                      }
999
-
1000
-                      // the number of windows with new "any widgets"
1001
-                      windowNo = me.readInt16BinaryMessage(message, offset);
1002
-                      offset = offset + 2;
1003
-                      
1004
-                      for (var j = 0; j < windowNo; j++)
1005
-                      {
1006
-                         // the window ID
1007
-                         var windowID = me.readInt32BinaryMessage(message, offset);
1008
-                         offset = offset + 4;
1009
-                         
1010
-                         if (!p2j.screen.isExistingWindowId(windowID))
1011
-                         {
1012
-                            console.log("undefined window " + windowID);
1013
-                            continue;
1014
-                         }
1015
-                         
1016
-                         var theWindow = p2j.screen.getWindow(windowID);
1017
-                         
1018
-                         // the number of new "any widgets" in this window
1019
-                         var widgetNo = me.readInt16BinaryMessage(message, offset);
1020
-                         offset = offset + 2;
1021
-                         
1022
-                         for (var k = 0; k < widgetNo; k++)
1023
-                         {
1024
-                            // the widget ID
1025
-                            var wid = me.readInt32BinaryMessage(message, offset);
1026
-                            offset = offset + 4;
1027
-                            theWindow.deregisterAnyMouseWidget(wid);
1028
-                            theWindow.registerAnyMouseWidget(wid);
1029
-                         }
1030
-                      }
1031
-      
1032
-                      // the number of windows with dead "any widgets"
1033
-                      windowNo = me.readInt16BinaryMessage(message, offset);
1034
-                      offset = offset + 2;
1035
-                      
1036
-                      for (var j = 0; j < windowNo; j++)
1037
-                      {
1038
-                         // the window ID
1039
-                         var windowID = me.readInt32BinaryMessage(message, offset);
1040
-                         offset = offset + 4;
1041
-                         
1042
-                         var theWindow = p2j.screen.getWindow(windowID);
1043
-                         
1044
-                         if (theWindow == undefined)
1045
-                         {
1046
-                            console.log("undefined window" + windowID);
1047
-                            continue;
1048
-                         }
1049
-                         
1050
-                         // the number of dead "any widgets" in this window
1051
-                         var widgetNo = me.readInt16BinaryMessage(message, offset);
1052
-                         offset = offset + 2;
1053
-                         
1054
-                         for (var k = 0; k < widgetNo; k++)
1055
-                         {
1056
-                            // the widget ID
1057
-                            var wid = me.readInt32BinaryMessage(message, offset);
1058
-                            offset = offset + 4;
1059
-
1060
-                            theWindow.deregisterAnyMouseWidget(wid);
1061
-                         }
1062
-                      }
1063
-
1064
-                      break;
1065
-                  case 0x97:
1066
-                     // enable/disable mouse events
1067
-                     p2j.screen.captureMouseEvents(message[1] == 1);
1068
-                     break;
1069
-                  case 0x98:
1070
-                     // enable/disable OS events
1071
-                     var wid = me.readInt32BinaryMessage(message, 1);
1072
-                     p2j.screen.enableOsEvents(wid, message[5] == 1);
1073
-                     break;
1074
-                  case 0x99:
1075
-                     // set window iconification state
1076
-                     var offset = 1;
1077
-
1078
-                     var windowID = me.readInt32BinaryMessage(message, offset);
1079
-                     offset = offset + 4;
1080
-                     
1081
-                     var iconified = (message[offset] == 1);
1082
-                     offset = offset + 1;
1083
-                     
1084
-                     var theWindow = p2j.screen.getWindow(windowID);
1085
-                     //p2j.logger.log("recieved 0x99: iconified = " + iconified + " windowId=" + windowID);
1086
-                     if (iconified)
1087
-                     {
1088
-                        theWindow.iconify();
1089
-                     }
1090
-                     else
1091
-                     {
1092
-                        theWindow.deiconify();
1093
-                     }
1094
-
1095
-                     break;
1096
-                  case 0x9A:
1097
-                     // resizeable window
1098
-                     var offset = 1;
1099
-                     
1100
-                     var windowID = me.readInt32BinaryMessage(message, offset);
1101
-                     offset = offset + 4;
1102
-                     
1103
-                     var theWindow = p2j.screen.getWindow(windowID);
1104
-
1105
-                     theWindow.resizeable = (message[offset] == 1);
1106
-                     offset = offset + 1;
1107
-                     
1108
-                     if (theWindow.resizeable)
1109
-                     {
1110
-                        theWindow.minWidth = me.readInt16BinaryMessage(message, offset);
1111
-                        offset = offset + 2;
1112
-                        theWindow.minHeight = me.readInt16BinaryMessage(message, offset);
1113
-                        offset = offset + 2;
1114
-                        
1115
-                        theWindow.maxWidth = me.readInt16BinaryMessage(message, offset);
1116
-                        offset = offset + 2;
1117
-                        theWindow.maxHeight = me.readInt16BinaryMessage(message, offset);
1118
-                        offset = offset + 2;
1119
-                     }
1120
-                     else
1121
-                     {
1122
-                        var rect = theWindow.canvas.getBoundingClientRect();
1123
-
1124
-                        var rwidth  = rect.right - rect.left + 1;
1125
-                        var rheight = rect.bottom - rect.top + 1;
1126
-                        
1127
-                        theWindow.minWidth = rwidth;
1128
-                        theWindow.minHeight = rheight;
1129
-
1130
-                        theWindow.maxWidth = rwidth;
1131
-                        theWindow.maxHeight = rheight;
1132
-                     }
1133
-                     
1134
-                     break;
1135
-                  case 0x9B:
1136
-                     // current editors selection is changed
1137
-                     var text = me.readStringBinaryMessage(message, 1);
1138
-                     p2j.clipboard.setSelection(text);
1139
-                     break;
1140
-                  case 0x9C:
1141
-                     var id = me.readInt32BinaryMessage(message, 1);
1142
-                     p2j.screen.moveToTop(id);
1143
-                     break;
1144
-                  case 0x9D:
1145
-                     var id = me.readInt32BinaryMessage(message, 1);
1146
-                     p2j.screen.moveToBottom(id);
1147
-                     break;
1148
-                  case 0x9E:
1149
-                     // change sensitivity for top-level or child window
1150
-                     var id = me.readInt32BinaryMessage(message, 1);
1151
-                     var enabled  = message[5] === 0 ? false : true;
1152
-                     p2j.screen.setWindowEnabled(id, enabled);
1153
-                     break;
1154
-               };
1155
+                           p2j.restoreCursor();
1156
+                        }, 1);
1157
+               }
1158
             }
1159
             else
1160
             {
1161
                // text messages
1162
                var pay = JSON.parse(data);
1163
-               
1164
-               switch (pay.c)
1165
-               {
1166
-                  case 0:
1167
-                     // color palette
1168
-                     p2j.screen.palette = pay.p;                        
1169
-                     break;
1170
-               };
1171
+               setTimeout(
1172
+                     function()
1173
+                     {
1174
+                        switch (pay.c)
1175
+                        {
1176
+                           case 0:
1177
+                              // color palette
1178
+                              p2j.screen.palette = pay.p;
1179
+                              break;
1180
+                        };
1181
+                     }, 1);
1182
             }
1183
-         };
1184
+         }
1185
 
1186
          // on web socket close
1187
          ws.onclose = function()
1188

    
1189
=== modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.mouse.js'
1190
--- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.mouse.js	2015-11-12 18:54:21 +0000
1191
+++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.mouse.js	2015-12-10 15:02:20 +0000
1192
@@ -534,8 +534,14 @@
1193
          {
1194
             return;
1195
          }
1196
-         // resize canvas
1197
+         // resize the offscreen canvas
1198
          win.resize(mThis.resizeArea.width, mThis.resizeArea.height);
1199
+         // set dimension for the window canvas
1200
+         win.canvas.width  = mThis.resizeArea.width;
1201
+         win.canvas.height = mThis.resizeArea.height;
1202
+         // blast the offscreen image to the window canvas
1203
+         win.ctx.drawImage(win.offscreenCanvas, 0, 0);
1204
+
1205
          // set new location
1206
          win.canvas.style.left = mThis.resizeArea.left + "px";
1207
          win.canvas.style.top  = mThis.resizeArea.top + "px";
1208

    
1209
=== modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js'
1210
--- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js	2015-12-09 19:44:53 +0000
1211
+++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js	2015-12-10 15:02:20 +0000
1212
@@ -351,8 +351,14 @@
1213
       
1214
       /** Backing canvas on which all output for this window will be rendered. */
1215
       this.canvas = p2j.createCanvas(null, options);
1216
+      this.canvas.style.visibility = "hidden";
1217
+
1218
       this.resizeable = false;
1219
-      
1220
+
1221
+      /** The off screen canvas to be used to make batch drawing. */
1222
+      this.offscreenCanvas = document.createElement('canvas');
1223
+      this.offscreenContext = this.offscreenCanvas.getContext('2d', {alpha : true});
1224
+
1225
       /** Canvas 2D graphics context. */
1226
       this.ctx = this.canvas.getContext('2d', {alpha : true});
1227
 
1228
@@ -369,7 +375,7 @@
1229
       this.iconHeight = 0;
1230
       
1231
       /** Creates canvas renderer. */
1232
-      this.canvasRenderer = new CanvasRenderer(this.canvas, this.ctx, strokesManager,
1233
+      this.canvasRenderer = new CanvasRenderer(this.offscreenCanvas, this.offscreenContext, strokesManager,
1234
              p2j.fonts, p2j.logger);
1235
       
1236
       /** 
1237
@@ -934,9 +940,9 @@
1238
       var numOps = p2j.socket.readInt32BinaryMessage(message, 5);
1239
                                    
1240
       p2j.logger.log("START DRAWING CYCLE FOR WINDOW " + this.id);
1241
-      
1242
+
1243
       var idx = 9;
1244
-      
1245
+
1246
       drawLoop:
1247
       for (var i = 0; i < numOps; i++)
1248
       {
1249
@@ -989,7 +995,6 @@
1250
 
1251
                y = p2j.socket.readInt32BinaryMessage(message, idx + offset);
1252
                offset = offset + 4;
1253
-
1254
                this.canvasRenderer.drawText(text, x, y, centered);
1255
                extra = " text = " + text + "; x = " + x + "; y = " + y +
1256
                        "; centered = " + centered;
1257
@@ -1017,7 +1022,6 @@
1258
 
1259
                var lheight = p2j.socket.readInt32BinaryMessage(message, idx + offset);
1260
                offset = offset + 4;
1261
-               
1262
                this.canvasRenderer.drawScaledText(currentFont, text, x, y, centered, lwidth, lheight);
1263
                extra = " text = " + text + "; x = " + x + "; y = " + y +
1264
                        "; centered = " + centered +
1265
@@ -1045,9 +1049,8 @@
1266
                offset = offset + 4;
1267
 
1268
                // TODO: this might need to be 'bottom', too
1269
-               this.ctx.textBaseline = 'top';
1270
-
1271
-               me.layoutParagraphWorker(this.ctx, text, fontId, x, y, width);
1272
+               this.offscreenContext.textBaseline = 'top';
1273
+               me.layoutParagraphWorker(this.offscreenContext, text, fontId, x, y, width);
1274
 
1275
                break;
1276
             case ops.DRAW_LINE:
1277
@@ -1056,7 +1059,8 @@
1278
                var x2 =  p2j.socket.readInt32BinaryMessage(message, idx + 9);
1279
                var y2 =  p2j.socket.readInt32BinaryMessage(message, idx + 13);
1280
                extra = " x1 = " + x1 + "; y1 = " + y1 + "; x2 = " + x2 + "; y2 = " + y2;
1281
-               this.canvasRenderer.strokeLineSegment(this.ctx, x1, y1, x2, y2, this.canvasRenderer.rawColor);
1282
+               this.canvasRenderer.strokeLineSegment(this.offscreenContext,
1283
+                     x1, y1, x2, y2, this.canvasRenderer.rawColor);
1284
                break;
1285
             case ops.DRAW_RECT:
1286
             case ops.FILL_RECT:
1287
@@ -1064,9 +1068,9 @@
1288
                y      = p2j.socket.readInt32BinaryMessage(message, idx + 5);
1289
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 9);
1290
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
1291
+               filled = (type === ops.FILL_RECT);
1292
                extra  = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
1293
-               filled = (type === ops.FILL_RECT);
1294
-               this.canvasRenderer.strokeRect(this.ctx, x, y, width, height,
1295
+               this.canvasRenderer.strokeRect(this.offscreenContext, x, y, width, height,
1296
                      this.canvasRenderer.rawColor, filled);
1297
                break;
1298
             case ops.DRAW_ROUND_RECT:
1299
@@ -1076,8 +1080,9 @@
1300
                height   = p2j.socket.readInt32BinaryMessage(message, idx + 13);
1301
                diameter = p2j.socket.readInt32BinaryMessage(message, idx + 17);
1302
                extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height
1303
-                        + "; diameter = " + diameter;
1304
-               this.canvasRenderer.drawRoundRect(this.ctx, x, y, width, height, diameter,
1305
+                  + "; diameter = " + diameter;
1306
+               this.canvasRenderer.drawRoundRect(this.offscreenContext, x, y,
1307
+                     width, height, diameter,
1308
                      this.canvasRenderer.rawColor, false);
1309
                break;
1310
             case ops.DRAW_IMAGE:
1311
@@ -1088,7 +1093,6 @@
1312
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
1313
 
1314
                extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
1315
-               
1316
                var encoding = message[idx + 17];
1317
                var key = p2j.socket.readInt32BinaryMessage(message, idx + 18);
1318
                var pixelsInBytes = width * height * 4;
1319
@@ -1103,9 +1107,11 @@
1320
                {
1321
                   imgData = message;
1322
                   imgDataOffset = idx + 22;
1323
-                  loadedImages.set(key, message.subarray(imgDataOffset, imgDataOffset + pixelsInBytes));
1324
+                  loadedImages.set(key, message.subarray(
1325
+                        imgDataOffset, imgDataOffset + pixelsInBytes));
1326
                }
1327
-               this.canvasRenderer.drawImage(this.ctx, x, y, width, height, imgData, imgDataOffset);
1328
+               this.canvasRenderer.drawImage(this.offscreenContext, x, y, width, height,
1329
+                     imgData, imgDataOffset);
1330
                break;
1331
             case ops.FILL_ROUND_RECT:
1332
                x        = p2j.socket.readInt32BinaryMessage(message, idx + 1);
1333
@@ -1115,13 +1121,12 @@
1334
                diameter = p2j.socket.readInt32BinaryMessage(message, idx + 17);
1335
                extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height
1336
                         + "; diameter = " + diameter;
1337
-               this.canvasRenderer.drawRoundRect(this.ctx, x, y, width, height, diameter,
1338
-                     this.canvasRenderer.rawColor, true);
1339
+               this.canvasRenderer.drawRoundRect(this.offscreenContext, x, y, width, height,
1340
+                     diameter, this.canvasRenderer.rawColor, true);
1341
                break;
1342
             case ops.FILL_POLYGON:
1343
                offset = idx + 1;
1344
                var numPoints = p2j.socket.readInt32BinaryMessage(message, offset);
1345
-               
1346
                var xPoints = [];
1347
                var yPoints = [];
1348
                
1349
@@ -1133,8 +1138,8 @@
1350
                   yPoints[j] = p2j.socket.readInt32BinaryMessage(message, offset);
1351
                }
1352
                
1353
-               this.canvasRenderer.strokePolygon(this.ctx, xPoints, yPoints, numPoints,
1354
-                     this.canvasRenderer.rawColor, true);
1355
+               this.canvasRenderer.strokePolygon(this.offscreenContext, xPoints, yPoints,
1356
+                     numPoints, this.canvasRenderer.rawColor, true);
1357
                break;
1358
             case ops.DRAW_3D_RECT:
1359
             case ops.FILL_3D_RECT:
1360
@@ -1145,8 +1150,8 @@
1361
                raised = (message[idx + 17] === 1);
1362
                filled = (type == ops.FILL_3D_RECT);
1363
                extra = " x = " + x +"; y = " + y + "; width = " + width + "; height = " +
1364
-                       height + "; raised = " + raised;
1365
-               this.canvasRenderer.draw3DRect(this.ctx, x, y, width, height,
1366
+                        height + "; raised = " + raised;
1367
+               this.canvasRenderer.draw3DRect(this.offscreenContext, x, y, width, height,
1368
                      this.canvasRenderer.rawColor, filled, raised);
1369
                break;
1370
             case ops.SET_COLOR:
1371
@@ -1164,22 +1169,21 @@
1372
                break;              
1373
             case ops.SET_FONT:
1374
                fontId = p2j.socket.readInt32BinaryMessage(message, idx + 1);
1375
-
1376
-               setFont(this.ctx, fontId);
1377
+               setFont(this.offscreenContext, fontId);
1378
                break;
1379
             case ops.SET_FONT_STYLE:
1380
                var style = p2j.socket.readInt32BinaryMessage(message, idx + 1);
1381
-               
1382
                p2j.fonts.setFontStyle(currentFont, style);
1383
                fname = p2j.fonts.getFontName(currentFont);
1384
-               this.ctx.font = fname;
1385
+               this.offscreenContext.font = fname;
1386
                break;
1387
             case ops.TRANSLATE_PUSH:                                                   
1388
                x =  p2j.socket.readInt32BinaryMessage(message, idx + 1);
1389
                y =  p2j.socket.readInt32BinaryMessage(message, idx + 5);
1390
                this.trans++;
1391
-               extra = " " + this.trans.toString() + "; x = " + x.toString() +"; y = " + y.toString();
1392
-               this.canvasRenderer.translate(x, y);  
1393
+               extra = " " + this.trans.toString() + "; x = " + x.toString()
1394
+                     + "; y = " + y.toString();
1395
+               this.canvasRenderer.translate(x, y);
1396
                break;
1397
             case ops.TRANSLATE_POP:                                                   
1398
                x =  p2j.socket.readInt32BinaryMessage(message, idx + 1);
1399
@@ -1214,6 +1218,9 @@
1400
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 9);
1401
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
1402
                this.resize(width, height);
1403
+               this.canvas.width  = width;
1404
+               this.canvas.height = height;
1405
+
1406
                extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
1407
                break;
1408
             case ops.SET_LOCATION:
1409
@@ -1227,6 +1234,8 @@
1410
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 1);
1411
                height = p2j.socket.readInt32BinaryMessage(message, idx + 5);
1412
                this.resize(width, height);
1413
+               this.canvas.width  = width;
1414
+               this.canvas.height = height;
1415
                extra = " width = " + width + "; height = " + height;
1416
                break;
1417
             case ops.DRAW_HIGHLIGHT:
1418
@@ -1292,7 +1301,8 @@
1419
          p2j.logger.log("PaintPrimitives." + ops[type] + " " + extra);
1420
          idx += sz;
1421
       }
1422
-      
1423
+      // to blast the offscreen image on the window canvas
1424
+      this.ctx.drawImage(this.offscreenCanvas, 0, 0);
1425
       p2j.logger.log("END DRAWING CYCLE FOR WINDOW " + this.id);
1426
    }; 
1427
 
1428