The elements to clone are now embedded in the corresponding JavaScript file, so there is no need for them to be kept in the HTML page. Also remove on the culprit img element the src attribute to avoid network requests on an unexisting file and the alt attribute, as they are appended dynamically with JavaScript.
124 lines
8.3 KiB
HTML
124 lines
8.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<title>Truth Inquiry</title>
|
||
<link rel="stylesheet" href="/static/css/game_ui.css">
|
||
<link rel="stylesheet" href="/static/css/game_ui_game.css">
|
||
<link rel="icon" href="/static/images/favicon/favicon_32.png" type="image/png" sizes="32x32">
|
||
<link rel="icon" href="/static/images/favicon/favicon_64.png" type="image/png" sizes="64x64">
|
||
<link rel="icon" href="/static/images/favicon/favicon_96.png" type="image/png" sizes="96x96">
|
||
<link rel="icon" href="/static/images/favicon/favicon_128.png" type="image/png" sizes="128x128">
|
||
<link rel="icon" href="/static/images/favicon/favicon_192.png" type="image/png" sizes="192x192">
|
||
<link rel="icon" href="/static/images/favicon/favicon_256.png" type="image/png" sizes="256x256">
|
||
<link rel="icon" href="/static/images/favicon/favicon_256.png" type="image/png" sizes="512x512">
|
||
<meta name="color-scheme" content="dark light">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<meta charset="UTF-8">
|
||
</head>
|
||
<body class="game_app">
|
||
<div class="current_background"></div>
|
||
<div class="introduction hidden">
|
||
<h1 class="introduction_title">Truth Inquiry</h1>
|
||
<p class="introduction_text">Bienvenue dans Truth Inquiry, vous allez intégrer la peau d’un enquêteur.<br><br>Vous avez été donné responsable de résoudre une enquête et devez trouver le coupable d’un vol.<br><br>Cliquez sur la flèche pour découvrir les suspects et les interroger.</p>
|
||
<button id="introduction_next_btn" class="next_btn" aria-label="Commencer">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||
<path d="m23.15 36.95-17.3-11.1Q4.7 25.25 4.7 24t1.15-1.9L23.15 11q1.15-.7 2.35-.075 1.2.625 1.2 2.025v8.75h15.8q.95 0 1.625.675T44.8 24q0 .95-.675 1.6-.675.65-1.625.65H26.7V35q0 1.45-1.2 2.075-1.2.625-2.35-.125Z">
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="interrogation hidden">
|
||
<h1 class="interrogation_title">Suspects</h1>
|
||
<button id="interrogation_next_btn" class="next_btn" aria-label="Passer à la suite">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||
<path d="m23.15 36.95-17.3-11.1Q4.7 25.25 4.7 24t1.15-1.9L23.15 11q1.15-.7 2.35-.075 1.2.625 1.2 2.025v8.75h15.8q.95 0 1.625.675T44.8 24q0 .95-.675 1.6-.675.65-1.625.65H26.7V35q0 1.45-1.2 2.075-1.2.625-2.35-.125Z">
|
||
</svg>
|
||
</button>
|
||
<div class="suspects" id="interrogation_suspects">
|
||
</div>
|
||
</div>
|
||
<div class="emotion_and_culprit_choices hidden">
|
||
<h1 class="emotion_and_culprit_choices_title">Choix du coupable et émotion des suspects</h1>
|
||
<button id="emotion_and_culprit_choices_next_btn" class="next_btn hidden" aria-label="Passer à la suite">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||
<path d="m23.15 36.95-17.3-11.1Q4.7 25.25 4.7 24t1.15-1.9L23.15 11q1.15-.7 2.35-.075 1.2.625 1.2 2.025v8.75h15.8q.95 0 1.625.675T44.8 24q0 .95-.675 1.6-.675.65-1.625.65H26.7V35q0 1.45-1.2 2.075-1.2.625-2.35-.125Z">
|
||
</svg>
|
||
</button>
|
||
<div class="suspects" id="culprits_choices">
|
||
</div>
|
||
</div>
|
||
<div class="interrogation_suspect hidden">
|
||
<h1 class="interrogation_title">Poser une question au suspect</h1>
|
||
<div class="questions_and_image">
|
||
<button id="interrogation_suspect_previous_btn" class="next_btn" aria-label="Revenir à la sélection du suspect">
|
||
<svg class="next_btn" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||
<path d="m23.15 36.95-17.3-11.1Q4.7 25.25 4.7 24t1.15-1.9L23.15 11q1.15-.7 2.35-.075 1.2.625 1.2 2.025v8.75h15.8q.95 0 1.625.675T44.8 24q0 .95-.675 1.6-.675.65-1.625.65H26.7V35q0 1.45-1.2 2.075-1.2.625-2.35-.125Z"/>
|
||
</svg>
|
||
</button>
|
||
<img class="image_interrogation suspect_picture" id="currentNpcPicure" src="">
|
||
<div class="questions_list">
|
||
<button class="action_button question_button" id="QA_0" >Où étiez vous hier soir ?</button>
|
||
<button class="action_button question_button" id="QA_1" >Avec qui étiez vous ?</button>
|
||
</div>
|
||
</div>
|
||
<div class="question_answer hidden">
|
||
<h1 class="anwser_title">Réponse du suspect à la question</h1>
|
||
<p class="suspect_answer"></p>
|
||
</div>
|
||
</div>
|
||
<div class="results_game hidden">
|
||
<h1 class="results_title">Résultats</h1>
|
||
<div class="reveal_and_scores">
|
||
<div class="scores">
|
||
<div class="player_score">
|
||
<h1 class="score_title">Votre score est de :</h1>
|
||
<h2 class="reveal_score">4/5</h2>
|
||
</div>
|
||
<div class="results_game_multiplayer">
|
||
<div class="players_list">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="reveal_culprit">
|
||
<h2 class="reveal_culprit_title">Le coupable était ...</h2>
|
||
<img class="suspect_picture" id="culprit" draggable="false">
|
||
</div>
|
||
</div>
|
||
<div class="summary">
|
||
<h1 class="summary_title">Débrief</h1>
|
||
<div class="suspects_list">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="alert_dialog_background"></div>
|
||
<div class="unsupported_browser">
|
||
<div id="unsupported_browser_dialog" class="alert_dialog">
|
||
<h3 class="alert_dialog_title">Navigateur non supporté</h3>
|
||
<p class="alert_dialog_msg unsupported_browser_msg"></p>
|
||
<div class="footer_links">
|
||
<a href="/privacy" class="footer_link link" target="_blank" title="Consulter la politique de confidentialité de Truth Inquiry (ouverture dans un nouvel onglet)">Politique de confidentialité</a>
|
||
<a href="/licenses" class="footer_link link" target="_blank" title="Consulter les licenses des éléments non-originaux de Truth Inquiry (ouverture dans un nouvel onglet)">Licenses</a>
|
||
<a href="/legal" class="footer_link link" target="_blank" title="Consulter les mentions légales de Truth Inquiry (ouverture dans un nouvel onglet)">Mentions légales</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<noscript>
|
||
<div class="alert_dialog_background" style="display: block;"></div>
|
||
<div class="js_requirement">
|
||
<div id="js_requirement_dialog" class="alert_dialog" style="display: block;">
|
||
<h3 class="alert_dialog_title" style="display: block;">JavaScript nécessaire</h3>
|
||
<p class="alert_dialog_msg unsupported_browser_msg" style="display: block;">Désolé, mais JavaScript est nécessaire pour faire fonctionner Truth Inquiry. Veuillez l'activer dans votre navigateur ou en utiliser un qui le supporte afin de pouvoir jouer au jeu.</p>
|
||
<div class="footer_links">
|
||
<a href="/privacy" class="footer_link link" target="_blank" title="Consulter la politique de confidentialité de Truth Inquiry (ouverture dans un nouvel onglet)">Politique de confidentialité</a>
|
||
<a href="/licenses" class="footer_link link" target="_blank" title="Consulter les licenses des éléments non-originaux de Truth Inquiry (ouverture dans un nouvel onglet)">Licenses</a>
|
||
<a href="/legal" class="footer_link link" target="_blank" title="Consulter les mentions légales de Truth Inquiry (ouverture dans un nouvel onglet)">Mentions légales</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</noscript>
|
||
<script src="/static/js/socket.io_v4.4.1/socket.io.min.js"></script>
|
||
<script src="/static/js/api.js"></script>
|
||
<script src="/static/js/game_common.js"></script>
|
||
<script src="/static/js/game.js"></script>
|
||
</body>
|
||
</html>
|