From 0113d2e9c9ff34a6ffb10707cc76d34b67a0c367 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Mon, 19 Jan 2026 16:29:41 +0000
Subject: [PATCH] =Refactored window.getTemplate into a full templating class window.jvbTemplates. Refactored CRUD.js, UploadManager.js, FormController.js, PopulateForm.js with that in mind
---
inc/helpers/ui.php | 56 +++++++++++++++++++++++++++++++++++---------------------
1 files changed, 35 insertions(+), 21 deletions(-)
diff --git a/inc/helpers/ui.php b/inc/helpers/ui.php
index bbd289a..5b0a616 100644
--- a/inc/helpers/ui.php
+++ b/inc/helpers/ui.php
@@ -17,7 +17,7 @@
}
?>
- <aside id="queue" class="left col start btw main" aria-expanded="false" hidden>
+ <aside id="queue" class="left col start btw main" aria-expanded="false" >
<div class="status-actions row start nowrap">
<div class="refresh row btw">
<span class="countdown row" title="Will refresh again...">5</span>
@@ -46,7 +46,8 @@
foreach($filters as $filter => $title) {
$active = ($i === 0) ? ' active': '';
?>
- <button class="filter<?=$active?>" data-filter="<?=$filter?>" data-count="0"><span class="count row"></span><?=$title?></button>
+ <input type="radio" id="qfilter-<?=$filter?>" name="qfilter" class="btn filter<?=$active?>" data-filter="<?=$filter?>">
+ <label for="qfilter-<?=$filter?>" data-count="0"><span class="count row"></span><?=$title?></label>
<?php
$i++;
}
@@ -61,7 +62,7 @@
<button class="retry-all">Retry Failed</button>
</div>
</aside>
- <button class="qtoggle row" title="Show Queue" aria-controls="queue" hidden>
+ <button class="qtoggle row" title="Show Queue" aria-controls="queue" >
<?= jvbIcon('floppy-disk') ?>
<span class="screen-reader-text"></span>
<span class="indicator"></span>
@@ -71,18 +72,22 @@
<div class="item">
<div class="header row btw">
<span class="type"></span>
- <span class="status row"><span class="screen-reader-text"></span></span>
+ <span class="status row"><?= jvbIcon('arrows-clockwise') ?><span class="screen-reader-text"></span></span>
</div>
- <?php jvbRenderProgressBar() ?>
+ <?php jvbRenderProgressBar('',false,false) ?>
<div class="info">
<div class="details"></div>
<div class="time row start">
<?= jvbIcon('clock') ?>
- <span class="started">Started: <span class="time"></span>
- <span class="completed"></span>
+ <span class="started">Started: <time></time></span>
+ <span class="completed" hidden><span>Completed: </span><time></time></span>
</div>
</div>
<div class="actions row end">
+ <button class="retry" data-action="retry"><span>Retry</span><?= jvbIcon('arrows-clockwise')?></button>
+ <button class="cancel" data-action="cancel"><span>Cancel</span><?= jvbIcon('x-square')?></button>
+ <button class="dismiss" data-action="dismiss"><span>Dismiss</span><?= jvbIcon('eye-closed')?></button>
+
</div>
</div>
</template>
@@ -205,19 +210,26 @@
* Outputs the search bar (likely don't need anymore)
* @return string
*/
-function jvbSearch(string $placeholder = 'Search...'):string
+function jvbSearch(string $placeholder = 'Search...', string $id = 'search'):string
{
- return '<div class="search-container row start nowrap">
- <input type="search" id="search" placeholder="'.$placeholder.'">
- <button
- title="Clear Search"
- type="button"
- class="clear-search"
- aria-label="Clear search"
- onclick="this.previousElementSibling.value = \'\'; this.previousElementSibling.focus();"
- >'.jvbIcon('x', ['title'=> 'Clear Search']).'</button>
- <button type="button" title="Search" class="toggle search" aria-label="Toggles search input visually" onclick="this.parentNode.classList.toggle(\'open\');this.previousElementSibling.previousElementSibling.focus();">'.jvbIcon('magnifying-glass').'</button>
-</div>';
+ $id = sanitize_title($id);
+ return sprintf(
+ '<div class="search-container row start nowrap">
+ <input type="search" id="%s" placeholder="%s">
+ <button
+ title="Clear Search"
+ type="button"
+ class="clear-search"
+ aria-label="Clear search"
+ onclick="this.previousElementSibling.value = \'\'; this.previousElementSibling.focus();"
+ >%s</button>
+ <button type="button" title="Search" class="toggle search" aria-label="Toggles search input visually" onclick="this.parentNode.classList.toggle(\'open\');this.previousElementSibling.previousElementSibling.focus();">%s</button>
+ </div>',
+ $id,
+ $placeholder,
+ jvbIcon('x', ['title'=> 'Clear Search']),
+ jvbIcon('magnifying-glass')
+ );
}
@@ -424,7 +436,7 @@
return $out;
}
-function jvbRenderProgressBar(string $inside ='', $top = false)
+function jvbRenderProgressBar(string $inside ='', $top = false, $icon = true)
{
$top = $top ? ' abs top' : '';
?>
@@ -433,7 +445,9 @@
<div class="fill"></div>
</div>
<div class="row btw">
- <i class="icon"></i>
+ <?php if ($icon) { ?>
+ <i class="icon"></i>
+ <?php } ?>
<div class="details">
<?=$inside?>
</div>
--
Gitblit v1.10.0