diff --git a/creator/index.php b/creator/index.php
index cfbff9648..624390063 100644
--- a/creator/index.php
+++ b/creator/index.php
@@ -38,6 +38,26 @@
+
@@ -113,7 +133,9 @@
-
+
+
+
-
+
\ No newline at end of file
diff --git a/css/style-5.css b/css/style-6.css
similarity index 97%
rename from css/style-5.css
rename to css/style-6.css
index 022ed100d..e900093ca 100644
--- a/css/style-5.css
+++ b/css/style-6.css
@@ -644,7 +644,7 @@ textarea.input {
text-align: center;
padding: 0.5rem 0;
}
-.frame-element-editor {
+.frame-element-editor, .textbox-editor {
display: none;
position: fixed;
max-width: calc(100vw - 6rem);
@@ -668,13 +668,13 @@ textarea.input {
grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
grid-gap: 1rem;
}
-.frame-element-editor.opened {
+.frame-element-editor.opened, .textbox-editor.opened {
display: grid;
}
-.frame-element-editor > .frame-element-editor-title {
+.frame-element-editor > .frame-element-editor-title, .textbox-editor > .textbox-editor-title {
grid-column: 1 / -2;
}
-.frame-element-editor > .frame-element-editor-close {
+.frame-element-editor > .frame-element-editor-close, .textbox-editor > .textbox-editor-close {
cursor: pointer;
width: auto;
height: auto;
diff --git a/globalHTML/header.php b/globalHTML/header.php
index 0d19b3768..884337d58 100644
--- a/globalHTML/header.php
+++ b/globalHTML/header.php
@@ -9,7 +9,7 @@
-
+
diff --git a/js/creator-4.js b/js/creator-5.js
similarity index 98%
rename from js/creator-4.js
rename to js/creator-5.js
index 51c974e50..ed28cd9df 100644
--- a/js/creator-4.js
+++ b/js/creator-5.js
@@ -472,6 +472,18 @@ function textOptionClicked(event) {
document.querySelector('#text-editor').value = Object.entries(card.text)[selectedTextIndex][1].text;
selectSelectable(event);
}
+function textboxEditor() {
+ var selectedTextbox = card.text[Object.keys(card.text)[selectedTextIndex]];
+ document.querySelector('#textbox-editor').classList.add('opened');
+ document.querySelector('#textbox-editor-x').value = scaleWidth(selectedTextbox.x || 0);
+ document.querySelector('#textbox-editor-x').onchange = (event) => {selectedTextbox.x = (event.target.value / card.width); textEdited();}
+ document.querySelector('#textbox-editor-y').value = scaleHeight(selectedTextbox.y || 0);
+ document.querySelector('#textbox-editor-y').onchange = (event) => {selectedTextbox.y = (event.target.value / card.height); textEdited();}
+ document.querySelector('#textbox-editor-width').value = scaleWidth(selectedTextbox.width || 1);
+ document.querySelector('#textbox-editor-width').onchange = (event) => {selectedTextbox.width = (event.target.value / card.width); textEdited();}
+ document.querySelector('#textbox-editor-height').value = scaleHeight(selectedTextbox.height || 1);
+ document.querySelector('#textbox-editor-height').onchange = (event) => {selectedTextbox.height = (event.target.value / card.height); textEdited();}
+}
function textEdited() {
card.text[Object.keys(card.text)[selectedTextIndex]].text = document.querySelector('#text-editor').value;
drawTextBuffer();