|
|
@@ -26,8 +26,8 @@
|
|
26
|
26
|
|
|
27
|
27
|
(function () { //Code isolation
|
|
28
|
28
|
//Indicates the id of the shape the user is currently drawing or an empty string while the user is not drawing
|
|
29
|
|
- let curshape = "Circle";
|
|
30
|
|
- const icons = ["tools/circle/icon-circle.svg", "tools/circle/icon-ellipse.svg"];
|
|
|
29
|
+ let curshape = "Ellipse";
|
|
|
30
|
+ const icons = ["tools/ellipse/icon-ellipse.svg", "tools/ellipse/icon-circle.svg"];
|
|
31
|
31
|
let end=false,
|
|
32
|
32
|
curId = "",
|
|
33
|
33
|
curUpdate = { //The data of the message that will be sent for every new point
|
|
|
@@ -46,10 +46,10 @@
|
|
46
|
46
|
//Prevent the press from being interpreted by the browser
|
|
47
|
47
|
evt.preventDefault();
|
|
48
|
48
|
|
|
49
|
|
- curId = Tools.generateUID("c"); //"c" for circle
|
|
|
49
|
+ curId = Tools.generateUID("e"); //"e" for ellipse
|
|
50
|
50
|
|
|
51
|
51
|
Tools.drawAndSend({
|
|
52
|
|
- 'type': 'circle',
|
|
|
52
|
+ 'type': 'ellipse',
|
|
53
|
53
|
'id': curId,
|
|
54
|
54
|
'shape': curshape,
|
|
55
|
55
|
'color': Tools.getColor(),
|
|
|
@@ -93,7 +93,7 @@
|
|
93
|
93
|
function draw(data) {
|
|
94
|
94
|
Tools.drawingEvent=true;
|
|
95
|
95
|
switch (data.type) {
|
|
96
|
|
- case "circle":
|
|
|
96
|
+ case "ellipse":
|
|
97
|
97
|
createShape(data);
|
|
98
|
98
|
break;
|
|
99
|
99
|
case "update":
|
|
|
@@ -129,7 +129,6 @@
|
|
129
|
129
|
}
|
|
130
|
130
|
|
|
131
|
131
|
function updateShape(shape, data, circle) {
|
|
132
|
|
- console.log(data);
|
|
133
|
132
|
shape.cx.baseVal.value = Math.round((data['x2'] + data['x'])/2);
|
|
134
|
133
|
shape.cy.baseVal.value = Math.round((data['y2'] + data['y'])/2);
|
|
135
|
134
|
if (circle) {
|
|
|
@@ -145,11 +144,11 @@
|
|
145
|
144
|
|
|
146
|
145
|
function toggle(elem){
|
|
147
|
146
|
let index = 0;
|
|
148
|
|
- if (curshape === "Circle") {
|
|
149
|
|
- curshape = "Ellipse";
|
|
|
147
|
+ if (curshape === "Ellipse") {
|
|
|
148
|
+ curshape = "Circle";
|
|
150
|
149
|
index = 1;
|
|
151
|
150
|
} else {
|
|
152
|
|
- curshape = "Circle";
|
|
|
151
|
+ curshape = "Ellipse";
|
|
153
|
152
|
}
|
|
154
|
153
|
elem.getElementsByClassName("tool-icon")[0].src = icons[index];
|
|
155
|
154
|
elem.getElementsByClassName("tool-name")[0].textContent = curshape;
|
|
|
@@ -157,7 +156,7 @@
|
|
157
|
156
|
|
|
158
|
157
|
|
|
159
|
158
|
Tools.add({ //The new tool
|
|
160
|
|
- "name": "Circle",
|
|
|
159
|
+ "name": "Ellipse",
|
|
161
|
160
|
"shortcut": "c",
|
|
162
|
161
|
"listeners": {
|
|
163
|
162
|
"press": start,
|
|
|
@@ -168,7 +167,7 @@
|
|
168
|
167
|
"toggle": toggle,
|
|
169
|
168
|
"mouseCursor": "crosshair",
|
|
170
|
169
|
"icon": icons[0],
|
|
171
|
|
- "stylesheet": "tools/circle/circle.css"
|
|
|
170
|
+ "stylesheet": "tools/ellipse/ellipse.css"
|
|
172
|
171
|
});
|
|
173
|
172
|
|
|
174
|
173
|
})(); //End of code isolation
|