{"id":932,"date":"2026-02-13T19:37:03","date_gmt":"2026-02-13T18:37:03","guid":{"rendered":"https:\/\/cptsruscino.fr\/?page_id=932"},"modified":"2026-02-16T11:54:51","modified_gmt":"2026-02-16T10:54:51","slug":"serious-game-ruscino","status":"publish","type":"page","link":"https:\/\/cptsruscino.fr\/?page_id=932","title":{"rendered":"Serious Game Ruscino"},"content":{"rendered":"\n<div id=\"cpts-game-container\">\n    <style>\n        @keyframes cptsFadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\n        \n        #cpts-game-container {\n            --primary: #00897b;\n            --accent: #ff7043;\n            --bg: #f4f8f8;\n            --text: #2c3e50;\n            font-family: 'Segoe UI', Roboto, sans-serif;\n            background: var(--bg);\n            padding: 25px;\n            border-radius: 20px;\n            max-width: 600px;\n            margin: 20px auto;\n            box-shadow: 0 12px 40px rgba(0,0,0,0.12);\n            color: var(--text);\n            position: relative;\n        }\n\n        \/* LOGO PERMANENT EN HAUT *\/\n        .cpts-fixed-header {\n            text-align: center;\n            margin-bottom: 25px;\n            padding-bottom: 15px;\n            border-bottom: 1px solid rgba(0,0,0,0.05);\n        }\n        .cpts-logo-img {\n            max-width: 220px;\n            height: auto;\n            display: block;\n            margin: 0 auto;\n        }\n\n        .cpts-screen { display: none; animation: cptsFadeIn 0.4s ease; }\n        .cpts-screen.active { display: block; }\n        \n        .cpts-card { \n            background: #fff; padding: 25px; border-radius: 16px; \n            box-shadow: 0 4px 15px rgba(0,0,0,0.05); margin-bottom: 20px;\n        }\n\n        .cpts-btn { \n            display: block; width: 100%; padding: 15px; margin: 10px 0;\n            background: var(--primary); color: #fff !important; \n            border: none; border-radius: 12px; cursor: pointer; \n            text-align: center; font-size: 1rem; font-weight: 600 !important;\n            transition: all 0.2s ease; text-decoration: none;\n        }\n        .cpts-btn:hover { transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,137,123,0.3); }\n\n        .cpts-opt { \n            padding: 14px 18px; border: 2px solid #edf2f2; margin-bottom: 10px; \n            border-radius: 12px; cursor: pointer; transition: all 0.2s;\n        }\n        .cpts-opt:hover { border-color: var(--primary); background: #f0f9f8; }\n        .cpts-opt.selected { border-color: var(--primary); background: #e0f2f1; font-weight: 600; border-left: 5px solid var(--primary); }\n\n        .hud { display: flex; justify-content: space-between; margin-bottom: 10px; font-weight: 600; }\n        .progress-bar { height: 8px; background: #e0e0e0; border-radius: 4px; margin-bottom: 20px; overflow: hidden; }\n        .progress-fill { height: 100%; background: var(--primary); width: 0%; transition: width 0.4s; }\n\n        .feedback { padding: 15px; border-radius: 12px; margin-top: 15px; display: none; border-left: 5px solid; }\n        .fb-success { background: #e8f5e9; color: #2e7d32; border-color: #4caf50; }\n        .fb-error { background: #ffebee; color: #c62828; border-color: #f44336; }\n\n        .top-list { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 0.85rem; }\n        .top-list td { padding: 8px; border-bottom: 1px solid #eee; }\n    <\/style>\n\n    <div class=\"cpts-fixed-header\">\n        <img decoding=\"async\" src=\"https:\/\/www.cptsruscino.fr\/wp-content\/uploads\/2022\/11\/logo-cpts-ruscino.png\" \n             alt=\"CPTS Ruscino\" \n             class=\"cpts-logo-img\"\n             onerror=\"this.style.display='none'; this.nextElementSibling.style.display='block';\">\n        <h2 style=\"display:none; color:var(--primary); margin:0;\">CPTS RUSCINO<\/h2>\n    <\/div>\n\n    <div id=\"scr-home\" class=\"cpts-screen active\">\n        <div class=\"cpts-card\" style=\"text-align:center;\">\n            <h3 style=\"margin-top:0; color:var(--primary);\">Serious Game<\/h3>\n            <p>Testez vos connaissances sur notre CPTS !<\/p>\n            <button class=\"cpts-btn\" onclick=\"game.start()\">\ud83d\udd0a Commencer le Quiz<\/button>\n        <\/div>\n        <div class=\"cpts-card\">\n            <h4 style=\"margin-top:0; text-align:center;\">\ud83c\udfc6 Top 10 des scores<\/h4>\n            <div id=\"highscores-list\"><\/div>\n        <\/div>\n    <\/div>\n\n    <div id=\"scr-game\" class=\"cpts-screen\">\n        <div class=\"hud\">\n            <span>Score: <span id=\"ui-score\">0<\/span><\/span>\n            <span>\u23f1 <span id=\"ui-timer\">120<\/span>s<\/span>\n        <\/div>\n        <div class=\"progress-bar\"><div class=\"progress-fill\" id=\"ui-progress\"><\/div><\/div>\n        <div class=\"cpts-card\">\n            <div id=\"ui-question-text\" style=\"font-size:1.1rem; font-weight:600; margin-bottom:20px;\"><\/div>\n            <div id=\"ui-options\"><\/div>\n            <div id=\"ui-feedback\" class=\"feedback\"><\/div>\n        <\/div>\n        <button id=\"btn-val\" class=\"cpts-btn\" onclick=\"game.validate()\">Valider<\/button>\n        <button id=\"btn-next\" class=\"cpts-btn\" style=\"display:none; background:var(--accent);\" onclick=\"game.next()\">Suivant \u279c<\/button>\n    <\/div>\n\n    <div id=\"scr-end\" class=\"cpts-screen\">\n        <div class=\"cpts-card\" style=\"text-align:center;\">\n            <h2 style=\"color:var(--primary);\">R\u00e9sultat<\/h2>\n            <div style=\"font-size:3rem; font-weight:800; color:var(--primary); margin:10px 0;\"><span id=\"ui-final-score\">0<\/span> pts<\/div>\n            <input type=\"text\" id=\"player-name\" placeholder=\"Votre nom\" style=\"width:100%; padding:12px; border-radius:10px; border:2px solid #ddd; margin-bottom:15px; text-align:center;\">\n            <button class=\"cpts-btn\" onclick=\"game.saveScore()\">Enregistrer mon score<\/button>\n            <button class=\"cpts-btn\" style=\"background:none; color:var(--primary) !important; border:2px solid var(--primary);\" onclick=\"location.reload()\">Rejouer<\/button>\n        <\/div>\n    <\/div>\n\n    <script>\n    var game = (function() {\n        var DB_NAME = \"cpts_ruscino_final_v2\";\n        var audioCtx = null;\n        var QUESTIONS = [\n            {q:\"Quelle mission prioritaire facilite l'acc\u00e8s aux soins ?\", o:[\"Le recrutement de secr\u00e9taires\",\"L'acc\u00e8s au m\u00e9decin traitant et les SNP\",\"La vente de mat\u00e9riel\"], c:1, e:\"C'est le premier pilier de l'ACI.\"},\n            {q:\"Qui valide le Projet de Sant\u00e9 d'une CPTS ?\", o:[\"La Mairie\",\"L'ARS et l'Assurance Maladie\",\"Le Conseil de l'Ordre\"], c:1, e:\"La signature se fait avec l'ARS et la CPAM.\"},\n            {q:\"Les Soins Non Programm\u00e9s (SNP) servent \u00e0 :\", o:[\"\u00c9viter l'engorgement des urgences\",\"Planifier des chirurgies\",\"Vendre des vaccins\"], c:0, e:\"Le but est de traiter les urgences du quotidien en ville.\"},\n            {q:\"Le territoire d'une CPTS est d\u00e9fini par :\", o:[\"Le nombre de pharmacies\",\"Une logique de bassin de population\",\"La taille de l'h\u00f4pital\"], c:1, e:\"C'est une zone g\u00e9ographique coh\u00e9rente.\"},\n            {q:\"Combien y a-t-il de missions socles obligatoires ?\", o:[\"2 missions\",\"4 missions\",\"10 missions\"], c:1, e:\"Les 4 missions : Acc\u00e8s aux soins, Parcours, Pr\u00e9vention et Crise sanitaire.\"},\n            {q:\"La CPTS am\u00e9liore le lien Ville-H\u00f4pital via :\", o:[\"La suppression du papier\",\"La coordination des sorties d'h\u00f4pital\",\"L'arr\u00eat des admissions\"], c:1, e:\"Fluidifier le retour \u00e0 domicile est crucial.\"},\n            {q:\"La CPTS peut agir sur la pr\u00e9vention via :\", o:[\"Le d\u00e9pistage des cancers\",\"La vaccination\",\"Toutes ces r\u00e9ponses\"], c:2, e:\"La pr\u00e9vention est une mission de sant\u00e9 publique centrale.\"},\n            {q:\"Quelle est la structure juridique d'une CPTS ?\", o:[\"Une SAS\",\"Une Association loi 1901\",\"Une administration\"], c:1, e:\"C'est une structure associative g\u00e9r\u00e9e par des lib\u00e9raux.\"},\n            {q:\"La mission 'Attractivit\u00e9' sert \u00e0 :\", o:[\"Augmenter les tarifs\",\"Faciliter l'installation de soignants\",\"R\u00e9nover les fa\u00e7ades\"], c:1, e:\"Il s'agit de lutter contre les d\u00e9serts m\u00e9dicaux.\"},\n            {q:\"En cas de crise sanitaire, la CPTS :\", o:[\"Se met en pause\",\"Coordonne la r\u00e9ponse ambulatoire\",\"Ferme les cabinets\"], c:1, e:\"Elle devient le pivot territorial de la r\u00e9ponse.\"}\n        ];\n\n        var s = { idx:0, score:0, timer:120, interval:null, sel:null };\n\n        function initAudio() { if(!audioCtx) audioCtx = new (window.AudioContext || window.webkitAudioContext)(); }\n        function beep(type) {\n            if(!audioCtx) return;\n            var o = audioCtx.createOscillator(); var g = audioCtx.createGain();\n            o.connect(g); g.connect(audioCtx.destination);\n            if(type === 'win') { o.type = 'sine'; o.frequency.setValueAtTime(600, audioCtx.currentTime); o.frequency.exponentialRampToValueAtTime(1200, audioCtx.currentTime + 0.1); }\n            else { o.type = 'sawtooth'; o.frequency.setValueAtTime(200, audioCtx.currentTime); o.frequency.linearRampToValueAtTime(100, audioCtx.currentTime + 0.2); }\n            o.start(); g.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 0.3); o.stop(audioCtx.currentTime + 0.3);\n        }\n\n        return {\n            start: function() {\n                initAudio(); s.idx = 0; s.score = 0; s.timer = 120;\n                this.show('scr-game'); this.render();\n                s.interval = setInterval(() => { s.timer--; document.getElementById('ui-timer').innerText = s.timer; if(s.timer <= 0) this.end(); }, 1000);\n            },\n            render: function() {\n                var q = QUESTIONS[s.idx];\n                document.getElementById('ui-feedback').style.display = 'none';\n                document.getElementById('btn-val').style.display = 'block';\n                document.getElementById('btn-next').style.display = 'none';\n                document.getElementById('ui-progress').style.width = ((s.idx \/ QUESTIONS.length) * 100) + '%';\n                document.getElementById('ui-question-text').innerText = (s.idx + 1) + \". \" + q.q;\n                var html = \"\"; q.o.forEach((opt, i) => html += '<div class=\"cpts-opt\" onclick=\"game.pick(this,'+i+')\">'+opt+'<\/div>');\n                document.getElementById('ui-options').innerHTML = html;\n            },\n            pick: function(el, i) { document.querySelectorAll('.cpts-opt').forEach(o => o.classList.remove('selected')); el.classList.add('selected'); s.sel = i; },\n            validate: function() {\n                if(s.sel === null) return;\n                var ok = (s.sel === QUESTIONS[s.idx].c);\n                if(ok) { s.score += 100 + Math.floor(s.timer\/5); beep('win'); } else { beep('lose'); }\n                document.getElementById('ui-score').innerText = s.score;\n                var fb = document.getElementById('ui-feedback'); fb.style.display = 'block';\n                fb.className = 'feedback ' + (ok ? 'fb-success' : 'fb-error');\n                fb.innerHTML = '<b>' + (ok ? 'Correct !' : 'Oups...') + '<\/b><br><small>' + QUESTIONS[s.idx].e + '<\/small>';\n                document.getElementById('btn-val').style.display = 'none';\n                document.getElementById('btn-next').style.display = 'block';\n            },\n            next: function() { s.idx++; if(s.idx >= QUESTIONS.length) this.end(); else { s.sel = null; this.render(); } },\n            end: function() { clearInterval(s.interval); document.getElementById('ui-final-score').innerText = s.score; this.show('scr-end'); },\n            saveScore: function() {\n                var name = document.getElementById('player-name').value || \"Anonyme\";\n                var scores = JSON.parse(localStorage.getItem(DB_NAME)) || [];\n                scores.push({name: name, score: s.score}); scores.sort((a,b) => b.score - a.score);\n                localStorage.setItem(DB_NAME, JSON.stringify(scores.slice(0, 10)));\n                location.reload();\n            },\n            show: function(id) { document.querySelectorAll('.cpts-screen').forEach(scr => scr.classList.remove('active')); document.getElementById(id).classList.add('active'); },\n            displayLeaderboard: function() {\n                var scores = JSON.parse(localStorage.getItem(DB_NAME)) || [];\n                var list = document.getElementById('highscores-list');\n                if(!scores.length) { list.innerHTML = \"<p style='text-align:center; opacity:0.5;'>Aucun score<\/p>\"; return; }\n                var h = \"<table class='top-list'>\";\n                scores.forEach((it, i) => h += \"<tr><td>#\"+(i+1)+\" \"+it.name+\"<\/td><td style='text-align:right'><b>\"+it.score+\"<\/b><\/td><\/tr>\");\n                list.innerHTML = h + \"<\/table>\";\n            }\n        };\n    })();\n    window.onload = game.displayLeaderboard;\n    <\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>CPTS RUSCINO Serious Game Testez vos connaissances sur notre CPTS ! \ud83d\udd0a Commencer le Quiz \ud83c\udfc6 Top 10 des scores Score: 0 \u23f1 120s Valider Suivant \u279c R\u00e9sultat 0 pts Enregistrer mon score Rejouer<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"saved_in_kubio":false,"footnotes":""},"class_list":["post-932","page","type-page","status-publish","hentry"],"kubio_ai_page_context":{"short_desc":"","purpose":"general"},"_links":{"self":[{"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/pages\/932","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=932"}],"version-history":[{"count":11,"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/pages\/932\/revisions"}],"predecessor-version":[{"id":1003,"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=\/wp\/v2\/pages\/932\/revisions\/1003"}],"wp:attachment":[{"href":"https:\/\/cptsruscino.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=932"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}