148 lines
10 KiB
HTML
148 lines
10 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<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">
|
||
</head>
|
||
<body class="game_app">
|
||
<div class="current_background"></div>
|
||
<section class="introduction hidden">
|
||
<div class="introduction_left">
|
||
<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" title="Cliquez ici pour commencer à jouer">
|
||
<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="introduction_right">
|
||
<p id="username">Le celebre inspecteur : </p>
|
||
<img class="inspector_picture" src="/static/images/inspector.png" alt="Image de l'inspecteur">
|
||
</div>
|
||
</section>
|
||
<section class="interrogation hidden">
|
||
<h1 class="interrogation_title">Suspects</h1>
|
||
<button id="interrogation_next_btn" class="next_btn" aria-label="Passer à la suite" title="Cliquez ici pour 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>
|
||
<ul class="suspects" id="interrogation_suspects"></ul>
|
||
<Section>
|
||
<button id="open_chat_button" class="open-button">Chat</button>
|
||
<div class="chat-popup" id="chatbox">
|
||
<div class="form-container">
|
||
<h1>Chat</h1>
|
||
<div class="messages_received_container">
|
||
<ul id="message_list" class="messages">
|
||
</ul>
|
||
</div>
|
||
<label for="msg"><b>Message</b></label>
|
||
<input type="text" id="chat_message_box" placeholder="Type message.." name="msg" required></textarea>
|
||
|
||
<button id="chat_button_send" class="btn">Send</button>
|
||
<button id="close_chat_button" type="button" class="btn cancel">Close</button>
|
||
</div>
|
||
</div>
|
||
</Section>
|
||
</section>
|
||
<section 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" title="Cliquez ici pour 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>
|
||
<ul class="suspects" id="culprits_choices"></ul>
|
||
</section>
|
||
<section 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" title="Cliquez ici pour 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" alt="Image du suspect en cours d'interrogation" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==">
|
||
<div class ="npc_answer">
|
||
<h1 class="anwser_title">Réponse du suspect à la question</h1>
|
||
<div class="question_answer">
|
||
<p class="suspect_answer"></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<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>
|
||
</section>
|
||
<section class="results_game hidden">
|
||
<h1 class="results_title">Résultats</h1>
|
||
<a id="return_to_home_btn" class="home_button" href="/" aria-label="Revenir à la page d'accueil du jeu" title="Cliquez ici pour revenir à la page d'accueil du jeu">
|
||
<svg class="home_btn" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||
<path d="M6.9 43.1V17.4L24 4.55 41.15 17.4v25.7h-12.9V27.7h-8.5v15.4Z" />
|
||
</svg>
|
||
</a>
|
||
<div class="reveal_and_scores">
|
||
<div class="scores">
|
||
<div class="player_score">
|
||
<h1 class="score_title">Votre score est de :</h1>
|
||
</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>
|
||
</div>
|
||
</div>
|
||
<div class="summary">
|
||
<h1 class="summary_title">Débrief</h1>
|
||
<div class="suspects_list"></div>
|
||
</div>
|
||
</section>
|
||
<div class="alert_dialog_background"></div>
|
||
<section class="unsupported_browser">
|
||
<dialog 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>
|
||
</dialog>
|
||
</section>
|
||
<noscript>
|
||
<div class="alert_dialog_background"></div>
|
||
<section class="js_requirement">
|
||
<dialog id="js_requirement_dialog" class="alert_dialog alert_dialog_show">
|
||
<h3 class="alert_dialog_title">JavaScript nécessaire</h3>
|
||
<p class="alert_dialog_msg unsupported_browser_msg">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>
|
||
</dialog>
|
||
</section>
|
||
</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>
|