d2tools/TblEditorGUI_TAB.php

309 lines
11 KiB
PHP
Raw Normal View History

<?php
session_start();
ob_start();
require_once './config.php';
require_once './_pdo.php';
require_once './src/D2Functions.php';
require_once './src/D2Crud.php';
error_reporting(E_ERROR | E_PARSE);
set_time_limit(-1);
ini_set('max_input_time', '-1');
ini_set('max_execution_time', '0');
define('DB_FILE', $_SESSION['modname'] . ".db");
try {
PDO_Connect("sqlite:" . DB_FILE);
} catch (Exception $e) {
echo "Connection error: " . $e->getMessage();
}
$tbl = $_SESSION['tbl'];
$tableNames = [];
foreach (glob($tbl . "*.tbl") as $filename) {
$tableInfo = pathinfo($filename);
$tableNames[] = $tableInfo['filename'];
}
?>
2023-06-25 19:22:17 +00:00
<body>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- CSS -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.4/css/jquery.dataTables.min.css">
2023-06-25 19:22:17 +00:00
<!-- JS -->
<!-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
2023-06-25 19:22:17 +00:00
<script src="https://cdn.datatables.net/1.11.4/js/jquery.dataTables.min.js"></script>
<!-- Bootstrap CSS (if not already included) -->
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">-->
2023-06-25 19:22:17 +00:00
<!-- Bootstrap DataTables CSS -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.11.4/css/dataTables.bootstrap4.min.css">
2023-06-25 19:22:17 +00:00
<!-- Bootstrap JS (if not already included) -->
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>-->
2023-06-25 19:22:17 +00:00
<!-- Bootstrap DataTables JS -->
<script src="https://cdn.datatables.net/1.11.4/js/dataTables.bootstrap4.min.js"></script>
<div style="padding:10px; border: 1px solid #eee;">
<div class="container">
<div class="row">
<div class="col-md-6">
<select name="tableName" id="tableName" class="form-control">
<option value="" disabled selected></option>
<?php foreach ($tableNames as $tableName): ?>
<option value="<?php echo $tableName; ?>" <?php echo ($tableName == "") ? "selected" : ""; ?>><?php echo $tableName; ?></option>
<?php endforeach; ?>
</select>
</div>
2023-06-25 19:22:17 +00:00
<div class="col-md-6">
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseForm" aria-expanded="false" aria-controls="collapseForm">
Add new String Key
</button>
</div>
</div>
2023-06-25 19:22:17 +00:00
<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>
2023-06-25 19:22:17 +00:00
</div>
2023-06-25 19:22:17 +00:00
<br>
<hr>
<div class="tablediv">
<table class="table">
<thead>
<tr>
<th style="width: 64px;">ID</th>
<th style='width: 20%;'>Key</th>
<th>String</th>
<th style="width: 100px;"></th>
</tr>
</thead>
<tbody>
<!-- Additional rows -->
</tbody>
</table>
</div>
<div id="loading-spinner" style="display: none; text-align:center;">
<img src="img/loading.gif" alt="Loading...">
</div>
2023-06-25 19:22:17 +00:00
</div>
<script>
function resizeTextarea() {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
}
function showLoadingSpinner() {
$('#loading-spinner').show();
}
// Hide the loading spinner
function hideLoadingSpinner() {
$('#loading-spinner').hide();
}
$(document).ready(function () {
// Function to resize textarea based on content
function resizeTextarea() {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
}
2023-06-25 19:22:17 +00:00
// Select element change event handler
$('#tableName').change(function () {
$('.table').DataTable().destroy();
$('.table tbody').html('');
showLoadingSpinner();
var selectedTable = $(this).val();
if (selectedTable !== '') {
2023-06-25 19:22:17 +00:00
// Send GET request to TblEditor.php?getTable with selected table name
var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable});
2023-06-25 19:22:17 +00:00
request.done(function (response) {
hideLoadingSpinner();
// Handle the response here
$('.tablediv tbody').html(response).promise().done(function () {
// Callback function after HTML content is loaded
2023-06-25 19:22:17 +00:00
// Initialize DataTables on the table
$('.table').DataTable();
2023-06-25 19:22:17 +00:00
// Resize textareas on page load
$('textarea').each(resizeTextarea);
2023-06-25 19:22:17 +00:00
// Resize textareas on input
$('textarea').on('input', resizeTextarea);
2023-06-25 19:22:17 +00:00
// Resize textareas on custom select change
$('.custom-select').change(function () {
$('textarea').each(resizeTextarea);
});
$('.page-link').click(function () {
$('textarea').each(resizeTextarea);
});
});
2023-06-25 19:22:17 +00:00
});
}
});
2023-06-25 19:22:17 +00:00
// Delete link click event handler
$(document).on('click', '.delete-link', function (event) {
event.preventDefault();
2023-06-25 19:22:17 +00:00
var selectedTable = $('select[name="tableName"]').val();
2023-06-25 19:22:17 +00:00
// Get the rowid from the custom attribute data-rowid
var rowid = $(this).data('rowid');
2023-06-25 19:22:17 +00:00
// Remove the deleted row from the table
$('.row-' + rowid).remove();
2023-06-25 19:22:17 +00:00
var key = $(this).parent().parent().parent().find('input').val();
2023-06-25 19:22:17 +00:00
// Send GET request to TblEditor.php?cmd=delete&rowid={rowid}
$.get('TblEditor.php?key=' + key + '&', {cmd: 'delete', tableName: selectedTable, rowid: rowid}, function (response) {
// Handle the response here
2023-06-25 19:22:17 +00:00
// Wait until the response is loaded, then remove the row
$(response).ready(function () {
// Update DataTable
});
});
2023-06-25 19:22:17 +00:00
});
2023-06-25 19:22:17 +00:00
// Update link click event handler
$(document).on('click', '.update-link', function (event) {
event.preventDefault();
2023-06-23 00:42:49 +00:00
2023-06-25 19:22:17 +00:00
var selectedTable = $('select[name="tableName"]').val();
2023-06-25 19:22:17 +00:00
// Get the rowid from the custom attribute data-rowid
var rowid = $(this).data('rowid');
2023-06-25 19:22:17 +00:00
// Get the updated values from the corresponding input and textarea
var key = $('.row-' + rowid + ' input').val();
var string = $('.row-' + rowid + ' textarea').val();
string = string.replace(/&#13;/g, '\\n');
string = string.replace(/\n/g, '\\n');
2023-06-25 19:22:17 +00:00
// Send POST request to TblEditor.php with the updated values
$.post('TblEditor.php', {cmd: 'update', tableName: selectedTable, rowid: rowid, key: key, string: string}, function (response) {
// Handle the response here
2023-06-25 19:22:17 +00:00
// Optional: Update any UI elements if needed
2023-06-23 00:42:49 +00:00
});
2023-06-25 19:22:17 +00:00
});
2023-06-25 19:22:17 +00:00
// Add link click event handler
$('#addLink').click(function () {
var selectedTable = $('#tableName').val();
var key = $('#inputKey').val();
var string = $('#inputString').val();
2023-06-23 00:42:49 +00:00
2023-06-25 19:22:17 +00:00
// Send POST request to TblEditor.php with parameters
$.post('TblEditor.php', {cmd: 'add', tableName: selectedTable, Key: key, String: string}, function (response) {
// Handle the response here
});
2023-06-23 00:42:49 +00:00
2023-06-25 19:22:17 +00:00
$('.table').DataTable().destroy();
$('.table tbody').html('');--
// Send GET request to TblEditor.php?getTable with selected table name
var request = $.get('TblEditor.php', {cmd: 'getTable', tableName: selectedTable});
2023-06-23 00:42:49 +00:00
2023-06-25 19:22:17 +00:00
request.done(function (response) {
hideLoadingSpinner();
// Handle the response here
$('.tablediv tbody').html(response).promise().done(function () {
// Callback function after HTML content is loaded
2023-06-23 00:42:49 +00:00
// Initialize DataTables on the table
2023-06-25 19:22:17 +00:00
$('.table').DataTable();
2023-06-23 00:42:49 +00:00
var table = $('.table').DataTable();
2023-06-25 19:22:17 +00:00
table.page( 'last' ).draw( 'page' );
// Resize textareas on page load
$('textarea').each(resizeTextarea);
2023-06-23 00:42:49 +00:00
2023-06-25 19:22:17 +00:00
// 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);
});
2023-06-23 00:42:49 +00:00
});
});
2023-06-25 19:22:17 +00:00
});
2023-06-25 19:22:17 +00:00
});
2023-06-25 19:22:17 +00:00
$(document).ready(function () {
$('textarea').each(function () {
this.style.height = 'auto';
this.style.height = (this.scrollHeight) + 'px';
});
setInterval(function () {
$('textarea').each(resizeTextarea);
}, 4000);
});
</script>
<style>
body {
background: #f8f8f8;
margin: 10px;
border: 1px solid #eee;
border-radius: 5px;
}
div.dataTables_wrapper div.dataTables_length select {
width: 75px !important;
}
textarea {
overflow: hidden;
resize: none;
scrollbar-width: none; /* For Firefox */
-ms-overflow-style: none; /* For Internet Explorer and Edge */
}
#loading-spinner {
}
</style>
</body>
</html>