pguzman/Rosary
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Beads are now a property of prayer steps, not separate steps

Browse Source 
Each prayer in the library has an optional default_bead_type (small/large/
crucifix). Standard prayers get sensible defaults: Our Father=large,
Hail Mary=small, Sign of Cross=crucifix, Divine Mercy beads accordingly.

In the sequence, each step card shows a bead selector (—/○/●/✝) so users
can override the default per step. Adding a prayer pre-fills its default.

Bead library icon hints (○●✝) appear on prayer cards in the library.
Modal now includes a Bead selector for creating/editing prayers.

Remove the separate Bead Markers library section — beads live on prayers.
build_slides: prayer steps with bead_type now get a real bead_index so
the ring advances correctly during presentation.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Philip Guzman III
2026-05-13 22:07:48 -07:00
parent 76a5061fba
commit 8c047f5b28
7 changed files with 228 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/builder.php
+14 -32
View File
@@ -49,7 +49,8 @@ if (isset($_GET['id'])) {
// ── Load prayer library ───────────────────────────────────────────────────────
$lib_stmt = $pdo->prepare("
SELECT cp.id, cp.name, cp.leader_text, cp.all_text, cp.is_global, cp.created_by,
SELECT cp.id, cp.name, cp.leader_text, cp.all_text,
cp.default_bead_type, cp.is_global, cp.created_by,
IF(cp.is_global=1 AND u.role='superadmin','standard',
IF(cp.is_global=1,'global','mine')) AS source_tag
FROM custom_prayers cp
@@ -168,37 +169,6 @@ $page_title = $session ? 'Edit: ' . htmlspecialchars($session['name']) : 'Rosary
<button class="tab-btn" data-tab="mine">My Prayers</button>
</div>
</div>
<!-- Bead markers — always visible, not filtered by search/tab -->
<div class="bead-markers-section">
<div class="bead-markers-label">Bead Markers</div>
<div class="bead-marker-cards">
<button class="bead-marker-card" onclick="builderAddBead('small')">
<span class="bead-icon-sm">&#x25CB;</span>
<span class="bead-card-text">
<strong>Small Bead</strong>
<small>Hail Mary</small>
</span>
<span class="bead-add-label">+ Add</span>
</button>
<button class="bead-marker-card" onclick="builderAddBead('large')">
<span class="bead-icon-lg">&#x25CF;</span>
<span class="bead-card-text">
<strong>Large Bead</strong>
<small>Our Father</small>
</span>
<span class="bead-add-label">+ Add</span>
</button>
<button class="bead-marker-card" onclick="builderAddBead('crucifix')">
<span class="bead-icon-cx">&#x271D;</span>
<span class="bead-card-text">
<strong>Crucifix</strong>
<small>Cross bead</small>
</span>
<span class="bead-add-label">+ Add</span>
</button>
</div>
</div>
<div id="prayer-list">
<div class="library-empty" style="grid-column:1/-1;padding:40px;text-align:center;color:var(--muted)">
Loading…
@@ -248,6 +218,18 @@ $page_title = $session ? 'Edit: ' . htmlspecialchars($session['name']) : 'Rosary
</div>
</div>
<div class="form-group">
<label>Bead (optional)</label>
<div class="bead-btn-row" id="modal-bead-row">
<button type="button" class="bead-sel-btn active" data-bead="">No bead</button>
<button type="button" class="bead-sel-btn" data-bead="small">&#x25CB; Small</button>
<button type="button" class="bead-sel-btn" data-bead="large">&#x25CF; Large</button>
<button type="button" class="bead-sel-btn" data-bead="crucifix">&#x271D; Crucifix</button>
</div>
<input type="hidden" id="modal-bead-type" value="">
<p class="help-hint">Sets the default bead when this prayer is added to a sequence.</p>
</div>
<div class="form-group" id="modal-leader-group">
<label for="modal-leader">Leader text</label>
<textarea id="modal-leader" class="modal-textarea" rows="5"
api/builder_session.php
+4 -1
View File
@@ -62,8 +62,10 @@ foreach ($steps as $i => $step) {
} else {
$pid = (int)($step['prayer_id'] ?? 0);
$att = $step['attribution'] ?? 'leader_all';
$bt = $step['bead_type'] ?? null;
if (!$pid) json_err("Step " . ($i + 1) . " is missing a prayer");
if (!in_array($att, $valid_attributions)) json_err("Invalid attribution on step " . ($i + 1));
if ($bt !== null && !in_array($bt, $valid_bead_types)) json_err("Invalid bead type on step " . ($i + 1));
$prayer_ids[] = $pid;
}
}
@@ -131,7 +133,8 @@ try {
if ($type === 'bead') {
$step_stmt->execute([$session_id, 'bead', $step['bead_type'], $order, null, 'none']);
} else {
$step_stmt->execute([$session_id, 'prayer', null, $order, (int)$step['prayer_id'], $step['attribution']]);
$bt = in_array($step['bead_type'] ?? null, ['small','large','crucifix']) ? $step['bead_type'] : null;
$step_stmt->execute([$session_id, 'prayer', $bt, $order, (int)$step['prayer_id'], $step['attribution']]);
}
}
api/prayers_api.php
+15 -8
View File
@@ -61,7 +61,7 @@ if ($method === 'GET') {
$sql = "
SELECT cp.id, cp.name, cp.leader_text, cp.all_text,
cp.is_global, cp.created_by,
cp.default_bead_type, cp.is_global, cp.created_by,
u.role AS creator_role,
IF(cp.is_global=1 AND u.role='superadmin', 'standard',
IF(cp.is_global=1, 'global', 'mine')) AS source_tag
@@ -87,18 +87,21 @@ if ($method === 'POST') {
$leader = trim($body['leader_text'] ?? '');
$all = trim($body['all_text'] ?? '');
$global = $is_admin ? (int)!empty($body['is_global']) : 0;
$bead_type = in_array($body['default_bead_type'] ?? '', ['small','large','crucifix'])
? $body['default_bead_type'] : null;
if ($name === '') json_err('Prayer name is required');
$st = $pdo->prepare(
"INSERT INTO custom_prayers (name, leader_text, all_text, is_global, created_by)
VALUES (?, ?, ?, ?, ?)"
"INSERT INTO custom_prayers (name, leader_text, all_text, default_bead_type, is_global, created_by)
VALUES (?, ?, ?, ?, ?, ?)"
);
$st->execute([$name, $leader, $all, $global, $uid]);
$st->execute([$name, $leader, $all, $bead_type, $global, $uid]);
$new_id = (int)$pdo->lastInsertId();
$row = $pdo->prepare("
SELECT cp.id, cp.name, cp.leader_text, cp.all_text, cp.is_global, cp.created_by,
SELECT cp.id, cp.name, cp.leader_text, cp.all_text,
cp.default_bead_type, cp.is_global, cp.created_by,
u.role AS creator_role,
IF(cp.is_global=1 AND u.role='superadmin', 'standard',
IF(cp.is_global=1, 'global', 'mine')) AS source_tag
@@ -130,16 +133,20 @@ if ($method === 'PUT') {
$leader = trim($body['leader_text'] ?? $prayer['leader_text']);
$all = trim($body['all_text'] ?? $prayer['all_text']);
$global = $is_admin ? (int)!empty($body['is_global']) : (int)$prayer['is_global'];
$bead_type = array_key_exists('default_bead_type', $body)
? (in_array($body['default_bead_type'], ['small','large','crucifix']) ? $body['default_bead_type'] : null)
: $prayer['default_bead_type'];
if ($name === '') json_err('Prayer name is required');
$pdo->prepare(
"UPDATE custom_prayers SET name=?, leader_text=?, all_text=?, is_global=?, updated_at=NOW()
"UPDATE custom_prayers SET name=?, leader_text=?, all_text=?, default_bead_type=?, is_global=?, updated_at=NOW()
WHERE id=?"
)->execute([$name, $leader, $all, $global, $id]);
)->execute([$name, $leader, $all, $bead_type, $global, $id]);
$row = $pdo->prepare("
SELECT cp.id, cp.name, cp.leader_text, cp.all_text, cp.is_global, cp.created_by,
SELECT cp.id, cp.name, cp.leader_text, cp.all_text,
cp.default_bead_type, cp.is_global, cp.created_by,
u.role AS creator_role,
IF(cp.is_global=1 AND u.role='superadmin', 'standard',
IF(cp.is_global=1, 'global', 'mine')) AS source_tag
assets/css/builder.css
+59 -93
View File
@@ -259,8 +259,15 @@
.step-preview.leader { color: #2563eb; }
.step-preview.response { color: #059669; }
.step-attribution-select {
.step-controls-row {
display: flex;
align-items: center;
gap: 6px;
margin-top: 6px;
flex-wrap: wrap;
}
.step-attribution-select {
padding: 3px 6px;
font-size: 11px;
border: 1px solid var(--border);
@@ -269,7 +276,57 @@
color: var(--text);
font-family: var(--font);
cursor: pointer;
width: 100%;
flex: 1;
min-width: 120px;
}
/* ── Bead selector buttons (on step cards and modal) ─────────── */
.step-bead-btns {
display: flex;
gap: 3px;
flex-shrink: 0;
}
.bead-sel-btn {
padding: 3px 7px;
border: 1px solid var(--border);
border-radius: 4px;
background: var(--bg);
font-size: 12px;
cursor: pointer;
font-family: var(--font);
color: var(--muted);
line-height: 1.4;
transition: all 0.12s;
}
.bead-sel-btn:hover { border-color: var(--primary); color: var(--primary); }
.bead-sel-btn.active {
background: var(--primary);
border-color: var(--primary);
color: #fff;
font-weight: 600;
}
/* Modal bead row */
.bead-btn-row {
display: flex;
gap: 6px;
flex-wrap: wrap;
margin-top: 4px;
}
.bead-btn-row .bead-sel-btn {
padding: 5px 14px;
font-size: 13px;
}
/* Bead hint icon on library cards */
.prayer-bead-hint {
font-size: 12px;
color: var(--muted);
margin-left: 2px;
}
.step-actions {
@@ -439,97 +496,6 @@
margin-top: 2px;
}
/* ── Bead markers section ────────────────────────────────────── */
.bead-markers-section {
padding: 10px 16px 8px;
border-bottom: 1px solid var(--border);
background: var(--bg-card);
flex-shrink: 0;
}
.bead-markers-label {
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .06em;
color: var(--muted);
margin-bottom: 8px;
}
.bead-marker-cards {
display: flex;
gap: 8px;
}
.bead-marker-card {
flex: 1;
display: flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border: 1px solid var(--border);
border-radius: 8px;
background: var(--bg);
cursor: pointer;
font-family: var(--font);
font-size: 12px;
text-align: left;
transition: border-color .15s, background .15s;
}
.bead-marker-card:hover {
border-color: var(--primary);
background: #eff6ff;
}
.bead-icon-sm { font-size: 18px; color: #6b7280; flex-shrink: 0; line-height: 1; }
.bead-icon-lg { font-size: 20px; color: #374151; flex-shrink: 0; line-height: 1; }
.bead-icon-cx { font-size: 18px; color: var(--gold); flex-shrink: 0; line-height: 1; }
.bead-card-text {
display: flex;
flex-direction: column;
flex: 1;
min-width: 0;
}
.bead-card-text strong { font-size: 12px; font-weight: 600; color: var(--text); }
.bead-card-text small { font-size: 10px; color: var(--muted); }
.bead-add-label {
font-size: 11px;
color: var(--primary);
font-weight: 600;
flex-shrink: 0;
}
/* ── Bead step card (in sequence list) ───────────────────────── */
.step-card.bead-step {
background: #fefce8;
border-color: #fde68a;
}
.step-card.bead-step:hover {
border-color: #f59e0b;
}
.bead-step-name {
font-size: 13px;
font-weight: 600;
color: #92400e;
display: flex;
align-items: center;
gap: 6px;
}
.bead-step-sub {
font-size: 11px;
color: #b45309;
margin-top: 2px;
}
/* ── Library footer ──────────────────────────────────────────── */
.library-footer {
assets/js/builder.js
+42 -6
View File
@@ -27,7 +27,7 @@
STEPS.push({ step_type: 'bead', bead_type: s.bead_type });
} else {
const prayer = PRAYERS.find(p => String(p.id) === String(s.prayer_id));
if (prayer) STEPS.push({ step_type: 'prayer', prayer_id: s.prayer_id, attribution: s.attribution, _prayer: prayer });
if (prayer) STEPS.push({ step_type: 'prayer', prayer_id: s.prayer_id, attribution: s.attribution, bead_type: s.bead_type || null, _prayer: prayer });
}
});
}
@@ -81,6 +81,15 @@
radio.addEventListener('change', updateModalFields);
});
// Modal bead selector buttons
document.querySelectorAll('#modal-bead-row .bead-sel-btn').forEach(function (btn) {
btn.addEventListener('click', function () {
document.querySelectorAll('#modal-bead-row .bead-sel-btn').forEach(b => b.classList.remove('active'));
this.classList.add('active');
document.getElementById('modal-bead-type').value = this.dataset.bead;
});
});
// Modal save
document.getElementById('modal-save').addEventListener('click', saveModalPrayer);
@@ -112,15 +121,18 @@
return;
}
const beadIcon = { small: '○', large: '●', crucifix: '✝' };
list.innerHTML = visible.map(function (p) {
const preview = (p.leader_text || p.all_text || '').replace(/\n/g, ' ').substring(0, 100);
const badgeClass = p.source_tag === 'standard' ? 'standard' : (p.source_tag === 'global' ? 'global' : 'mine');
const badgeLabel = p.source_tag === 'standard' ? 'Standard' : (p.source_tag === 'global' ? 'Global' : 'Mine');
const canEdit = p.source_tag === 'mine' || window.IS_ADMIN;
const beadHint = p.default_bead_type ? `<span class="prayer-bead-hint" title="${p.default_bead_type} bead">${beadIcon[p.default_bead_type]}</span>` : '';
return `<div class="prayer-card">
<div class="prayer-card-top">
<span class="prayer-card-name">${esc(p.name)}</span>
<span class="prayer-card-name">${esc(p.name)} ${beadHint}</span>
<span class="source-badge ${badgeClass}">${badgeLabel}</span>
</div>
<div class="prayer-card-preview">${esc(preview)}${preview.length >= 100 ? '…' : ''}</div>
@@ -177,18 +189,27 @@
const leaderPrev = (p.leader_text || '').replace(/\n/g, ' ').substring(0, 60);
const allPrev = (p.all_text || '').replace(/\n/g, ' ').substring(0, 60);
const bead = step.bead_type || '';
return `<div class="step-card">
<div class="step-num">${i + 1}</div>
<div class="step-body">
<div class="step-name">${esc(p.name)}</div>
${leaderPrev ? `<div class="step-preview leader">Leader: ${esc(leaderPrev)}${leaderPrev.length >= 60 ? '…' : ''}</div>` : ''}
${allPrev ? `<div class="step-preview response">All: ${esc(allPrev)}${allPrev.length >= 60 ? '…' : ''}</div>` : ''}
<div class="step-controls-row">
<select class="step-attribution-select" onchange="builderSetAttribution(${i}, this.value)">
<option value="leader_all" ${step.attribution==='leader_all' ? 'selected':''}>Leader / All</option>
<option value="leader_only" ${step.attribution==='leader_only' ? 'selected':''}>Leader only</option>
<option value="all_only" ${step.attribution==='all_only' ? 'selected':''}>All together (unison)</option>
<option value="all_only" ${step.attribution==='all_only' ? 'selected':''}>All (unison)</option>
<option value="none" ${step.attribution==='none' ? 'selected':''}>No attribution</option>
</select>
<div class="step-bead-btns">
<button class="bead-sel-btn ${bead===''?'active':''}" onclick="builderSetBead(${i},null)" title="No bead">—</button>
<button class="bead-sel-btn ${bead==='small'?'active':''}" onclick="builderSetBead(${i},'small')" title="Small bead (Hail Mary)">○</button>
<button class="bead-sel-btn ${bead==='large'?'active':''}" onclick="builderSetBead(${i},'large')" title="Large bead (Our Father)">●</button>
<button class="bead-sel-btn ${bead==='crucifix'?'active':''}" onclick="builderSetBead(${i},'crucifix')" title="Crucifix">✝</button>
</div>
</div>
</div>
<div class="step-actions">${moveUp}${moveDn}${remove}</div>
</div>`;
@@ -220,7 +241,8 @@
else if (!prayer.all_text) attr = 'leader_only';
else if (!prayer.leader_text) attr = 'all_only';
STEPS.push({ step_type: 'prayer', prayer_id: prayerId, attribution: attr, _prayer: prayer });
const defaultBead = prayer.default_bead_type || null;
STEPS.push({ step_type: 'prayer', prayer_id: prayerId, attribution: attr, bead_type: defaultBead, _prayer: prayer });
renderSequence();
// Briefly highlight the new step
const list = document.getElementById('step-list');
@@ -249,6 +271,13 @@
if (STEPS[index]) STEPS[index].attribution = value;
};
window.builderSetBead = function (index, value) {
if (STEPS[index]) {
STEPS[index].bead_type = value;
renderSequence(); // re-render so active bead button updates
}
};
window.builderEditPrayer = function (prayerId) {
openModal(prayerId);
};
@@ -276,6 +305,12 @@
document.getElementById('modal-leader').value = p.leader_text || '';
document.getElementById('modal-all').value = p.all_text || '';
document.getElementById('modal-global').checked = !!p.is_global;
// Pre-fill bead type
const beadVal = p.default_bead_type || '';
document.getElementById('modal-bead-type').value = beadVal;
document.querySelectorAll('#modal-bead-row .bead-sel-btn').forEach(function (btn) {
btn.classList.toggle('active', btn.dataset.bead === beadVal);
});
// Determine existing attribution for radio pre-selection
const hasLeader = !!(p.leader_text || '').trim();
@@ -328,6 +363,7 @@
const leader = document.getElementById('modal-leader').value.trim();
const all = document.getElementById('modal-all').value.trim();
const global = document.getElementById('modal-global').checked ? 1 : 0;
const beadType = document.getElementById('modal-bead-type').value || null;
const attr = getSelectedAttr();
if (!name) {
@@ -350,7 +386,7 @@
fetch(url, {
method: method,
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name, leader_text: sendLeader, all_text: sendAll, is_global: global }),
body: JSON.stringify({ name, leader_text: sendLeader, all_text: sendAll, default_bead_type: beadType, is_global: global }),
})
.then(r => r.json())
.then(function (data) {
@@ -417,7 +453,7 @@
subject_dates: document.getElementById('subject-dates').value.trim(),
steps: STEPS.map(s => s.step_type === 'bead'
? { step_type: 'bead', bead_type: s.bead_type }
: { step_type: 'prayer', prayer_id: s.prayer_id, attribution: s.attribution }),
: { step_type: 'prayer', prayer_id: s.prayer_id, attribution: s.attribution, bead_type: s.bead_type || null }),
};
const btn = document.getElementById('btn-save');
includes/build_slides.php
+3 -2
View File
@@ -137,6 +137,7 @@ function build_slides(array $session): array {
$leader = ($step['leader_text'] ?: $step['all_text']) ?? '';
}
$bead_type = $step['bead_type'] ?? null;
$slides[] = [
'id' => 'custom_' . $i,
'type' => 'prayer',
@@ -144,8 +145,8 @@ function build_slides(array $session): array {
'title' => $step['name'],
'leader' => $leader,
'all' => $all,
'bead' => null,
'bead_index' => null,
'bead' => $bead_type,
'bead_index' => $bead_type ? $bead_idx++ : null,
];
}
migrate_v6.php
+74
View File
@@ -0,0 +1,74 @@
<?php
/**
* migrate_v6.php — Adds default_bead_type to custom_prayers.
* Updates standard seeded prayers with sensible bead defaults.
* Run once in browser, then delete.
*/
require_once __DIR__ . '/config/db.php';
$pdo = get_pdo();
$log = [];
function mig6_sql(PDO $pdo, string $label, string $sql, array &$log): void {
try {
$pdo->exec($sql);
$log[] = ['ok', $label];
} catch (PDOException $e) {
if (in_array($e->errorInfo[1], [1060, 1054], true)) {
$log[] = ['skip', $label . ' (already exists)'];
} else {
$log[] = ['err', $label . ': ' . $e->getMessage()];
}
}
}
mig6_sql($pdo, 'Add default_bead_type to custom_prayers', "
ALTER TABLE custom_prayers
ADD COLUMN default_bead_type ENUM('small','large','crucifix') NULL AFTER all_text
", $log);
// Set defaults for the seeded standard global prayers
$defaults = [
'Sign of the Cross' => 'crucifix',
'Our Father' => 'large',
'Hail Mary' => 'small',
'Eternal Father (Divine Mercy)' => 'large',
'For the Sake of His Sorrowful Passion' => 'small',
];
$updated = 0;
$st = $pdo->prepare(
"UPDATE custom_prayers SET default_bead_type = ? WHERE name = ? AND is_global = 1"
);
foreach ($defaults as $name => $bead) {
$st->execute([$bead, $name]);
if ($st->rowCount() > 0) $updated++;
}
$log[] = ['ok', "Updated default bead types for {$updated} standard prayers"];
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Migrate v6</title>
<style>
body { font-family: system-ui; max-width: 700px; margin: 40px auto; padding: 0 20px; }
.ok { color: #15803d; } .skip { color: #b45309; } .err { color: #dc2626; }
li { margin: 4px 0; font-size: 14px; }
.done { background: #f0fdf4; border: 1px solid #86efac; padding: 16px; border-radius: 8px; margin-top: 20px; }
</style>
</head>
<body>
<h2>Migrate v6 — Prayer Bead Defaults</h2>
<ul>
<?php foreach ($log as [$status, $msg]): ?>
<li class="<?= $status ?>">
<?= $status === 'ok' ? '&#x2713;' : ($status === 'skip' ? '&#x25CC;' : '&#x2717;') ?>
<?= htmlspecialchars($msg) ?>
</li>
<?php endforeach; ?>
</ul>
<?php if (!array_filter($log, fn($l) => $l[0] === 'err')): ?>
<div class="done"><strong>Migration complete.</strong> Delete this file: <code>migrate_v6.php</code></div>
<?php endif; ?>
</body>
</html>