{"id":518,"date":"2026-10-10T23:23:58","date_gmt":"2026-10-10T23:23:58","guid":{"rendered":"https:\/\/imtproduction.wpenginepowered.com\/?page_id=518"},"modified":"2026-10-10T23:54:37","modified_gmt":"2026-10-10T23:54:37","slug":"518-2","status":"publish","type":"page","link":"https:\/\/insidemusicteaching.com\/","title":{"rendered":"Rhythm Bootcamp Audio"},"content":{"rendered":"\n<!-- Rhythm Bootcamp audio player \u2014 paste this whole file into a WordPress \"Custom HTML\" block.\n     Audio files are expected at \/wp-content\/uploads\/{level}_{slow|fast}_{target}.mp3\n     Deep links: add ?level=7 or #level-7 to the page address to open a given level. -->\n<div id=\"rb-audio\">\n<style>\n#rb-audio{--rb-red:#cf2a2f;--rb-ink:#231f20;--rb-muted:#6b6566;--rb-line:#e4dfdc;--rb-paper:#ffffff;\n  --rb-green:#e4f3cf;--rb-green-k:#7fb236;--rb-yellow:#f8f3a6;--rb-yellow-k:#c9b400;\n  --rb-blue:#d9f0f7;--rb-blue-k:#2a9fcf;--rb-pink:#fbd2b9;--rb-pink-k:#e9792f;\n  font-family:Georgia,\"Times New Roman\",serif;color:var(--rb-ink);max-width:880px;margin:0 auto;line-height:1.45}\n#rb-audio *{box-sizing:border-box}\n#rb-audio button{font:inherit;color:inherit;background:none;border:0;margin:0;padding:0;cursor:pointer;text-transform:none;letter-spacing:normal;box-shadow:none;border-radius:0;min-height:0;line-height:inherit}\n#rb-audio button:focus-visible{outline:3px solid var(--rb-blue-k);outline-offset:2px}\n#rb-audio .rb-sans{font-family:\"Helvetica Neue\",Arial,sans-serif}\n#rb-audio .rb-head h2{font-size:2rem;margin:0 0 .25rem;font-weight:normal;line-height:1.15}\n#rb-audio .rb-head h2 span{color:var(--rb-red)}\n#rb-audio .rb-head p{margin:0 0 1.5rem;color:var(--rb-muted);font-size:1.02rem}\n#rb-audio .rb-picker-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--rb-muted);margin:0 0 .5rem}\n#rb-audio .rb-levels{display:grid;grid-template-columns:repeat(16,1fr);gap:4px;margin:0 0 1.75rem}\n#rb-audio .rb-lv{height:36px;border:1px solid var(--rb-line);border-radius:6px;font-size:.9rem;font-weight:600;background:#faf8f7;transition:background .12s,border-color .12s}\n#rb-audio .rb-lv:hover{border-color:var(--rb-ink)}\n#rb-audio .rb-lv[aria-pressed=\"true\"]{background:var(--rb-red);border-color:var(--rb-red);color:#fff}\n#rb-audio .rb-banner{display:flex;align-items:stretch;margin:0 0 1.25rem;min-height:52px}\n#rb-audio .rb-tab{background:var(--rb-red);color:#fff;font-style:italic;font-weight:700;font-size:1.6rem;padding:.35rem 1.1rem;border-radius:8px 0 0 8px;display:flex;align-items:center;white-space:nowrap;transform:skewX(-6deg);margin-left:4px}\n#rb-audio .rb-tab span{transform:skewX(6deg)}\n#rb-audio .rb-bar{flex:1;background:var(--rb-ink);color:#fff;display:flex;align-items:center;padding:.4rem 1rem;border-radius:0 8px 8px 0;font-size:1.05rem;gap:.5rem;flex-wrap:wrap}\n#rb-audio .rb-bar b{font-weight:700}\n#rb-audio .rb-nav{display:flex;gap:.25rem;margin-left:auto}\n#rb-audio .rb-nav button{color:#fff;width:34px;height:34px;border-radius:50%;font-size:1.1rem;opacity:.85}\n#rb-audio .rb-nav button:hover{opacity:1;background:rgba(255,255,255,.12)}\n#rb-audio .rb-nav button:disabled{opacity:.25;cursor:default;background:none}\n#rb-audio .rb-group-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--rb-muted);margin:1.1rem 0 .45rem}\n#rb-audio .rb-row{display:grid;gap:10px}\n#rb-audio .rb-row.n4{grid-template-columns:repeat(4,1fr)}\n#rb-audio .rb-row.n3{grid-template-columns:repeat(3,1fr)}\n#rb-audio .rb-row.n1{grid-template-columns:1fr}\n#rb-audio .rb-card{border:1px solid var(--rb-line);border-radius:10px;overflow:hidden;background:var(--rb-paper);display:flex;flex-direction:column}\n#rb-audio .rb-swatch{display:flex;height:34px}\n#rb-audio .rb-swatch i{flex:1}\n#rb-audio .rb-name{padding:.5rem .7rem .2rem;font-size:.98rem}\n#rb-audio .rb-btns{display:flex;gap:6px;padding:.35rem .6rem .65rem}\n#rb-audio .rb-play{flex:1;display:flex;align-items:center;justify-content:center;gap:.4rem;height:38px;border:1px solid var(--rb-line);border-radius:7px;font-size:.88rem;position:relative;overflow:hidden;background:#faf8f7}\n#rb-audio .rb-play:hover{border-color:var(--rb-ink)}\n#rb-audio .rb-play .rb-ico{width:0;height:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}\n#rb-audio .rb-play.is-playing{background:var(--rb-ink);border-color:var(--rb-ink);color:#fff}\n#rb-audio .rb-play.is-playing .rb-ico{width:10px;height:12px;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor}\n#rb-audio .rb-play.is-loading{opacity:.7}\n#rb-audio .rb-play.is-error{border-color:var(--rb-red);color:var(--rb-red);background:#fff4f3}\n#rb-audio .rb-play .rb-prog{position:absolute;left:0;bottom:0;height:3px;background:var(--rb-red);width:0}\n#rb-audio .rb-play b{font-weight:600}\n#rb-audio .rb-note{margin:1.6rem 0 0;padding:1rem 1.1rem;background:#f4f1ef;border-radius:10px;font-size:.95rem;color:#3d3839}\n#rb-audio .rb-note p{margin:0 0 .4rem}\n#rb-audio .rb-note p:last-child{margin:0}\n#rb-audio{padding:0 16px}\n#rb-audio .rb-site{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:1.1rem 0 .9rem;border-bottom:1px solid var(--rb-line);margin:0 0 2.2rem;font-size:.85rem;color:var(--rb-muted)}\n#rb-audio .rb-site a{color:inherit;text-decoration:none}\n#rb-audio .rb-site a:hover{color:var(--rb-ink)}\n#rb-audio .rb-site .rb-domain{font-weight:600;color:var(--rb-ink);letter-spacing:.01em}\n#rb-audio .rb-site .rb-domain span{color:var(--rb-red)}\n#rb-audio .rb-masthead{margin:0 0 .6rem}\n#rb-audio .rb-masthead h1{margin:0;font-weight:normal;font-size:3.1rem;line-height:1;letter-spacing:-.01em;color:var(--rb-ink)}\n#rb-audio .rb-masthead h1 span{color:var(--rb-red)}\n#rb-audio .rb-masthead .rb-tag{margin:.45rem 0 0;font-size:1.15rem;color:var(--rb-ink)}\n#rb-audio .rb-masthead .rb-tag b{font-weight:700}\n#rb-audio .rb-foot{margin:3rem 0 0;padding:1.1rem 0 2rem;border-top:1px solid var(--rb-line);font-size:.82rem;color:var(--rb-muted);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}\n@media (max-width:720px){#rb-audio .rb-masthead h1{font-size:2.3rem}#rb-audio .rb-masthead .rb-tag{font-size:1rem}}\n@media (max-width:720px){\n  #rb-audio .rb-levels{grid-template-columns:repeat(8,1fr)}\n  #rb-audio .rb-row.n4{grid-template-columns:repeat(2,1fr)}\n  #rb-audio .rb-row.n3{grid-template-columns:1fr}\n  #rb-audio .rb-tab{font-size:1.3rem}\n  #rb-audio .rb-bar{font-size:.95rem}\n  #rb-audio .rb-head h2{font-size:1.6rem}\n}\n@media (max-width:380px){#rb-audio .rb-row.n4{grid-template-columns:1fr}}\n<\/style>\n\n<header class=\"rb-site rb-sans\">\n  <a class=\"rb-domain\" href=\"\/\">inside<span>music<\/span>teaching.com<\/a>\n  <span>Philip Johnston<\/span>\n<\/header>\n\n<div class=\"rb-masthead\">\n  <h1>Rhythm <span>Bootcamp<\/span><\/h1>\n  <p class=\"rb-tag\">Audio Files<\/p>\n<\/div>\n\n<div class=\"rb-head\">\n  <p>Choose your level, then the rhythm you&#8217;re working on. Every quest target has a slow and a fast recording&nbsp;&mdash; use them for the <em>In sync<\/em> quest, and for Twist&nbsp;2 (<em>Hear it. Write it.<\/em>).<\/p>\n<\/div>\n\n<p class=\"rb-picker-label rb-sans\">Level<\/p>\n<div class=\"rb-levels rb-sans\" role=\"group\" aria-label=\"Choose a level\"><\/div>\n\n<div class=\"rb-banner\">\n  <div class=\"rb-tab rb-sans\"><span>Level <span class=\"rb-num\">1<\/span><\/span><\/div>\n  <div class=\"rb-bar rb-sans\">\n    <span><b>New:<\/b> <span class=\"rb-new\"><\/span><\/span>\n    <span class=\"rb-nav\">\n      <button type=\"button\" class=\"rb-prev\" aria-label=\"Previous level\">&#8249;<\/button>\n      <button type=\"button\" class=\"rb-next\" aria-label=\"Next level\">&#8250;<\/button>\n    <\/span>\n  <\/div>\n<\/div>\n\n<div class=\"rb-targets rb-sans\" aria-live=\"polite\"><\/div>\n\n<!-- TWISTS 8\u201310 PLACEHOLDER\n     The book promises: Runaway Train metronomes (Twists 8 & 9) and reversed recordings (Twist 10).\n     Replace this comment with that content once it exists, or with a short note to readers. -->\n\n<!-- OTHER BOOKS PLACEHOLDER\n     Add resources promised by other books here, if any. -->\n\n<div class=\"rb-note\">\n  <p><strong>Slow<\/strong> recordings match the <em>Slow motion<\/em> quest; <strong>Fast<\/strong> recordings match <em>Riding the tiger<\/em>.<\/p>\n  <p>The combined targets (two lines, or all four) play the lines back-to-back as one longer rhythm, just like the wider boxes in your quest grid.<\/p>\n<\/div>\n\n<script>\n(function(){\n  var BASE = '\/wp-content\/uploads\/';\n  var TITLES = [\"Quarter notes, half notes, 2\/4 time\",\"Whole notes, 4\/4 time\",\"Dotted half notes, 3\/4 time\",\"Dotted half notes in 4\/4 time\",\"Whole measure rests\",\"Half note rests\",\"Quarter note rests\",\"Consecutive whole measure rests\",\"Basic syncopation\",\"Ties\",\"Ties in 4\/4 time\",\"Ties and rests in 3\/4 time\",\"Eighth notes\",\"Eighth notes in 3\/4 time\",\"Eighth notes in 4\/4 time\",\"3\/8 time, dotted quarter notes\",\"6\/8 time\",\"Dotted quarter notes in 2\/4 time\",\"Dotted quarter notes in 3\/4 time\",\"Dotted quarter notes in 4\/4 time\",\"Eighth note rests\",\"Eighth note rests in 3\/8 time\",\"Eighth note rests in 6\/8 time\",\"Eighth note rests in 3\/4 time\",\"Eighth note rests in 4\/4 time\",\"Tied eighth notes\",\"Tied eighth notes in 3\/8 time\",\"Tied eighth notes in 6\/8 time\",\"Tied eighth notes in 3\/4 time\",\"Tied eighth notes in 4\/4 time\",\"Chaotic rests\",\"Badly grouped notation (it happens!)\"];\n  var C = {green:'var(--rb-green)',yellow:'var(--rb-yellow)',blue:'var(--rb-blue)',pink:'var(--rb-pink)'};\n  var GROUPS = [\n    {label:'Single lines', cls:'n4', items:[['green','Green',['green']],['yellow','Yellow',['yellow']],['blue','Blue',['blue']],['pink','Pink',['pink']]]},\n    {label:'Two lines together', cls:'n3', items:[['greenyellow','Green + Yellow',['green','yellow']],['yellowblue','Yellow + Blue',['yellow','blue']],['bluepink','Blue + Pink',['blue','pink']]]},\n    {label:'The complete rhythm', cls:'n1', items:[['all','All four lines',['green','yellow','blue','pink']]]}\n  ];\n\n  var root = document.getElementById('rb-audio');\n  var levelsEl = root.querySelector('.rb-levels');\n  var targetsEl = root.querySelector('.rb-targets');\n  var audio = new Audio();\n  audio.preload = 'none';\n  var current = 1, activeBtn = null;\n\n  for (var i = 1; i <= 32; i++) {\n    var b = document.createElement('button');\n    b.type = 'button'; b.className = 'rb-lv'; b.textContent = i; b.setAttribute('data-level', i);\n    b.setAttribute('aria-label', 'Level ' + i);\n    levelsEl.appendChild(b);\n  }\n  levelsEl.addEventListener('click', function(e){\n    var t = e.target.closest('.rb-lv'); if (t) setLevel(+t.getAttribute('data-level'), true);\n  });\n  root.querySelector('.rb-prev').addEventListener('click', function(){ setLevel(current - 1, true); });\n  root.querySelector('.rb-next').addEventListener('click', function(){ setLevel(current + 1, true); });\n\n  function stop(){\n    audio.pause();\n    if (activeBtn) { activeBtn.classList.remove('is-playing','is-loading'); activeBtn.querySelector('.rb-prog').style.width = '0'; activeBtn.setAttribute('aria-pressed','false'); }\n    activeBtn = null;\n  }\n\n  function render(){\n    stop();\n    var h = '';\n    GROUPS.forEach(function(g){\n      h += '<p class=\"rb-group-label\">' + g.label + '<\/p><div class=\"rb-row ' + g.cls + '\">';\n      g.items.forEach(function(it){\n        h += '<div class=\"rb-card\"><div class=\"rb-swatch\" aria-hidden=\"true\">';\n        it[2].forEach(function(c){ h += '<i style=\"background:' + C[c] + '\"><\/i>'; });\n        h += '<\/div><div class=\"rb-name\">' + it[1] + '<\/div><div class=\"rb-btns\">';\n        ['slow','fast'].forEach(function(sp){\n          var file = current + '_' + sp + '_' + it[0] + '.mp3';\n          h += '<button type=\"button\" class=\"rb-play\" aria-pressed=\"false\" data-src=\"' + BASE + file + '\" aria-label=\"' + it[1] + ', ' + sp + ', level ' + current + '\">'\n             + '<span class=\"rb-ico\"><\/span><b>' + (sp === 'slow' ? 'Slow' : 'Fast') + '<\/b><span class=\"rb-prog\"><\/span><\/button>';\n        });\n        h += '<\/div><\/div>';\n      });\n      h += '<\/div>';\n    });\n    targetsEl.innerHTML = h;\n  }\n\n  targetsEl.addEventListener('click', function(e){\n    var btn = e.target.closest('.rb-play'); if (!btn) return;\n    if (btn === activeBtn) {\n      if (audio.paused) { audio.play(); btn.classList.add('is-playing'); btn.setAttribute('aria-pressed','true'); }\n      else { audio.pause(); btn.classList.remove('is-playing'); btn.setAttribute('aria-pressed','false'); }\n      return;\n    }\n    stop();\n    activeBtn = btn;\n    btn.classList.remove('is-error');\n    btn.classList.add('is-loading','is-playing'); btn.setAttribute('aria-pressed','true');\n    audio.src = btn.getAttribute('data-src');\n    var p = audio.play();\n    if (p && p.catch) p.catch(function(){});\n  });\n\n  audio.addEventListener('playing', function(){ if (activeBtn) activeBtn.classList.remove('is-loading'); });\n  audio.addEventListener('timeupdate', function(){\n    if (activeBtn && audio.duration) activeBtn.querySelector('.rb-prog').style.width = (100 * audio.currentTime \/ audio.duration) + '%';\n  });\n  audio.addEventListener('ended', stop);\n  audio.addEventListener('error', function(){\n    if (!activeBtn) return;\n    var b = activeBtn; stop();\n    b.classList.add('is-error'); b.querySelector('b').textContent = 'Unavailable';\n  });\n\n  function setLevel(n, push){\n    n = Math.max(1, Math.min(32, n | 0 || 1));\n    current = n;\n    root.querySelector('.rb-num').textContent = n;\n    root.querySelector('.rb-new').textContent = TITLES[n - 1];\n    levelsEl.querySelectorAll('.rb-lv').forEach(function(b){ b.setAttribute('aria-pressed', (+b.getAttribute('data-level') === n) ? 'true' : 'false'); });\n    root.querySelector('.rb-prev').disabled = n === 1;\n    root.querySelector('.rb-next').disabled = n === 32;\n    render();\n    if (push && history.replaceState) history.replaceState(null, '', location.pathname + '?level=' + n);\n  }\n\n  function fromUrl(){\n    var m = location.search.match(\/[?&]level=(\\d+)\/) || location.hash.match(\/level-?(\\d+)\/);\n    return m ? +m[1] : 1;\n  }\n  setLevel(fromUrl(), false);\n})();\n<\/script>\n\n<footer class=\"rb-foot rb-sans\">\n  <span>Audio companion to <em>Rhythm Bootcamp<\/em> by Philip Johnston<\/span>\n  <span>&copy; 2014&ndash;<span class=\"rb-year\">2026<\/span> Philip Johnston<\/span>\n<\/footer>\n<script>document.querySelector('#rb-audio .rb-year').textContent = new Date().getFullYear();<\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>insidemusicteaching.com Philip Johnston Rhythm Bootcamp Audio Files Choose your level, then the rhythm you&#8217;re working on. Every quest target has a slow and a fast recording&nbsp;&mdash; use them for the In sync quest, and for Twist&nbsp;2 (Hear it. Write it.). Level Level 1 New: &#8249; &#8250; Slow recordings match the Slow motion quest; Fast recordings [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"blank","meta":{"footnotes":""},"class_list":["post-518","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/pages\/518","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=518"}],"version-history":[{"count":5,"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/pages\/518\/revisions"}],"predecessor-version":[{"id":531,"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=\/wp\/v2\/pages\/518\/revisions\/531"}],"wp:attachment":[{"href":"https:\/\/insidemusicteaching.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=518"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}