arcanis/ffxivbis
1
0
Fork 0
mirror of https://github.com/arcan1s/ffxivbis.git synced 2025-04-25 09:47:18 +00:00
Code Issues Projects Releases Wiki Activity

move modals to form validation

Browse Source
This commit is contained in:
Evgenii Alekseev 2022-01-19 03:04:59 +03:00
parent 7a6cd84ce3
commit dc882b74bf
5 changed files with 60 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/main/resources/html/bis.html
View File

@ -86,7 +86,7 @@
<div id="update-bis-dialog" tabindex="-1" role="dialog" class="modal fade"> <div id="update-bis-dialog" tabindex="-1" role="dialog" class="modal fade">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<form class="modal-content"> <form class="modal-content" action="javascript:" onsubmit="updateBis()">
<div class="modal-header"> <div class="modal-header">
<div class="btn-group" role="group" aria-label="Update bis"> <div class="btn-group" role="group" aria-label="Update bis">
<input id="add-piece-btn" name="update-bis" type="radio" class="btn-check" autocomplete="off" checked> <input id="add-piece-btn" name="update-bis" type="radio" class="btn-check" autocomplete="off" checked>
@ -102,7 +102,7 @@
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="player">player</label> <label class="col-sm-4 col-form-label" for="player">player</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="player" name="player" class="form-control" title="player"></select> <select id="player" name="player" class="form-control" title="player" required></select>
</div> </div>
</div> </div>
<div id="piece-row" class="form-group row"> <div id="piece-row" class="form-group row">
@ -120,14 +120,14 @@
<div id="bis-link-row" class="form-group row" style="display: none"> <div id="bis-link-row" class="form-group row" style="display: none">
<label class="col-sm-4 col-form-label" for="bis-link">link</label> <label class="col-sm-4 col-form-label" for="bis-link">link</label>
<div class="col-sm-8"> <div class="col-sm-8">
<input id="bis-link" name="link" class="form-control" placeholder="link to bis" onkeyup="disableSubmitBisButton()"> <input id="bis-link" name="link" class="form-control" placeholder="link to bis">
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button> <button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button>
<button id="submit-add-bis-btn" type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="addPiece()" disabled>add</button> <button id="submit-add-bis-btn" type="submit" class="btn btn-primary">add</button>
<button id="submit-update-bis-btn" type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="setBis()" style="display: none" disabled>set</button> <button id="submit-set-bis-btn" type="submit" class="btn btn-primary" style="display: none">set</button>
</div> </div>
</div> </div>
</form> </form>
@ -171,7 +171,7 @@
const updateButton = $("#update-btn"); const updateButton = $("#update-btn");
const submitAddBisButton = $("#submit-add-bis-btn"); const submitAddBisButton = $("#submit-add-bis-btn");
const submitUpdateBisButton = $("#submit-update-bis-btn"); const submitSetBisButton = $("#submit-set-bis-btn");
const updateBisDialog = $("#update-bis-dialog"); const updateBisDialog = $("#update-bis-dialog");
const addPieceButton = $("#add-piece-btn"); const addPieceButton = $("#add-piece-btn");
@ -208,12 +208,8 @@
success: function (_) { reload(); }, success: function (_) { reload(); },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
} updateBisDialog.modal("hide");
return true; // action expects boolean result
function disableSubmitBisButton() {
const nonEmpty = (playerInput.val() !== null); // well lol
submitUpdateBisButton.attr("disabled", !(nonEmpty && linkInput.val()));
submitAddBisButton.attr("disabled", !(nonEmpty));
} }
function hideControls() { function hideControls() {
@ -222,20 +218,24 @@
} }
function hideLinkPart() { function hideLinkPart() {
disableSubmitBisButton();
bisLinkRow.hide(); bisLinkRow.hide();
submitUpdateBisButton.hide(); linkInput.prop("required", false);
submitSetBisButton.hide();
pieceRow.show(); pieceRow.show();
pieceTypeRow.show(); pieceTypeRow.show();
pieceInput.prop("required", true);
pieceTypeInput.prop("required", true);
submitAddBisButton.show(); submitAddBisButton.show();
} }
function hidePiecePart() { function hidePiecePart() {
disableSubmitBisButton();
bisLinkRow.show(); bisLinkRow.show();
submitUpdateBisButton.show(); linkInput.prop("required", true);
submitSetBisButton.show();
pieceRow.hide(); pieceRow.hide();
pieceTypeRow.hide(); pieceTypeRow.hide();
pieceInput.prop("required", false);
pieceTypeInput.prop("required", false);
submitAddBisButton.hide(); submitAddBisButton.hide();
} }
@ -269,7 +269,6 @@
return option; return option;
}); });
playerInput.empty().append(options); playerInput.empty().append(options);
disableSubmitBisButton();
}, },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
@ -327,6 +326,18 @@
success: function (_) { reload(); }, success: function (_) { reload(); },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
updateBisDialog.modal("hide");
return true; // action expects boolean result
}
function updateBis() {
if (updateBisButton.is(":checked")) {
return setBis();
}
if (addPieceButton.is(":checked")) {
return addPiece();
}
return false; // should not happen
} }
$(function () { $(function () {
@ -344,6 +355,7 @@
table.bootstrapTable({}); table.bootstrapTable({});
reload(); reload();
reset();
}); });
</script> </script>

