{"id":6,"date":"2025-05-22T09:00:30","date_gmt":"2025-05-22T09:00:30","guid":{"rendered":"https:\/\/ookgaaf.nl\/?page_id=6"},"modified":"2025-05-22T14:36:17","modified_gmt":"2025-05-22T14:36:17","slug":"home","status":"publish","type":"page","link":"https:\/\/ookgaaf.nl\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\n\n\n \n Geheugentraining Spel<\/title>\n <style>\n \/* Volledige pagina en body setup *\/\n html, body {\n height: 100%;\n margin: 0;\n padding: 0;\n background-color: #fff;\n color: #000;\n font-family: sans-serif;\n text-align: center;\n }\n\n \/* Layout structuur *\/\n body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding-bottom: 80px; \/* ruimte onder voor reset knop *\/\n }\n\n \/* Verberg elementen *\/\n .hidden {\n display: none;\n }\n\n \/* Cijferreeks stijl *\/\n .number-display {\n font-size: 75px;\n color: #65DFDE;\n }\n\n \/* Countdown stijl *\/\n .countdown-style {\n font-size: 180px;\n color: rgba(101, 223, 222, 0.3);\n }\n\n \/* Introductietekst en sliders *\/\n .standard-text {\n font-size: 20px;\n margin: 15px 0;\n }\n\n \/* Resultaatweergave *\/\n .result-text {\n font-size: 30px;\n margin: 0px;\n }\n\n \/* Tekstinvoer en sliders *\/\n input[type=\"text\"], input[type=\"range\"] {\n font-size: 20px;\n padding: 5px;\n text-align: center;\n }\n\n \/* Invoer tekstveld *\/\n input[type=\"text\"] {\n width: 200px;\n margin-right: 20px;\n }\n\n \/* Algemene knoppenstijl *\/\n button {\n font-size: 20px;\n padding: 10px 50px;\n background-color: #65DFDE;\n color: #000;\n border: none;\n cursor: pointer;\n }\n\n \/* Resetknop vast onderaan *\/\n #resetWrap {\n position: fixed;\n bottom: 10px;\n left: 0;\n right: 0;\n text-align: center;\n }\n\n \/* Resetknop zelf *\/\n #resetWrap button {\n font-size: 14px;\n padding: 6px 12px;\n }\n\n \/* Slider breedte *\/\n input[type=\"range\"] {\n width: 300px;\n }\n\n \/* Mobiele responsiviteit *\/\n @media screen and (max-width: 600px) {\n .number-display { font-size: 30px; }\n .countdown-style { font-size: 100px; }\n .standard-text,\n input[type=\"text\"],\n button {\n font-size: 16px;\n }\n .result-text { font-size: 24px; }\n #resetWrap button { font-size: 12px; padding: 5px 10px; }\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"intro\">\n <p class=\"standard-text\">Welkom bij de geheugentraining!<br>Je ziet zo meteen een reeks cijfers. Die moet je onthouden en daarna intypen uit je hoofd.<\/p>\n <div class=\"standard-text\">\n Aantal cijfers: <span id=\"lengthValue\">6<\/span><br>\n <input type=\"range\" id=\"numLength\" min=\"2\" max=\"10\" value=\"6\">\n <\/div>\n <div class=\"standard-text\">\n Toontijd (seconden): <span id=\"durationValue\">1.0<\/span><br>\n <input type=\"range\" id=\"durationSlider\" min=\"0.5\" max=\"2\" step=\"0.1\" value=\"1\">\n <\/div>\n <button onclick=\"startGame()\">Starten<\/button>\n <\/div>\n\n <div id=\"game\" class=\"hidden\">\n <div id=\"screen\"><\/div>\n <div id=\"resetWrap\" class=\"hidden\">\n <button onclick=\"resetGame()\">Opnieuw beginnen<\/button>\n <\/div>\n <\/div>\n\n <script>\n let currentSequence = '';\n let sequenceLength = 6;\n let displayTime = 1000;\n\n const intro = document.getElementById(\"intro\");\n const game = document.getElementById(\"game\");\n const screen = document.getElementById(\"screen\");\n const resetWrap = document.getElementById(\"resetWrap\");\n\n document.getElementById(\"numLength\").addEventListener(\"input\", function() {\n document.getElementById(\"lengthValue\").innerText = this.value;\n });\n\n document.getElementById(\"durationSlider\").addEventListener(\"input\", function() {\n document.getElementById(\"durationValue\").innerText = this.value;\n });\n\n function startGame() {\n sequenceLength = parseInt(document.getElementById(\"numLength\").value);\n displayTime = parseFloat(document.getElementById(\"durationSlider\").value) * 1000;\n intro.classList.add(\"hidden\");\n game.classList.remove(\"hidden\");\n startGameRound();\n }\n\n function resetGame() {\n location.reload();\n }\n\n function clearScreen() {\n screen.innerHTML = '';\n }\n\n function startGameRound() {\n clearScreen();\n resetWrap.classList.add(\"hidden\");\n let count = 3;\n screen.className = \"countdown-style\";\n screen.textContent = count;\n\n const countdown = setInterval(() => {\n count--;\n if (count === 0) {\n clearInterval(countdown);\n clearScreen();\n showSequence();\n } else {\n screen.textContent = count;\n }\n }, 1000);\n }\n\n function showSequence() {\n currentSequence = Array.from({length: sequenceLength}, () => Math.floor(Math.random() * 10)).join('');\n screen.className = \"number-display\";\n screen.textContent = currentSequence;\n\n setTimeout(() => {\n clearScreen();\n showInputField();\n }, displayTime);\n }\n\n function showInputField() {\n const input = document.createElement('input');\n input.type = 'text';\n input.id = 'userInput';\n input.placeholder = 'Typ de reeks...';\n\n const checkBtn = document.createElement('button');\n checkBtn.textContent = 'Check';\n checkBtn.onclick = () => checkInput(input.value);\n\n const wrapper = document.createElement('div');\n wrapper.style.marginTop = '20px';\n wrapper.appendChild(input);\n wrapper.appendChild(checkBtn);\n\n screen.appendChild(wrapper);\n input.focus();\n\n document.addEventListener(\"keydown\", function handler(e) {\n if (e.key === \"Enter\") {\n checkBtn.click();\n document.removeEventListener(\"keydown\", handler);\n }\n });\n }\n\n function checkInput(value) {\n clearScreen();\n const result = document.createElement('div');\n result.className = 'result-text';\n result.textContent = `${value} ${value === currentSequence ? '\u2705 Correct!' : `\u274c Fout: ${currentSequence}`}`;\n\n const nextBtn = document.createElement('button');\n nextBtn.textContent = 'Volgende';\n nextBtn.onclick = startGameRound;\n\n screen.appendChild(result);\n screen.appendChild(nextBtn);\n resetWrap.classList.remove(\"hidden\");\n\n document.addEventListener(\"keydown\", function handler(e) {\n if (e.key === \"Enter\") {\n nextBtn.click();\n document.removeEventListener(\"keydown\", handler);\n }\n });\n }\n <\/script>\n<\/body>\n<\/html>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Geheugentraining Spel Welkom bij de geheugentraining!Je ziet zo meteen een reeks cijfers. Die moet je onthouden en daarna intypen uit je hoofd. Aantal cijfers: 6 Toontijd (seconden): 1.0 Starten Opnieuw beginnen<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ocean_post_layout":"full-screen","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"","ocean_second_sidebar":"","ocean_disable_margins":"enable","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"default","ocean_display_header":"default","ocean_header_style":"","ocean_center_header_left_menu":"","ocean_custom_header_template":"","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"","ocean_menu_typo_font_family":"","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"default","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"default","ocean_display_footer_bottom":"default","ocean_custom_footer_template":"","footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry","entry"],"_links":{"self":[{"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":263,"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":302,"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/pages\/6\/revisions\/302"}],"wp:attachment":[{"href":"https:\/\/ookgaaf.nl\/index.php\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}