{"id":6391,"date":"2025-03-03T08:55:07","date_gmt":"2025-03-03T08:55:07","guid":{"rendered":"https:\/\/junkbrothers.be\/?page_id=6391"},"modified":"2025-03-04T00:53:01","modified_gmt":"2025-03-04T00:53:01","slug":"te","status":"publish","type":"page","link":"https:\/\/junkbrothers.be\/fr\/te\/","title":{"rendered":"Te"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"6391\" class=\"elementor elementor-6391\" data-elementor-settings=\"{&quot;element_pack_global_tooltip_width&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_padding&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true}}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-393405d e-flex e-con-boxed e-con e-parent\" data-id=\"393405d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ca313fc elementor-widget elementor-widget-html\" data-id=\"ca313fc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"burnout-chat-wrapper\">\n    <div class=\"welcome-screen\" id=\"welcome-screen\">\n        <div class=\"header\">Welkom bij de Assessment<\/div>\n        <p>Welkom bij de Burnout Risico Assessment Chat. Deze tool helpt je om je burnout-risico te beoordelen door middel van 48 vragen, gebaseerd op wetenschappelijk gevalideerde methoden zoals de Maslach Burnout Inventory (MBI), de Utrecht Burnout Scale (UBOS) en de Burnout Assessment Tool (BAT). Dit zorgt voor een relatief betrouwbare indicatie van je huidige toestand. Beantwoord de vragen zo eerlijk mogelijk voor het beste inzicht.<\/p>\n        <label for=\"user-name\">Hoe mogen we jou noemen?<\/label>\n        <input type=\"text\" id=\"user-name\" placeholder=\"Jouw naam\" style=\"margin: 10px; padding: 5px;\" aria-label=\"Voer je naam in\">\n        <button id=\"start-btn\" onclick=\"startChat()\" aria-label=\"Begin het assessment\">Start gesprek<\/button>\n    <\/div>\n    <div class=\"chat-container\" id=\"chat-container\" style=\"display: none;\">\n        <div class=\"chat-header\">Burnout Risico Assessment Chat<\/div>\n        <div id=\"progress-bar\">\n            <div id=\"progress\"><\/div>\n        <\/div>\n        <div class=\"chat-box\" id=\"chat-box\"><\/div>\n        <div class=\"input-area\" id=\"input-area\">\n            <div class=\"options\" id=\"options\"><\/div>\n            <div class=\"nav-buttons\">\n                <button class=\"nav-btn back-btn\" id=\"back-btn\" aria-label=\"Terug naar vorige vraag\">Teruggaan<\/button>\n                <button class=\"nav-btn skip-btn\" id=\"skip-btn\" aria-label=\"Vraag overslaan\">Overslaan<\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n    <div class=\"results-container\" id=\"results\" style=\"display: none;\">\n        <h2>Resultaten<\/h2>\n        <p id=\"burnout-score\" aria-label=\"Jouw totale burnout-score\"><\/p>\n        <p id=\"subcategories\" aria-label=\"Jouw scores per categorie\"><\/p>\n        <details class=\"result-section\">\n            <summary><h3>Wat betekent dit?<\/h3><\/summary>\n            <div class=\"result-content\" id=\"interpretation-content\" aria-label=\"Interpretatie van jouw scores\"><\/div>\n        <\/details>\n        <details class=\"result-section\">\n            <summary><h3>Advies<\/h3><\/summary>\n            <div class=\"result-content\" id=\"advice-content\" aria-label=\"Praktisch advies op basis van jouw scores\"><\/div>\n        <\/details>\n        <div class=\"legend\">\n            Legende: <span style=\"color: #28a745\">0% (Laag)<\/span> - <span style=\"color: #ffc107\">50% (Matig)<\/span> - <span style=\"color: #dc3545\">100% (Hoog)<\/span>\n        <\/div>\n        <button id=\"restart-btn\" class=\"restart-btn\">Assessment opnieuw starten<\/button>\n    <\/div>\n    <div id=\"skip-warning\" style=\"display: none;\">\n        <p>Ben je zeker dat je deze vraag wilt overslaan? Dit kan je resultaten be\u00efnvloeden. Vul zoveel mogelijk in voor de beste uitkomst.<\/p>\n        <button class=\"confirm\" id=\"confirm-skip\" aria-label=\"Bevestig vraag overslaan\">Ja, overslaan<\/button>\n        <button class=\"cancel\" id=\"cancel-skip\" aria-label=\"Annuleer overslaan\">Nee, terug<\/button>\n    <\/div>\n    <div id=\"loading\" style=\"display: none; text-align: center; padding: 20px;\">\n        <div class=\"spinner\"><\/div>\n        <p>Resultaten worden berekend...<\/p>\n    <\/div>\n<\/div>\n\n<style>\n    .burnout-chat-wrapper {\n        position: relative;\n        width: 100%;\n        max-width: 700px;\n        margin: 0 auto;\n        padding-top: 100px; \/* Ruimte voor de header\/navigatiebalk *\/\n        font-family: 'Arial', sans-serif;\n    }\n    .burnout-chat-wrapper .chat-container {\n        background: white;\n        border-radius: 15px;\n        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n        width: 100%;\n        height: 80dvh; \/* Dynamische viewport-hoogte voor betere mobiele ondersteuning *\/\n        display: flex;\n        flex-direction: column;\n        position: relative;\n    }\n    .burnout-chat-wrapper .chat-header {\n        background: #007bff;\n        color: white;\n        padding: 15px;\n        text-align: center;\n        font-size: 22px;\n        font-weight: 600;\n        border-radius: 15px 15px 0 0;\n    }\n    .burnout-chat-wrapper #progress-bar {\n        height: 5px;\n        background: #e9ecef;\n        border-radius: 5px;\n        margin: 10px 0;\n    }\n    .burnout-chat-wrapper #progress {\n        height: 100%;\n        width: 0%;\n        background: #007bff;\n        border-radius: 5px;\n        transition: width 0.3s ease;\n    }\n    .burnout-chat-wrapper .chat-box {\n        flex-grow: 1;\n        padding: 20px 30px;\n        overflow-y: auto; \/* Zorg dat de chatbox scrollt *\/\n        background: #fafafa;\n        -webkit-overflow-scrolling: touch; \/* Smooth scrolling op mobiel *\/\n        max-height: calc(80dvh - 200px); \/* Vaste maximale hoogte, rekening houdend met header, progress bar, en input-area *\/\n    }\n    .burnout-chat-wrapper .message {\n        margin: 15px 0;\n        padding: 12px 18px;\n        border-radius: 10px;\n        max-width: 70%;\n        font-size: 16px;\n        line-height: 1.4;\n        opacity: 0;\n        animation: fadeIn 0.5s ease forwards;\n    }\n    @keyframes fadeIn {\n        from { opacity: 0; transform: translateY(10px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n    @keyframes fadeInSection {\n        from { opacity: 0; }\n        to { opacity: 1; }\n    }\n    .burnout-chat-wrapper .bot-message {\n        background: #e9ecef;\n        color: #333;\n    }\n    .burnout-chat-wrapper .user-message {\n        background: #007bff;\n        color: white;\n        margin-left: auto;\n    }\n    .burnout-chat-wrapper .input-area {\n        background: white;\n        padding: 10px;\n        position: sticky;\n        bottom: 0;\n        z-index: 1;\n    }\n    .burnout-chat-wrapper .options {\n        display: flex;\n        flex-wrap: wrap;\n        gap: 15px;\n        margin: 15px 0;\n        padding: 10px;\n        justify-content: center;\n    }\n    .burnout-chat-wrapper .option-btn {\n        padding: 10px 20px;\n        border: 2px solid #007bff;\n        background: white;\n        color: #007bff;\n        border-radius: 25px;\n        cursor: pointer;\n        transition: all 0.3s ease;\n        font-size: 14px;\n        margin: 5px;\n    }\n    .burnout-chat-wrapper .option-btn:hover,\n    .burnout-chat-wrapper .option-btn.selected {\n        background: #007bff;\n        color: white;\n        transform: scale(1.05);\n    }\n    .burnout-chat-wrapper .option-btn.clicked {\n        animation: clickFade 0.3s ease;\n    }\n    @keyframes clickFade {\n        0% { opacity: 0.5; }\n        100% { opacity: 1; }\n    }\n    .burnout-chat-wrapper .nav-buttons {\n        display: flex;\n        justify-content: space-between;\n        margin: 20px 20px 10px;\n        padding: 0 10px;\n    }\n    .burnout-chat-wrapper .nav-btn {\n        padding: 8px 15px;\n        border: none;\n        border-radius: 5px;\n        cursor: pointer;\n        font-size: 14px;\n        transition: all 0.3s ease;\n    }\n    .burnout-chat-wrapper .skip-btn {\n        background: #dc3545;\n        color: white;\n    }\n    .burnout-chat-wrapper .skip-btn:hover {\n        background: #c82333;\n        transform: scale(1.05);\n    }\n    .burnout-chat-wrapper .back-btn {\n        background: #6c757d;\n        color: white;\n    }\n    .burnout-chat-wrapper .back-btn:hover {\n        background: #5a6268;\n        transform: scale(1.05);\n    }\n    .burnout-chat-wrapper .welcome-screen {\n        background: white;\n        border-radius: 15px;\n        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n        padding: 30px;\n        width: 100%;\n        max-width: 600px;\n        text-align: center;\n        margin: 0 auto;\n        z-index: 1001;\n    }\n    .burnout-chat-wrapper .welcome-screen .header {\n        background: #007bff;\n        color: white;\n        padding: 10px;\n        border-radius: 10px 10px 0 0;\n        margin: -30px -30px 20px;\n        font-size: 20px;\n        font-weight: 600;\n    }\n    .burnout-chat-wrapper .welcome-screen p {\n        font-size: 16px;\n        color: #555;\n        line-height: 1.5;\n        margin-bottom: 20px;\n    }\n    .burnout-chat-wrapper .welcome-screen button,\n    .burnout-chat-wrapper .restart-btn {\n        padding: 12px 24px;\n        background: #28a745;\n        color: white;\n        border: none;\n        border-radius: 5px;\n        cursor: pointer;\n        font-size: 16px;\n        transition: background 0.3s ease;\n    }\n    .burnout-chat-wrapper .welcome-screen button:hover,\n    .burnout-chat-wrapper .restart-btn:hover {\n        background: #218838;\n    }\n    .burnout-chat-wrapper #skip-warning {\n        position: fixed;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        background: white;\n        padding: 20px;\n        border-radius: 10px;\n        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n        text-align: center;\n        z-index: 1000;\n    }\n    .burnout-chat-wrapper #skip-warning p {\n        font-size: 14px;\n        color: #333;\n        margin-bottom: 15px;\n    }\n    .burnout-chat-wrapper #skip-warning button {\n        padding: 8px 16px;\n        border: none;\n        border-radius: 5px;\n        cursor: pointer;\n        margin: 0 10px;\n        font-size: 14px;\n    }\n    .burnout-chat-wrapper #skip-warning .confirm {\n        background: #dc3545;\n        color: white;\n    }\n    .burnout-chat-wrapper #skip-warning .cancel {\n        background: #28a745;\n        color: white;\n    }\n    .burnout-chat-wrapper .results-container {\n        padding: 30px;\n        background: #fff;\n        border-radius: 15px;\n        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n        max-width: 700px;\n        margin: 0 auto;\n        font-size: 18px;\n    }\n    .burnout-chat-wrapper .results-container h2 {\n        font-size: 24px;\n        color: #333;\n        margin-bottom: 20px;\n        text-align: center;\n    }\n    .burnout-chat-wrapper .result-section {\n        margin-bottom: 20px;\n    }\n    .burnout-chat-wrapper .result-section summary {\n        cursor: pointer;\n        padding: 10px;\n        background: #f1f1f1;\n        border-radius: 5px;\n        font-size: 20px;\n        color: #007bff;\n        transition: background 0.3s ease;\n    }\n    .burnout-chat-wrapper .result-section summary h3 {\n        margin: 0;\n        display: inline;\n    }\n    .burnout-chat-wrapper .result-section summary:hover {\n        background: #e1e1e1;\n    }\n    .burnout-chat-wrapper .result-content {\n        padding: 15px;\n        background: #f9f9f9;\n        border-radius: 10px;\n        font-size: 16px;\n        color: #555;\n        line-height: 1.6;\n    }\n    .burnout-chat-wrapper .result-content h4 {\n        font-size: 18px;\n        color: #333;\n        margin: 15px 0 10px;\n    }\n    .burnout-chat-wrapper .result-content ul {\n        list-style-type: disc;\n        padding-left: 20px;\n        margin: 10px 0;\n    }\n    .burnout-chat-wrapper .result-content li {\n        margin: 5px 0;\n    }\n    .burnout-chat-wrapper .subcategory {\n        position: relative;\n        display: inline-block;\n        margin-right: 15px;\n        margin-bottom: 10px;\n    }\n    .burnout-chat-wrapper .tooltip {\n        visibility: hidden;\n        position: absolute;\n        background: #333;\n        color: white;\n        padding: 5px 10px;\n        border-radius: 5px;\n        font-size: 12px;\n        top: -40px;\n        left: 50%;\n        transform: translateX(-50%);\n        white-space: nowrap;\n        z-index: 10;\n        opacity: 0;\n        transition: opacity 0.3s;\n    }\n    .burnout-chat-wrapper .subcategory:hover .tooltip {\n        visibility: visible;\n        opacity: 1;\n    }\n    .burnout-chat-wrapper .legend {\n        font-size: 14px;\n        color: #555;\n        margin-top: 20px;\n        text-align: center;\n    }\n    .burnout-chat-wrapper .restart-btn {\n        display: block;\n        margin: 20px auto 0;\n    }\n    .burnout-chat-wrapper #loading {\n        position: fixed;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        text-align: center;\n        padding: 20px;\n        z-index: 1000;\n        background: rgba(255, 255, 255, 0.9);\n        border-radius: 10px;\n        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n    }\n    .burnout-chat-wrapper .spinner {\n        border: 4px solid #f3f3f3;\n        border-top: 4px solid #007bff;\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        animation: spin 1s linear infinite;\n        margin: 0 auto 10px;\n    }\n    @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n    }\n    @media (max-width: 600px) {\n        .burnout-chat-wrapper .chat-container,\n        .burnout-chat-wrapper .welcome-screen,\n        .burnout-chat-wrapper .results-container {\n            max-width: 100%;\n            padding: 10px;\n            height: 80dvh; \/* Dynamische hoogte voor mobiel *\/\n        }\n        .burnout-chat-wrapper .chat-box {\n            padding: 10px 15px;\n            max-height: calc(80dvh - 220px); \/* Aangepaste hoogte voor mobiel *\/\n        }\n        .burnout-chat-wrapper .message {\n            font-size: 15px; \/* Iets grotere fontgrootte voor leesbaarheid *\/\n            max-width: 80%;\n        }\n        .burnout-chat-wrapper .options {\n            flex-direction: column;\n            align-items: stretch;\n            gap: 10px;\n        }\n        .burnout-chat-wrapper .option-btn {\n            width: 100%;\n            margin: 5px 0;\n            padding: 12px 20px; \/* Grotere padding voor touch-vriendelijkheid *\/\n            font-size: 16px; \/* Grotere fontgrootte voor leesbaarheid *\/\n            min-height: 44px; \/* Minimale touch-target grootte *\/\n            box-sizing: border-box;\n        }\n        .burnout-chat-wrapper .nav-buttons {\n            margin: 15px 10px 5px;\n        }\n        .burnout-chat-wrapper .nav-btn {\n            padding: 10px 15px; \/* Grotere padding voor touch-vriendelijkheid *\/\n            font-size: 14px;\n            min-height: 44px; \/* Minimale touch-target grootte *\/\n        }\n        .burnout-chat-wrapper .welcome-screen {\n            padding: 20px;\n        }\n        .burnout-chat-wrapper .welcome-screen .header {\n            font-size: 18px;\n        }\n        .burnout-chat-wrapper .welcome-screen p {\n            font-size: 14px;\n        }\n        .burnout-chat-wrapper .welcome-screen button,\n        .burnout-chat-wrapper .restart-btn {\n            padding: 10px 20px;\n            font-size: 14px;\n            min-height: 44px; \/* Minimale touch-target grootte *\/\n        }\n        .burnout-chat-wrapper .results-container {\n            padding: 20px;\n            font-size: 16px;\n        }\n        .burnout-chat-wrapper .results-container h2 {\n            font-size: 20px;\n        }\n        .burnout-chat-wrapper .result-section summary {\n            padding: 15px; \/* Grotere touch-target *\/\n            font-size: 18px;\n            min-height: 44px; \/* Minimale touch-target grootte *\/\n            display: flex;\n            align-items: center;\n        }\n        .burnout-chat-wrapper .result-section summary h3 {\n            font-size: 18px;\n        }\n        .burnout-chat-wrapper .result-content {\n            padding: 10px;\n            font-size: 14px;\n        }\n        .burnout-chat-wrapper .result-content h4 {\n            font-size: 16px;\n        }\n        .burnout-chat-wrapper .result-content ul {\n            padding-left: 15px;\n        }\n        .burnout-chat-wrapper .result-content li {\n            margin: 5px 0;\n        }\n        .burnout-chat-wrapper .subcategory {\n            display: block;\n            margin-bottom: 10px;\n            font-size: 14px;\n        }\n        .burnout-chat-wrapper .legend {\n            font-size: 12px;\n        }\n        .burnout-chat-wrapper #skip-warning p {\n            font-size: 12px;\n        }\n        .burnout-chat-wrapper #skip-warning button {\n            padding: 8px 12px;\n            font-size: 12px;\n            min-height: 44px; \/* Minimale touch-target grootte *\/\n        }\n    }\n<\/style>\n\n<script>\n    document.addEventListener('DOMContentLoaded', () => {\n        console.log(\"DOMContentLoaded event fired\");\n\n        \/\/ Configuration data\n        const config = {\n            questions: [\n                \"Ik voel me emotioneel uitgeput door mijn werk\",\n                \"Ik voel me aan het eind van een werkdag leeg\",\n                \"Ik voel me moe als ik 's morgens opsta en geconfronteerd word met mijn werk\",\n                \"Het kost mij moeite om me in te leven in collega\u2019s of klanten\/pati\u00ebnten\/cli\u00ebnten\",\n                \"Ik voel me opgebrand door mijn werk\",\n                \"Ik merk dat ik te veel hooi op mijn vork neem\",\n                \"Ik ben minder enthousiast geworden over mijn werk\",\n                \"Ik twijfel aan het nut van mijn werk\",\n                \"Ik ben cynischer geworden over de effecten van mijn werk\",\n                \"Ik voel me steeds meer onverschillig over mijn werk\",\n                \"Ik merk dat ik afstand neem van anderen in mijn werkomgeving\",\n                \"Ik kan effectief de problemen oplossen die in mijn werk ontstaan\",\n                \"Ik heb het gevoel dat ik met mijn werk een positieve bijdrage lever\",\n                \"Ik vind dat ik goed ben in mijn werk\",\n                \"Ik voel me tevreden als ik iets heb bereikt in mijn werk\",\n                \"Ik kan voldoende zelfvertrouwen opbrengen voor mijn werk\",\n                \"Ik heb moeite om me te concentreren op mijn werk\",\n                \"Ik vergeet dingen die ik moet doen\",\n                \"Ik voel me overweldigd door mijn emoties op het werk\",\n                \"Ik heb moeite om helder te denken tijdens mijn werk\",\n                \"Ik ervaar te weinig tijd om mijn werk goed uit te voeren\",\n                \"Ik heb weinig invloed op hoe ik mijn werk kan indelen\",\n                \"Ik moet vaak overwerken om mijn taken af te krijgen\",\n                \"Ik word regelmatig onderbroken tijdens mijn werkzaamheden\",\n                \"Ik krijg voldoende ondersteuning van mijn leidinggevende\",\n                \"Ik voel me gewaardeerd voor mijn bijdrage\",\n                \"De communicatie binnen mijn werkomgeving is goed\",\n                \"Ik kan bij collega\u2019s terecht als ik problemen ervaar\",\n                \"Mijn werk interfereert met mijn priv\u00e9leven\",\n                \"Ik heb voldoende tijd voor ontspanning en herstel\",\n                \"Ik kan werk en priv\u00e9 goed gescheiden houden\",\n                \"Ik blijf in mijn vrije tijd piekeren over werk\",\n                \"Ik stel hoge eisen aan mezelf\",\n                \"Ik vind het moeilijk om \u2018nee\u2019 te zeggen\",\n                \"Ik maak me vaak zorgen over zaken op het werk\",\n                \"Ik vind het moeilijk om hulp te vragen\",\n                \"Ik heb last van hoofdpijn\",\n                \"Ik heb slaapproblemen\",\n                \"Ik voel me lichamelijk uitgeput\",\n                \"Ik heb last van spierspanning of pijn\",\n                \"Ik kan me moeilijk concentreren\",\n                \"Ik vergeet dingen\",\n                \"Ik voel me prikkelbaar of ge\u00efrriteerd\",\n                \"Ik maak me zorgen\",\n                \"Ik trek me terug uit sociale situaties\",\n                \"Ik heb minder interesse in vrijetijdsactiviteiten\",\n                \"Ik ervaar spanning in mijn persoonlijke relaties\",\n                \"Ik heb minder energie voor sociale contacten\"\n            ],\n            scales: [\n                [\"Nooit\", \"Enkele keren\", \"Maandelijks\", \"Wekelijks\", \"Dagelijks\"],\n                [\"Volledig oneens\", \"Oneens\", \"Neutraal\", \"Eens\", \"Volledig eens\"],\n                [\"Nooit\", \"Zelden\", \"Soms\", \"Vaak\", \"Zeer vaak\"]\n            ],\n            categories: [\n                { start: 0, end: 19, name: \"Kernsymptomen\" },\n                { start: 20, end: 35, name: \"Risicofactoren\" },\n                { start: 36, end: 47, name: \"Impact op Dagelijks Functioneren\" }\n            ]\n        };\n\n        \/\/ App state\n        let state = {\n            currentQuestionIndex: 0,\n            answers: [],\n            userName: \"\",\n            isSkipWarningVisible: false\n        };\n\n        \/\/ DOM elements - cached for performance\n        const elements = {\n            welcomeScreen: document.getElementById('welcome-screen'),\n            userNameInput: document.getElementById('user-name'),\n            startButton: document.getElementById('start-btn'),\n            chatContainer: document.getElementById('chat-container'),\n            chatBox: document.getElementById('chat-box'),\n            optionsContainer: document.getElementById('options'),\n            inputArea: document.getElementById('input-area'),\n            progressBar: document.getElementById('progress'),\n            backButton: document.getElementById('back-btn'),\n            skipButton: document.getElementById('skip-btn'),\n            skipWarning: document.getElementById('skip-warning'),\n            confirmSkipButton: document.getElementById('confirm-skip'),\n            cancelSkipButton: document.getElementById('cancel-skip'),\n            results: document.getElementById('results'),\n            loading: document.getElementById('loading'),\n            burnoutScore: document.getElementById('burnout-score'),\n            subcategories: document.getElementById('subcategories'),\n            interpretationContent: document.getElementById('interpretation-content'),\n            adviceContent: document.getElementById('advice-content'),\n            restartButton: document.getElementById('restart-btn')\n        };\n\n        \/\/ Debugging: Controleer of de startButton correct wordt gevonden\n        console.log(\"Start button element:\", elements.startButton);\n\n        \/\/ Utility functions\n        function getColor(percentage) {\n            if (percentage <= 25) return '#28a745'; \/\/ Groen\n            if (percentage <= 50) return '#ffc107'; \/\/ Geel\n            if (percentage <= 75) return '#fd7e14'; \/\/ Oranje\n            return '#dc3545'; \/\/ Rood\n        }\n\n        function getScale(index) {\n            if (index < 20) return config.scales[0];\n            if (index < 36) return config.scales[1];\n            return config.scales[2];\n        }\n\n        function getCurrentCategory() {\n            const index = state.currentQuestionIndex;\n            return config.categories.find(cat => index >= cat.start && index <= cat.end);\n        }\n\n        \/\/ UI functions\n        function addMessage(text, isUser = false) {\n            console.log(\"Adding message:\", text, \"isUser:\", isUser);\n            if (!elements.chatBox) {\n                console.error(\"chatBox element not found\");\n                return;\n            }\n            const message = document.createElement('div');\n            message.className = 'message ' + (isUser ? 'user-message' : 'bot-message');\n            message.innerText = text;\n            elements.chatBox.appendChild(message);\n            \/\/ Altijd naar onderen scrollen bij een nieuw bericht\n            elements.chatBox.scrollTop = elements.chatBox.scrollHeight;\n            console.log(\"Chatbox scroll position:\", elements.chatBox.scrollTop, \"clientHeight:\", elements.chatBox.clientHeight, \"scrollHeight:\", elements.chatBox.scrollHeight);\n        }\n\n        function showOptions(scale, isFinal = false) {\n            console.log(\"Showing options, isFinal:\", isFinal);\n            if (!elements.optionsContainer) {\n                console.error(\"optionsContainer element not found\");\n                return;\n            }\n            elements.optionsContainer.innerHTML = '';\n\n            if (isFinal) {\n                const viewResultsBtn = document.createElement('button');\n                viewResultsBtn.className = 'nav-btn';\n                viewResultsBtn.innerText = 'Resultaten bekijken';\n                viewResultsBtn.style.background = '#28a745';\n                viewResultsBtn.style.color = 'white';\n                viewResultsBtn.onclick = showResultsWithLoading;\n                elements.optionsContainer.appendChild(viewResultsBtn);\n            } else {\n                scale.forEach((label, value) => {\n                    const btn = document.createElement('button');\n                    btn.className = 'option-btn';\n                    btn.innerText = label;\n                    btn.setAttribute('data-value', value);\n                    btn.onclick = () => {\n                        btn.classList.add('clicked');\n                        sendResponse(value);\n                    };\n                    elements.optionsContainer.appendChild(btn);\n                });\n            }\n        }\n\n        function updateProgressBar() {\n            const progress = (state.currentQuestionIndex \/ config.questions.length) * 100;\n            elements.progressBar.style.width = `${progress}%`;\n        }\n\n        \/\/ Core app functions\n        function startChat() {\n            console.log(\"startChat function called\");\n            state.userName = elements.userNameInput.value.trim() || \"jij\";\n            state.currentQuestionIndex = 0;\n            state.answers = [];\n            console.log(\"Starting chat for:\", state.userName);\n\n            elements.welcomeScreen.style.display = 'none';\n            elements.chatContainer.style.display = 'block';\n            elements.results.style.display = 'none';\n\n            elements.chatBox.innerHTML = ''; \/\/ Clear chat box\n            addMessage(`Hoi ${state.userName}! Welkom bij de Burnout Risico Assessment Chat. Klik op een optie. Je kunt ook overslaan of teruggaan. Laten we beginnen!`);\n            askQuestion();\n        }\n\n        function restartAssessment() {\n            console.log(\"restartAssessment function called\");\n            state.currentQuestionIndex = 0;\n            state.answers = [];\n            state.isSkipWarningVisible = false;\n\n            elements.results.style.display = 'none';\n            elements.welcomeScreen.style.display = 'block';\n            elements.userNameInput.value = state.userName;\n        }\n\n        function askQuestion() {\n            console.log(\"Asking question, index:\", state.currentQuestionIndex);\n            elements.inputArea.style.display = 'block';\n\n            if (state.currentQuestionIndex < config.questions.length) {\n                const currentCategory = getCurrentCategory();\n                const prevCategory = state.currentQuestionIndex > 0 ? \n                    config.categories.find(cat => state.currentQuestionIndex - 1 >= cat.start && state.currentQuestionIndex - 1 <= cat.end) : null;\n\n                \/\/ Show category header if we're at the first question or switching categories\n                if (state.currentQuestionIndex === 0 || (currentCategory && prevCategory && currentCategory.name !== prevCategory.name)) {\n                    addMessage(`${state.userName}, we gaan nu over naar vragen over ${currentCategory.name}.`);\n                }\n\n                addMessage(`${state.currentQuestionIndex + 1}. ${config.questions[state.currentQuestionIndex]}`);\n                const scale = getScale(state.currentQuestionIndex);\n                showOptions(scale);\n                updateProgressBar();\n            } else {\n                addMessage(`Dit was het, ${state.userName}! Bedankt voor je antwoorden. Klik op 'Resultaten bekijken' om je score te zien, of ga terug naar de vorige vraag.`);\n                showOptions([], true);\n            }\n        }\n\n        function sendResponse(value) {\n            console.log(\"sendResponse function called with value:\", value);\n            const label = getScale(state.currentQuestionIndex)[value];\n            addMessage(label, true);\n            state.answers[state.currentQuestionIndex] = value;\n\n            if ((state.currentQuestionIndex + 1) % 10 === 0) {\n                const remainingQuestions = config.questions.length - state.currentQuestionIndex - 1;\n                addMessage(`Goed gedaan ${state.userName}! Nog maar ${remainingQuestions} vragen te gaan.`);\n            }\n\n            state.currentQuestionIndex++;\n            setTimeout(() => askQuestion(), 500);\n        }\n\n        function goBack() {\n            console.log(\"goBack function called\");\n            if (state.currentQuestionIndex > 0) {\n                state.currentQuestionIndex--;\n                state.answers.pop();\n\n                \/\/ Remove last two messages (the question and possibly user's answer)\n                elements.chatBox.removeChild(elements.chatBox.lastChild);\n                if (elements.chatBox.lastChild && elements.chatBox.lastChild.classList.contains('user-message')) {\n                    elements.chatBox.removeChild(elements.chatBox.lastChild);\n                }\n\n                updateProgressBar();\n                askQuestion();\n            } else {\n                addMessage(\"Je bent al bij de eerste vraag!\");\n            }\n        }\n\n        function showSkipWarning() {\n            console.log(\"showSkipWarning function called\");\n            state.isSkipWarningVisible = true;\n            elements.skipWarning.style.display = 'block';\n        }\n\n        function confirmSkip() {\n            console.log(\"confirmSkip function called\");\n            state.isSkipWarningVisible = false;\n            elements.skipWarning.style.display = 'none';\n\n            addMessage(\"Vraag overgeslagen\", true);\n            state.answers[state.currentQuestionIndex] = null; \/\/ Use null for skipped questions\n            state.currentQuestionIndex++;\n            setTimeout(() => askQuestion(), 500);\n        }\n\n        function cancelSkip() {\n            console.log(\"cancelSkip function called\");\n            state.isSkipWarningVisible = false;\n            elements.skipWarning.style.display = 'none';\n        }\n\n        function showResultsWithLoading() {\n            console.log(\"Showing loading screen...\");\n            elements.inputArea.style.display = 'none';\n            elements.loading.style.display = 'block';\n            elements.chatContainer.style.display = 'block';\n\n            \/\/ Ensure we're giving some time for the spinner to be visible\n            setTimeout(showResults, 800);\n        }\n\n        async function showResults() {\n            console.log(\"Starting showResults...\");\n            const startTime = Date.now();\n            try {\n                \/\/ Fill in missing answers with a mid-value (2)\n                const filledAnswers = state.answers.map(ans => ans === null || ans === undefined ? 2 : ans);\n\n                \/\/ Calculate overall burnout score\n                const burnoutScore = filledAnswers.reduce((sum, score) => sum + score, 0);\n                const maxScore = config.questions.length * 4;\n                const percentage = Math.round((burnoutScore \/ maxScore) * 100);\n                const color = getColor(percentage);\n\n                \/\/ Calculate subscores\n                const emotioneleUitputting = [0, 1, 2, 3, 4, 5].reduce((sum, i) => sum + filledAnswers[i], 0);\n                const cynismeDistantie = [6, 7, 8, 9, 10].reduce((sum, i) => sum + filledAnswers[i], 0);\n                const verminderdeCompetentieRaw = [11, 12, 13, 14, 15].reduce((sum, i) => sum + filledAnswers[i], 0);\n                const verminderdeCompetentie = 20 - verminderdeCompetentieRaw;\n                const cognitieveEmotioneleBeperkingen = [16, 17, 18, 19].reduce((sum, i) => sum + filledAnswers[i], 0);\n\n                \/\/ Calculate percentages\n                const emotioneleUitputtingPct = Math.round((emotioneleUitputting \/ 24) * 100);\n                const cynismeDistantiePct = Math.round((cynismeDistantie \/ 20) * 100);\n                const verminderdeCompetentiePct = Math.round((verminderdeCompetentie \/ 20) * 100);\n                const cognitieveEmotioneleBeperkingenPct = Math.round((cognitieveEmotioneleBeperkingen \/ 16) * 100);\n\n                \/\/ Prepare API data\n                const apiData = prepareAPIData(burnoutScore);\n                const { interpretation, advice } = await sendToAPI(apiData);\n\n                const elapsed = Date.now() - startTime;\n                const delay = Math.max(500 - elapsed, 0);\n                setTimeout(() => {\n                    console.log(\"Rendering results...\");\n                    elements.chatContainer.style.display = 'none';\n                    console.log(\"Hiding loading...\");\n                    elements.loading.style.display = 'none';\n                    console.log(\"Showing results...\");\n                    elements.results.style.display = 'block';\n                    elements.burnoutScore.innerHTML = `Jouw score: <span style=\"color: ${color}\">${burnoutScore} van ${maxScore} (${percentage}%)<\/span>`;\n                    elements.subcategories.innerHTML = `\n                        <span class=\"subcategory\">Emotionele Uitputting: <span style=\"color: ${getColor(emotioneleUitputtingPct)}\">${emotioneleUitputtingPct}%<\/span><span class=\"tooltip\">Gevoel van emotionele vermoeidheid door werk<\/span><\/span>\n                        <span class=\"subcategory\">Cynisme\/Distantie: <span style=\"color: ${getColor(cynismeDistantiePct)}\">${cynismeDistantiePct}%<\/span><span class=\"tooltip\">Afstand of negativiteit t.o.v. werk<\/span><\/span>\n                        <span class=\"subcategory\">Verminderde Competentie: <span style=\"color: ${getColor(verminderdeCompetentiePct)}\">${verminderdeCompetentiePct}%<\/span><span class=\"tooltip\">Gevoel van afnemende bekwaamheid<\/span><\/span>\n                        <span class=\"subcategory\">Cognitieve\/Emotionele Beperkingen: <span style=\"color: ${getColor(cognitieveEmotioneleBeperkingenPct)}\">${cognitieveEmotioneleBeperkingenPct}%<\/span><span class=\"tooltip\">Moeite met concentratie of emoties<\/span><\/span>\n                    `;\n                    elements.interpretationContent.innerHTML = interpretation;\n                    elements.adviceContent.innerHTML = advice;\n                }, delay);\n            } catch (error) {\n                console.error('Error in showResults:', error);\n                const elapsed = Date.now() - startTime;\n                const delay = Math.max(500 - elapsed, 0);\n                setTimeout(() => {\n                    elements.chatContainer.style.display = 'none';\n                    elements.loading.style.display = 'none';\n                    elements.results.style.display = 'block';\n                    elements.burnoutScore.innerText = 'Oeps, het laden is mislukt.';\n                    elements.interpretationContent.innerText = 'Er ging iets mis bij het ophalen van je resultaten. Probeer het nog eens!';\n                    elements.adviceContent.innerText = 'Als je je zorgen maakt, neem contact op met een coach of professional.';\n                }, delay);\n            }\n        }\n\n        async function sendToAPI(data) {\n            try {\n                const response = await fetch('https:\/\/api.openai.com\/v1\/chat\/completions', {\n                    method: 'POST',\n                    headers: {\n                        'Content-Type': 'application\/json',\n                        'Authorization': 'Bearer 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'\n                    },\n                    body: JSON.stringify({\n                        model: 'gpt-3.5-turbo',\n                        messages: [\n                            {\n                                role: 'system',\n                                content: `Je bent een psychologische assistent die een gedetailleerde en gepersonaliseerde burnout-analyse maakt voor ${state.userName}. Gebruik \"jij\" of \"je\" in je antwoord. Formatteer je antwoord als platte tekst zonder Markdown-symbolen (gebruik geen ### of **), maar met duidelijke secties en structuur. Gebruik HTML-tags zoals <h4>, <ul>, en <li> om een gestructureerde lay-out te cre\u00ebren die er mooi uitziet in een webinterface.`\n                            },\n                            {\n                                role: 'user',\n                                content: `Analyseer deze burnout-data (48 antwoorden, 0-4 schaal): ${data}. Geef een gedetailleerde uitleg voor \"Wat betekent dit\" gebaseerd op de totaalscore en de onderverdelingen (Emotionele Uitputting, Cynisme\/Distantie, Verminderde Competentie, Cognitieve\/Emotionele Beperkingen). Geef een inleiding, gevolgd door een analyse per subcategorie, en sluit af met een samenvatting die antwoordt op: \"Mag ik ervan uitgaan dat ik een burn-out heb, of de kans groot is dat ik op weg ben om een burn-out te krijgen?\" Geef daarna een \"Advies\" dat specifiek en gepersonaliseerd is op basis van de scores per subcategorie, met concrete acties of professionals om te raadplegen, in een gestructureerde lijst. Gebruik HTML-tags zoals <h4>, <ul>, en <li> om de secties duidelijk te structureren.`\n                            }\n                        ]\n                    })\n                });\n                if (!response.ok) throw new Error('API-aanroep mislukt: ' + response.status);\n                const result = await response.json();\n                const fullResponse = result.choices[0].message.content;\n\n                const parts = fullResponse.split('<h4>Advies<\/h4>');\n                let interpretation = parts[0]?.trim() || fullResponse;\n                let advice = parts.length > 1 ? `${'<h4>Advies<\/h4>'}${parts[1].trim()}` : 'Neem contact op met een professional voor een persoonlijke evaluatie.';\n                if (!interpretation) interpretation = \"Geen specifieke interpretatie ontvangen van de API.\";\n\n                return { interpretation, advice };\n            } catch (error) {\n                console.error('API Error:', error);\n                return {\n                    interpretation: 'Er ging iets mis bij het ophalen van de analyse.',\n                    advice: 'Probeer het later opnieuw of neem contact op met een professional.'\n                };\n            }\n        }\n\n        function prepareAPIData(burnoutScore) {\n            const filledAnswers = state.answers.map(ans => ans === null || ans === undefined ? 2 : ans);\n\n            const emotioneleUitputting = [0, 1, 2, 3, 4, 5].reduce((sum, i) => sum + filledAnswers[i], 0);\n            const cynismeDistantie = [6, 7, 8, 9, 10].reduce((sum, i) => sum + filledAnswers[i], 0);\n            const verminderdeCompetentieRaw = [11, 12, 13, 14, 15].reduce((sum, i) => sum + filledAnswers[i], 0);\n            const verminderdeCompetentie = 20 - verminderdeCompetentieRaw;\n            const cognitieveEmotioneleBeperkingen = [16, 17, 18, 19].reduce((sum, i) => sum + filledAnswers[i], 0);\n\n            const emotioneleUitputtingPct = Math.round((emotioneleUitputting \/ 24) * 100);\n            const cynismeDistantiePct = Math.round((cynismeDistantie \/ 20) * 100);\n            const verminderdeCompetentiePct = Math.round((verminderdeCompetentie \/ 20) * 100);\n            const cognitieveEmotioneleBeperkingenPct = Math.round((cognitieveEmotioneleBeperkingen \/ 16) * 100);\n\n            return JSON.stringify({\n                answers: filledAnswers,\n                totalScore: burnoutScore,\n                subcategories: {\n                    \"Emotionele Uitputting\": `${emotioneleUitputtingPct}%`,\n                    \"Cynisme\/Distantie\": `${cynismeDistantiePct}%`,\n                    \"Verminderde Competentie\": `${verminderdeCompetentiePct}%`,\n                    \"Cognitieve\/Emotionele Beperkingen\": `${cognitieveEmotioneleBeperkingenPct}%`\n                }\n            });\n        }\n\n        \/\/ Event listeners\n        if (elements.startButton) {\n            elements.startButton.addEventListener('click', () => {\n                console.log(\"Start button clicked via event listener\");\n                startChat();\n            });\n        } else {\n            console.error(\"Start button not found in DOM\");\n        }\n\n        elements.backButton.addEventListener('click', goBack);\n        elements.skipButton.addEventListener('click', showSkipWarning);\n        elements.confirmSkipButton.addEventListener('click', confirmSkip);\n        elements.cancelSkipButton.addEventListener('click', cancelSkip);\n        elements.restartButton.addEventListener('click', restartAssessment);\n    });\n<\/script>\t\t\t\t<\/div>\n\t\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>Welkom bij de Assessment Welkom bij de Burnout Risico Assessment Chat. Deze tool helpt je om je burnout-risico te beoordelen door middel van 48 vragen, gebaseerd op wetenschappelijk gevalideerde methoden zoals de Maslach Burnout Inventory (MBI), de Utrecht Burnout Scale (UBOS) en de Burnout Assessment Tool (BAT). Dit zorgt voor een relatief betrouwbare indicatie van [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6391","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/pages\/6391","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/comments?post=6391"}],"version-history":[{"count":0,"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/pages\/6391\/revisions"}],"wp:attachment":[{"href":"https:\/\/junkbrothers.be\/fr\/wp-json\/wp\/v2\/media?parent=6391"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}