22
src/main/resources/html/loot.html
View File

@ -88,35 +88,35 @@
<div id="add-loot-dialog" tabindex="-1" role="dialog" class="modal fade"> <div id="add-loot-dialog" tabindex="-1" role="dialog" class="modal fade">
<div class="modal-dialog modal-lg" role="document"> <div class="modal-dialog modal-lg" role="document">
<div class="modal-content"> <form class="modal-content" action="javascript:" onsubmit="addLoot()">
<div class="modal-header"> <div class="modal-header">
<h4 class="modal-title">add looted piece</h4> <h4 class="modal-title">add looted piece</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button>
</div> </div>
<form class="modal-body"> <div class="modal-body">
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="player">player</label> <label class="col-sm-4 col-form-label" for="player">player</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="player" name="player" class="form-control" title="player"></select> <select id="player" name="player" class="form-control" title="player" required></select>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="piece">piece</label> <label class="col-sm-4 col-form-label" for="piece">piece</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="piece" name="piece" class="form-control" title="piece"></select> <select id="piece" name="piece" class="form-control" title="piece" required></select>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="piece-type">piece type</label> <label class="col-sm-4 col-form-label" for="piece-type">piece type</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="piece-type" name="pieceType" class="form-control" title="pieceType"></select> <select id="piece-type" name="pieceType" class="form-control" title="pieceType" required></select>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="job">job</label> <label class="col-sm-4 col-form-label" for="job">job</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="job" name="job" class="form-control" title="job"></select> <select id="job" name="job" class="form-control" title="job" required></select>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
@ -141,14 +141,14 @@
</tr> </tr>
</thead> </thead>
</table> </table>
</form> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button> <button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button>
<button type="button" class="btn btn-secondary" onclick="suggestLoot()">suggest</button> <button type="button" class="btn btn-secondary" onclick="suggestLoot()">suggest</button>
<button id="submit-btn" type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="addLoot()" disabled>add</button> <button type="submit" class="btn btn-primary">add</button>
</div> </div>
</div> </form>
</div> </div>
</div> </div>
@ -189,7 +189,6 @@
const addButton = $("#add-btn"); const addButton = $("#add-btn");
const removeButton = $("#remove-btn"); const removeButton = $("#remove-btn");
const submitLootButton = $("#submit-btn");
const addLootDialog = $("#add-loot-dialog"); const addLootDialog = $("#add-loot-dialog");
const freeLootInput = $("#free-loot"); const freeLootInput = $("#free-loot");
@ -221,6 +220,8 @@
success: function (_) { reload(); }, success: function (_) { reload(); },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
addLootDialog.modal("hide");
return true; // action expects boolean result
} }
function hideControls() { function hideControls() {
@ -260,7 +261,6 @@
return option; return option;
}); });
playerInput.empty().append(options); playerInput.empty().append(options);
submitLootButton.attr("disabled", options.length === 0);
}, },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });

21
src/main/resources/html/party.html
View File

