artin/miniPaint
1
0
Fork 0
mirror of https://github.com/viliusle/miniPaint.git synced 2026-02-06 11:21:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #276 from kmanaseryan/feature/rotate-text

Browse Source 
Issue #185 - Allow text rotation
This commit is contained in:
Vilius 2022-01-03 23:59:20 +02:00 committed by GitHub
commit c2aa4594e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/js/tools/text.js
View File

@ -15,7 +15,6 @@ import alertify from './../../../node_modules/alertifyjs/build/alertify.min.js';
* - Add leading, superscript, subscript
* - Implement text direction (right to left, top to bottom, etc.); currently partial implementation
* - Allow search & add google fonts
* - Enable text layer rotation
* - Undo history
*/
@ -1622,6 +1621,16 @@ class Text_editor_class {
let wrapIndex = 0;
const cursorLine = this.selection.isActiveSideEnd ? this.selection.end.line : this.selection.start.line;
const cursorCharacter = this.selection.isActiveSideEnd ? this.selection.end.character : this.selection.start.character;
if(layer.rotate){
const alpha = (layer.rotate * Math.PI) / 180;
ctx.save();
// Move the canvas to the center before rotating
ctx.translate(layer.x + layer.width / 2, layer.y + layer.height / 2);
ctx.rotate(alpha);
// Move it back after it
ctx.translate(-layer.x - layer.width / 2, -layer.y - layer.height / 2);
}
for (let line of this.lineRenderInfo.lines) {
let lineLetterCount = 0;
for (let [localWrapIndex, wrap] of line.wraps.entries()) {
@ -1674,6 +1683,8 @@ class Text_editor_class {
ctx.lineWidth = 0;
}
// Loop through each letter in each span and draw it
for (let c = 0; c < span.text.length; c++) {
const letter = span.text.charAt(c);
@ -1750,6 +1761,8 @@ class Text_editor_class {
lineLetterCount++;
}
if (span.text.length === 0) {
if (cursorLine === lineIndex && cursorCharacter === lineLetterCount) {
const lineStart = Math.round(drawOffsetTop + wrapSizes[wrapIndex].offset);
@ -1795,6 +1808,9 @@ class Text_editor_class {
}
lineIndex++;
}
if(layer.rotate){
ctx.restore();
}
} catch (error) {
console.warn(error);
}
@ -1982,7 +1998,7 @@ class Text_class extends Base_tools_class {
enable_background: false,
enable_borders: true,
enable_controls: true,
enable_rotation: false,
enable_rotation: true,
enable_move: false,
data_function: () => {
return this.selection;
@ -2517,6 +2533,7 @@ class Text_class extends Base_tools_class {
this.selection.y = layer.y;
this.selection.width = layer.width;
this.selection.height = layer.height;
this.selection.rotate = layer.rotate;
} else if (config.layer.type !== 'text') {
this.selection.x = -100000;
this.selection.y = -100000;