{"id":5279,"date":"2025-06-26T07:09:53","date_gmt":"2025-06-26T07:09:53","guid":{"rendered":"https:\/\/warrior-instinct.com\/?page_id=5279"},"modified":"2025-07-09T05:53:53","modified_gmt":"2025-07-09T05:53:53","slug":"fitness-challenge-test","status":"publish","type":"page","link":"https:\/\/warrior-instinct.com\/de\/fitness-challenge-test\/","title":{"rendered":"Fitness challenge test"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"5279\" class=\"elementor elementor-5279\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7c597ac e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-equal-height-no e-con e-parent\" data-id=\"7c597ac\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b1d26c8 elementor-widget elementor-widget-heading\" data-id=\"b1d26c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Day 1<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aaafb26 elementor-widget elementor-widget-html\" data-id=\"aaafb26\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"workout-timer\">\r\n  <div class=\"progress-ring\">\r\n    <div class=\"circle\" id=\"timer-circle\">\r\n      <div class=\"timer-content\">\r\n        <div id=\"exercise-title\"><\/div>\r\n        <div id=\"timer-display\">00<\/div>\r\n        <h2 id=\"phase-label\">Tap to Start<\/h2>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n  body {\r\n    background: #000;\r\n    margin: 0;\r\n    font-family: sans-serif;\r\n  }\r\n\r\n  #workout-timer {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    margin: 40px auto;\r\n  }\r\n\r\n  .progress-ring {\r\n    width: 270px;\r\n    height: 270px;\r\n    border-radius: 50%;\r\n    background: conic-gradient(yellow 0%, transparent 0%);\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    transition: background 0.1s linear;\r\n  }\r\n\r\n  .circle {\r\n    width: 250px;\r\n    height: 250px;\r\n    border-radius: 50%;\r\n    background-color: #000;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    position: relative;\r\n    color: white;\r\n    cursor: pointer;\r\n    border: 3px solid transparent;\r\n    transition: border-color 0.4s ease, background-color 0.4s ease;\r\n    z-index: 1;\r\n  }\r\n\r\n  .circle::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    inset: 0;\r\n    border-radius: 50%;\r\n    border: 3px dotted yellow;\r\n    opacity: 1;\r\n    transition: opacity 0.5s ease;\r\n    pointer-events: none;\r\n    z-index: 2;\r\n  }\r\n\r\n  .circle.paused::before {\r\n    opacity: 0;\r\n  }\r\n\r\n  .circle.work {\r\n    background-color: #0a0; \/* green for work *\/\r\n  }\r\n\r\n  .circle.rest {\r\n    background-color: #a00; \/* red for rest *\/\r\n  }\r\n\r\n  .timer-content {\r\n    text-align: center;\r\n    color: #fff;\r\n    padding: 10px;\r\n  }\r\n\r\n  #exercise-title {\r\n    font-size: 16px;\r\n    font-weight: 600;\r\n    margin-bottom: 4px;\r\n  }\r\n\r\n  #timer-display {\r\n    font-size: 48px;\r\n    font-weight: bold;\r\n  }\r\n\r\n  #phase-label {\r\n    font-size: 16px;\r\n    margin-top: 4px;\r\n  }\r\n\r\n  @media (max-width: 480px) {\r\n    .progress-ring {\r\n      width: 220px;\r\n      height: 220px;\r\n    }\r\n\r\n    .circle {\r\n      width: 200px;\r\n      height: 200px;\r\n    }\r\n\r\n    #timer-display {\r\n      font-size: 36px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  const beepSound = new Audio('https:\/\/warrior-instinct.com\/wp-content\/uploads\/2025\/06\/beep.mp3');\r\n  const startSound = new Audio('https:\/\/warrior-instinct.com\/wp-content\/uploads\/2025\/06\/lets-go.mp3');\r\n  const workSound = new Audio('https:\/\/warrior-instinct.com\/wp-content\/uploads\/2025\/06\/Start.mp3');\r\n  const restSound = new Audio('https:\/\/warrior-instinct.com\/wp-content\/uploads\/2025\/06\/rest.mp3');\r\n\r\n  const timerCircle = document.getElementById('timer-circle');\r\n  const ring = document.querySelector('.progress-ring');\r\n  const exerciseTitle = document.getElementById('exercise-title');\r\n  const timerDisplay = document.getElementById('timer-display');\r\n  const phaseLabel = document.getElementById('phase-label');\r\n\r\n  let state = 'idle';\r\n  let isPaused = false;\r\n  let currentPhaseIndex = 0;\r\n  let timerInterval = null;\r\n  let precountdownInterval = null;\r\n  let phaseTimeRemaining = 10;\r\n  let currentPhaseDuration = 10;\r\n\r\n  const sequence = [\r\n    { title: \"Squat - Round 1\/3\", label: \"Work\", duration: 40, },\r\n    { title: \"Squat - Round 1\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Squat - Round 2\/3\", label: \"Work\", duration: 40, sound: workSound },\r\n    { title: \"Squat - Round 2\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Squat - Round 3\/3\", label: \"Work\", duration: 40, sound: workSound },\r\n    { title: \"Squat - Round 3\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Break\", label: \"Rest\", duration: 60, sound: restSound },\r\n    { title: \"Push Up - Round 1\/3\", label: \"Work\", duration: 40, sound: workSound },\r\n    { title: \"Push Up - Round 1\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Push Up - Round 2\/3\", label: \"Work\", duration: 40, sound: workSound },\r\n    { title: \"Push Up - Round 2\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Push Up - Round 3\/3\", label: \"Work\", duration: 40, sound: workSound },\r\n    { title: \"Push Up - Round 3\/3\", label: \"Rest\", duration: 20, sound: restSound },\r\n    { title: \"Break\", label: \"Rest\", duration: 60, sound: restSound },\r\n  ];\r\n\r\n  function updateDisplay(time) {\r\n    timerDisplay.textContent = String(time).padStart(2, '0');\r\n  }\r\n\r\n  function updatePhase(title, label) {\r\n    exerciseTitle.textContent = title;\r\n    phaseLabel.textContent = label;\r\n\r\n    timerCircle.classList.remove('work', 'rest');\r\n\r\n    if (label === \"Work\") {\r\n      timerCircle.classList.add('work');\r\n    } else if (label === \"Rest\") {\r\n      timerCircle.classList.add('rest');\r\n    }\r\n  }\r\n\r\n  function updateRingProgress() {\r\n    const percent = ((currentPhaseDuration - phaseTimeRemaining) \/ currentPhaseDuration) * 100;\r\n    ring.style.background = `conic-gradient(yellow ${percent}%, transparent ${percent}%)`;\r\n  }\r\n\r\n  function resetRing() {\r\n    ring.style.background = `conic-gradient(yellow 0%, transparent 0%)`;\r\n  }\r\n\r\n  function startPreCountdown() {\r\n    state = 'precountdown';\r\n    phaseTimeRemaining = 10;\r\n    currentPhaseDuration = 10;\r\n    updateDisplay(phaseTimeRemaining);\r\n    updatePhase(\"Get Ready\", \"\");\r\n    resetRing();\r\n\r\n    precountdownInterval = setInterval(() => {\r\n      phaseTimeRemaining--;\r\n      updateDisplay(phaseTimeRemaining);\r\n      updateRingProgress();\r\n      if (phaseTimeRemaining <= 3 && phaseTimeRemaining > 0) beepSound.play();\r\n      if (phaseTimeRemaining <= 0) {\r\n        clearInterval(precountdownInterval);\r\n        startSound.play();\r\n        startWorkout();\r\n      }\r\n    }, 1000);\r\n  }\r\n\r\n  function startWorkout() {\r\n    state = 'running';\r\n    isPaused = false;\r\n    currentPhaseIndex = 0;\r\n    runPhase();\r\n  }\r\n\r\n  function runPhase() {\r\n    if (currentPhaseIndex >= sequence.length) {\r\n      updatePhase(\"Workout Complete!\", \"\");\r\n      updateDisplay(\"\u2714\");\r\n      state = 'finished';\r\n      ring.style.background = `conic-gradient(lime 100%, transparent 0%)`;\r\n      timerCircle.classList.remove('work', 'rest');\r\n      timerCircle.style.backgroundColor = '#000';\r\n      return;\r\n    }\r\n\r\n    const phase = sequence[currentPhaseIndex];\r\n    if (phase.sound) phase.sound.play();\r\n\r\n    phaseTimeRemaining = phase.duration;\r\n    currentPhaseDuration = phase.duration;\r\n    updateDisplay(phaseTimeRemaining);\r\n    updatePhase(phase.title, phase.label);\r\n    resetRing();\r\n\r\n    timerInterval = setInterval(() => {\r\n      if (!isPaused) {\r\n        phaseTimeRemaining--;\r\n\r\n        if (phase.label === \"Rest\" && phaseTimeRemaining > 0 && phaseTimeRemaining <= 3) {\r\n          beepSound.play();\r\n        }\r\n\r\n        updateDisplay(phaseTimeRemaining);\r\n        updateRingProgress();\r\n\r\n        if (phaseTimeRemaining <= 0) {\r\n          clearInterval(timerInterval);\r\n          currentPhaseIndex++;\r\n          runPhase();\r\n        }\r\n      }\r\n    }, 1000);\r\n  }\r\n\r\n  function togglePause() {\r\n    if (state !== 'running') return;\r\n    isPaused = !isPaused;\r\n    phaseLabel.textContent = isPaused ? \"Tap to Resume\" : sequence[currentPhaseIndex].label;\r\n\r\n    if (isPaused) {\r\n      timerCircle.classList.add('paused');\r\n      timerCircle.style.borderColor = 'yellow';\r\n    } else {\r\n      timerCircle.classList.remove('paused');\r\n      timerCircle.style.borderColor = 'transparent';\r\n    }\r\n  }\r\n\r\n  function handleTap() {\r\n    if (state === 'idle') {\r\n      startPreCountdown();\r\n    } else if (state === 'running') {\r\n      togglePause();\r\n    }\r\n  }\r\n\r\n  timerCircle.addEventListener('click', handleTap);\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Day 1 00 Tap to Start<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-5279","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/pages\/5279","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/comments?post=5279"}],"version-history":[{"count":148,"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/pages\/5279\/revisions"}],"predecessor-version":[{"id":5440,"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/pages\/5279\/revisions\/5440"}],"wp:attachment":[{"href":"https:\/\/warrior-instinct.com\/de\/wp-json\/wp\/v2\/media?parent=5279"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}