diff --git a/www/index.html b/www/index.html
index 041ce95..c43e312 100644
--- a/www/index.html
+++ b/www/index.html
@@ -190,6 +190,12 @@
+
+
diff --git a/www/lang/de-DE.json b/www/lang/de-DE.json
index adbebc6..1ade635 100644
--- a/www/lang/de-DE.json
+++ b/www/lang/de-DE.json
@@ -107,5 +107,9 @@
"text-font": "Schriftart",
"text-size": "Textgröße",
"enter-text": "Text eingeben",
- "wrap-by-space": "Autom. Zeilenumbruch"
+ "wrap-by-space": "Autom. Zeilenumbruch",
+ "text-align": "Textausrichtung",
+ "align-left": "Linksbündig",
+ "align-mid": "Zentriert",
+ "align-right": "Rechtsbündig"
}
\ No newline at end of file
diff --git a/www/lang/en-US.json b/www/lang/en-US.json
index 8c39e0f..80ba3ce 100644
--- a/www/lang/en-US.json
+++ b/www/lang/en-US.json
@@ -132,5 +132,9 @@
"text-font": "Font",
"text-size": "Size",
"enter-text": "Enter text",
- "wrap-by-space": "Wrap words by spaces"
+ "wrap-by-space": "Wrap words by spaces",
+ "text-align": "Align text",
+ "align-left": "Left",
+ "align-mid": "Center",
+ "align-right": "Right"
}
\ No newline at end of file
diff --git a/www/main.css b/www/main.css
index e7b8d80..100c7f7 100644
--- a/www/main.css
+++ b/www/main.css
@@ -660,4 +660,11 @@ body.high-contrast #control-overlay { background-color: var(--shade); }
font-family: 'Unifont';
src: local('Unifont') url('unifont.ttf') url('unifont.otf');
}
-#insert-text-area { white-space: pre; height: 50vh; width: var(--paper-width); overflow: hidden auto; white-space: pre-line;}
+#insert-text-area {
+ white-space: pre;
+ height: 50vh;
+ width: var(--paper-width);
+ overflow: hidden auto;
+ white-space: pre-line;
+ resize:none;
+}
diff --git a/www/main.js b/www/main.js
index afa6bbd..d44c459 100644
--- a/www/main.js
+++ b/www/main.js
@@ -307,7 +307,7 @@ class CanvasController {
this._thresholdRange = document.querySelector('[name="threshold"]');
this._energyRange = document.querySelector('[name="energy"]');
this.imageUrl = null;
- this.textAlign = 0; // 0: Left, 1: Center, 2: Right
+ this.textAlign = document.getElementById("text-align");
const prevent_default = (event) => {
event.preventDefault();
@@ -330,6 +330,7 @@ class CanvasController {
putEvent('#insert-text' , 'click', () => Dialog.alert("#text-input", () => this.insertText(this.textArea.value)));
putEvent('#text-size' , 'change', () => this.textArea.style["font-size"] = this.textSize.value + "px");
putEvent('#text-font' , 'change', () => this.textArea.style["font-family"] = this.textFont.value);
+ putEvent('#text-align' , 'change', () => this.textArea.style["text-align"] = this.textAlign.value);
putEvent('input[name="wrap-by-space"]' , 'change', () => this.textArea.style["word-break"] = this.wrapBySpace.checked ? "break-word" : "break-all");
putEvent('#button-preview' , 'click', this.activatePreview , this);
putEvent('#button-reset' , 'click', this.reset , this);
@@ -513,9 +514,10 @@ class CanvasController {
let y_pos = y_step;
for (let line of lines) {
let x_pos = 0;
- if (this.textAlign == 2) {
+ // Text-alignment
+ if (this.textAlign.value == "right") {
x_pos = Math.max(max_width - ctx.measureText(line).width, 0)
- } else if (this.textAlign == 1) {
+ } else if (this.textAlign.value == "center") {
x_pos = Math.max(max_width - ctx.measureText(line).width, 0) / 2;
}