mirror of
https://github.com/magicbug/Cloudlog
synced 2026-08-13 17:49:35 -04:00
Introduce an HTMX-powered results component and refactor Timeplotter flow: add component_timeplot_results controller action that supplies band/dxcc/cqzone defaults and renders a new timeplotter/component_results view. Revamp the index view to use Bootstrap cards, a filter form wired to HTMX (hx-post/hx-target/hx-trigger) and a results container that auto-loads on page load. Refactor assets/js/sections/timeplot.js: separate loading state, implement timeplotRender/timeplot helper functions, improve AJAX error handling, and add renderTimeplotFromComponent + htmx:afterSwap hook to initialize charts when the component is swapped in. Also update getTimes controller to rely on the model to output JSON directly.
78 lines
No EOL
3.5 KiB
PHP
78 lines
No EOL
3.5 KiB
PHP
<div class="container">
|
|
<div class="d-flex align-items-center justify-content-between flex-wrap gap-2 mb-3">
|
|
<div>
|
|
<h1 class="mb-0"><?php echo $page_title; ?></h1>
|
|
<p class="text-muted mb-0">Analyze when your QSOs happen across the day by band, DXCC, and CQ zone.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card shadow-sm mb-4">
|
|
<div class="card-header py-3">
|
|
<h2 class="h5 mb-0">Filters</h2>
|
|
</div>
|
|
<div class="card-body">
|
|
<form id="timeplotterFiltersForm"
|
|
class="form"
|
|
hx-post="<?php echo site_url('timeplotter/component_timeplot_results'); ?>"
|
|
hx-target="#timeplotterResults"
|
|
hx-swap="innerHTML"
|
|
hx-trigger="change from:select, submit">
|
|
<div class="row g-3 align-items-end">
|
|
<div class="col-md-4">
|
|
<label class="form-label" for="band">Band</label>
|
|
<select id="band" name="band" class="form-select">
|
|
<option value="All">All</option>
|
|
<?php foreach ($worked_bands as $band) {
|
|
echo '<option value="' . $band . '">' . $band . '</option>' . "\n";
|
|
} ?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<label class="form-label" for="dxcc">DXCC</label>
|
|
<select id="dxcc" name="dxcc" class="form-select">
|
|
<option value="All">All</option>
|
|
<?php
|
|
if ($dxcc_list->num_rows() > 0) {
|
|
foreach ($dxcc_list->result() as $dxcc) {
|
|
echo '<option value="' . $dxcc->adif . '">' . ucwords(strtolower($dxcc->name)) . ' - ' . $dxcc->prefix;
|
|
if ($dxcc->end != null) {
|
|
echo ' (' . lang('gen_hamradio_deleted_dxcc') . ')';
|
|
}
|
|
echo '</option>';
|
|
}
|
|
}
|
|
?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<label class="form-label" for="cqzone">CQ Zone</label>
|
|
<select id="cqzone" name="cqzone" class="form-select">
|
|
<option value="All">All</option>
|
|
<?php
|
|
for ($i = 1; $i <= 40; $i++) {
|
|
echo '<option value="' . $i . '">' . $i . '</option>';
|
|
}
|
|
?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-md-12 d-flex justify-content-md-end gap-2">
|
|
<button id="timeplotShowButton" type="submit" class="btn btn-primary ld-ext-right">
|
|
Show
|
|
<div class="ld ld-ring ld-spin"></div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="timeplotterResults"
|
|
hx-post="<?php echo site_url('timeplotter/component_timeplot_results'); ?>"
|
|
hx-target="this"
|
|
hx-swap="innerHTML"
|
|
hx-include="#timeplotterFiltersForm"
|
|
hx-trigger="load"></div>
|
|
</div>
|