promises WIP

master
km0 3 years ago
parent defa22e901
commit cd4e6907d8

@ -11,9 +11,8 @@
<body>
<div id="container">
<div id="editor"></div>
<form id="text-input" class="text-input">
<input id="input" type="text" />
<form class="text-input">
<input id="input" placeholder="Insert your label" type="text" />
<button id="insert" type="submit">Insert</button>
<button id="cancel">x</button>
</form>

@ -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();
});
}
}

Loading…
Cancel
Save