Javascript, HTML, CSS Code
<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>Rock, Paper, Scissors AI Application</title> <meta name="description" content="Play Rock, Paper, Scissors against a computer opponent, with insightful statistics and odds based on your performance."> <meta name="keywords" content="rock paper scissors, AI, statistics, game"> <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"> <script type="text/javascript"> var localStoragePrefix = "ct-168166761967066"; 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"> var wins = 0, losses = 0, ties = 0, totalGames = 0; var winStreak = 0, lossStreak = 0, longestWinStreak = 0, longestLossStreak = 0; var choices = ['rock', 'paper', 'scissors']; var userChoice, computerChoice; function getComputerChoice() { return choices[Math.floor(Math.random() * 3)]; } function playGame(choice) { userChoice = choice; if (userChoice === null) { return false; } computerChoice = getComputerChoice(); compareChoices(userChoice, computerChoice); updateStats(); return true; } function compareChoices(user, computer) { if (user === computer) { ties++; winStreak = 0; lossStreak = 0; } else if ( (user === 'rock' && computer === 'scissors') || (user === 'paper' && computer === 'rock') || (user === 'scissors' && computer === 'paper') ) { wins++; winStreak++; lossStreak = 0; longestWinStreak = Math.max(longestWinStreak, winStreak); } else { losses++; lossStreak++; winStreak = 0; longestLossStreak = Math.max(longestLossStreak, lossStreak); } totalGames++; } function calculateOdds() { const expectedWinRate = 1 / 3; const currentWinRate = wins / totalGames; const zScore = (currentWinRate - expectedWinRate) / Math.sqrt((expectedWinRate * (1 - expectedWinRate)) / totalGames); return (1 - (0.5 * (1 + erf(zScore / Math.sqrt(2))))); } function updateStats() { $("#computer-choice").text(computerChoice); $("#user-choice").text(userChoice); $("#wins").text(wins); $("#losses").text(losses); $("#ties").text(ties); $("#win-streak").text(winStreak); $("#loss-streak").text(lossStreak); $("#longest-win-streak").text(longestWinStreak); $("#longest-loss-streak").text(longestLossStreak); $("#total-games").text(totalGames); $("#odds").text((calculateOdds() * 100).toFixed(2) + '%'); } function erf(x) { var sign = x >= 0 ? 1 : -1; x = Math.abs(x); var a1 = 0.254829592; var a2 = -0.284496736; var a3 = 1.421413741; var a4 = -1.453152027; var a5 = 1.061405429; var p = 0.3275911; var t = 1 / (1 + p * x); var y = 1 - (((((a5 * t + a4) * t) + a3) * t + a2) * t + a1) * t * Math.exp(-x * x); return sign * y; } $(document).ready(function() { $(".choice-button").click(function() { playGame($(this).data("choice")); }); }); </script> <style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #f5f5f5; } #stats-table { margin: 20px auto; } .choice-button { display: inline-block; margin: 10px; font-size: 24px; background-color: #007bff; border: none; border-radius: 4px; color: white; padding: 10px 20px; cursor: pointer; } .choices-container { text-align: center; } </style> <link rel="canonical" href="https://calculator.tools/prompt/496/"> <meta charset="utf-8"> </head> <body> <div id="main-container" class="container"> <h1 class="text-center mt-4">Rock, Paper, Scissors AI Application</h1> <table id="stats-table" class="table table-bordered"> <tbody> <tr> <td>Computer Choice</td> <td id="computer-choice"></td> </tr> <tr> <td>User Choice</td> <td id="user-choice"></td> </tr> <tr> <td>Wins</td> <td id="wins"></td> </tr> <tr> <td>Losses</td> <td id="losses"></td> </tr> <tr> <td>Ties</td> <td id="ties"></td> </tr> <tr> <td>Current Win Streak</td> <td id="win-streak"></td> </tr> <tr> <td>Current Loss Streak</td> <td id="loss-streak"></td> </tr> <tr> <td>Longest Win Streak</td> <td id="longest-win-streak"></td> </tr> <tr> <td>Longest Loss Streak</td> <td id="longest-loss-streak"></td> </tr> <tr> <td>Total Games Played</td> <td id="total-games"></td> </tr> <tr> <td>Odds of Playing Better</td> <td id="odds"></td> </tr> </tbody> </table> <div class="choices-container"> <button class="choice-button" data-choice="rock">Rock</button> <button class="choice-button" data-choice="paper">Paper</button> <button class="choice-button" data-choice="scissors">Scissors</button> <button class="choice-button" onclick="window.close()">Exit</button> </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>
Rock, Paper, Scissors AI Application
Calculator Tools