kennethreitz/kjvstudy.org
1
0
Fork 0
mirror of https://github.com/kennethreitz/kjvstudy.org.git synced 2026-06-05 23:00:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add Listen/Stop toggle to all resource page audio buttons

Browse Source 
Updated all Listen buttons across resource pages to toggle between
Listen and Stop states when audio is playing. The button changes its
icon and text to indicate current state, and clicking Stop halts the
text-to-speech playback.

Templates updated:
- biblical_prophets.html
- fruits_of_spirit.html
- names_of_god.html
- parables.html
- resource_detail.html
- resource_index.html
- story_kids.html
- topic_detail.html
- twelve_apostles.html
- women_of_the_bible.html

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Kenneth Reitz
2025-12-06 14:56:14 -05:00
parent c3867fc4cb
commit b9aa030a35
10 changed files with 90 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
kjvstudy_org/templates/biblical_prophets.html
+9
View File
@@ -295,14 +295,23 @@ document.body.dataset.resourceReader = 'true';
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .prophet-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/fruits_of_spirit.html
+9
View File
@@ -295,14 +295,23 @@ document.body.dataset.resourceReader = 'true';
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .fruit-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/names_of_god.html
+9
View File
@@ -291,14 +291,23 @@
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .name-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/parables.html
+9
View File
@@ -309,14 +309,23 @@ document.body.dataset.resourceReader = 'true';
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .parable-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/resource_detail.html
+9
View File
@@ -198,14 +198,23 @@ document.body.dataset.resourceReader = 'true';
(function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.resource-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/resource_index.html
+9
View File
@@ -318,14 +318,23 @@ document.body.dataset.resourceReader = 'true';
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .resource-item-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/story_kids.html
+9
View File
@@ -388,14 +388,23 @@ hr.story-divider::before {
(function() {
// Listen button handler
var listenBtn = document.getElementById('story-listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('article section p');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/topic_detail.html
+9
View File
@@ -233,14 +233,23 @@
(function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.topic-overview, .intro-text, .subtopic-description, .verse-note');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/twelve_apostles.html
+9
View File
@@ -297,14 +297,23 @@
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .apostle-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}
kjvstudy_org/templates/women_of_the_bible.html
+9
View File
@@ -291,14 +291,23 @@ document.body.dataset.resourceReader = 'true';
document.addEventListener('DOMContentLoaded', function() {
// Listen button handler
var listenBtn = document.getElementById('listen-btn');
var isListening = false;
if (listenBtn) {
listenBtn.addEventListener('click', function() {
if (isListening) {
if (window.KJVSpeech) window.KJVSpeech.stop();
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg> Listen';
isListening = false;
return;
}
var paragraphs = document.querySelectorAll('.intro-text, .woman-description p, .verse-text');
var text = Array.from(paragraphs).map(function(p) {
return p.textContent.trim();
}).join(' ');
if (window.KJVSpeech && text) {
window.KJVSpeech.speak(text);
listenBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" /></svg> Stop';
isListening = true;
}
});
}