From 0b69837e457de9d7dd4b3e8bcd80af7e92304f89 Mon Sep 17 00:00:00 2001 From: Tim Fry Date: Fri, 22 Nov 2024 02:56:50 -0400 Subject: [PATCH] Initial commit Still TODO - Now has drag and drop but needs work - alignment of up/down arrows needs to be centered in the cell - action choice need to be reflected on the selection box - permissions missing (assumes superadmin) --- app/phrases/phrase_edit.php | 175 +++++++++++------- .../resources/javascript/phrase_edit.js | 103 +++++++++++ 2 files changed, 208 insertions(+), 70 deletions(-) create mode 100644 app/phrases/resources/javascript/phrase_edit.js diff --git a/app/phrases/phrase_edit.php b/app/phrases/phrase_edit.php index 050251f5ad..7a5e868a08 100644 --- a/app/phrases/phrase_edit.php +++ b/app/phrases/phrase_edit.php @@ -41,6 +41,11 @@ $language = new text; $text = $language->get(); +//ensure we have a database object + if (!($database instanceof database)) { + $database = database::new(); + } + //add the defaults $phrase_name = ''; $phrase_language = ''; @@ -162,8 +167,6 @@ //execute insert $p = new permissions; $p->add('phrase_detail_add', 'temp'); - - $database = new database; $database->app_name = 'phrases'; $database->app_uuid = '5c6f597c-9b78-11e4-89d3-123b93f75cba'; $database->save($array); @@ -226,8 +229,6 @@ //execute update/insert $p = new permissions; $p->add('phrase_detail_add', 'temp'); - - $database = new database; $database->app_name = 'phrases'; $database->app_uuid = '5c6f597c-9b78-11e4-89d3-123b93f75cba'; $database->save($array); @@ -276,7 +277,6 @@ $sql .= "and phrase_uuid = :phrase_uuid "; $parameters['domain_uuid'] = $domain_uuid; $parameters['phrase_uuid'] = $phrase_uuid; - $database = new database; $row = $database->select($sql, $parameters, 'row'); if (is_array($row) && @sizeof($row) != 0) { $phrase_name = $row["phrase_name"]; @@ -298,17 +298,15 @@ $sql .= "order by phrase_detail_order asc "; $parameters['domain_uuid'] = $_SESSION['domain_uuid']; $parameters['phrase_uuid'] = $phrase_uuid; - $database = new database; $phrase_details = $database->select($sql, $parameters, 'all'); unset($sql, $parameters); } //get the recording names from the database. - $sql = "select recording_name, recording_filename from v_recordings "; + $sql = "select recording_uuid, recording_name, recording_filename from v_recordings "; $sql .= "where domain_uuid = :domain_uuid "; $sql .= "order by recording_name asc "; $parameters['domain_uuid'] = $_SESSION['domain_uuid']; - $database = new database; $recordings = $database->select($sql, $parameters, 'all'); unset($sql, $parameters); @@ -321,8 +319,27 @@ if ($action == 'update') { $document['title'] = $text['title-edit_phrase']; } require_once "resources/header.php"; +//javascript constants for use in the selection option group + echo "\n"; + //js to control action form input - echo "\n"; + +/* old section + echo " \n"; - +//*/ //show the content echo "
\n"; @@ -495,55 +510,66 @@ echo ""; echo "".$text['label-structure'].""; echo ""; - echo " \n"; + //structure table + echo "
\n"; + //headings + echo " \n"; echo " \n"; - echo " \n"; + echo " \n"; echo " \n"; - echo " \n"; - if (!empty($phrase_details)) { - echo " \n"; - } + echo " \n"; +/* +// echo " \n"; +// if (!empty($phrase_details)) { +// echo " \n"; +// } +//*/ echo " \n"; - if (!empty($phrase_details)) { - foreach($phrase_details as $x => $field) { - //clean up output for display - if ($field['phrase_detail_function'] == 'play-file' && substr($field['phrase_detail_data'], 0, 21) == '${lua streamfile.lua ') { - $phrase_detail_function = $text['label-play']; - $phrase_detail_data = str_replace('${lua streamfile.lua ', '', $field['phrase_detail_data']); - $phrase_detail_data = str_replace('}', '', $phrase_detail_data); - } - else if ($field['phrase_detail_function'] == 'execute' && substr($field['phrase_detail_data'], 0, 6) == 'sleep(') { - $phrase_detail_function = $text['label-pause']; - $phrase_detail_data = str_replace('sleep(', '', $field['phrase_detail_data']); - $phrase_detail_data = str_replace(')', '', $phrase_detail_data); - $phrase_detail_data = ($phrase_detail_data / 1000).'s'; // seconds - } - else if ($field['phrase_detail_function'] == 'play-file') { - $phrase_detail_function = $text['label-play']; - $phrase_detail_data = str_replace($_SESSION['switch']['recordings']['dir'].'/'.$_SESSION['domain_name'].'/', '', $field['phrase_detail_data']); - } - else { - $phrase_detail_function = $field['phrase_detail_function']; - $phrase_detail_data = $field['phrase_detail_data']; - } - echo "\n"; - echo " \n"; - echo " \n"; - echo " \n"; - echo " \n"; - echo "\n"; - } - } - unset($phrase_details, $field); - echo "\n"; + echo " \n"; + echo "\n"; +/* +// if (!empty($phrase_details)) { +// foreach($phrase_details as $x => $field) { +// //clean up output for display +// if ($field['phrase_detail_function'] == 'play-file' && substr($field['phrase_detail_data'], 0, 21) == '${lua streamfile.lua ') { +// $phrase_detail_function = $text['label-play']; +// $phrase_detail_data = str_replace('${lua streamfile.lua ', '', $field['phrase_detail_data']); +// $phrase_detail_data = str_replace('}', '', $phrase_detail_data); +// } +// else if ($field['phrase_detail_function'] == 'execute' && substr($field['phrase_detail_data'], 0, 6) == 'sleep(') { +// $phrase_detail_function = $text['label-pause']; +// $phrase_detail_data = str_replace('sleep(', '', $field['phrase_detail_data']); +// $phrase_detail_data = str_replace(')', '', $phrase_detail_data); +// $phrase_detail_data = ($phrase_detail_data / 1000).'s'; // seconds +// } +// else if ($field['phrase_detail_function'] == 'play-file') { +// $phrase_detail_function = $text['label-play']; +// $phrase_detail_data = str_replace($_SESSION['switch']['recordings']['dir'].'/'.$_SESSION['domain_name'].'/', '', $field['phrase_detail_data']); +// } +// else { +// $phrase_detail_function = $field['phrase_detail_function']; +// $phrase_detail_data = $field['phrase_detail_data']; +// } +// echo "\n"; +// echo " \n"; +// echo " \n"; +// echo " \n"; +// echo " \n"; +// echo "\n"; +// } +// } +// unset($phrase_details, $field); +//*/ + echo "\n"; + echo " "; echo " \n"; - echo " \n"; - echo " \n"; - +/* +// echo " \n"; +// */ echo " \n"; + echo ""; + echo ""; + echo ""; + echo ""; + echo ""; + echo ""; + echo ""; + echo "\n"; echo "
".$text['label-function']."" . ($text['label-order'] ?? 'Order') . "".$text['label-action']."".$text['label-order']."\n"; - echo " ".$text['label-delete']."\n"; - echo " \n"; - echo " ".($text['label-recording'] ?? 'Recording')."".$text['label-order']."\n"; +// echo " ".$text['label-delete']."\n"; +// echo " \n"; +// echo "
".escape($phrase_detail_function)." ".escape($phrase_detail_data)." ".$field['phrase_detail_order']." "; - if (is_uuid($field['phrase_detail_uuid'])) { - echo " \n"; - echo " \n"; - } - echo "
".escape($phrase_detail_function)." ".escape($phrase_detail_data)." ".$field['phrase_detail_order']." "; +// if (is_uuid($field['phrase_detail_uuid'])) { +// echo " \n"; +// echo " \n"; +// } +// echo "
 
