{"id":1897,"date":"2024-02-23T15:36:32","date_gmt":"2024-02-23T13:36:32","guid":{"rendered":"https:\/\/digitalrise.art\/?page_id=1897"},"modified":"2024-02-23T15:52:22","modified_gmt":"2024-02-23T13:52:22","slug":"%d7%9e%d7%a9%d7%97%d7%a7-xo","status":"publish","type":"page","link":"https:\/\/digitalrise.art\/?page_id=1897","title":{"rendered":"\u05de\u05e9\u05d7\u05e7 XO"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n Tic Tac Toe 3D<\/title>\r\n <style>\r\n h1 {\r\n text-align: center;\r\n margin-top: 20px;\r\n }\r\n\r\n body {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n min-height: 100vh;\r\n margin: 0;\r\n background-color: #f0f0f0;\r\n font-family: 'Arial', sans-serif;\r\n }\r\n\r\n .score-board {\r\n text-align: center;\r\n width: 100%;\r\n margin: 20px 0;\r\n }\r\n\r\n .game-board {\r\n perspective: 1000px;\r\n display: grid;\r\n grid-template-columns: repeat(3, 100px);\r\n grid-gap: 10px;\r\n margin: 20px;\r\n }\r\n\r\n .cell {\r\n background-color: #f0f0f0;\r\n width: 100px;\r\n height: 100px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n font-size: 2em;\r\n cursor: pointer;\r\n transform-style: preserve-3d;\r\n box-shadow: 5px 5px 15px rgba(0,0,0,0.6);\r\n transition: transform 0.3s;\r\n }\r\n\r\n .cell:hover {\r\n transform: scale(1.1);\r\n }\r\n\r\n .cell.x, .cell.o {\r\n font-size: 4em;\r\n }\r\n\r\n .cell.x {\r\n color: #00BFFF; \/* Light Blue *\/\r\n }\r\n\r\n .cell.o {\r\n color: #FF69B4; \/* Pink *\/\r\n }\r\n\r\n .buttons {\r\n display: flex;\r\n justify-content: center;\r\n gap: 20px;\r\n margin-top: 20px;\r\n }\r\n\r\n .button {\r\n background-color: #FFA500; \/* Neon Orange *\/\r\n color: white;\r\n padding: 10px 20px;\r\n font-size: 16px;\r\n border: none;\r\n cursor: pointer;\r\n border-radius: 5px;\r\n box-shadow: 0 0 10px #FFA500;\r\n transition: background-color 0.3s, box-shadow 0.3s;\r\n }\r\n\r\n .button:hover {\r\n background-color: #000000; \/* Neon Black *\/\r\n box-shadow: 0 0 20px #000000;\r\n }\r\n\r\n .message-3d {\r\n text-align: center;\r\n font-size: 2em;\r\n color: black;\r\n text-shadow: 0 0 5px #FFD700, 0 0 10px #FFD700, 0 0 15px #FFD700, 0 0 20px #FFD700;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <h1>Tic Tac Toe 3D<\/h1>\r\n <div id=\"scoreBoard\" class=\"score-board\">\r\n X\u05e9\u05d7\u05e7\u05df: <span id=\"scoreX\">0<\/span><br>\r\n O\u05e9\u05d7\u05e7\u05df: <span id=\"scoreO\">0<\/span>\r\n <\/div>\r\n <div id=\"gameBoard\" class=\"game-board\"><\/div>\r\n <p id=\"message\" class=\"message-3d\"><\/p>\r\n <div class=\"buttons\">\r\n <button id=\"newGameButton\" class=\"button\">\u05de\u05e9\u05d7\u05e7 \u05d7\u05d3\u05e9<\/button>\r\n <button id=\"resetButton\" class=\"button\">\u05d0\u05e4\u05e1 \u05e0\u05d9\u05e7\u05d5\u05d3<\/button>\r\n <\/div>\r\n <script>\r\n const board = new Array(9).fill('');\r\n let currentPlayer = 'X';\r\n let gameActive = true;\r\n let score = { 'X': 0, 'O': 0 };\r\n const winningCombinations = [\r\n [0, 1, 2],\r\n [3, 4, 5],\r\n [6, 7, 8],\r\n [0, 3, 6],\r\n [1, 4, 7],\r\n [2, 5, 8],\r\n [0, 4, 8],\r\n [2, 4, 6]\r\n ];\r\n\r\n document.addEventListener('DOMContentLoaded', () => {\r\n initializeGame();\r\n document.getElementById('newGameButton').addEventListener('click', resetBoard);\r\n document.getElementById('resetButton').addEventListener('click', resetGame);\r\n updateScoreDisplay();\r\n });\r\n\r\n function initializeGame() {\r\n const gameBoard = document.getElementById('gameBoard');\r\n gameBoard.innerHTML = '';\r\n board.forEach((_, index) => {\r\n const cell = document.createElement('div');\r\n cell.className = 'cell';\r\n cell.dataset.index = index;\r\n cell.addEventListener('click', handleCellClick);\r\n gameBoard.appendChild(cell);\r\n });\r\n }\r\n\r\n function handleCellClick(event) {\r\n const cell = event.target;\r\n const index = parseInt(cell.dataset.index, 10);\r\n if (board[index] !== '' || !gameActive) {\r\n return;\r\n }\r\n\r\n board[index] = currentPlayer;\r\n cell.textContent = currentPlayer;\r\n cell.classList.add(currentPlayer.toLowerCase());\r\n cell.style.boxShadow = `0 0 10px ${currentPlayer === 'X' ? '#00BFFF' : '#FF69B4'}`;\r\n\r\n let winningCombination = checkWin();\r\n if (winningCombination) {\r\n endGame(false, winningCombination);\r\n } else if (isDraw()) {\r\n endGame(true);\r\n } else {\r\n currentPlayer = currentPlayer === 'X' ? 'O' : 'X';\r\n }\r\n }\r\n\r\n function checkWin() {\r\n return winningCombinations.find(combination => {\r\n return combination.every(index => board[index] === currentPlayer);\r\n });\r\n }\r\n\r\n function endGame(draw, winningCombination = []) {\r\n gameActive = false;\r\n const message = document.getElementById('message');\r\n if (draw) {\r\n message.innerHTML = '\u05ea\u05d9\u05e7\u05d5!';\r\n } else {\r\n message.innerHTML = `\u05e9\u05d7\u05e7\u05df ${currentPlayer} \u05e0\u05d9\u05e6\u05d7!`;\r\n message.style.color = currentPlayer === 'X' ? '#00BFFF' : '#FF69B4';\r\n score[currentPlayer]++;\r\n winningCombination.forEach(index => {\r\n const winningCell = document.getElementsByClassName('cell')[index];\r\n winningCell.classList.add('winning');\r\n });\r\n }\r\n updateScoreDisplay();\r\n }\r\n\r\n function isDraw() {\r\n return board.every(cell => cell !== '');\r\n }\r\n\r\n function resetBoard() {\r\n board.fill('');\r\n gameActive = true;\r\n currentPlayer = 'X';\r\n document.getElementById('message').innerHTML = '';\r\n initializeGame();\r\n }\r\n\r\n function resetGame() {\r\n resetBoard();\r\n score = { 'X': 0, 'O': 0 };\r\n updateScoreDisplay();\r\n }\r\n\r\n function updateScoreDisplay() {\r\n document.getElementById('scoreX').textContent = score['X'];\r\n document.getElementById('scoreO').textContent = score['O'];\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n \r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7e0dea7 elementor-widget elementor-widget-heading\" data-id=\"7e0dea7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/drdigital.com.co\/\">\u00a9 Copyright 2024 powered by DR DIGITAL <\/a><\/p>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Tic Tac Toe 3D Tic Tac Toe 3D X\u05e9\u05d7\u05e7\u05df: 0 O\u05e9\u05d7\u05e7\u05df: 0 \u05de\u05e9\u05d7\u05e7 \u05d7\u05d3\u05e9 \u05d0\u05e4\u05e1 \u05e0\u05d9\u05e7\u05d5\u05d3 \u00a9 Copyright 2024 powered by DR DIGITAL<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_eb_attr":"","content-type":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1897","page","type-page","status-publish","hentry"],"ams_acf":[],"_links":{"self":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/1897","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1897"}],"version-history":[{"count":13,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/1897\/revisions"}],"predecessor-version":[{"id":1910,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/1897\/revisions\/1910"}],"wp:attachment":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1897"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}