{"id":12,"date":"2023-08-14T11:37:20","date_gmt":"2023-08-14T11:37:20","guid":{"rendered":"https:\/\/danieloliver.io\/?p=12"},"modified":"2023-08-17T09:31:29","modified_gmt":"2023-08-16T23:31:29","slug":"danieloliver-io","status":"publish","type":"post","link":"https:\/\/danieloliver.io\/?p=12","title":{"rendered":"notion &#8211; timer"},"content":{"rendered":"\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\" \/>\n<style>\n  .timer-gradient {\n    background: linear-gradient(to bottom right, \n      #C6F266 0%, #EBF20C 33%, #888C16 66%, #A68549 100%);\n    color: white;\n    text-shadow: 1.5px 1.5px 2px #888C16;\n  }\n.material-symbols-outlined {\n  font-variation-settings:\n  'FILL' 0,\n  'wght' 400,\n  'GRAD' 0,\n  'opsz' 48\n}\n.timer-fullscreen {\nposition: absolute;\ndisplay: flex;\njustify-content: center;\nalign-items: center;\ntop: 0;\nleft: 0;\nmargin-block-start: 0;\nwidth: 100vw;\nheight: 100vh;\n}\n#timer {\nfont-weight: 300;\n}\n<\/style>\n<div id=\"timercontainer\">\n<div class=\"wp-block has-text-align-right\"><span id=\"fullscreen\" class=\"material-symbols-outlined\" onclick=\"fullscreen()\">fullscreen<\/span><\/div>\n<h2 class=\"wp-block-heading has-text-align-center\" id=\"timer\">25:00<\/h2>\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-7 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" id=\"startStopButton\" onclick=\"startStopTimer()\">Start<\/a><\/div>\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" id=\"resetButton\" onclick=\"resetTimer()\" disabled>Reset<\/a><\/div>\n<\/div>\n<\/div>\n\n    <script>\n        let timerInterval;\n        let timerRunning = false;\n        let minutes = 25;\n        let seconds = 0;\n\n        function updateTimerDisplay() {\n            document.getElementById('timer').textContent = `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n        }\n\n        function startStopTimer() {\n            if (timerRunning) {\n                clearInterval(timerInterval);\n                timerRunning = false;\n                document.getElementById('startStopButton').textContent = 'Start';\n                document.getElementById('resetButton').disabled = false;\n            } else {\n                timerInterval = setInterval(updateTime, 1000);\n                timerRunning = true;\n                document.getElementById('startStopButton').textContent = 'Stop';\n                document.getElementById('resetButton').disabled = true;\n            }\n        }\n\n        function updateTime() {\n            if (minutes === 0 && seconds === 0) {\n                clearInterval(timerInterval);\n                timerRunning = false;\n                document.getElementById('startStopButton').textContent = 'Start';\n                document.getElementById('resetButton').disabled = false;\n            } else if (seconds === 0) {\n                minutes--;\n                seconds = 59;\n            } else {\n                seconds--;\n            }\n\n            updateTimerDisplay();\n        }\n\n        function resetTimer() {\n            clearInterval(timerInterval);\n            timerRunning = false;\n            minutes = 25;\n            seconds = 0;\n            updateTimerDisplay();\n            document.getElementById('startStopButton').textContent = 'Start';\n            document.getElementById('resetButton').disabled = false;\n        }\n\nfunction fullscreen() {\n    var fullscreenElement = document.getElementById('fullscreen');\n\n    if (fullscreenElement.textContent == 'fullscreen')\n{\nvar currentURL = new URL(window.location.href);\n    currentURL.searchParams.append('fullscreen', true);\n\n    window.history.pushState({}, '', currentURL.toString());\n\n    expandContainer();\n}\nelse\n{\n    var currentURL = new URL(window.location.href);\n    currentURL.searchParams.delete('fullscreen');\n\n    window.history.pushState({}, '', currentURL.toString());\n\n    expandContainer();\n}    \n}\n\nfunction expandContainer() {\n            const container = document.getElementById('timercontainer').parentNode;\n            const queryString = window.location.search;\n            const urlParams = new URLSearchParams(queryString);\n    var fullscreenElement = document.getElementById('fullscreen');\n\n            if (urlParams.has('fullscreen')) {\ncontainer.classList.add('timer-gradient');\ncontainer.classList.add('timer-fullscreen');\n                container.style.backgroundColor = getComputedStyle(document.body).backgroundColor;\ndocument.body.style.overflow = 'hidden';\nfullscreenElement.textContent = \"close_fullscreen\";\n            }\nelse\n{\ncontainer.classList.remove('timer-gradient');\ncontainer.classList.remove('timer-fullscreen');\ndocument.body.style.overflow = 'normal';\nfullscreenElement.textContent = \"fullscreen\";\n}\n}\n\n        window.addEventListener('resize', expandContainer);\n        window.addEventListener('load', expandContainer);\n    <\/script>\n","protected":false},"excerpt":{"rendered":"<p>fullscreen 25:00 Start Reset<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":true,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-12","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/posts\/12","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/danieloliver.io\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12"}],"version-history":[{"count":30,"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/posts\/12\/revisions"}],"predecessor-version":[{"id":59,"href":"https:\/\/danieloliver.io\/index.php?rest_route=\/wp\/v2\/posts\/12\/revisions\/59"}],"wp:attachment":[{"href":"https:\/\/danieloliver.io\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/danieloliver.io\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=12"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/danieloliver.io\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}