\n"; echo " \n"; - echo " \n"; - echo " \n"; - echo button::create(['type'=>'submit','label'=>$text['button-add'],'icon'=>$_SESSION['theme']['button_icon_add']]); - echo " \n"; +// echo " \n"; +// echo "
 
"; + echo button::create(['type'=>'button','icon'=>$_SESSION['theme']['button_icon_add'], 'onclick' => 'add_row()']); + echo button::create(['type'=>'button','icon'=>'fa-solid fa-minus', 'onclick' => 'remove_row()']); + echo "
 
\n"; echo " ".$text['description-structure']."\n"; diff --git a/app/phrases/resources/javascript/phrase_edit.js b/app/phrases/resources/javascript/phrase_edit.js new file mode 100644 index 0000000000..f1d92fcfab --- /dev/null +++ b/app/phrases/resources/javascript/phrase_edit.js @@ -0,0 +1,103 @@ +document.addEventListener("DOMContentLoaded", function () { + // Initialize the select options + const select = document.getElementById('phrase_detail_data'); + const grp_rec = document.createElement('optgroup'); + const grp_snd = document.createElement('optgroup'); + + // Add a blank entry + select.appendChild(new Option('', '')); + + // Add recordings + grp_rec.label = 'Recordings'; + for (let i = 0; i < window.phrase_recordings.length; i++) { + grp_rec.appendChild(new Option(' ' + window.phrase_recordings[i].recording_name, window.phrase_recordings[i].recording_uuid)); + } + select.appendChild(grp_rec); + + // Add sounds + grp_snd.label = 'Sounds'; + for (let i = 0; i < window.phrase_sounds.length; i++) { + grp_snd.appendChild(new Option(' ' + window.phrase_sounds[i], i)); + } + select.appendChild(grp_snd); + + // Initialize draggable rows + add_draggable_rows(); +}); + +// Add draggable functionality to rows +function add_draggable_rows() { + const tableBody = document.getElementById('structure'); + let draggedRow = null; + + tableBody.querySelectorAll('tr').forEach((row) => { + // Make rows draggable + row.setAttribute('draggable', 'true'); + + // When dragging starts + row.addEventListener('dragstart', (e) => { + draggedRow = row; + e.dataTransfer.effectAllowed = 'move'; + e.dataTransfer.setData('text/plain', row.rowIndex); + + // Highlight the dragged row + row.style.backgroundColor = '#d1e7fd'; // Light blue color + row.style.opacity = '0.8'; // Slightly transparent for visual feedback + }); + + // When dragging ends + row.addEventListener('dragend', () => { + draggedRow = null; + + // Clear the background color + row.style.backgroundColor = ''; + row.style.opacity = '1'; // Reset opacity + }); + + // Allow drop (prevent default behavior) + row.addEventListener('dragover', (e) => { + e.preventDefault(); + }); + + // Handle drop + row.addEventListener('drop', (e) => { + e.preventDefault(); + + if (draggedRow && draggedRow !== row) { + // Insert the dragged row before the row it is dropped onto + tableBody.insertBefore(draggedRow, row.nextSibling || row); + } + }); + + // Optional: Highlight drop target + row.addEventListener('dragenter', () => { + row.style.backgroundColor = '#f0f0f0'; // Light gray for drop target + }); + + row.addEventListener('dragleave', () => { + row.style.backgroundColor = ''; // Clear drop target highlight + }); + }); +} + + +// Add a new row to the table +function add_row() { + const tbody = document.getElementById('structure'); + const newRow = document.getElementById('recordings_row').cloneNode(true); + newRow.id = `row_${tbody.childElementCount}`; + newRow.name = `recordings[${tbody.childElementCount}]`; + + tbody.appendChild(newRow); + + // Reinitialize draggable functionality + add_draggable_rows(); +} + +// Remove the last row in the table +function remove_row() { + const tbody = document.getElementById('structure'); + if (tbody && tbody.rows.length > 1) { + tbody.lastElementChild.remove(); + } +}