55 lines
2.4 KiB
HTML
55 lines
2.4 KiB
HTML
<div id="{{id}}" class="roll-dialog">
|
|
<h1 style="text-align: center;">{{localize skillName}} ({{skillValue}})</h1>
|
|
<div class="flexrow" style="margin-bottom: 10px;">
|
|
<label style="margin: auto;">{{localize "ROLL.OPENCLOSE"}}</label>
|
|
<input type="button" name="openclosed" min="0" value="{{startopen}}" style="min-height: 30px; min-width: 45px;" />
|
|
<label name="notopenedorclosed" style="margin: auto; display: inline-block;"> </label>
|
|
<label name="closed" style="margin: auto; display: none; text-align: center;">{{localize "ROLL.CLOSED"}}</label>
|
|
<label name="opened" style="margin: auto; display: none; text-align: center;">{{localize "ROLL.OPENED"}}</label>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
(function() {
|
|
const scope = document.getElementById("{{{id}}}");
|
|
const input = scope.querySelector(`[name="openclosed"`);
|
|
const closed = scope.querySelector(`[name="closed"`);
|
|
const opened = scope.querySelector(`[name="opened"`);
|
|
const none = scope.querySelector(`[name="notopenedorclosed"`);
|
|
|
|
input.addEventListener("click", (event) => {
|
|
event.target.value++;
|
|
|
|
if(event.target.value > 0) {
|
|
closed.style.display = "none"
|
|
none.style.display = "none"
|
|
opened.style.display = "inline-block"
|
|
} else if(event.target.value < 0) {
|
|
opened.style.display = "none"
|
|
none.style.display = "none"
|
|
closed.style.display = "inline-block"
|
|
} else {
|
|
opened.style.display = "none"
|
|
closed.style.display = "none"
|
|
none.style.display = "inline-block"
|
|
}
|
|
});
|
|
input.addEventListener("contextmenu", (event) => {
|
|
event.target.value--;
|
|
|
|
if(event.target.value > 0) {
|
|
closed.style.display = "none"
|
|
none.style.display = "none"
|
|
opened.style.display = "inline-block"
|
|
} else if(event.target.value < 0) {
|
|
opened.style.display = "none"
|
|
none.style.display = "none"
|
|
closed.style.display = "inline-block"
|
|
} else {
|
|
opened.style.display = "none"
|
|
closed.style.display = "none"
|
|
none.style.display = "inline-block"
|
|
}
|
|
});
|
|
})();
|
|
</script> |