@ -84,23 +84,23 @@
<div id="add-player-dialog" tabindex="-1" role="dialog" class="modal fade"> <div id="add-player-dialog" tabindex="-1" role="dialog" class="modal fade">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <form class="modal-content" action="javascript:" onsubmit="addPlayer()">
<div class="modal-header"> <div class="modal-header">
<h4 class="modal-title">add new player</h4> <h4 class="modal-title">add new player</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button>
</div> </div>
<form class="modal-body"> <div class="modal-body">
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="nick">player name</label> <label class="col-sm-4 col-form-label" for="nick">player name</label>
<div class="col-sm-8"> <div class="col-sm-8">
<input id="nick" name="nick" class="form-control" placeholder="nick" onkeyup="disableAddPlayerForm()"> <input id="nick" name="nick" class="form-control" placeholder="nick" required>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="job">player job</label> <label class="col-sm-4 col-form-label" for="job">player job</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="job" name="job" class="form-control" title="job"></select> <select id="job" name="job" class="form-control" title="job" required></select>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
@ -115,13 +115,13 @@
<input id="priority" name="priority" type="number" class="form-control" value="0"> <input id="priority" name="priority" type="number" class="form-control" value="0">
</div> </div>
</div> </div>
</form> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button> <button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button>
<button id="submit-player-btn" type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="addPlayer()" disabled>add</button> <button type="submit" class="btn btn-primary">add</button>
</div> </div>
</div> </form>
</div> </div>
</div> </div>
@ -162,7 +162,6 @@
const removeButton = $("#remove-btn"); const removeButton = $("#remove-btn");
const addPlayerDialog = $("#add-player-dialog"); const addPlayerDialog = $("#add-player-dialog");
const submitPlayerButton = $("#submit-player-btn");
const jobInput = $("#job"); const jobInput = $("#job");
const linkInput = $("#link"); const linkInput = $("#link");
@ -187,6 +186,8 @@
success: function (_) { reload(); }, success: function (_) { reload(); },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
addPlayerDialog.modal("hide");
return true; // action expects boolean result
} }
function bisLinkFormatter(link, row) { function bisLinkFormatter(link, row) {
@ -197,10 +198,6 @@
} }
} }
function disableAddPlayerForm() {
submitPlayerButton.attr("disabled", !nickInput.val());
}
function hideControls() { function hideControls() {
addButton.attr("hidden", isReadOnly); addButton.attr("hidden", isReadOnly);
removeButton.attr("hidden", isReadOnly); removeButton.attr("hidden", isReadOnly);

23
src/main/resources/html/users.html
View File

@ -84,38 +84,38 @@
<div id="add-user-dialog" tabindex="-1" role="dialog" class="modal fade"> <div id="add-user-dialog" tabindex="-1" role="dialog" class="modal fade">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <form class="modal-content" action="javascript:" onsubmit="addUser()">
<div class="modal-header"> <div class="modal-header">
<h4 class="modal-title">add new user</h4> <h4 class="modal-title">add new user</h4>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="close"></button>
</div> </div>
<form class="modal-body"> <div class="modal-body">
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="username">login</label> <label class="col-sm-4 col-form-label" for="username">login</label>
<div class="col-sm-8"> <div class="col-sm-8">
<input id="username" name="username" class="form-control" placeholder="username" onkeyup="disableAddUserForm()"> <input id="username" name="username" class="form-control" placeholder="username" required>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="password">password</label> <label class="col-sm-4 col-form-label" for="password">password</label>
<div class="col-sm-8"> <div class="col-sm-8">
<input id="password" name="password" type="password" class="form-control" placeholder="password" onkeyup="disableAddUserForm()"> <input id="password" name="password" type="password" class="form-control" placeholder="password" required>
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label" for="permission">permission</label> <label class="col-sm-4 col-form-label" for="permission">permission</label>
<div class="col-sm-8"> <div class="col-sm-8">
<select id="permission" name="permission" class="form-control" title="permission"></select> <select id="permission" name="permission" class="form-control" title="permission" required></select>
</div> </div>
</div> </div>
</form> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button> <button type="button" class="btn btn-danger" data-bs-dismiss="modal">close</button>
<button id="submit-btn" type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="addUser()" disabled>add</button> <button type="submit" class="btn btn-primary">add</button>
</div> </div>
</div> </form>
</div> </div>
</div> </div>
@ -156,7 +156,6 @@
const removeButton = $("#remove-btn"); const removeButton = $("#remove-btn");
const addUserDialog = $("#add-user-dialog"); const addUserDialog = $("#add-user-dialog");
const submitUserButton = $("#submit-btn");
const usernameInput = $("#username"); const usernameInput = $("#username");
const passwordInput = $("#password"); const passwordInput = $("#password");
@ -176,10 +175,8 @@
success: function (_) { reload(); }, success: function (_) { reload(); },
error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); }, error: function (jqXHR, _, errorThrown) { requestAlert(jqXHR, errorThrown); },
}); });
} addUserDialog.modal("hide");
return true; // action expects boolean result
function disableAddUserForm() {
submitUserButton.attr("disabled", !(usernameInput.val() && passwordInput.val()));
} }
function hideControls() { function hideControls() {

2
src/main/resources/static/load.js
View File

@ -37,7 +37,7 @@ function loadTypes(url, selector) {
} }
function setupFormClear(dialog, reset) { function setupFormClear(dialog, reset) {
dialog.on("shown.bs.modal", function () { dialog.on("hide.bs.modal", function () {
$(this).find("form").trigger("reset"); $(this).find("form").trigger("reset");
$(this).find("table").bootstrapTable("removeAll"); $(this).find("table").bootstrapTable("removeAll");
if (reset) { if (reset) {