mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-10-07 03:10:45 +00:00
Code Issues Releases Wiki Activity

Limited bitmap editing canvas width to 100%

Browse Source
This commit is contained in:
Jeremy Ruston 2012-04-02 13:09:24 +01:00
parent 13d61056ad
commit 995de58d47
2 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
js/macros/edit.js
View File

@ -96,20 +96,24 @@ BitmapEditor.prototype.addEventHandlers = function() {
},false); },false);
}; };
BitmapEditor.prototype.strokeStart = function(x,y) { BitmapEditor.prototype.adjustCoordinates = function(x,y) {
var canvas = this.macroNode.content[0].domNode, var canvas = this.macroNode.content[0].domNode,
canvasRect = canvas.getBoundingClientRect(); canvasRect = canvas.getBoundingClientRect(),
scale = canvas.width/canvasRect.width;
return {x: (x - canvasRect.left) * scale, y: (y - canvasRect.top) * scale};
};
BitmapEditor.prototype.strokeStart = function(x,y) {
// Start off a new stroke // Start off a new stroke
this.stroke = [{x: x - canvasRect.left, y: y - canvasRect.top}]; this.stroke = [this.adjustCoordinates(x,y)];
}; };
BitmapEditor.prototype.strokeMove = function(x,y) { BitmapEditor.prototype.strokeMove = function(x,y) {
var canvas = this.macroNode.content[0].domNode, var canvas = this.macroNode.content[0].domNode,
canvasRect = canvas.getBoundingClientRect(),
ctx = canvas.getContext("2d"), ctx = canvas.getContext("2d"),
t; t;
// Add the new position to the end of the stroke // Add the new position to the end of the stroke
this.stroke.push({x: x - canvasRect.left, y: y - canvasRect.top}); this.stroke.push(this.adjustCoordinates(x,y));
// Redraw the previous image // Redraw the previous image
ctx.drawImage(this.currCanvas,0,0); ctx.drawImage(this.currCanvas,0,0);
// Render the stroke // Render the stroke
@ -121,9 +125,9 @@ BitmapEditor.prototype.strokeMove = function(x,y) {
for(t=1; t<this.stroke.length-1; t++) { for(t=1; t<this.stroke.length-1; t++) {
var s1 = this.stroke[t], var s1 = this.stroke[t],
s2 = this.stroke[t-1], s2 = this.stroke[t-1],
c = (s1.x + s2.x)/2, tx = (s1.x + s2.x)/2,
d = (s1.y + s2.y)/2; ty = (s1.y + s2.y)/2;
ctx.quadraticCurveTo(s2.x,s2.y,c,d); ctx.quadraticCurveTo(s2.x,s2.y,tx,ty);
} }
ctx.stroke(); ctx.stroke();
}; };

2
tiddlywiki5/shadows/css/styles.css
View File

@ -24,7 +24,7 @@ canvas.tw-edit-field {
-ms-user-select: none; -ms-user-select: none;
} }
img { img, canvas {
max-width: 100%; max-width: 100%;
} }