diff --git a/index.html b/index.html
index 6890d86..0d9a7e2 100644
--- a/index.html
+++ b/index.html
@@ -11,9 +11,8 @@
-
-
diff --git a/script.js b/script.js
index e7c14a6..cd9bbdd 100644
--- a/script.js
+++ b/script.js
@@ -96,37 +96,44 @@ function drawLabel() {
if (width > minimumSizeX && height > minimumSizeY) {
// Create a label and push it into the array of labels
- let label = createLabel(minX, minY, width, height, labels.length);
- let userInput = new Promise(function (resolve, reject) {
+ new Promise(function (resolve, reject) {
// TODO: show the modal for text input in overlay
// TODO: temp editor freeze before the label is created
// then if the user click insert and there is a value in the input-- > resolve the promise and return the text input to create the label,
// if the user click cancel-- > reject the promise and don't create the label
-
input.focus();
- // TODO: after the first promise it breaks??
+ // Insert button
insert.addEventListener("click", (e) => {
e.preventDefault();
if (input.value) {
- resolve(input.value);
- } else {
- reject("no input");
+ resolve();
}
- input.value = "";
});
- }).then((textInput) => {
+
+ // Cancel button
+ cancel.addEventListener("click", (e) => {
+ e.preventDefault();
+ reject("no input");
+ });
+ }).then(() => {
+ // Create the label
+ let label = createLabel(minX, minY, width, height, labels.length);
+
// Add the text input to the label
let text = document.createElement("p");
text.classList.add("label--text");
- text.innerHTML = textInput;
+ text.innerHTML = input.value;
label.appendChild(text);
- });
- labels.push(label);
- container.appendChild(label);
- input.value = "";
+ // labels.push(label);
+ container.appendChild(label);
+
+ // Reset the modal
+ input.value = "";
+ input.blur();
+ });
}
}