SEND all files + questionnaires + json + data_tests

public/script_html_infos.js

@@ -0,0 +1,100 @@
+// Création de la boîte d'information
+const infoBox = document.createElement('div');
+infoBox.id = 'info-box';
+infoBox.innerHTML = `
+    <div id="info-toggle">
+        <label>
+            <input type="checkbox" id="toggle-display"> <span id="toggle_hide_text">Masquer</span>
+        </label>
+    </div>
+    <div id="info-content">
+        <div><strong>Parent :</strong> <span id="element-parent"></span></div>
+        <div><strong>Enfant :</strong> <span id="element-info"></span></div>
+    </div>
+`;
+
+// Ajout des styles
+const style = document.createElement('style');
+style.textContent = `
+    #info-box {
+        position: fixed;
+        top: 20px;
+        right: 40px;
+        background: #333;
+        color: white;
+        padding: 10px 11px;
+        border-radius: 8px 8px 0 0;
+        min-width: 250px;
+        max-width: 250px;
+        overflow: hidden;
+        box-shadow: 0 4px 6px rgba(0,0,0,0.3);
+        font-size: 14px;
+        display: none;
+        z-index: 9999;
+    }
+    
+    #info-box.visible {
+        display: block;
+    }
+        
+    
+    #info-box div {
+        margin: 5px 0;
+    }
+    
+    #info-box strong {
+        color: #4CAF50;
+    }
+    
+    #info-toggle {
+        margin-bottom: 10px;
+        padding-bottom: 10px;
+        border-bottom: 1px solid #555;
+    }
+    
+    #info-box.no_infos {
+        max-width: 200px;
+        display: block;
+        overflow: hidden;
+        min-width: auto;
+    }
+
+    #info-box.no_infos {
+        #info-toggle {
+            border-bottom: 0px solid #555;
+            padding: 0;
+            margin: 0;
+        }
+        #toggle_hide_text {
+            display: none;
+        }
+    }
+    #info-toggle label {
+        cursor: pointer;
+        user-select: none;
+    }
+    
+    #info-content.hidden {
+        display: none;
+    }
+    .info_id {
+        color: #ff0095;
+    }
+    .info_class {
+        color:rgb(0, 200, 215);
+    }
+    .info_el {
+        color:rgb(0, 179, 255);
+    }
+    .info_prop {
+        margin-right: 2px;
+    }
+`;
+
+// Injection dans le DOM
+document.head.appendChild(style);
+// document.body.appendChild(infoBox);
+
+
+
+