Type the Answers or Die
Info
Created On: July 12, 2023
Created By:
AI
Model: gpt-3.5-turbo-16k-0613
Time: 18 seconds
Prompt Tokens: 898
Completion Tokens: 1291
Total Token Cost: 2189
Get This App On Your Website
Copy Code
1. Copy the code above with the iframe and link.
2. Paste the code into your website.
3. Resize the iframe to fit your website.
Javascript, HTML, CSS Code
Copy
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Type the Answers or Die</title>
<meta name="description" content="A game where you type the answers or die">
<meta name="keywords" content="game, answers, type, die">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Built-In Functions for Apps -->
<script type="text/javascript">
var localStoragePrefix = "ct-168918116596247";
var lastSave = 0;
// save to localstorage
function saveLocal(data) {
if (Date.now() - lastSave < 1000) {
return;
}
// save to cookie
let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict";
cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString();
document.cookie = cookie;
lastSave = Date.now();
}
// load from localstorage
function loadLocal() {
var cookiePrefix = localStoragePrefix + "=";
var cookieStart = document.cookie.indexOf(cookiePrefix);
if (cookieStart > -1) {
let cookieEnd = document.cookie.indexOf(";", cookieStart);
if (cookieEnd == -1) {
cookieEnd = document.cookie.length;
}
var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd);
return JSON.parse(cookieData);
}
}
</script>
<script type="text/javascript">
// Game Logic Goes Here
var questions = [
{ question: "What is the capital of France?", answer: "Paris" },
{ question: "What is the largest planet in our solar system?", answer: "Jupiter" },
{ question: "Which country is home to the kangaroo?", answer: "Australia" },
{ question: "What is the chemical symbol for gold?", answer: "Au" },
{ question: "Which animal is the tallest in the world?", answer: "Giraffe" }
];
var currentQuestionIndex = 0;
var score = 0;
function displayQuestion() {
var question = questions[currentQuestionIndex];
$("#question").text(question.question);
}
function checkAnswer() {
var question = questions[currentQuestionIndex];
var userAnswer = $("#answer").val();
if (userAnswer.toLowerCase() === question.answer.toLowerCase()) {
score++;
} else {
// Game over
$("#game-over").show();
$("#score").text(score);
$("#answer").prop("disabled", true);
return;
}
currentQuestionIndex++;
if (currentQuestionIndex < questions.length) {
displayQuestion();
} else {
// Game over
$("#game-over").show();
$("#score").text(score);
$("#answer").prop("disabled", true);
}
$("#answer").val("");
}
$(document).ready(function() {
displayQuestion();
$("#submit").click(function() {
checkAnswer();
});
});
</script>
<style>
/* App CSS Goes Here */
body {
background-color: #f1f1f1;
font-family: 'Roboto', sans-serif;
}
.container {
max-width: 500px;
margin: 0 auto;
padding: 20px;
text-align: center;
}
h1 {
color: #333333;
font-size: 24px;
font-weight: bold;
}
p {
color: #666666;
font-size: 16px;
}
input[type="text"] {
width: 100%;
max-width: 300px;
padding: 10px;
margin-top: 20px;
margin-bottom: 20px;
border: 2px solid #333333;
border-radius: 5px;
font-size: 16px;
}
button {
padding: 10px 20px;
background-color: #333333;
color: #ffffff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
button:hover {
background-color: #555555;
}
#game-over {
display: none;
margin-top: 30px;
}
#score {
font-size: 20px;
font-weight: bold;
color: #333333;
}
</style>
<link rel="canonical" href="https://calculator.tools/prompt/1482/">
<meta charset="utf-8">
</head>
<body>
<div id="main-container" class="container">
<h1>Type the Answers or Die</h1>
<p id="question"></p>
<input type="text" id="answer" placeholder="Type your answer">
<button id="submit">Submit</button>
<div id="game-over">
<p>Game Over!</p>
<p>Your score: <span id="score"></span></p>
</div>
</div>
<script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script>
<script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script>
</body>
</html>