nosklo
/
DrawOnYourScreen
mirror of https://codeberg.org/som/DrawOnYourScreen
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

minor, enumeration syntax

This commit is contained in:
abakkk 2021-02-17 14:53:13 +01:00
parent cb49c83799
commit ca6baf0dc8
5 changed files with 181 additions and 181 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
area.js
View File

@ -1,5 +1,5 @@
/* jslint esversion: 6 */ /* jslint esversion: 6 */
/* exported Tools, DrawingArea */ /* exported Tool, DrawingArea */
/* /*
* Copyright 2019 Abakkk * Copyright 2019 Abakkk
@ -53,17 +53,17 @@ const GRID_TILES_HORIZONTAL_NUMBER = 30;
const COLOR_PICKER_EXTENSION_UUID = 'color-picker@tuberry'; const COLOR_PICKER_EXTENSION_UUID = 'color-picker@tuberry';
const UUID = Me.uuid.replace(/@/gi, '_at_').replace(/[^a-z0-9+_-]/gi, '_'); const UUID = Me.uuid.replace(/@/gi, '_at_').replace(/[^a-z0-9+_-]/gi, '_');
const { Shapes, TextAlignment, Transformations } = Elements; const { Shape, TextAlignment, Transformation } = Elements;
const { DisplayStrings } = Menu; const { DisplayStrings } = Menu;
const FontGenericFamilies = ['Sans-Serif', 'Serif', 'Monospace', 'Cursive', 'Fantasy']; const FontGenericFamilies = ['Sans-Serif', 'Serif', 'Monospace', 'Cursive', 'Fantasy'];
const Manipulations = { MOVE: 100, RESIZE: 101, MIRROR: 102 }; const Manipulation = { MOVE: 100, RESIZE: 101, MIRROR: 102 };
var Tools = Object.assign({ var Tool = Object.assign({
getNameOf: function(value) { getNameOf: function(value) {
return Object.keys(this).find(key => this[key] == value); return Object.keys(this).find(key => this[key] == value);
} }
}, Shapes, Manipulations); }, Shape, Manipulation);
Object.defineProperty(Tools, 'getNameOf', { enumerable: false }); Object.defineProperty(Tool, 'getNameOf', { enumerable: false });
// toJSON provides a string suitable for SVG color attribute whereas // toJSON provides a string suitable for SVG color attribute whereas
// toString provides a string suitable for displaying the color name to the user. // toString provides a string suitable for displaying the color name to the user.
@ -150,7 +150,7 @@ var DrawingArea = new Lang.Class({
this.elements = []; this.elements = [];
this.undoneElements = []; this.undoneElements = [];
this.currentElement = null; this.currentElement = null;
this.currentTool = Shapes.NONE; this.currentTool = Shape.NONE;
this.currentImage = null; this.currentImage = null;
this.currentTextAlignment = Clutter.get_default_text_direction() == Clutter.TextDirection.RTL ? TextAlignment.RIGHT : TextAlignment.LEFT; this.currentTextAlignment = Clutter.get_default_text_direction() == Clutter.TextDirection.RTL ? TextAlignment.RIGHT : TextAlignment.LEFT;
let fontName = St.Settings && St.Settings.get().font_name || Convenience.getSettings('org.gnome.desktop.interface').get_string('font-name'); let fontName = St.Settings && St.Settings.get().font_name || Convenience.getSettings('org.gnome.desktop.interface').get_string('font-name');
@ -178,7 +178,7 @@ var DrawingArea = new Lang.Class({
get menu() { get menu() {
if (!this._menu) if (!this._menu)
this._menu = new Menu.DrawingMenu(this, this.monitor, Tools, this.areaManagerUtils); this._menu = new Menu.DrawingMenu(this, this.monitor, Tool, this.areaManagerUtils);
return this._menu; return this._menu;
}, },
@ -251,7 +251,7 @@ var DrawingArea = new Lang.Class({
get hasManipulationTool() { get hasManipulationTool() {
// No Object.values method in GS 3.24. // No Object.values method in GS 3.24.
return Object.keys(Manipulations).map(key => Manipulations[key]).indexOf(this.currentTool) != -1; return Object.keys(Manipulation).map(key => Manipulation[key]).indexOf(this.currentTool) != -1;
}, },
// Boolean wrapper for switch menu item. // Boolean wrapper for switch menu item.
@ -325,7 +325,7 @@ var DrawingArea = new Lang.Class({
if (this.elements[i].fill && !this.elements[i].isStraightLine) { if (this.elements[i].fill && !this.elements[i].isStraightLine) {
cr.fillPreserve(); cr.fillPreserve();
if (this.elements[i].shape == Shapes.NONE || this.elements[i].shape == Shapes.LINE) if (this.elements[i].shape == Shape.NONE || this.elements[i].shape == Shape.LINE)
cr.closePath(); cr.closePath();
} }
@ -335,7 +335,7 @@ var DrawingArea = new Lang.Class({
if (this.currentElement && this.currentElement.eraser) { if (this.currentElement && this.currentElement.eraser) {
this.currentElement.buildCairo(cr, { showTextCursor: this.textHasCursor, this.currentElement.buildCairo(cr, { showTextCursor: this.textHasCursor,
showTextRectangle: this.currentElement.shape != Shapes.TEXT || !this.isWriting, showTextRectangle: this.currentElement.shape != Shape.TEXT || !this.isWriting,
dummyStroke: this.currentElement.fill && this.currentElement.line.lineWidth == 0 }); dummyStroke: this.currentElement.fill && this.currentElement.line.lineWidth == 0 });
cr.stroke(); cr.stroke();
} }
@ -346,7 +346,7 @@ var DrawingArea = new Lang.Class({
return; return;
this.currentElement.buildCairo(cr, { showTextCursor: this.textHasCursor, this.currentElement.buildCairo(cr, { showTextCursor: this.textHasCursor,
showTextRectangle: this.currentElement.shape != Shapes.TEXT || !this.isWriting, showTextRectangle: this.currentElement.shape != Shape.TEXT || !this.isWriting,
dummyStroke: this.currentElement.fill && this.currentElement.line.lineWidth == 0 }); dummyStroke: this.currentElement.fill && this.currentElement.line.lineWidth == 0 });
cr.stroke(); cr.stroke();
}, },
@ -379,11 +379,11 @@ var DrawingArea = new Lang.Class({
}, },
_getHasImageBack: function() { _getHasImageBack: function() {
return this.elements.some(element => element.shape == Shapes.IMAGE); return this.elements.some(element => element.shape == Shape.IMAGE);
}, },
_getHasImageFore: function() { _getHasImageFore: function() {
return this.currentElement && this.currentElement.shape == Shapes.IMAGE || false; return this.currentElement && this.currentElement.shape == Shape.IMAGE || false;
}, },
_redisplay: function() { _redisplay: function() {
@ -411,7 +411,7 @@ var DrawingArea = new Lang.Class({
let controlPressed = event.has_control_modifier(); let controlPressed = event.has_control_modifier();
let shiftPressed = event.has_shift_modifier(); let shiftPressed = event.has_shift_modifier();
if (this.currentElement && this.currentElement.shape == Shapes.TEXT && this.isWriting) if (this.currentElement && this.currentElement.shape == Shape.TEXT && this.isWriting)
// finish writing // finish writing
this._stopWriting(); this._stopWriting();
@ -471,7 +471,7 @@ var DrawingArea = new Lang.Class({
}, },
_onKeyPressed: function(actor, event) { _onKeyPressed: function(actor, event) {
if (this.currentElement && this.currentElement.shape == Shapes.LINE && if (this.currentElement && this.currentElement.shape == Shape.LINE &&
(event.get_key_symbol() == Clutter.KEY_Return || (event.get_key_symbol() == Clutter.KEY_Return ||
event.get_key_symbol() == Clutter.KEY_KP_Enter || event.get_key_symbol() == Clutter.KEY_KP_Enter ||
event.get_key_symbol() == Clutter.KEY_Control_L)) { event.get_key_symbol() == Clutter.KEY_Control_L)) {
@ -485,7 +485,7 @@ var DrawingArea = new Lang.Class({
this._redisplay(); this._redisplay();
return Clutter.EVENT_STOP; return Clutter.EVENT_STOP;
} else if (this.currentElement && } else if (this.currentElement &&
(this.currentElement.shape == Shapes.POLYGON || this.currentElement.shape == Shapes.POLYLINE) && (this.currentElement.shape == Shape.POLYGON || this.currentElement.shape == Shape.POLYLINE) &&
(event.get_key_symbol() == Clutter.KEY_Return || event.get_key_symbol() == Clutter.KEY_KP_Enter)) { (event.get_key_symbol() == Clutter.KEY_Return || event.get_key_symbol() == Clutter.KEY_KP_Enter)) {
this.currentElement.addPoint(); this.currentElement.addPoint();
@ -560,7 +560,7 @@ var DrawingArea = new Lang.Class({
if (!success) if (!success)
return; return;
if (this.currentTool == Manipulations.MIRROR) { if (this.currentTool == Manipulation.MIRROR) {
this.grabbedElementLocked = !this.grabbedElementLocked; this.grabbedElementLocked = !this.grabbedElementLocked;
if (this.grabbedElementLocked) { if (this.grabbedElementLocked) {
this.updatePointerCursor(); this.updatePointerCursor();
@ -591,12 +591,12 @@ var DrawingArea = new Lang.Class({
let undoable = !duplicate; let undoable = !duplicate;
if (this.currentTool == Manipulations.MOVE) if (this.currentTool == Manipulation.MOVE)
this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformations.ROTATION : Transformations.TRANSLATION, undoable); this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformation.ROTATION : Transformation.TRANSLATION, undoable);
else if (this.currentTool == Manipulations.RESIZE) else if (this.currentTool == Manipulation.RESIZE)
this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformations.STRETCH : Transformations.SCALE_PRESERVE, undoable); this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformation.STRETCH : Transformation.SCALE_PRESERVE, undoable);
else if (this.currentTool == Manipulations.MIRROR) { else if (this.currentTool == Manipulation.MIRROR) {
this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformations.INVERSION : Transformations.REFLECTION, undoable); this.grabbedElement.startTransformation(startX, startY, controlPressed ? Transformation.INVERSION : Transformation.REFLECTION, undoable);
this._redisplay(); this._redisplay();
} }
@ -616,28 +616,28 @@ var DrawingArea = new Lang.Class({
_updateTransforming: function(x, y, controlPressed) { _updateTransforming: function(x, y, controlPressed) {
let undoable = this.grabbedElement.lastTransformation.undoable || false; let undoable = this.grabbedElement.lastTransformation.undoable || false;
if (controlPressed && this.grabbedElement.lastTransformation.type == Transformations.TRANSLATION) { if (controlPressed && this.grabbedElement.lastTransformation.type == Transformation.TRANSLATION) {
this.grabbedElement.stopTransformation(); this.grabbedElement.stopTransformation();
this.grabbedElement.startTransformation(x, y, Transformations.ROTATION, undoable); this.grabbedElement.startTransformation(x, y, Transformation.ROTATION, undoable);
} else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformations.ROTATION) { } else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformation.ROTATION) {
this.grabbedElement.stopTransformation(); this.grabbedElement.stopTransformation();
this.grabbedElement.startTransformation(x, y, Transformations.TRANSLATION, undoable); this.grabbedElement.startTransformation(x, y, Transformation.TRANSLATION, undoable);
} }
if (controlPressed && this.grabbedElement.lastTransformation.type == Transformations.SCALE_PRESERVE) { if (controlPressed && this.grabbedElement.lastTransformation.type == Transformation.SCALE_PRESERVE) {
this.grabbedElement.stopTransformation(); this.grabbedElement.stopTransformation();
this.grabbedElement.startTransformation(x, y, Transformations.STRETCH, undoable); this.grabbedElement.startTransformation(x, y, Transformation.STRETCH, undoable);
} else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformations.STRETCH) { } else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformation.STRETCH) {
this.grabbedElement.stopTransformation(); this.grabbedElement.stopTransformation();
this.grabbedElement.startTransformation(x, y, Transformations.SCALE_PRESERVE, undoable); this.grabbedElement.startTransformation(x, y, Transformation.SCALE_PRESERVE, undoable);
} }
if (controlPressed && this.grabbedElement.lastTransformation.type == Transformations.REFLECTION) { if (controlPressed && this.grabbedElement.lastTransformation.type == Transformation.REFLECTION) {
this.grabbedElement.transformations.pop(); this.grabbedElement.transformations.pop();
this.grabbedElement.startTransformation(x, y, Transformations.INVERSION, undoable); this.grabbedElement.startTransformation(x, y, Transformation.INVERSION, undoable);
} else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformations.INVERSION) { } else if (!controlPressed && this.grabbedElement.lastTransformation.type == Transformation.INVERSION) {
this.grabbedElement.transformations.pop(); this.grabbedElement.transformations.pop();
this.grabbedElement.startTransformation(x, y, Transformations.REFLECTION, undoable); this.grabbedElement.startTransformation(x, y, Transformation.REFLECTION, undoable);
} }
this.grabbedElement.updateTransformation(x, y); this.grabbedElement.updateTransformation(x, y);
@ -669,7 +669,7 @@ var DrawingArea = new Lang.Class({
this._stopDrawing(); this._stopDrawing();
}); });
if (this.currentTool == Shapes.TEXT) { if (this.currentTool == Shape.TEXT) {
this.currentElement = new Elements.DrawingElement({ this.currentElement = new Elements.DrawingElement({
shape: this.currentTool, shape: this.currentTool,
color: this.currentColor, color: this.currentColor,
@ -680,7 +680,7 @@ var DrawingArea = new Lang.Class({
textAlignment: this.currentTextAlignment, textAlignment: this.currentTextAlignment,
points: [] points: []
}); });
} else if (this.currentTool == Shapes.IMAGE) { } else if (this.currentTool == Shape.IMAGE) {
this.currentElement = new Elements.DrawingElement({ this.currentElement = new Elements.DrawingElement({
shape: this.currentTool, shape: this.currentTool,
color: this.currentColor, color: this.currentColor,
@ -703,8 +703,8 @@ var DrawingArea = new Lang.Class({
this.currentElement.startDrawing(startX, startY); this.currentElement.startDrawing(startX, startY);
if (this.currentTool == Shapes.POLYGON || this.currentTool == Shapes.POLYLINE) { if (this.currentTool == Shape.POLYGON || this.currentTool == Shape.POLYLINE) {
let icon = Files.Icons[this.currentTool == Shapes.POLYGON ? 'TOOL_POLYGON' : 'TOOL_POLYLINE']; let icon = Files.Icons[this.currentTool == Shape.POLYGON ? 'TOOL_POLYGON' : 'TOOL_POLYLINE'];
// Translators: %s is a key label // Translators: %s is a key label
this.emit('show-osd', icon, _("Press <i>%s</i> to mark vertices") this.emit('show-osd', icon, _("Press <i>%s</i> to mark vertices")
.format(Gtk.accelerator_get_label(Clutter.KEY_Return, 0)), "", -1, true); .format(Gtk.accelerator_get_label(Clutter.KEY_Return, 0)), "", -1, true);
@ -727,7 +727,7 @@ var DrawingArea = new Lang.Class({
let controlPressed = event.has_control_modifier(); let controlPressed = event.has_control_modifier();
this._updateDrawing(x, y, controlPressed); this._updateDrawing(x, y, controlPressed);
if (this.currentTool == Shapes.NONE) { if (this.currentTool == Shape.NONE) {
let device = event.get_device(); let device = event.get_device();
let sequence = event.get_event_sequence(); let sequence = event.get_event_sequence();
@ -781,14 +781,14 @@ var DrawingArea = new Lang.Class({
} }
// skip when a polygon has not at least 3 points // skip when a polygon has not at least 3 points
if (this.currentElement && this.currentElement.shape == Shapes.POLYGON && this.currentElement.points.length < 3) if (this.currentElement && this.currentElement.shape == Shape.POLYGON && this.currentElement.points.length < 3)
this.currentElement = null; this.currentElement = null;
if (this.currentElement) if (this.currentElement)
this.currentElement.stopDrawing(); this.currentElement.stopDrawing();
if (this.currentElement && this.currentElement.points.length >= 2) { if (this.currentElement && this.currentElement.points.length >= 2) {
if (this.currentElement.shape == Shapes.TEXT && !this.isWriting) { if (this.currentElement.shape == Shape.TEXT && !this.isWriting) {
this._startWriting(); this._startWriting();
return; return;
} }
@ -891,15 +891,15 @@ var DrawingArea = new Lang.Class({
}, },
updatePointerCursor: function(controlPressed) { updatePointerCursor: function(controlPressed) {
if (this.currentTool == Manipulations.MIRROR && this.grabbedElementLocked) if (this.currentTool == Manipulation.MIRROR && this.grabbedElementLocked)
this.setPointerCursor('CROSSHAIR'); this.setPointerCursor('CROSSHAIR');
else if (this.hasManipulationTool) else if (this.hasManipulationTool)
this.setPointerCursor(this.grabbedElement ? 'MOVE_OR_RESIZE_WINDOW' : 'DEFAULT'); this.setPointerCursor(this.grabbedElement ? 'MOVE_OR_RESIZE_WINDOW' : 'DEFAULT');
else if (this.currentElement && this.currentElement.shape == Shapes.TEXT && this.isWriting) else if (this.currentElement && this.currentElement.shape == Shape.TEXT && this.isWriting)
this.setPointerCursor('IBEAM'); this.setPointerCursor('IBEAM');
else if (!this.currentElement) else if (!this.currentElement)
this.setPointerCursor(this.currentTool == Shapes.NONE ? 'POINTING_HAND' : 'CROSSHAIR'); this.setPointerCursor(this.currentTool == Shape.NONE ? 'POINTING_HAND' : 'CROSSHAIR');
else if (this.currentElement.shape != Shapes.NONE && controlPressed) else if (this.currentElement.shape != Shape.NONE && controlPressed)
this.setPointerCursor('MOVE_OR_RESIZE_WINDOW'); this.setPointerCursor('MOVE_OR_RESIZE_WINDOW');
}, },
@ -988,7 +988,7 @@ var DrawingArea = new Lang.Class({
}, },
smoothLastElement: function() { smoothLastElement: function() {
if (this.elements.length > 0 && this.elements[this.elements.length - 1].shape == Shapes.NONE) { if (this.elements.length > 0 && this.elements[this.elements.length - 1].shape == Shape.NONE) {
this.elements[this.elements.length - 1].smoothAll(); this.elements[this.elements.length - 1].smoothAll();
this._redisplay(); this._redisplay();
} }
@ -1069,7 +1069,7 @@ var DrawingArea = new Lang.Class({
selectTool: function(tool) { selectTool: function(tool) {
this.currentTool = tool; this.currentTool = tool;
this.emit('show-osd', Files.Icons[`TOOL_${Tools.getNameOf(tool)}`] || null, DisplayStrings.Tool[tool], "", -1, false); this.emit('show-osd', Files.Icons[`TOOL_${Tool.getNameOf(tool)}`] || null, DisplayStrings.Tool[tool], "", -1, false);
this.updatePointerCursor(); this.updatePointerCursor();
}, },
@ -1169,7 +1169,7 @@ var DrawingArea = new Lang.Class({
pasteImageFiles: function() { pasteImageFiles: function() {
Files.Images.addImagesFromClipboard(lastImage => { Files.Images.addImagesFromClipboard(lastImage => {
this.currentImage = lastImage; this.currentImage = lastImage;
this.currentTool = Shapes.IMAGE; this.currentTool = Shape.IMAGE;
this.updatePointerCursor(); this.updatePointerCursor();
this.emit('show-osd', this.currentImage.gicon, this.currentImage.toString(), "", -1, false); this.emit('show-osd', this.currentImage.gicon, this.currentImage.toString(), "", -1, false);
}); });
@ -1369,7 +1369,7 @@ var DrawingArea = new Lang.Class({
this._stopAll(); this._stopAll();
let prefixes = 'xmlns="http://www.w3.org/2000/svg"'; let prefixes = 'xmlns="http://www.w3.org/2000/svg"';
if (this.elements.some(element => element.shape == Shapes.IMAGE)) if (this.elements.some(element => element.shape == Shape.IMAGE))
prefixes += ' xmlns:xlink="http://www.w3.org/1999/xlink"'; prefixes += ' xmlns:xlink="http://www.w3.org/1999/xlink"';
let content = `<svg viewBox="0 0 ${this.layerContainer.width} ${this.layerContainer.height}" ${prefixes}>`; let content = `<svg viewBox="0 0 ${this.layerContainer.width} ${this.layerContainer.height}" ${prefixes}>`;
let backgroundColorString = this.hasBackground ? String(this.areaBackgroundColor) : 'transparent'; let backgroundColorString = this.hasBackground ? String(this.areaBackgroundColor) : 'transparent';

144
elements.js
View File

@ -1,5 +1,5 @@
/* jslint esversion: 6 */ /* jslint esversion: 6 */
/* exported Shapes, Transformations, getAllFontFamilies, DrawingElement */ /* exported Shape, TextAlignment, Transformation, getAllFontFamilies, DrawingElement */
/* /*
* Copyright 2019 Abakkk * Copyright 2019 Abakkk
@ -30,9 +30,9 @@ const PangoCairo = imports.gi.PangoCairo;
const Me = imports.misc.extensionUtils.getCurrentExtension(); const Me = imports.misc.extensionUtils.getCurrentExtension();
const UUID = Me.uuid.replace(/@/gi, '_at_').replace(/[^a-z0-9+_-]/gi, '_'); const UUID = Me.uuid.replace(/@/gi, '_at_').replace(/[^a-z0-9+_-]/gi, '_');
var Shapes = { NONE: 0, LINE: 1, ELLIPSE: 2, RECTANGLE: 3, TEXT: 4, POLYGON: 5, POLYLINE: 6, IMAGE: 7 }; var Shape = { NONE: 0, LINE: 1, ELLIPSE: 2, RECTANGLE: 3, TEXT: 4, POLYGON: 5, POLYLINE: 6, IMAGE: 7 };
var TextAlignment = { LEFT: 0, CENTER: 1, RIGHT: 2 }; var TextAlignment = { LEFT: 0, CENTER: 1, RIGHT: 2 };
var Transformations = { TRANSLATION: 0, ROTATION: 1, SCALE_PRESERVE: 2, STRETCH: 3, REFLECTION: 4, INVERSION: 5, SMOOTH: 100 }; var Transformation = { TRANSLATION: 0, ROTATION: 1, SCALE_PRESERVE: 2, STRETCH: 3, REFLECTION: 4, INVERSION: 5, SMOOTH: 100 };
var getAllFontFamilies = function() { var getAllFontFamilies = function() {
return PangoCairo.font_map_get_default().list_families().map(fontFamily => fontFamily.get_name()).sort((a,b) => a.localeCompare(b)); return PangoCairo.font_map_get_default().list_families().map(fontFamily => fontFamily.get_name()).sort((a,b) => a.localeCompare(b));
@ -66,8 +66,8 @@ const MIN_DRAWING_SIZE = 3; // px
const MIN_INTERMEDIATE_POINT_DISTANCE = 1; // px, the higher it is, the fewer points there will be const MIN_INTERMEDIATE_POINT_DISTANCE = 1; // px, the higher it is, the fewer points there will be
var DrawingElement = function(params) { var DrawingElement = function(params) {
return params.shape == Shapes.TEXT ? new TextElement(params) : return params.shape == Shape.TEXT ? new TextElement(params) :
params.shape == Shapes.IMAGE ? new ImageElement(params) : params.shape == Shape.IMAGE ? new ImageElement(params) :
new _DrawingElement(params); new _DrawingElement(params);
}; };
@ -104,9 +104,9 @@ const _DrawingElement = new Lang.Class({
if (params.transform && params.transform.center) { if (params.transform && params.transform.center) {
let angle = (params.transform.angle || 0) + (params.transform.startAngle || 0); let angle = (params.transform.angle || 0) + (params.transform.startAngle || 0);
if (angle) if (angle)
this.transformations.push({ type: Transformations.ROTATION, angle: angle }); this.transformations.push({ type: Transformation.ROTATION, angle: angle });
} }
if (params.shape == Shapes.ELLIPSE && params.transform && params.transform.ratio && params.transform.ratio != 1 && params.points.length >= 2) { if (params.shape == Shape.ELLIPSE && params.transform && params.transform.ratio && params.transform.ratio != 1 && params.points.length >= 2) {
let [ratio, p0, p1] = [params.transform.ratio, params.points[0], params.points[1]]; let [ratio, p0, p1] = [params.transform.ratio, params.points[0], params.points[1]];
// Add a fake point that will give the right ellipse ratio when building the element. // Add a fake point that will give the right ellipse ratio when building the element.
this.points.push([ratio * (p1[0] - p0[0]) + p0[0], ratio * (p1[1] - p0[1]) + p0[1]]); this.points.push([ratio * (p1[0] - p0[0]) + p0[0], ratio * (p1[1] - p0[1]) + p0[1]]);
@ -129,7 +129,7 @@ const _DrawingElement = new Lang.Class({
fill: this.fill, fill: this.fill,
fillRule: this.fillRule, fillRule: this.fillRule,
eraser: this.eraser, eraser: this.eraser,
transformations: this.transformations.filter(transformation => transformation.type != Transformations.SMOOTH) transformations: this.transformations.filter(transformation => transformation.type != Transformation.SMOOTH)
.map(transformation => Object.assign({}, transformation, { undoable: undefined })), .map(transformation => Object.assign({}, transformation, { undoable: undefined })),
points: this.points.map((point) => [Math.round(point[0]*100)/100, Math.round(point[1]*100)/100]) points: this.points.map((point) => [Math.round(point[0]*100)/100, Math.round(point[1]*100)/100])
}; };
@ -142,7 +142,7 @@ const _DrawingElement = new Lang.Class({
if (this.showSymmetryElement) { if (this.showSymmetryElement) {
let transformation = this.lastTransformation; let transformation = this.lastTransformation;
setDummyStroke(cr); setDummyStroke(cr);
if (transformation.type == Transformations.REFLECTION) { if (transformation.type == Transformation.REFLECTION) {
cr.moveTo(transformation.startX, transformation.startY); cr.moveTo(transformation.startX, transformation.startY);
cr.lineTo(transformation.endX, transformation.endY); cr.lineTo(transformation.endX, transformation.endY);
} else { } else {
@ -177,21 +177,21 @@ const _DrawingElement = new Lang.Class({
} }
this.transformations.slice(0).reverse().forEach(transformation => { this.transformations.slice(0).reverse().forEach(transformation => {
if (transformation.type == Transformations.TRANSLATION) { if (transformation.type == Transformation.TRANSLATION) {
cr.translate(transformation.slideX, transformation.slideY); cr.translate(transformation.slideX, transformation.slideY);
} else if (transformation.type == Transformations.ROTATION) { } else if (transformation.type == Transformation.ROTATION) {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
cr.translate(center[0], center[1]); cr.translate(center[0], center[1]);
cr.rotate(transformation.angle); cr.rotate(transformation.angle);
cr.translate(-center[0], -center[1]); cr.translate(-center[0], -center[1]);
} else if (transformation.type == Transformations.SCALE_PRESERVE || transformation.type == Transformations.STRETCH) { } else if (transformation.type == Transformation.SCALE_PRESERVE || transformation.type == Transformation.STRETCH) {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
cr.translate(center[0], center[1]); cr.translate(center[0], center[1]);
cr.rotate(transformation.angle); cr.rotate(transformation.angle);
cr.scale(transformation.scaleX, transformation.scaleY); cr.scale(transformation.scaleX, transformation.scaleY);
cr.rotate(-transformation.angle); cr.rotate(-transformation.angle);
cr.translate(-center[0], -center[1]); cr.translate(-center[0], -center[1]);
} else if (transformation.type == Transformations.REFLECTION || transformation.type == Transformations.INVERSION) { } else if (transformation.type == Transformation.REFLECTION || transformation.type == Transformation.INVERSION) {
cr.translate(transformation.slideX, transformation.slideY); cr.translate(transformation.slideX, transformation.slideY);
cr.rotate(transformation.angle); cr.rotate(transformation.angle);
cr.scale(transformation.scaleX, transformation.scaleY); cr.scale(transformation.scaleX, transformation.scaleY);
@ -208,21 +208,21 @@ const _DrawingElement = new Lang.Class({
_drawCairo: function(cr, params) { _drawCairo: function(cr, params) {
let [points, shape] = [this.points, this.shape]; let [points, shape] = [this.points, this.shape];
if (shape == Shapes.LINE && points.length == 3) { if (shape == Shape.LINE && points.length == 3) {
cr.moveTo(points[0][0], points[0][1]); cr.moveTo(points[0][0], points[0][1]);
cr.curveTo(points[0][0], points[0][1], points[1][0], points[1][1], points[2][0], points[2][1]); cr.curveTo(points[0][0], points[0][1], points[1][0], points[1][1], points[2][0], points[2][1]);
} else if (shape == Shapes.LINE && points.length == 4) { } else if (shape == Shape.LINE && points.length == 4) {
cr.moveTo(points[0][0], points[0][1]); cr.moveTo(points[0][0], points[0][1]);
cr.curveTo(points[1][0], points[1][1], points[2][0], points[2][1], points[3][0], points[3][1]); cr.curveTo(points[1][0], points[1][1], points[2][0], points[2][1], points[3][0], points[3][1]);
} else if (shape == Shapes.NONE || shape == Shapes.LINE) { } else if (shape == Shape.NONE || shape == Shape.LINE) {
cr.moveTo(points[0][0], points[0][1]); cr.moveTo(points[0][0], points[0][1]);
for (let j = 1; j < points.length; j++) { for (let j = 1; j < points.length; j++) {
cr.lineTo(points[j][0], points[j][1]); cr.lineTo(points[j][0], points[j][1]);
} }
} else if (shape == Shapes.ELLIPSE && points.length >= 2) { } else if (shape == Shape.ELLIPSE && points.length >= 2) {
let radius = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]); let radius = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]);
let ratio = 1; let ratio = 1;
@ -238,15 +238,15 @@ const _DrawingElement = new Lang.Class({
} else } else
cr.arc(points[0][0], points[0][1], radius, 0, 2 * Math.PI); cr.arc(points[0][0], points[0][1], radius, 0, 2 * Math.PI);
} else if (shape == Shapes.RECTANGLE && points.length == 2) { } else if (shape == Shape.RECTANGLE && points.length == 2) {
cr.rectangle(points[0][0], points[0][1], points[1][0] - points[0][0], points[1][1] - points[0][1]); cr.rectangle(points[0][0], points[0][1], points[1][0] - points[0][0], points[1][1] - points[0][1]);
} else if ((shape == Shapes.POLYGON || shape == Shapes.POLYLINE) && points.length >= 2) { } else if ((shape == Shape.POLYGON || shape == Shape.POLYLINE) && points.length >= 2) {
cr.moveTo(points[0][0], points[0][1]); cr.moveTo(points[0][0], points[0][1]);
for (let j = 1; j < points.length; j++) { for (let j = 1; j < points.length; j++) {
cr.lineTo(points[j][0], points[j][1]); cr.lineTo(points[j][0], points[j][1]);
} }
if (shape == Shapes.POLYGON) if (shape == Shape.POLYGON)
cr.closePath(); cr.closePath();
} }
@ -268,19 +268,19 @@ const _DrawingElement = new Lang.Class({
this.transformations.slice(0).reverse().forEach(transformation => { this.transformations.slice(0).reverse().forEach(transformation => {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
if (transformation.type == Transformations.TRANSLATION) { if (transformation.type == Transformation.TRANSLATION) {
transforms.push(['translate', transformation.slideX, transformation.slideY]); transforms.push(['translate', transformation.slideX, transformation.slideY]);
} else if (transformation.type == Transformations.ROTATION) { } else if (transformation.type == Transformation.ROTATION) {
transforms.push(['translate', center[0], center[1]]); transforms.push(['translate', center[0], center[1]]);
transforms.push(['rotate', transformation.angle * RADIAN]); transforms.push(['rotate', transformation.angle * RADIAN]);
transforms.push(['translate', -center[0], -center[1]]); transforms.push(['translate', -center[0], -center[1]]);
} else if (transformation.type == Transformations.SCALE_PRESERVE || transformation.type == Transformations.STRETCH) { } else if (transformation.type == Transformation.SCALE_PRESERVE || transformation.type == Transformation.STRETCH) {
transforms.push(['translate', center[0], center[1]]); transforms.push(['translate', center[0], center[1]]);
transforms.push(['rotate', transformation.angle * RADIAN]); transforms.push(['rotate', transformation.angle * RADIAN]);
transforms.push(['scale', transformation.scaleX, transformation.scaleY]); transforms.push(['scale', transformation.scaleX, transformation.scaleY]);
transforms.push(['rotate', -transformation.angle * RADIAN]); transforms.push(['rotate', -transformation.angle * RADIAN]);
transforms.push(['translate', -center[0], -center[1]]); transforms.push(['translate', -center[0], -center[1]]);
} else if (transformation.type == Transformations.REFLECTION || transformation.type == Transformations.INVERSION) { } else if (transformation.type == Transformation.REFLECTION || transformation.type == Transformation.INVERSION) {
transforms.push(['translate', transformation.slideX, transformation.slideY]); transforms.push(['translate', transformation.slideX, transformation.slideY]);
transforms.push(['rotate', transformation.angle * RADIAN]); transforms.push(['rotate', transformation.angle * RADIAN]);
transforms.push(['scale', transformation.scaleX, transformation.scaleY]); transforms.push(['scale', transformation.scaleX, transformation.scaleY]);
@ -348,45 +348,45 @@ const _DrawingElement = new Lang.Class({
attributes += ` stroke-dasharray="${this.dash.array[0]} ${this.dash.array[1]}" stroke-dashoffset="${this.dash.offset}"`; attributes += ` stroke-dasharray="${this.dash.array[0]} ${this.dash.array[1]}" stroke-dashoffset="${this.dash.offset}"`;
} }
if (this.shape == Shapes.LINE && points.length == 4) { if (this.shape == Shape.LINE && points.length == 4) {
row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`; row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`;
row += ` C ${points[1][0]} ${points[1][1]}, ${points[2][0]} ${points[2][1]}, ${points[3][0]} ${points[3][1]}`; row += ` C ${points[1][0]} ${points[1][1]}, ${points[2][0]} ${points[2][1]}, ${points[3][0]} ${points[3][1]}`;
row += `${fill ? 'z' : ''}"${transAttribute}/>`; row += `${fill ? 'z' : ''}"${transAttribute}/>`;
} else if (this.shape == Shapes.LINE && points.length == 3) { } else if (this.shape == Shape.LINE && points.length == 3) {
row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`; row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`;
row += ` C ${points[0][0]} ${points[0][1]}, ${points[1][0]} ${points[1][1]}, ${points[2][0]} ${points[2][1]}`; row += ` C ${points[0][0]} ${points[0][1]}, ${points[1][0]} ${points[1][1]}, ${points[2][0]} ${points[2][1]}`;
row += `${fill ? 'z' : ''}"${transAttribute}/>`; row += `${fill ? 'z' : ''}"${transAttribute}/>`;
} else if (this.shape == Shapes.LINE) { } else if (this.shape == Shape.LINE) {
row += `<line ${attributes} x1="${points[0][0]}" y1="${points[0][1]}" x2="${points[1][0]}" y2="${points[1][1]}"${transAttribute}/>`; row += `<line ${attributes} x1="${points[0][0]}" y1="${points[0][1]}" x2="${points[1][0]}" y2="${points[1][1]}"${transAttribute}/>`;
} else if (this.shape == Shapes.NONE) { } else if (this.shape == Shape.NONE) {
row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`; row += `<path ${attributes} d="M${points[0][0]} ${points[0][1]}`;
for (let i = 1; i < points.length; i++) for (let i = 1; i < points.length; i++)
row += ` L ${points[i][0]} ${points[i][1]}`; row += ` L ${points[i][0]} ${points[i][1]}`;
row += `${fill ? 'z' : ''}"${transAttribute}/>`; row += `${fill ? 'z' : ''}"${transAttribute}/>`;
} else if (this.shape == Shapes.ELLIPSE && points.length == 3) { } else if (this.shape == Shape.ELLIPSE && points.length == 3) {
let ry = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]); let ry = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]);
let rx = Math.hypot(points[2][0] - points[0][0], points[2][1] - points[0][1]); let rx = Math.hypot(points[2][0] - points[0][0], points[2][1] - points[0][1]);
row += `<ellipse ${attributes} cx="${points[0][0]}" cy="${points[0][1]}" rx="${rx}" ry="${ry}"${transAttribute}/>`; row += `<ellipse ${attributes} cx="${points[0][0]}" cy="${points[0][1]}" rx="${rx}" ry="${ry}"${transAttribute}/>`;
} else if (this.shape == Shapes.ELLIPSE && points.length == 2) { } else if (this.shape == Shape.ELLIPSE && points.length == 2) {
let r = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]); let r = Math.hypot(points[1][0] - points[0][0], points[1][1] - points[0][1]);
row += `<circle ${attributes} cx="${points[0][0]}" cy="${points[0][1]}" r="${r}"${transAttribute}/>`; row += `<circle ${attributes} cx="${points[0][0]}" cy="${points[0][1]}" r="${r}"${transAttribute}/>`;
} else if (this.shape == Shapes.RECTANGLE && points.length == 2) { } else if (this.shape == Shape.RECTANGLE && points.length == 2) {
row += `<rect ${attributes} x="${Math.min(points[0][0], points[1][0])}" y="${Math.min(points[0][1], points[1][1])}" ` + row += `<rect ${attributes} x="${Math.min(points[0][0], points[1][0])}" y="${Math.min(points[0][1], points[1][1])}" ` +
`width="${Math.abs(points[1][0] - points[0][0])}" height="${Math.abs(points[1][1] - points[0][1])}"${transAttribute}/>`; `width="${Math.abs(points[1][0] - points[0][0])}" height="${Math.abs(points[1][1] - points[0][1])}"${transAttribute}/>`;
} else if (this.shape == Shapes.POLYGON && points.length >= 3) { } else if (this.shape == Shape.POLYGON && points.length >= 3) {
row += `<polygon ${attributes} points="`; row += `<polygon ${attributes} points="`;
for (let i = 0; i < points.length; i++) for (let i = 0; i < points.length; i++)
row += ` ${points[i][0]},${points[i][1]}`; row += ` ${points[i][0]},${points[i][1]}`;
row += `"${transAttribute}/>`; row += `"${transAttribute}/>`;
} else if (this.shape == Shapes.POLYLINE && points.length >= 2) { } else if (this.shape == Shape.POLYLINE && points.length >= 2) {
row += `<polyline ${attributes} points="`; row += `<polyline ${attributes} points="`;
for (let i = 0; i < points.length; i++) for (let i = 0; i < points.length; i++)
row += ` ${points[i][0]},${points[i][1]}`; row += ` ${points[i][0]},${points[i][1]}`;
@ -405,7 +405,7 @@ const _DrawingElement = new Lang.Class({
}, },
get isStraightLine() { get isStraightLine() {
return this.shape == Shapes.LINE && this.points.length == 2; return this.shape == Shape.LINE && this.points.length == 2;
}, },
smoothAll: function() { smoothAll: function() {
@ -416,21 +416,21 @@ const _DrawingElement = new Lang.Class({
let newPoints = this.points.slice(); let newPoints = this.points.slice();
this.transformations.push({ type: Transformations.SMOOTH, undoable: true, this.transformations.push({ type: Transformation.SMOOTH, undoable: true,
undo: () => this.points = oldPoints, undo: () => this.points = oldPoints,
redo: () => this.points = newPoints }); redo: () => this.points = newPoints });
if (this._undoneTransformations) if (this._undoneTransformations)
this._undoneTransformations = this._undoneTransformations.filter(transformation => transformation.type != Transformations.SMOOTH); this._undoneTransformations = this._undoneTransformations.filter(transformation => transformation.type != Transformation.SMOOTH);
}, },
addPoint: function() { addPoint: function() {
if (this.shape == Shapes.POLYGON || this.shape == Shapes.POLYLINE) { if (this.shape == Shape.POLYGON || this.shape == Shape.POLYLINE) {
// copy last point // copy last point
let [lastPoint, secondToLastPoint] = [this.points[this.points.length - 1], this.points[this.points.length - 2]]; let [lastPoint, secondToLastPoint] = [this.points[this.points.length - 1], this.points[this.points.length - 2]];
if (!getNearness(secondToLastPoint, lastPoint, MIN_DRAWING_SIZE)) if (!getNearness(secondToLastPoint, lastPoint, MIN_DRAWING_SIZE))
this.points.push([lastPoint[0], lastPoint[1]]); this.points.push([lastPoint[0], lastPoint[1]]);
} else if (this.shape == Shapes.LINE) { } else if (this.shape == Shape.LINE) {
if (this.points.length == 2) { if (this.points.length == 2) {
this.points[2] = this.points[1]; this.points[2] = this.points[1];
} else if (this.points.length == 3) { } else if (this.points.length == 3) {
@ -454,7 +454,7 @@ const _DrawingElement = new Lang.Class({
startDrawing: function(startX, startY) { startDrawing: function(startX, startY) {
this.points.push([startX, startY]); this.points.push([startX, startY]);
if (this.shape == Shapes.POLYGON || this.shape == Shapes.POLYLINE) if (this.shape == Shape.POLYGON || this.shape == Shape.POLYLINE)
this.points.push([startX, startY]); this.points.push([startX, startY]);
}, },
@ -465,29 +465,29 @@ const _DrawingElement = new Lang.Class({
transform = transform || this.transformations.length >= 1; transform = transform || this.transformations.length >= 1;
if (this.shape == Shapes.NONE) { if (this.shape == Shape.NONE) {
points.push([x, y]); points.push([x, y]);
if (transform) if (transform)
this._smooth(points.length - 1); this._smooth(points.length - 1);
} else if ((this.shape == Shapes.RECTANGLE || this.shape == Shapes.POLYGON || this.shape == Shapes.POLYLINE) && transform) { } else if ((this.shape == Shape.RECTANGLE || this.shape == Shape.POLYGON || this.shape == Shape.POLYLINE) && transform) {
if (points.length < 2) if (points.length < 2)
return; return;
let center = this._getOriginalCenter(); let center = this._getOriginalCenter();
this.transformations[0] = { type: Transformations.ROTATION, this.transformations[0] = { type: Transformation.ROTATION,
angle: getAngle(center[0], center[1], points[points.length - 1][0], points[points.length - 1][1], x, y) }; angle: getAngle(center[0], center[1], points[points.length - 1][0], points[points.length - 1][1], x, y) };
} else if (this.shape == Shapes.ELLIPSE && transform) { } else if (this.shape == Shape.ELLIPSE && transform) {
if (points.length < 2) if (points.length < 2)
return; return;
points[2] = [x, y]; points[2] = [x, y];
let center = this._getOriginalCenter(); let center = this._getOriginalCenter();
this.transformations[0] = { type: Transformations.ROTATION, this.transformations[0] = { type: Transformation.ROTATION,
angle: getAngle(center[0], center[1], center[0] + 1, center[1], x, y) }; angle: getAngle(center[0], center[1], center[0] + 1, center[1], x, y) };
} else if (this.shape == Shapes.POLYGON || this.shape == Shapes.POLYLINE) { } else if (this.shape == Shape.POLYGON || this.shape == Shape.POLYLINE) {
points[points.length - 1] = [x, y]; points[points.length - 1] = [x, y];
} else { } else {
@ -498,51 +498,51 @@ const _DrawingElement = new Lang.Class({
stopDrawing: function() { stopDrawing: function() {
// skip when the size is too small to be visible (3px) (except for free drawing) // skip when the size is too small to be visible (3px) (except for free drawing)
if (this.shape != Shapes.NONE && this.points.length >= 2) { if (this.shape != Shape.NONE && this.points.length >= 2) {
let lastPoint = this.points[this.points.length - 1]; let lastPoint = this.points[this.points.length - 1];
let secondToLastPoint = this.points[this.points.length - 2]; let secondToLastPoint = this.points[this.points.length - 2];
if (getNearness(secondToLastPoint, lastPoint, MIN_DRAWING_SIZE)) if (getNearness(secondToLastPoint, lastPoint, MIN_DRAWING_SIZE))
this.points.pop(); this.points.pop();
} }
if (this.transformations[0] && this.transformations[0].type == Transformations.ROTATION && if (this.transformations[0] && this.transformations[0].type == Transformation.ROTATION &&
Math.abs(this.transformations[0].angle) < MIN_ROTATION_ANGLE) Math.abs(this.transformations[0].angle) < MIN_ROTATION_ANGLE)
this.transformations.shift(); this.transformations.shift();
}, },
startTransformation: function(startX, startY, type, undoable) { startTransformation: function(startX, startY, type, undoable) {
if (type == Transformations.TRANSLATION) if (type == Transformation.TRANSLATION)
this.transformations.push({ startX, startY, type, undoable, slideX: 0, slideY: 0 }); this.transformations.push({ startX, startY, type, undoable, slideX: 0, slideY: 0 });
else if (type == Transformations.ROTATION) else if (type == Transformation.ROTATION)
this.transformations.push({ startX, startY, type, undoable, angle: 0 }); this.transformations.push({ startX, startY, type, undoable, angle: 0 });
else if (type == Transformations.SCALE_PRESERVE || type == Transformations.STRETCH) else if (type == Transformation.SCALE_PRESERVE || type == Transformation.STRETCH)
this.transformations.push({ startX, startY, type, undoable, scaleX: 1, scaleY: 1, angle: 0 }); this.transformations.push({ startX, startY, type, undoable, scaleX: 1, scaleY: 1, angle: 0 });
else if (type == Transformations.REFLECTION) else if (type == Transformation.REFLECTION)
this.transformations.push({ startX, startY, endX: startX, endY: startY, type, undoable, this.transformations.push({ startX, startY, endX: startX, endY: startY, type, undoable,
scaleX: 1, scaleY: 1, slideX: 0, slideY: 0, angle: 0 }); scaleX: 1, scaleY: 1, slideX: 0, slideY: 0, angle: 0 });
else if (type == Transformations.INVERSION) else if (type == Transformation.INVERSION)
this.transformations.push({ startX, startY, endX: startX, endY: startY, type, undoable, this.transformations.push({ startX, startY, endX: startX, endY: startY, type, undoable,
scaleX: -1, scaleY: -1, slideX: startX, slideY: startY, scaleX: -1, scaleY: -1, slideX: startX, slideY: startY,
angle: Math.PI + Math.atan(startY / (startX || 1)) }); angle: Math.PI + Math.atan(startY / (startX || 1)) });
if (type == Transformations.REFLECTION || type == Transformations.INVERSION) if (type == Transformation.REFLECTION || type == Transformation.INVERSION)
this.showSymmetryElement = true; this.showSymmetryElement = true;
}, },
updateTransformation: function(x, y) { updateTransformation: function(x, y) {
let transformation = this.lastTransformation; let transformation = this.lastTransformation;
if (transformation.type == Transformations.TRANSLATION) { if (transformation.type == Transformation.TRANSLATION) {
transformation.slideX = x - transformation.startX; transformation.slideX = x - transformation.startX;
transformation.slideY = y - transformation.startY; transformation.slideY = y - transformation.startY;
} else if (transformation.type == Transformations.ROTATION) { } else if (transformation.type == Transformation.ROTATION) {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
transformation.angle = getAngle(center[0], center[1], transformation.startX, transformation.startY, x, y); transformation.angle = getAngle(center[0], center[1], transformation.startX, transformation.startY, x, y);
} else if (transformation.type == Transformations.SCALE_PRESERVE) { } else if (transformation.type == Transformation.SCALE_PRESERVE) {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
let scale = Math.hypot(x - center[0], y - center[1]) / Math.hypot(transformation.startX - center[0], transformation.startY - center[1]) || 1; let scale = Math.hypot(x - center[0], y - center[1]) / Math.hypot(transformation.startX - center[0], transformation.startY - center[1]) || 1;
[transformation.scaleX, transformation.scaleY] = [scale, scale]; [transformation.scaleX, transformation.scaleY] = [scale, scale];
} else if (transformation.type == Transformations.STRETCH) { } else if (transformation.type == Transformation.STRETCH) {
let center = this._getTransformedCenter(transformation); let center = this._getTransformedCenter(transformation);
let startAngle = getAngle(center[0], center[1], center[0] + 1, center[1], transformation.startX, transformation.startY); let startAngle = getAngle(center[0], center[1], center[0] + 1, center[1], transformation.startX, transformation.startY);
let vertical = Math.abs(Math.sin(startAngle)) >= Math.sin(Math.PI / 2 - STRETCH_TOLERANCE); let vertical = Math.abs(Math.sin(startAngle)) >= Math.sin(Math.PI / 2 - STRETCH_TOLERANCE);
@ -551,7 +551,7 @@ const _DrawingElement = new Lang.Class({
transformation.scaleX = vertical ? 1 : scale; transformation.scaleX = vertical ? 1 : scale;
transformation.scaleY = !vertical ? 1 : scale; transformation.scaleY = !vertical ? 1 : scale;
transformation.angle = vertical || horizontal ? 0 : getAngle(center[0], center[1], center[0] + 1, center[1], x, y); transformation.angle = vertical || horizontal ? 0 : getAngle(center[0], center[1], center[0] + 1, center[1], x, y);
} else if (transformation.type == Transformations.REFLECTION) { } else if (transformation.type == Transformation.REFLECTION) {
[transformation.endX, transformation.endY] = [x, y]; [transformation.endX, transformation.endY] = [x, y];
if (getNearness([transformation.startX, transformation.startY], [x, y], MIN_REFLECTION_LINE_LENGTH)) { if (getNearness([transformation.startX, transformation.startY], [x, y], MIN_REFLECTION_LINE_LENGTH)) {
// do nothing to avoid jumps (no transformation at starting and locked transformation after) // do nothing to avoid jumps (no transformation at starting and locked transformation after)
@ -574,7 +574,7 @@ const _DrawingElement = new Lang.Class({
[transformation.slideX, transformation.slideY] = [transformation.startX - transformation.startY * tan, 0]; [transformation.slideX, transformation.slideY] = [transformation.startX - transformation.startY * tan, 0];
transformation.angle = Math.PI - Math.atan(tan); transformation.angle = Math.PI - Math.atan(tan);
} }
} else if (transformation.type == Transformations.INVERSION) { } else if (transformation.type == Transformation.INVERSION) {
[transformation.endX, transformation.endY] = [x, y]; [transformation.endX, transformation.endY] = [x, y];
[transformation.scaleX, transformation.scaleY] = [-1, -1]; [transformation.scaleX, transformation.scaleY] = [-1, -1];
[transformation.slideX, transformation.slideY] = [x, y]; [transformation.slideX, transformation.slideY] = [x, y];
@ -590,10 +590,10 @@ const _DrawingElement = new Lang.Class({
if (!transformation) if (!transformation)
return; return;
if (transformation.type == Transformations.REFLECTION && if (transformation.type == Transformation.REFLECTION &&
getNearness([transformation.startX, transformation.startY], [transformation.endX, transformation.endY], MIN_REFLECTION_LINE_LENGTH) || getNearness([transformation.startX, transformation.startY], [transformation.endX, transformation.endY], MIN_REFLECTION_LINE_LENGTH) ||
transformation.type == Transformations.TRANSLATION && Math.hypot(transformation.slideX, transformation.slideY) < MIN_TRANSLATION_DISTANCE || transformation.type == Transformation.TRANSLATION && Math.hypot(transformation.slideX, transformation.slideY) < MIN_TRANSLATION_DISTANCE ||
transformation.type == Transformations.ROTATION && Math.abs(transformation.angle) < MIN_ROTATION_ANGLE) { transformation.type == Transformation.ROTATION && Math.abs(transformation.angle) < MIN_ROTATION_ANGLE) {
this.transformations.pop(); this.transformations.pop();
} else { } else {
@ -614,7 +614,7 @@ const _DrawingElement = new Lang.Class({
this._undoneTransformations = []; this._undoneTransformations = [];
let transformation = this.transformations.pop(); let transformation = this.transformations.pop();
if (transformation.type == Transformations.SMOOTH) if (transformation.type == Transformation.SMOOTH)
transformation.undo(); transformation.undo();
this._undoneTransformations.push(transformation); this._undoneTransformations.push(transformation);
@ -631,7 +631,7 @@ const _DrawingElement = new Lang.Class({
this.transformations = []; this.transformations = [];
let transformation = this._undoneTransformations.pop(); let transformation = this._undoneTransformations.pop();
if (transformation.type == Transformations.SMOOTH) if (transformation.type == Transformation.SMOOTH)
transformation.redo(); transformation.redo();
this.transformations.push(transformation); this.transformations.push(transformation);
@ -654,9 +654,9 @@ const _DrawingElement = new Lang.Class({
_getOriginalCenter: function() { _getOriginalCenter: function() {
if (!this._originalCenter) { if (!this._originalCenter) {
let points = this.points; let points = this.points;
this._originalCenter = this.shape == Shapes.ELLIPSE ? [points[0][0], points[0][1]] : this._originalCenter = this.shape == Shape.ELLIPSE ? [points[0][0], points[0][1]] :
this.shape == Shapes.LINE && points.length == 4 ? getCurveCenter(points[0], points[1], points[2], points[3]) : this.shape == Shape.LINE && points.length == 4 ? getCurveCenter(points[0], points[1], points[2], points[3]) :
this.shape == Shapes.LINE && points.length == 3 ? getCurveCenter(points[0], points[0], points[1], points[2]) : this.shape == Shape.LINE && points.length == 3 ? getCurveCenter(points[0], points[0], points[1], points[2]) :
points.length >= 3 ? getCentroid(points) : points.length >= 3 ? getCentroid(points) :
getNaiveCenter(points); getNaiveCenter(points);
} }
@ -672,13 +672,13 @@ const _DrawingElement = new Lang.Class({
// Apply transformations to the matrice in reverse order // Apply transformations to the matrice in reverse order
// because Pango multiply matrices by the left when applying a transformation // because Pango multiply matrices by the left when applying a transformation
this.transformations.slice(0, this.transformations.indexOf(transformation)).reverse().forEach(transformation => { this.transformations.slice(0, this.transformations.indexOf(transformation)).reverse().forEach(transformation => {
if (transformation.type == Transformations.TRANSLATION) { if (transformation.type == Transformation.TRANSLATION) {
matrix.translate(transformation.slideX, transformation.slideY); matrix.translate(transformation.slideX, transformation.slideY);
} else if (transformation.type == Transformations.ROTATION) { } else if (transformation.type == Transformation.ROTATION) {
// nothing, the center position is preserved. // nothing, the center position is preserved.
} else if (transformation.type == Transformations.SCALE_PRESERVE || transformation.type == Transformations.STRETCH) { } else if (transformation.type == Transformation.SCALE_PRESERVE || transformation.type == Transformation.STRETCH) {
// nothing, the center position is preserved. // nothing, the center position is preserved.
} else if (transformation.type == Transformations.REFLECTION || transformation.type == Transformations.INVERSION) { } else if (transformation.type == Transformation.REFLECTION || transformation.type == Transformation.INVERSION) {
matrix.translate(transformation.slideX, transformation.slideY); matrix.translate(transformation.slideX, transformation.slideY);
matrix.rotate(-transformation.angle * RADIAN); matrix.rotate(-transformation.angle * RADIAN);
matrix.scale(transformation.scaleX, transformation.scaleY); matrix.scale(transformation.scaleX, transformation.scaleY);
@ -757,7 +757,7 @@ const TextElement = new Lang.Class({
layout.set_font_description(this.font); layout.set_font_description(this.font);
layout.set_text(this.text, -1); layout.set_text(this.text, -1);
this.textWidth = layout.get_pixel_size()[0]; this.textWidth = layout.get_pixel_size()[0];
this.lineWidths = layout.get_lines_readonly().map(layoutLine => layoutLine.get_pixel_extents()[1].width) this.lineWidths = layout.get_lines_readonly().map(layoutLine => layoutLine.get_pixel_extents()[1].width);
layout.get_lines_readonly().forEach((layoutLine, index) => { layout.get_lines_readonly().forEach((layoutLine, index) => {
cr.moveTo(this._getLineX(index), this.y + this.height * index); cr.moveTo(this._getLineX(index), this.y + this.height * index);

22
extension.js
View File

@ -210,17 +210,17 @@ const AreaManager = new Lang.Class({
'switch-fill' : this.activeArea.switchFill.bind(this.activeArea), 'switch-fill' : this.activeArea.switchFill.bind(this.activeArea),
'switch-image-file' : this.activeArea.switchImageFile.bind(this.activeArea, false), 'switch-image-file' : this.activeArea.switchImageFile.bind(this.activeArea, false),
'switch-image-file-reverse' : this.activeArea.switchImageFile.bind(this.activeArea, true), 'switch-image-file-reverse' : this.activeArea.switchImageFile.bind(this.activeArea, true),
'select-none-shape': () => this.activeArea.selectTool(Area.Tools.NONE), 'select-none-shape': () => this.activeArea.selectTool(Area.Tool.NONE),
'select-line-shape': () => this.activeArea.selectTool(Area.Tools.LINE), 'select-line-shape': () => this.activeArea.selectTool(Area.Tool.LINE),
'select-ellipse-shape': () => this.activeArea.selectTool(Area.Tools.ELLIPSE), 'select-ellipse-shape': () => this.activeArea.selectTool(Area.Tool.ELLIPSE),
'select-rectangle-shape': () => this.activeArea.selectTool(Area.Tools.RECTANGLE), 'select-rectangle-shape': () => this.activeArea.selectTool(Area.Tool.RECTANGLE),
'select-text-shape': () => this.activeArea.selectTool(Area.Tools.TEXT), 'select-text-shape': () => this.activeArea.selectTool(Area.Tool.TEXT),
'select-image-shape': () => this.activeArea.selectTool(Area.Tools.IMAGE), 'select-image-shape': () => this.activeArea.selectTool(Area.Tool.IMAGE),
'select-polygon-shape': () => this.activeArea.selectTool(Area.Tools.POLYGON), 'select-polygon-shape': () => this.activeArea.selectTool(Area.Tool.POLYGON),
'select-polyline-shape': () => this.activeArea.selectTool(Area.Tools.POLYLINE), 'select-polyline-shape': () => this.activeArea.selectTool(Area.Tool.POLYLINE),
'select-move-tool': () => this.activeArea.selectTool(Area.Tools.MOVE), 'select-move-tool': () => this.activeArea.selectTool(Area.Tool.MOVE),
'select-resize-tool': () => this.activeArea.selectTool(Area.Tools.RESIZE), 'select-resize-tool': () => this.activeArea.selectTool(Area.Tool.RESIZE),
'select-mirror-tool': () => this.activeArea.selectTool(Area.Tools.MIRROR) 'select-mirror-tool': () => this.activeArea.selectTool(Area.Tool.MIRROR)
}; };
// available when writing // available when writing

6
files.js
View File

@ -41,7 +41,7 @@ const ICON_NAMES = [
'arc', 'color', 'dashed-line', 'document-export', 'fillrule-evenodd', 'fillrule-nonzero', 'fill', 'full-line', 'linecap', 'linejoin', 'palette', 'smooth', 'stroke', 'arc', 'color', 'dashed-line', 'document-export', 'fillrule-evenodd', 'fillrule-nonzero', 'fill', 'full-line', 'linecap', 'linejoin', 'palette', 'smooth', 'stroke',
'tool-ellipse', 'tool-line', 'tool-mirror', 'tool-move', 'tool-none', 'tool-polygon', 'tool-polyline', 'tool-rectangle', 'tool-resize', 'tool-ellipse', 'tool-line', 'tool-mirror', 'tool-move', 'tool-none', 'tool-polygon', 'tool-polyline', 'tool-rectangle', 'tool-resize',
]; ];
const ThemedIconNames = { const ThemedIconName = {
COLOR_PICKER: 'color-select-symbolic', COLOR_PICKER: 'color-select-symbolic',
ENTER: 'applications-graphics', LEAVE: 'application-exit', ENTER: 'applications-graphics', LEAVE: 'application-exit',
GRAB: 'input-touchpad', UNGRAB: 'touchpad-disabled', GRAB: 'input-touchpad', UNGRAB: 'touchpad-disabled',
@ -74,11 +74,11 @@ ICON_NAMES.forEach(name => {
}); });
}); });
Object.keys(ThemedIconNames).forEach(key => { Object.keys(ThemedIconName).forEach(key => {
Object.defineProperty(Icons, key, { Object.defineProperty(Icons, key, {
get: function() { get: function() {
if (!this[`_${key}`]) if (!this[`_${key}`])
this[`_${key}`] = new Gio.ThemedIcon({ name: `${ThemedIconNames[key]}-symbolic` }); this[`_${key}`] = new Gio.ThemedIcon({ name: `${ThemedIconName[key]}-symbolic` });
return this[`_${key}`]; return this[`_${key}`];
} }
}); });

88
menu.js
View File

@ -72,52 +72,52 @@ var DisplayStrings = {
}, },
get FillRule() { get FillRule() {
if (!this._fillRules) if (!this._FillRule)
// Translators: fill-rule SVG attribute // Translators: fill-rule SVG attribute
this._fillRules = { 0: _("Nonzero"), 1: _("Evenodd") }; this._FillRule = { 0: _("Nonzero"), 1: _("Evenodd") };
return this._fillRules; return this._FillRule;
}, },
getFontFamily: function(family) { getFontFamily: function(family) {
if (!this._fontGenericFamilies) if (!this._FontGenericFamily)
// Translators: generic font-family SVG attribute // Translators: generic font-family SVG attribute
this._fontGenericFamilies = { 'Sans-Serif': pgettext("font-family", "Sans-Serif"), 'Serif': pgettext("font-family", "Serif"), this._FontGenericFamily = { 'Sans-Serif': pgettext("font-family", "Sans-Serif"), 'Serif': pgettext("font-family", "Serif"),
'Monospace': pgettext("font-family", "Monospace"), 'Cursive': pgettext("font-family", "Cursive"), 'Monospace': pgettext("font-family", "Monospace"), 'Cursive': pgettext("font-family", "Cursive"),
'Fantasy': pgettext("font-family", "Fantasy") }; 'Fantasy': pgettext("font-family", "Fantasy") };
return this._fontGenericFamilies[family] || family; return this._FontGenericFamily[family] || family;
}, },
get FontStyle() { get FontStyle() {
if (!this._fontStyles) if (!this._FontStyle)
// Translators: font-style SVG attribute // Translators: font-style SVG attribute
this._fontStyles = { 0: pgettext("font-style", "Normal"), 1: pgettext("font-style", "Oblique"), 2: pgettext("font-style", "Italic") }; this._FontStyle = { 0: pgettext("font-style", "Normal"), 1: pgettext("font-style", "Oblique"), 2: pgettext("font-style", "Italic") };
return this._fontStyles; return this._FontStyle;
}, },
FontStyleMarkup: { 0: 'normal', 1: 'oblique', 2: 'italic' }, FontStyleMarkup: { 0: 'normal', 1: 'oblique', 2: 'italic' },
get FontWeight() { get FontWeight() {
if (!this._fontWeights) if (!this._FontWeight)
// Translators: font-weight SVG attribute // Translators: font-weight SVG attribute
this._fontWeights = { 100: pgettext("font-weight", "Thin"), 200: pgettext("font-weight", "Ultra Light"), 300: pgettext("font-weight", "Light"), this._FontWeight = { 100: pgettext("font-weight", "Thin"), 200: pgettext("font-weight", "Ultra Light"), 300: pgettext("font-weight", "Light"),
350: pgettext("font-weight", "Semi Light"), 380: pgettext("font-weight", "Book"), 400: pgettext("font-weight", "Normal"), 350: pgettext("font-weight", "Semi Light"), 380: pgettext("font-weight", "Book"), 400: pgettext("font-weight", "Normal"),
500: pgettext("font-weight", "Medium"), 600: pgettext("font-weight", "Semi Bold"), 700: pgettext("font-weight", "Bold"), 500: pgettext("font-weight", "Medium"), 600: pgettext("font-weight", "Semi Bold"), 700: pgettext("font-weight", "Bold"),
800: pgettext("font-weight", "Ultra Bold"), 900: pgettext("font-weight", "Heavy"), 1000: pgettext("font-weight", "Ultra Heavy") }; 800: pgettext("font-weight", "Ultra Bold"), 900: pgettext("font-weight", "Heavy"), 1000: pgettext("font-weight", "Ultra Heavy") };
return this._fontWeights; return this._FontWeight;
}, },
get LineCap() { get LineCap() {
if (!this._lineCaps) if (!this._LineCap)
// Translators: stroke-linecap SVG attribute // Translators: stroke-linecap SVG attribute
this._lineCaps = { 0: pgettext("stroke-linecap", "Butt"), 1: pgettext("stroke-linecap", "Round"), 2: pgettext("stroke-linecap", "Square") }; this._LineCap = { 0: pgettext("stroke-linecap", "Butt"), 1: pgettext("stroke-linecap", "Round"), 2: pgettext("stroke-linecap", "Square") };
return this._lineCaps; return this._LineCap;
}, },
get LineJoin() { get LineJoin() {
if (!this._lineJoins) if (!this._LineJoin)
// Translators: stroke-linejoin SVG attribute // Translators: stroke-linejoin SVG attribute
this._lineJoins = { 0: pgettext("stroke-linejoin", "Miter"), 1: pgettext("stroke-linejoin", "Round"), 2: pgettext("stroke-linejoin", "Bevel") }; this._LineJoin = { 0: pgettext("stroke-linejoin", "Miter"), 1: pgettext("stroke-linejoin", "Round"), 2: pgettext("stroke-linejoin", "Bevel") };
return this._lineJoins; return this._LineJoin;
}, },
getPixels(value) { getPixels(value) {
@ -127,29 +127,29 @@ var DisplayStrings = {
get TextAlignment() { get TextAlignment() {
// Translators: text alignment // Translators: text alignment
if (!this._textAlignments) if (!this._TextAlignment)
this._textAlignments = { 0: _("Left aligned"), 1: _("Centered"), 2: _("Right aligned") }; this._TextAlignment = { 0: _("Left aligned"), 1: _("Centered"), 2: _("Right aligned") };
return this._textAlignments; return this._TextAlignment;
}, },
get Tool() { get Tool() {
if (!this._tools) if (!this._Tool)
this._tools = { 0: pgettext("drawing-tool", "Free drawing"), 1: pgettext("drawing-tool", "Line"), 2: pgettext("drawing-tool", "Ellipse"), this._Tool = { 0: pgettext("drawing-tool", "Free drawing"), 1: pgettext("drawing-tool", "Line"), 2: pgettext("drawing-tool", "Ellipse"),
3: pgettext("drawing-tool", "Rectangle"), 4: pgettext("drawing-tool", "Text"), 5: pgettext("drawing-tool", "Polygon"), 3: pgettext("drawing-tool", "Rectangle"), 4: pgettext("drawing-tool", "Text"), 5: pgettext("drawing-tool", "Polygon"),
6: pgettext("drawing-tool", "Polyline"), 7: pgettext("drawing-tool", "Image"), 6: pgettext("drawing-tool", "Polyline"), 7: pgettext("drawing-tool", "Image"),
100: pgettext("drawing-tool", "Move"), 101: pgettext("drawing-tool", "Resize"), 102: pgettext("drawing-tool", "Mirror") }; 100: pgettext("drawing-tool", "Move"), 101: pgettext("drawing-tool", "Resize"), 102: pgettext("drawing-tool", "Mirror") };
return this._tools; return this._Tool;
} }
}; };
var DrawingMenu = new Lang.Class({ var DrawingMenu = new Lang.Class({
Name: `${UUID}-DrawingMenu`, Name: `${UUID}-DrawingMenu`,
_init: function(area, monitor, drawingTools, areaManagerUtils) { _init: function(area, monitor, DrawingTool, areaManagerUtils) {
this.area = area; this.area = area;
this.monitor = monitor; this.monitor = monitor;
this.drawingTools = drawingTools; this.DrawingTool = DrawingTool;
this.areaManagerUtils = areaManagerUtils; this.areaManagerUtils = areaManagerUtils;
let side = Clutter.get_default_text_direction() == Clutter.TextDirection.RTL ? St.Side.RIGHT : St.Side.LEFT; let side = Clutter.get_default_text_direction() == Clutter.TextDirection.RTL ? St.Side.RIGHT : St.Side.LEFT;
@ -182,7 +182,7 @@ var DrawingMenu = new Lang.Class({
disable: function() { disable: function() {
delete this.area; delete this.area;
delete this.drawingTools; delete this.DrawingTool;
delete this.areaManagerUtils; delete this.areaManagerUtils;
this.menuManager.removeMenu(this.menu); this.menuManager.removeMenu(this.menu);
Main.layoutManager.uiGroup.remove_actor(this.menu.actor); Main.layoutManager.uiGroup.remove_actor(this.menu.actor);
@ -315,14 +315,14 @@ var DrawingMenu = new Lang.Class({
this.undoButton.child.reactive = this.area.elements.length > 0; this.undoButton.child.reactive = this.area.elements.length > 0;
this.redoButton.child.reactive = this.area.undoneElements.length > 0 || (this.area.elements.length && this.area.elements[this.area.elements.length - 1].canUndo); this.redoButton.child.reactive = this.area.undoneElements.length > 0 || (this.area.elements.length && this.area.elements[this.area.elements.length - 1].canUndo);
this.eraseButton.child.reactive = this.area.elements.length > 0; this.eraseButton.child.reactive = this.area.elements.length > 0;
this.smoothButton.child.reactive = this.area.elements.length > 0 && this.area.elements[this.area.elements.length - 1].shape == this.drawingTools.NONE; this.smoothButton.child.reactive = this.area.elements.length > 0 && this.area.elements[this.area.elements.length - 1].shape == this.DrawingTool.NONE;
this.saveButton.child.reactive = this.area.elements.length > 0; this.saveButton.child.reactive = this.area.elements.length > 0;
this.svgButton.child.reactive = this.area.elements.length > 0; this.svgButton.child.reactive = this.area.elements.length > 0;
this.saveDrawingSubMenuItem.setSensitive(this.area.elements.length > 0); this.saveDrawingSubMenuItem.setSensitive(this.area.elements.length > 0);
}, },
_updateSectionVisibility: function() { _updateSectionVisibility: function() {
let [isText, isImage] = [this.area.currentTool == this.drawingTools.TEXT, this.area.currentTool == this.drawingTools.IMAGE]; let [isText, isImage] = [this.area.currentTool == this.DrawingTool.TEXT, this.area.currentTool == this.DrawingTool.IMAGE];
this.lineSection.actor.visible = !isText && !isImage; this.lineSection.actor.visible = !isText && !isImage;
this.fontSection.actor.visible = isText; this.fontSection.actor.visible = isText;
this.imageSection.actor.visible = isImage; this.imageSection.actor.visible = isImage;
@ -425,7 +425,7 @@ var DrawingMenu = new Lang.Class({
let item = new PopupMenu.PopupSubMenuMenuItem('', true); let item = new PopupMenu.PopupSubMenuMenuItem('', true);
item.update = () => { item.update = () => {
item.label.set_text(DisplayStrings.Tool[this.area.currentTool]); item.label.set_text(DisplayStrings.Tool[this.area.currentTool]);
let toolName = this.drawingTools.getNameOf(this.area.currentTool); let toolName = this.DrawingTool.getNameOf(this.area.currentTool);
item.icon.set_gicon(Files.Icons[`TOOL_${toolName}`]); item.icon.set_gicon(Files.Icons[`TOOL_${toolName}`]);
}; };
item.update(); item.update();
@ -435,7 +435,7 @@ var DrawingMenu = new Lang.Class({
GLib.idle_add(GLib.PRIORITY_DEFAULT_IDLE, () => { GLib.idle_add(GLib.PRIORITY_DEFAULT_IDLE, () => {
Object.keys(DisplayStrings.Tool).forEach(key => { Object.keys(DisplayStrings.Tool).forEach(key => {
let text = DisplayStrings.Tool[key]; let text = DisplayStrings.Tool[key];
let toolName = this.drawingTools.getNameOf(key); let toolName = this.DrawingTool.getNameOf(key);
let subItemIcon = Files.Icons[`TOOL_${toolName}`]; let subItemIcon = Files.Icons[`TOOL_${toolName}`];
let subItem = item.menu.addAction(text, () => { let subItem = item.menu.addAction(text, () => {
this.area.currentTool = Number(key); this.area.currentTool = Number(key);
@ -447,10 +447,10 @@ var DrawingMenu = new Lang.Class({
getActor(subItem).connect('key-focus-in', updateSubMenuAdjustment); getActor(subItem).connect('key-focus-in', updateSubMenuAdjustment);
// change the display order of tools // change the display order of tools
if (key == this.drawingTools.POLYGON) if (key == this.DrawingTool.POLYGON)
item.menu.moveMenuItem(subItem, Number(this.drawingTools.TEXT)); item.menu.moveMenuItem(subItem, Number(this.DrawingTool.TEXT));
else if (key == this.drawingTools.POLYLINE) else if (key == this.DrawingTool.POLYLINE)
item.menu.moveMenuItem(subItem, Number(this.drawingTools.TEXT) + 1); item.menu.moveMenuItem(subItem, Number(this.DrawingTool.TEXT) + 1);
}); });
return GLib.SOURCE_REMOVE; return GLib.SOURCE_REMOVE;
}); });
@ -680,7 +680,7 @@ var DrawingMenu = new Lang.Class({
let insertCallback = () => { let insertCallback = () => {
this.area.currentImage = json.image; this.area.currentImage = json.image;
this.imageItem.update(); this.imageItem.update();
this.area.currentTool = this.drawingTools.IMAGE; this.area.currentTool = this.DrawingTool.IMAGE;
this.toolItem.update(); this.toolItem.update();
this._updateSectionVisibility(); this._updateSectionVisibility();
}; };