Project

General

Profile

1811q_diff_20150827_2.txt

Sergey Ivanovskiy, 08/27/2015 09:58 AM

Download (12.9 KB)

 
1
=== modified file 'src/com/goldencode/p2j/ui/client/gui/driver/EmulatedWindowState.java'
2
--- src/com/goldencode/p2j/ui/client/gui/driver/EmulatedWindowState.java	2015-08-26 22:14:27 +0000
3
+++ src/com/goldencode/p2j/ui/client/gui/driver/EmulatedWindowState.java	2015-08-27 13:19:27 +0000
4
@@ -461,6 +461,25 @@
5
                
6
                switch (ps.id)
7
                {
8
+                  case SET_LOCATION:
9
+                     extra = String.format(" x = %d; y = %d", ps.x, ps.y);
10
+                     break;
11
+                  case DRAW_LINE:
12
+                     extra = String.format(" x1 = %d; y1 = %d; x2 = %d; y2 = %d",
13
+                              ps.x,
14
+                              ps.y,
15
+                              ps.width,
16
+                              ps.height);
17
+                     break;
18
+                  case DRAW_ROUND_RECT:
19
+                  case FILL_ROUND_RECT:
20
+                     extra = String.format(" x = %d; y = %d; width = %d; height = %d; diameter = %d",
21
+                              ps.x,
22
+                              ps.y,
23
+                              ps.width,
24
+                              ps.height,
25
+                              ps.arcDiameter);
26
+                     break;
27
                   case DRAW_RECT:
28
                   case FILL_RECT:
29
                   case DRAW_IMAGE:
30

    
31
=== modified file 'src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js'
32
--- src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js	2015-08-27 07:47:53 +0000
33
+++ src/com/goldencode/p2j/ui/client/gui/driver/web/res/p2j.screen.js	2015-08-27 13:47:59 +0000
34
@@ -925,8 +925,8 @@
35
                var y1 =  p2j.socket.readInt32BinaryMessage(message, idx + 5);
36
                var x2 =  p2j.socket.readInt32BinaryMessage(message, idx + 9);
37
                var y2 =  p2j.socket.readInt32BinaryMessage(message, idx + 13);
38
-               extra = " x1 = " + x1 +"; y1 = " + y1 + "; x2 = " + x2 + "; y2 = " + y2;
39
-               path = this.drawLine(this.ctx, x1, y1, x2, y2, this.rawColor);
40
+               extra = " x1 = " + x1 + "; y1 = " + y1 + "; x2 = " + x2 + "; y2 = " + y2;
41
+               path = this.drawLineSegment(this.ctx, x1, y1, x2, y2, this.rawColor);
42
                
43
                strokesManager.applyStrokeToPath(this.ctx,
44
                                                 this.strokeStyleId,
45
@@ -939,7 +939,7 @@
46
                y      = p2j.socket.readInt32BinaryMessage(message, idx + 5);
47
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 9);
48
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
49
-               extra = " x = " + x +"; y = " + y + "; width = " + width + "; height = " + height;
50
+               extra  = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
51
                path   = this.drawRect(this.ctx, x, y, width, height, this.rawColor, false);
52
                
53
                strokesManager.applyStrokeToPath(this.ctx,
54
@@ -954,7 +954,8 @@
55
                width    = p2j.socket.readInt32BinaryMessage(message, idx + 9);
56
                height   = p2j.socket.readInt32BinaryMessage(message, idx + 13);
57
                diameter = p2j.socket.readInt32BinaryMessage(message, idx + 17);
58
-               extra = " x = " + x +"; y = " + y + "; width = " + width + "; height = " + height + "; diameter = " + diameter;
59
+               extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height
60
+                        + "; diameter = " + diameter;
61
                this.drawRoundRect(ctx, x, y, width, height, diameter, this.rawColor, false);
62
                break;
63
             case ops.DRAW_IMAGE:
64
@@ -964,7 +965,7 @@
65
                width = p2j.socket.readInt32BinaryMessage(message, idx + 9);
66
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
67
 
68
-               extra = " x = " + x +"; y = " + y + "; width = " + width + "; height = " + height;
69
+               extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
70
                
71
                var encoding = message[idx + 17];
72
                var key = p2j.socket.readInt32BinaryMessage(message, idx + 18);
73
@@ -989,7 +990,7 @@
74
                y      = p2j.socket.readInt32BinaryMessage(message, idx + 5);
75
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 9);
76
                height = p2j.socket.readInt32BinaryMessage(message, idx + 13);
77
-               extra = " x = " + x +"; y = " + y + "; width = " + width + "; height = " + height;
78
+               extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height;
79
                this.drawRect(this.ctx, x, y, width, height, this.rawColor, true);
80
                break;
81
             case ops.FILL_ROUND_RECT:
82
@@ -998,6 +999,8 @@
83
                width    = p2j.socket.readInt32BinaryMessage(message, idx + 9);
84
                height   = p2j.socket.readInt32BinaryMessage(message, idx + 13);
85
                diameter = p2j.socket.readInt32BinaryMessage(message, idx + 17);
86
+               extra = " x = " + x + "; y = " + y + "; width = " + width + "; height = " + height
87
+                        + "; diameter = " + diameter;
88
                this.drawRoundRect(this.ctx, x, y, width, height, diameter, this.rawColor, true);
89
                break;
90
             case ops.FILL_POLYGON:
91
@@ -1097,7 +1100,7 @@
92
                y =  p2j.socket.readInt32BinaryMessage(message, idx + 5);
93
                this.canvas.style.left = x.toString() + "px";
94
                this.canvas.style.top  = y.toString() + "px";
95
-               extra = " x = " + x +"; y = " + y;
96
+               extra = " x = " + x + "; y = " + y;
97
                break;
98
             case ops.RESIZE_WINDOW:
99
                width  = p2j.socket.readInt32BinaryMessage(message, idx + 1);
100
@@ -1411,9 +1414,9 @@
101
     *           Array of 3 integer values between 0 and 255 inclusive, representing an RGB color.
102
     * 
103
     * @return   {Array} path
104
-    *           The {x:.,y:.} point per a pixel array that represents the rectangle outerline.
105
+    *           The {x:.,y:.} point per a pixel array that represents the drawing line segment.
106
     */
107
-   Window.prototype.drawLine = function(ctx, x1, y1, x2, y2, color)
108
+   Window.prototype.drawLineSegment = function(ctx, x1, y1, x2, y2, color)
109
    {
110
       x1 = x1 + this.origin.x;
111
       x2 = x2 + this.origin.x;
112
@@ -1490,6 +1493,36 @@
113
    };
114
    
115
    /**
116
+    * Draw a line in the given color from (x1, y1) to (x2, y2) inclusive, using direct drawing and
117
+    * add its pixels path to the end of the provided pixels path.
118
+    * <p>
119
+    * This is an implementation of the well known 50+ year old Bresenham algorithm.
120
+    *
121
+    * @param    {CanvasRenderingContext2D} ctx
122
+    *           The canvas 2D graphics context on which to draw.
123
+    * @param    {Number} x1
124
+    *           X coordinate of the starting pixel to be drawn.
125
+    * @param    {Number} y1
126
+    *           Y coordinate of the starting pixel to be drawn.
127
+    * @param    {Number} x2
128
+    *           X coordinate of the ending pixel to be drawn.
129
+    * @param    {Number} y2
130
+    *           Y coordinate of the ending pixel to be drawn.
131
+    * @param    {Number[]} color
132
+    *           Array of 3 integer values between 0 and 255 inclusive, representing an RGB color.
133
+    * @param    {Array} path
134
+    *           The provided holder of {x:.,y:.} points, the target drawing as a set of sequential
135
+    *           line points will be added at the end of the provided path.
136
+    * @return   {Array}
137
+    *           The {x:.,y:.} point per a pixel array that represents the drawing line segment.
138
+    */
139
+   Window.prototype.drawLine = function(ctx, x1, y1, x2, y2, color, path)
140
+   {
141
+      var segment = this.drawLineSegment(ctx, x1, y1, x2, y2, color);
142
+      Array.prototype.push.apply(path, segment);
143
+      return segment;
144
+   }
145
+   /**
146
     * Fill or stroke the current path on the given context, first using the current path as a
147
     * clipping region.  This ensures that the drawing of the path will not extend outside of the
148
     * path by a half-pixel (which it would otherwise). The state of the context is saved on
149
@@ -1545,7 +1578,7 @@
150
    {
151
       // filled rectangles draw 1 pixel smaller in 2 dimensions than stroked rectangles
152
       var inset = 0;
153
-      
154
+      var path  = [];
155
       // use vector operations for the interior of the rectangle
156
       if (fill)
157
       {
158
@@ -1553,25 +1586,16 @@
159
          ctx.beginPath();
160
          ctx.rect(x, y, width - inset, height - inset);
161
          renderClosedPath(ctx, fill);
162
-         return [];
163
-      }
164
-      else
165
-      {
166
-         // now overdraw the stroked portion to eliminate anti-aliasing, we draw in a
167
-         // clockwise direction (since we are not using paths, this is not strictly necessary)
168
-         var path = this.drawLine(ctx, x, y, x + width - inset, y, color);
169
-         
170
-         var more = this.drawLine(ctx, x + width - inset, y + 1, x + width - inset, y + height - inset, color);
171
-         Array.prototype.push.apply(path, more);
172
-         
173
-         more = this.drawLine(ctx, x + width - 1 - inset, y + height - inset, x + 1, y + height - inset, color);
174
-         Array.prototype.push.apply(path, more);
175
-         
176
-         // close the path
177
-         more = this.drawLine(ctx, x, y + height - inset, x, y + 1, color);
178
-         Array.prototype.push.apply(path, more);
179
-         return path;
180
-      }
181
+      }
182
+      
183
+      // now overdraw the stroked portion to eliminate anti-aliasing, we draw in a
184
+      // clockwise direction (since we are not using paths, this is not strictly necessary)
185
+      this.drawLine(ctx, x, y, x + width - inset, y, color, path);
186
+      this.drawLine(ctx, x + width - inset, y + 1, x + width - inset, y + height - inset, color, path);
187
+      this.drawLine(ctx, x + width - 1 - inset, y + height - inset, x + 1, y + height - inset, color, path);
188
+      this.drawLine(ctx, x, y + height - inset, x, y + 1, color, path);// close the path
189
+      
190
+      return path;
191
    };
192
    
193
    /**
194
@@ -1851,14 +1875,11 @@
195
       renderClosedPath(ctx, fill);
196
       
197
       // overdraw the anti-aliased line segments              
198
-      
199
-      var path = this.drawLine(ctx, topLeftX, topLeftY, topRightX, topRightY, color);
200
-      var more = this.drawLine(ctx, rightUpX, rightUpY, rightDownX, rightDownY, color);
201
-      Array.prototype.push.apply(path, more);
202
-      more = this.drawLine(ctx, bottomLeftX, bottomLeftY, bottomRightX, bottomRightY, color);
203
-      Array.prototype.push.apply(path, more);
204
-      more = this.drawLine(ctx, leftUpX, leftUpY, leftDownX, leftDownY, color);
205
-      Array.prototype.push.apply(path, more);
206
+      var path = [];
207
+      this.drawLine(ctx, topLeftX, topLeftY, topRightX, topRightY, color, path);
208
+      this.drawLine(ctx, rightUpX, rightUpY, rightDownX, rightDownY, color, path);
209
+      this.drawLine(ctx, bottomLeftX, bottomLeftY, bottomRightX, bottomRightY, color, path);
210
+      this.drawLine(ctx, leftUpX, leftUpY, leftDownX, leftDownY, color, path);
211
       strokesManager.applyStrokeToPath(this.ctx,
212
             this.strokeStyleId,
213
             this.strokeWidth,
214
@@ -1934,9 +1955,9 @@
215
       
216
       // draw the top and left sides in the contrasting color (raised mode) or the darker color
217
       // otherwise
218
-      var path = this.drawLine(ctx, x, y, x + width - 2 - inset, y, current);
219
-      var more = this.drawLine(ctx, x, y + 1, x, y + height - 1 - inset, current);
220
-      Array.prototype.push.apply(path, more);
221
+      var path = [];// create new pixels path to draw
222
+      this.drawLine(ctx, x, y, x + width - 2 - inset, y, current, path);
223
+      this.drawLine(ctx, x, y + 1, x, y + height - 1 - inset, current, path);
224
       strokesManager.applyStrokeToPath(this.ctx,
225
             this.strokeStyleId,
226
             this.strokeWidth,
227
@@ -1946,9 +1967,9 @@
228
       // draw the bottom and right sides in the darker color (raised mode) or the contrasting
229
       // color otherwise
230
       current = raised ? darker : lighter;
231
-      path = this.drawLine(ctx, x + 1, y + height - 1 - inset, x + width - 1 - inset, y + height - 1 - inset, current);
232
-      more = this.drawLine(ctx, x + width - 1 - inset, y, x + width - 1 - inset, y + height - 2, current);
233
-      Array.prototype.push.apply(path, more);
234
+      path = []; // create new pixels path to draw
235
+      this.drawLine(ctx, x + 1, y + height - 1 - inset, x + width - 1 - inset, y + height - 1 - inset, current, path);
236
+      this.drawLine(ctx, x + width - 1 - inset, y, x + width - 1 - inset, y + height - 2, current, path);
237
       strokesManager.applyStrokeToPath(this.ctx,
238
             this.strokeStyleId,
239
             this.strokeWidth,
240
@@ -2000,8 +2021,7 @@
241
       // now overdraw the stroked portion
242
       for (i = 0; i < (num - 1); i++)
243
       {
244
-         var more = this.drawLine(ctx, xPoints[i], yPoints[i], xPoints[i + 1], yPoints[i + 1], color);
245
-         Array.prototype.push.apply(path, more);
246
+         this.drawLine(ctx, xPoints[i], yPoints[i], xPoints[i + 1], yPoints[i + 1], color, path);
247
       }
248
       return path;
249
    };
250