Pomodoro Timer<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n background-color: #f4f4f4;\n margin: 0;\n }\n .container {\n text-align: center;\n background: #fff;\n padding: 40px;\n border-radius: 8px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n }\n h1 {\n font-size: 3rem;\n margin-bottom: 20px;\n }\n #timer {\n font-size: 2.5rem;\n margin-bottom: 20px;\n }\n .button-group {\n display: inline-block;\n padding: 10px;\n border: 2px solid #000;\n border-radius: 8px;\n margin-bottom: 20px;\n }\n button {\n padding: 10px 20px;\n font-size: 1rem;\n border: none;\n border-radius: 5px;\n margin: 5px;\n cursor: pointer;\n }\n button#start25 {\n background-color: #28a745;\n color: white;\n }\n button#start5 {\n background-color: #17a2b8;\n color: white;\n }\n button#start15 {\n background-color: #ffc107;\n color: white;\n }\n\t\tbutton#start3s {\n background-color: #050107;\n color: white;\n }\n button#pauseButton {\n background-color: #007bff;\n color: white;\n }\n button#resetButton {\n background-color: #dc3545;\n color: white;\n }\n button:disabled {\n background-color: #ccc;\n }\n .active {\n border: 3px solid #000;\n box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"container\">\n <h1>Pomodoro Timer<\/h1>\n <div id=\"timer\">25:00<\/div>\n \n \n <div class=\"button-group\">\n <button id=\"start25\">Start 25 min<\/button>\n <button id=\"start5\">Start 5 min<\/button>\n <button id=\"start15\">Start 15 min<\/button>\n\t\t<button id=\"start_input\">Start 120 min<\/button>\n\t\t<button id=\"start3s\">Start 3 sec<\/button>\n <\/div>\n \n <button id=\"pauseButton\" disabled>Pause<\/button>\n <button id=\"resetButton\" disabled>Reset<\/button>\n\n\t\t \n <audio id=\"alarmSound\" src=\"http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3\" controls loop><\/audio>\n<\/div>\n\n<script>\n class PomodoroTimer {\n constructor() {\n this.interval = null;\n this.timeLeft = 0; \/\/ \u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c (\u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445)\n this.isPaused = false; \/\/ \u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0430\u0443\u0437\u044b\n this.alarm = document.getElementById('alarmSound'); \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0430\u0443\u0434\u0438\u043e\u044d\u043b\u0435\u043c\u0435\u043d\u0442\n }\n\n startTimer(duration) {\n this.timeLeft = duration;\n\n this.interval = setInterval(() => {\n if (!this.isPaused) {\n const minutes = Math.floor(this.timeLeft \/ 60);\n const seconds = this.timeLeft % 60;\n document.getElementById('timer').textContent =\n `${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;\n\n if (this.timeLeft > 0) {\n this.timeLeft--;\n } else {\n clearInterval(this.interval);\n this.alarm.play(); \/\/ \u0412\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u043c \u043c\u0443\u0437\u044b\u043a\u0443 \u043f\u043e \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0438 \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n \/\/alert(\"Time's up!\"); \/\/ \u0412\u044b\u0432\u0435\u0441\u0442\u0438 \u043e\u043a\u043d\u043e \u0441 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\u043c, \u0447\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u0437\u0430\u043a\u043e\u043d\u0447\u0435\u043d\u043e.\n }\n }\n }, 1000);\n }\n\n start(workTime) {\n this.clear(); \/\/ \u0421\u0431\u0440\u043e\u0441 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n const duration = workTime * 60;\n this.startTimer(duration);\n }\n\n clear() {\n clearInterval(this.interval); \/\/ \u041e\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n }\n\n pause() {\n this.isPaused = !this.isPaused; \/\/ \u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043f\u0430\u0443\u0437\u044b\n document.getElementById('pauseButton').textContent = this.isPaused ? 'Resume' : 'Pause';\n }\n\n reset() {\n this.clear();\n document.getElementById('timer').textContent = '25:00';\n document.getElementById('resetButton').disabled = true;\n document.getElementById('pauseButton').disabled = true;\n document.querySelectorAll('button[id^=\"start\"]').forEach(btn => {\n btn.disabled = false;\n });\n this.isPaused = false; \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0430\u0443\u0437\u044b\n document.getElementById('pauseButton').textContent = 'Pause';\n clearActiveButton(); \/\/ \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0441 \u043a\u043d\u043e\u043f\u043e\u043a\n this.alarm.pause(); \/\/ \u041e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043c\u0443\u0437\u044b\u043a\u0443\n \/\/this.alarm.currentTime = 0; \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0432\u0440\u0435\u043c\u044f \u043c\u0443\u0437\u044b\u043a\u0438 \u043d\u0430 \u043d\u0430\u0447\u0430\u043b\u043e.\n }\n }\n\n const pomodoro = new PomodoroTimer();\n\n \/\/ \u041b\u043e\u0433\u0438\u043a\u0430 \u0434\u043b\u044f \u043a\u043d\u043e\u043f\u043e\u043a\n document.getElementById('start25').addEventListener('click', () => {\n pomodoro.start(25);\n toggleButtons();\n setActiveButton('start25');\n });\n\n document.getElementById('start5').addEventListener('click', () => {\n pomodoro.start(5); \/\/5 = \u043c\u0438\u043d\u0443\u0442. \u0414\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c 5, \u043d\u043e \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c 0.05 - \u044d\u0442\u043e 3 \u0441\u0435\u043a. \n toggleButtons();\n setActiveButton('start5');\n });\n\n document.getElementById('start15').addEventListener('click', () => {\n pomodoro.start(15);\n toggleButtons();\n setActiveButton('start15');\n });\n\n document.getElementById('start_input').addEventListener('click', () => {\n pomodoro.start(100); \/\/ 0.05 = 3s \u044d\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430.\n toggleButtons();\n setActiveButton('start_input'); \/\/\u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 - \u043e\u0431\u0440\u0430\u043c\u043b\u044f\u044f \u0435\u0435 \u0440\u0430\u043c\u043a\u043e\u0439.\n });\n\n document.getElementById('start3s').addEventListener('click', () => {\n pomodoro.start(0.05); \/\/ 0.05 = 3s \u044d\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430.\n toggleButtons();\n setActiveButton('start3s'); \/\/\u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 - \u043e\u0431\u0440\u0430\u043c\u043b\u044f\u044f \u0435\u0435 \u0440\u0430\u043c\u043a\u043e\u0439.\n });\n\n\n document.getElementById('pauseButton').addEventListener('click', () => {\n pomodoro.pause();\n setActiveButton('pauseButton'); \/\/ \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0436\u0430\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u043f\u0430\u0443\u0437\u044b\n });\n\n document.getElementById('resetButton').addEventListener('click', () => {\n pomodoro.reset();\n setActiveButton('resetButton'); \/\/ \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0436\u0430\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0441\u0431\u0440\u043e\u0441\u0430\n });\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0438 \u043a\u043d\u043e\u043f\u043e\u043a\n function toggleButtons() {\n document.getElementById('resetButton').disabled = false;\n document.getElementById('pauseButton').disabled = false;\n document.querySelectorAll('button[id^=\"start\"]').forEach(btn => {\n btn.disabled = true;\n });\n }\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0441\u0442\u0438\u043b\u044f \u043d\u0430 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u044e\u044e \u043d\u0430\u0436\u0430\u0442\u0443\u044e \u043a\u043d\u043e\u043f\u043a\u0443\n function setActiveButton(buttonId) {\n clearActiveButton(); \/\/ \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0441\u0442\u0438\u043b\u044c \u0441\u043e \u0432\u0441\u0435\u0445 \u043a\u043d\u043e\u043f\u043e\u043a\n document.getElementById(buttonId).classList.add('active'); \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043a\u043b\u0430\u0441\u0441 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u043a\u043d\u043e\u043f\u043a\u0435\n }\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0441\u0431\u0440\u043e\u0441\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0441\u0442\u0438\u043b\u044f\n function clearActiveButton() {\n document.querySelectorAll('button').forEach(btn => {\n btn.classList.remove('active');\n });\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n\n\n\n<p><a href=\"http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3\">http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3<\/a><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Pomodoro Timer Pomodoro Timer 25:00 Start 25 min Start 5 min Start 15 min Start 120 min Start 3 sec Pause Reset http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[138,7,5,6],"tags":[],"class_list":["post-6751","post","type-post","status-publish","format-standard","hentry","category-138","category-html","category-css","category-js"],"_links":{"self":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6751"}],"version-history":[{"count":5,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751\/revisions"}],"predecessor-version":[{"id":6758,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751\/revisions\/6758"}],"wp:attachment":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=6751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=6751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":6751,"date":"2024-11-07T20:04:45","date_gmt":"2024-11-07T17:04:45","guid":{"rendered":"https:\/\/1.cbm.ua\/?p=6751"},"modified":"2024-11-08T10:20:18","modified_gmt":"2024-11-08T07:20:18","slug":"pomodoro-%d0%bc%d0%b5%d1%82%d0%be%d0%b4-%d0%bf%d0%be%d0%bc%d0%b8%d0%b4%d0%be%d1%80%d0%b0","status":"publish","type":"post","link":"https:\/\/1.cbm.ua\/?p=6751","title":{"rendered":"pomodoro — \u041c\u0435\u0442\u043e\u0434 \u043f\u043e\u043c\u0438\u0434\u043e\u0440\u0430."},"content":{"rendered":"\n\n\n\n \n \n Pomodoro Timer<\/title>\n <style>\n body {\n font-family: Arial, sans-serif;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n background-color: #f4f4f4;\n margin: 0;\n }\n .container {\n text-align: center;\n background: #fff;\n padding: 40px;\n border-radius: 8px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);\n }\n h1 {\n font-size: 3rem;\n margin-bottom: 20px;\n }\n #timer {\n font-size: 2.5rem;\n margin-bottom: 20px;\n }\n .button-group {\n display: inline-block;\n padding: 10px;\n border: 2px solid #000;\n border-radius: 8px;\n margin-bottom: 20px;\n }\n button {\n padding: 10px 20px;\n font-size: 1rem;\n border: none;\n border-radius: 5px;\n margin: 5px;\n cursor: pointer;\n }\n button#start25 {\n background-color: #28a745;\n color: white;\n }\n button#start5 {\n background-color: #17a2b8;\n color: white;\n }\n button#start15 {\n background-color: #ffc107;\n color: white;\n }\n\t\tbutton#start3s {\n background-color: #050107;\n color: white;\n }\n button#pauseButton {\n background-color: #007bff;\n color: white;\n }\n button#resetButton {\n background-color: #dc3545;\n color: white;\n }\n button:disabled {\n background-color: #ccc;\n }\n .active {\n border: 3px solid #000;\n box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"container\">\n <h1>Pomodoro Timer<\/h1>\n <div id=\"timer\">25:00<\/div>\n \n \n <div class=\"button-group\">\n <button id=\"start25\">Start 25 min<\/button>\n <button id=\"start5\">Start 5 min<\/button>\n <button id=\"start15\">Start 15 min<\/button>\n\t\t<button id=\"start_input\">Start 120 min<\/button>\n\t\t<button id=\"start3s\">Start 3 sec<\/button>\n <\/div>\n \n <button id=\"pauseButton\" disabled>Pause<\/button>\n <button id=\"resetButton\" disabled>Reset<\/button>\n\n\t\t \n <audio id=\"alarmSound\" src=\"http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3\" controls loop><\/audio>\n<\/div>\n\n<script>\n class PomodoroTimer {\n constructor() {\n this.interval = null;\n this.timeLeft = 0; \/\/ \u0421\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c (\u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445)\n this.isPaused = false; \/\/ \u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0430\u0443\u0437\u044b\n this.alarm = document.getElementById('alarmSound'); \/\/ \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0430\u0443\u0434\u0438\u043e\u044d\u043b\u0435\u043c\u0435\u043d\u0442\n }\n\n startTimer(duration) {\n this.timeLeft = duration;\n\n this.interval = setInterval(() => {\n if (!this.isPaused) {\n const minutes = Math.floor(this.timeLeft \/ 60);\n const seconds = this.timeLeft % 60;\n document.getElementById('timer').textContent =\n `${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;\n\n if (this.timeLeft > 0) {\n this.timeLeft--;\n } else {\n clearInterval(this.interval);\n this.alarm.play(); \/\/ \u0412\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u043c \u043c\u0443\u0437\u044b\u043a\u0443 \u043f\u043e \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0438 \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n \/\/alert(\"Time's up!\"); \/\/ \u0412\u044b\u0432\u0435\u0441\u0442\u0438 \u043e\u043a\u043d\u043e \u0441 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\u043c, \u0447\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u0437\u0430\u043a\u043e\u043d\u0447\u0435\u043d\u043e.\n }\n }\n }, 1000);\n }\n\n start(workTime) {\n this.clear(); \/\/ \u0421\u0431\u0440\u043e\u0441 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n const duration = workTime * 60;\n this.startTimer(duration);\n }\n\n clear() {\n clearInterval(this.interval); \/\/ \u041e\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0442\u0430\u0439\u043c\u0435\u0440\u0430\n }\n\n pause() {\n this.isPaused = !this.isPaused; \/\/ \u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043f\u0430\u0443\u0437\u044b\n document.getElementById('pauseButton').textContent = this.isPaused ? 'Resume' : 'Pause';\n }\n\n reset() {\n this.clear();\n document.getElementById('timer').textContent = '25:00';\n document.getElementById('resetButton').disabled = true;\n document.getElementById('pauseButton').disabled = true;\n document.querySelectorAll('button[id^=\"start\"]').forEach(btn => {\n btn.disabled = false;\n });\n this.isPaused = false; \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0430\u0443\u0437\u044b\n document.getElementById('pauseButton').textContent = 'Pause';\n clearActiveButton(); \/\/ \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0441 \u043a\u043d\u043e\u043f\u043e\u043a\n this.alarm.pause(); \/\/ \u041e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u043c\u0443\u0437\u044b\u043a\u0443\n \/\/this.alarm.currentTime = 0; \/\/ \u0421\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u043c \u0432\u0440\u0435\u043c\u044f \u043c\u0443\u0437\u044b\u043a\u0438 \u043d\u0430 \u043d\u0430\u0447\u0430\u043b\u043e.\n }\n }\n\n const pomodoro = new PomodoroTimer();\n\n \/\/ \u041b\u043e\u0433\u0438\u043a\u0430 \u0434\u043b\u044f \u043a\u043d\u043e\u043f\u043e\u043a\n document.getElementById('start25').addEventListener('click', () => {\n pomodoro.start(25);\n toggleButtons();\n setActiveButton('start25');\n });\n\n document.getElementById('start5').addEventListener('click', () => {\n pomodoro.start(5); \/\/5 = \u043c\u0438\u043d\u0443\u0442. \u0414\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c 5, \u043d\u043e \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c 0.05 - \u044d\u0442\u043e 3 \u0441\u0435\u043a. \n toggleButtons();\n setActiveButton('start5');\n });\n\n document.getElementById('start15').addEventListener('click', () => {\n pomodoro.start(15);\n toggleButtons();\n setActiveButton('start15');\n });\n\n document.getElementById('start_input').addEventListener('click', () => {\n pomodoro.start(100); \/\/ 0.05 = 3s \u044d\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430.\n toggleButtons();\n setActiveButton('start_input'); \/\/\u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 - \u043e\u0431\u0440\u0430\u043c\u043b\u044f\u044f \u0435\u0435 \u0440\u0430\u043c\u043a\u043e\u0439.\n });\n\n document.getElementById('start3s').addEventListener('click', () => {\n pomodoro.start(0.05); \/\/ 0.05 = 3s \u044d\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430.\n toggleButtons();\n setActiveButton('start3s'); \/\/\u0412\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 - \u043e\u0431\u0440\u0430\u043c\u043b\u044f\u044f \u0435\u0435 \u0440\u0430\u043c\u043a\u043e\u0439.\n });\n\n\n document.getElementById('pauseButton').addEventListener('click', () => {\n pomodoro.pause();\n setActiveButton('pauseButton'); \/\/ \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0436\u0430\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u043f\u0430\u0443\u0437\u044b\n });\n\n document.getElementById('resetButton').addEventListener('click', () => {\n pomodoro.reset();\n setActiveButton('resetButton'); \/\/ \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0436\u0430\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0441\u0431\u0440\u043e\u0441\u0430\n });\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0438 \u043a\u043d\u043e\u043f\u043e\u043a\n function toggleButtons() {\n document.getElementById('resetButton').disabled = false;\n document.getElementById('pauseButton').disabled = false;\n document.querySelectorAll('button[id^=\"start\"]').forEach(btn => {\n btn.disabled = true;\n });\n }\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0441\u0442\u0438\u043b\u044f \u043d\u0430 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u044e\u044e \u043d\u0430\u0436\u0430\u0442\u0443\u044e \u043a\u043d\u043e\u043f\u043a\u0443\n function setActiveButton(buttonId) {\n clearActiveButton(); \/\/ \u0423\u0431\u0438\u0440\u0430\u0435\u043c \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0441\u0442\u0438\u043b\u044c \u0441\u043e \u0432\u0441\u0435\u0445 \u043a\u043d\u043e\u043f\u043e\u043a\n document.getElementById(buttonId).classList.add('active'); \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043a\u043b\u0430\u0441\u0441 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u043a\u043d\u043e\u043f\u043a\u0435\n }\n\n \/\/ \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0441\u0431\u0440\u043e\u0441\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0441\u0442\u0438\u043b\u044f\n function clearActiveButton() {\n document.querySelectorAll('button').forEach(btn => {\n btn.classList.remove('active');\n });\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n\n\n\n<p><a href=\"http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3\">http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3<\/a><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Pomodoro Timer Pomodoro Timer 25:00 Start 25 min Start 5 min Start 15 min Start 120 min Start 3 sec Pause Reset http:\/\/word.cbm.ua\/wp-content\/uploads\/2024\/10\/Ausgehen_AnnenMayKantereit_2.mp3<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[138,7,5,6],"tags":[],"class_list":["post-6751","post","type-post","status-publish","format-standard","hentry","category-138","category-html","category-css","category-js"],"_links":{"self":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6751"}],"version-history":[{"count":5,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751\/revisions"}],"predecessor-version":[{"id":6758,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=\/wp\/v2\/posts\/6751\/revisions\/6758"}],"wp:attachment":[{"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=6751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/1.cbm.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=6751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}