hash/d2tools
1
0
Fork 0
mirror of https://gitlab.com/hashborgir/d2tools.git synced 2024-12-02 13:36:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

better UI

Browse Source
This commit is contained in:
Hash Borgir 2023-06-13 12:58:28 -06:00
parent 6eadbcfebb
commit 5a8bac8e87
1 changed files with 72 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
TblEditorGUI.php
View File

@ -57,21 +57,29 @@ foreach (glob($tbl . "*.tbl") as $filename) {
<div class="container"> <div class="container">
<h2>Select .tbl File</h2> <h2>Select .tbl File</h2>
<select name="tableName" id="tableName" class="form-control"> <select name="tableName" id="tableName" class="form-control">
<option value="" selected></option>
<?php foreach ($tableNames as $tableName): ?> <?php foreach ($tableNames as $tableName): ?>
<option value="<?php echo $tableName; ?>" <?php echo ($tableName == "patchstring") ? "selected" : ""; ?>><?php echo $tableName; ?></option> <option value="<?php echo $tableName; ?>" <?php echo ($tableName == "") ? "selected" : ""; ?>><?php echo $tableName; ?></option>
<?php endforeach; ?> <?php endforeach; ?>
</select> </select>
<h2>Table</h2> <h2>Table</h2>
<div class="form-group"> <div>
Add new String <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseForm" aria-expanded="false" aria-controls="collapseForm">
<label for="inputKey">Key</label> Add new String Key
<input type="text" class="form-control" id="inputKey" placeholder="Enter Key"> </button>
<div class="collapse" id="collapseForm">
<div class="form-group">
<label for="inputKey">Key</label>
<input type="text" class="form-control" id="inputKey" placeholder="Enter Key">
</div>
<div class="form-group">
<label for="inputString">String</label>
<textarea class="form-control" id="inputString" placeholder="Enter String"></textarea>
</div>
<button type="button" class="btn btn-primary" id="addLink">Add</button>
</div>
</div> </div>
<div class="form-group">
<label for="inputString">String</label>
<textarea class="form-control" id="inputString" placeholder="Enter String"></textarea>
</div>
<button type="button" class="btn btn-primary" id="addLink">Add</button>
<br> <br>
<hr> <hr>
@ -97,26 +105,37 @@ foreach (glob($tbl . "*.tbl") as $filename) {
<script> <script>
function resizeTextarea() {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
}
$(document).ready(function () { $(document).ready(function () {
// Get the initial selected table // Get the initial selected table
var selectedTable = $('#tableName').val(); // var selectedTable = $('#tableName').val();
//
// // Send GET request to TblEditor.php?getTable with selected table name
// var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable});
//
// request.done(function (response) {
// // Handle the response here
// $('.tablediv tbody').html(response).promise().done(function () {
// // Callback function after HTML content is loaded
//
// // Initialize DataTables on the table
// $('.table').DataTable();
// });
// });
// Send GET request to TblEditor.php?getTable with selected table name // Function to resize textarea based on content
var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable}); function resizeTextarea() {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
}
request.done(function (response) { // Select element change event handler
// Handle the response here
$('.tablediv tbody').html(response).promise().done(function () {
// Callback function after HTML content is loaded
// Initialize DataTables on the table
$('.table').DataTable();
});
});
// Select element change event handler
$('#tableName').change(function () { $('#tableName').change(function () {
$('.table').DataTable().destroy(); $('.table').DataTable().destroy();
$('.table tbody').html('');
var selectedTable = $(this).val(); var selectedTable = $(this).val();
@ -130,12 +149,27 @@ foreach (glob($tbl . "*.tbl") as $filename) {
// Initialize DataTables on the table // Initialize DataTables on the table
$('.table').DataTable(); $('.table').DataTable();
// Resize textareas on page load
$('textarea').each(resizeTextarea);
// Resize textareas on input
$('textarea').on('input', resizeTextarea);
// Resize textareas on custom select change
$('.custom-select').change(function () {
$('textarea').each(resizeTextarea);
});
$('.page-link').click(function () {
$('textarea').each(resizeTextarea);
});
}); });
}); });
}); });
// Delete link click event handler // Delete link click event handler
$(document).on('click', '.delete-link', function (event) { $(document).on('click', '.delete-link', function (event) {
event.preventDefault(); event.preventDefault();
@ -225,24 +259,28 @@ foreach (glob($tbl . "*.tbl") as $filename) {
$(document).ready(function () { $(document).ready(function () {
// Iterate over each div with the form-control class $('textarea').each(function () {
$('.form-control').each(function () { this.style.height = 'auto';
// Get the text content of the div this.style.height = (this.scrollHeight) + 'px';
var text = $(this).val();
// Set the height of the div to fit the text content
$(this).height('auto'); // Reset the height to auto
var contentHeight = $(this).prop('scrollHeight');
$(this).height(contentHeight);
}); });
setInterval(function () {
$('textarea').each(resizeTextarea);
}, 4000);
}); });
</script> </script>
<style> <style>
div.dataTables_wrapper div.dataTables_length select { div.dataTables_wrapper div.dataTables_length select {
width: 75px !important; width: 75px !important;
} }
textarea {
overflow: hidden;
resize: none;
scrollbar-width: none; /* For Firefox */
-ms-overflow-style: none; /* For Internet Explorer and Edge */
}
</style> </style>
</body> </body>
</html> </html>