OLD | NEW |
| (Empty) |
1 // Copyright (c) 2011 The Native Client Authors. All rights reserved. | |
2 // Use of this source code is governed by a BSD-style license that can be found | |
3 // in the LICENSE file. | |
4 | |
5 /** | |
6 * @fileoverview This file contains the JavaScript required for the WebGTT | |
7 * application, specifically, the implementation of the Vertex class. This | |
8 * implementation provides functions for creating, selecting, coloring, and | |
9 * drawing a vertex. | |
10 * | |
11 * @author ragad@google.com (Raga Gopalakrishnan) | |
12 */ | |
13 | |
14 /** | |
15 * This constant holds the size used to draw a vertex. | |
16 * @type {number} | |
17 * @const | |
18 */ | |
19 var VERTEX_SIZE = 6; | |
20 | |
21 /** | |
22 * This class is used to represent a vertex of the graph. | |
23 * | |
24 * @param {number} x The x-coordinate of the center of the vertex relative to | |
25 * the canvas. | |
26 * @param {number} y The y-coordinate of the center of the vertex relative to | |
27 * the canvas. | |
28 * @constructor | |
29 */ | |
30 Vertex = function (x, y) { | |
31 this.x = x; | |
32 this.y = y; | |
33 | |
34 /** | |
35 * This boolean variable indicates whether the vertex is selected or not. | |
36 */ | |
37 this.isSelected = false; | |
38 | |
39 /** | |
40 * This variable stores the color used while drawing the vertex on the canvas. | |
41 */ | |
42 this.color = 'black'; | |
43 }; | |
44 | |
45 /** | |
46 * This function sets the value of Vertex.isSelected. | |
47 * | |
48 * @param {boolean} isSelected The value to be assigned to Vertex.isSelected. | |
49 */ | |
50 Vertex.prototype.setSelected = function (isSelected) { | |
51 this.isSelected = isSelected; | |
52 }; | |
53 | |
54 /** | |
55 * This function sets the value of Vertex.color. | |
56 * | |
57 * @param {string} color The value to be assigned to Vertex.color. | |
58 */ | |
59 Vertex.prototype.setColor = function (color) { | |
60 this.color = color; | |
61 }; | |
62 | |
63 /** | |
64 * This function draws the vertex on the canvas, with a specified color and | |
65 * radius. | |
66 * | |
67 * @param {object} drawingContext The handle to the drawing surface of the | |
68 * canvas. | |
69 * @param {string} color The color with which the vertex is to be drawn. | |
70 * @param {number} radius The radius with which the vertex is to be drawn. | |
71 */ | |
72 Vertex.prototype.drawSpecific = function (drawingContext, color, radius) { | |
73 drawingContext.fillStyle = color; | |
74 drawingContext.beginPath(); | |
75 drawingContext.arc(this.x, this.y, radius, 0, Math.PI * 2, false); | |
76 drawingContext.closePath(); | |
77 drawingContext.fill(); | |
78 }; | |
79 | |
80 /** | |
81 * This function draws the vertex on the canvas. | |
82 * | |
83 * The vertex is drawn as a solid circle centered at (x,y) with radius | |
84 * specified by VERTEX_SIZE. If isSelected is true, a bigger red circle is | |
85 * also drawn, to indicate that the vertex is selected. | |
86 * | |
87 * @param {object} drawingContext The handle to the drawing surface of the | |
88 * canvas. | |
89 */ | |
90 Vertex.prototype.draw = function (drawingContext) { | |
91 this.drawSpecific(drawingContext, this.color, VERTEX_SIZE); | |
92 if (this.isSelected) { | |
93 this.drawSpecific(drawingContext, 'red', 3*VERTEX_SIZE/2); | |
94 } | |
95 }; | |
OLD | NEW |