word-games-theme 1.9.2 → 1.9.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e2317f231c380c280e75bffee153fd4f78c074197c5ea4a45feacdc0f3a25c64
-  data.tar.gz: a978524c61f942b3633785153bfa8d0c43c82ff655c8f40c7e30a8020e06d493
+  metadata.gz: fe6a0c90a9f68816a0e01d7489467f882af82e62c3915c3d583ec35aee34d71f
+  data.tar.gz: 81714c5b92127517ad55dceeab38233eab41083e53accee4fb40b43c09a5dba9
 SHA512:
-  metadata.gz: db57a27fc98775cc450e7f3196e793732847d380a4f5e7d67b6567ed104a2d135ba331e57cf200696c52cb6924100a89721d5e0fb32d7eedbd9787f7f130afa1
-  data.tar.gz: 42167d4d687f8b29f37b6ecb504285b5d9a3e682df94cb701ece62f3618ceef8ed5f6af0e3bd6ec0a974c7b7271c8925df64951eba5132c05199b6550518b45b
+  metadata.gz: 3a7029dfa977f362d2f621012ce827620c4d216790092dde9a108ce74e562b083ecbe0bef51f02889522ab609016850f7d4042f237b4d5f0428504a3981b8045
+  data.tar.gz: d5af90f320b910cf83e2434bb647e8e515eb395ac57f5e205adcd8a7860bf973ff38e5aaff6332631e16fb1c06bd56ae28af14ddee8c20b5a6bf64aafb3dbd17

data/_includes/word-game/word-game-generator-online.html

@@ -8,24 +8,21 @@
                 <form id="create-wordle-form">
                     <img src="/assets/images/wordle.png" alt="wordswithletters" style="width:35px; height:35px;">
                     <h3 class="font-weight-bolder mt-4">Make your own wordle</h3>
-
                     <input id="cstmword" autocomplete="off" type="text" class="form-control custom-word"
                         placeholder="Enter Up to 5 Letters?" name="custom-word" required maxlength="5">
-
-                    <button id="generate_link" type="submit" class="btn generate-word-game-link">Generate Link</button>
-                    <span class="open-popup" data-toggle="modal" data-target="#exampleModal"></span>
+                    <button onclick="openModal()" id="generate_link" type="submit"
+                        class="btn generate-word-game-link">Generate Link</button>
+                    <!-- <span class="open-popup" data-toggle="modal" data-target="#exampleModal"></span> -->
                 </form>
             </div>
         </div>
     </div>
 </div>
-
-
-<div class="modal fade modalWrapper" id="exampleModal">
+<div class="modal modalWrapper" id="exampleModal">
     <div class="modal-dialog">
         <div class="modal-content">
-            <div class="modal-header p-0">
-                <button id="close-btn" aria-label="close-btn" type="button" class="close" data-dismiss="modal">
+            <div class="modal-header py-3">
+                <button onclick="closeModal()" id="close-btn" aria-label="close-btn" type="button" class="close" data-dismiss="modal">
                     <span class="times-icon">&times;</span>
                 </button>
             </div>
@@ -55,4 +52,4 @@
             </div>
         </div>
     </div>
-</div>
+</div>

data/_includes/word-game/word-game-play.html

@@ -1,7 +1,7 @@
 <div class="game">
     <div class="game-container">
         <div class="d-flex justify-content-center align-items-center">
-            <div class="pt-2" style="cursor: pointer;" data-toggle="modal" data-target="#how-to-play-wordle">
+            <div class="pt-2" style="cursor: pointer;" onclick="howtoModal()">
                 <i style="font-size:18px" class="bi bi-question-circle"></i>
             </div>
 
@@ -134,12 +134,12 @@
 </div>
 
 
-<div class="modal fade modalWrapper" id="exampleModal">
+<div class="modal modalWrapper" id="resutPopup">
     <div class="modal-dialog" style="max-width:400px">
         <div class="modal-content">
             <div class="modal-header p-2" style="background-color: #f8f9fa;">
                 <div class="gameResult"></div>
-                <button type="button" class="close" style="position: absolute; right: 0; top:-3px;"
+                <button  onclick="btnModal()" type="button" class="close" style="position: absolute; right: 0; top:-3px;"
                     data-dismiss="modal">
                     <span class="times-icon">&times;</span>
                 </button>
@@ -183,13 +183,12 @@
     </div>
 </div>
 
-
-<div class="modal fade" id="how-to-play-wordle" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+<div class="modal" id="how-to-play-wordle">
     <div class="modal-dialog wordletip" style="top:20px !important">
         <div class="modal-content">
             <div class="modal-header px-4 p-2">
                 <h5 class="modal-title" id="exampleModalLabel">How to Play</h5>
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <button onclick="closeModal()" type="button" class="close py-3" style="font-size:20px">
                     <span aria-hidden="true">&times;</span>
                 </button>
             </div>

data/_layouts/aboutUs.html

@@ -100,12 +100,14 @@ p{
             size }} features</a>
         </div>
       </div>
+      {%- if site.internationalizationall -%}
       <div class="col-md-4 my-4">
         <img class="feature-card-img" src="/assets/images/star.svg" loading="lazy" height="48px" width="48px"
           alt="{{data.header}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />
         <div class="feature-card-title">Languages Supported</div>
         <div class="feature-card-desc">Our website currently supports 22 languages.</div>
       </div>
+      {%- endif -%}
       <div class="col-md-4 my-4">
         <img class="feature-card-img" src="/assets/images/star.svg" loading="lazy" height="48px" width="48px"
           alt="{{data.header}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />

data/assets/css/game.css

@@ -3,6 +3,20 @@
     text-transform: capitalize;
 }
 
+.modal {
+    background: rgba(0, 0, 0, 0.6);
+    height: 100%;
+    width: 100%;
+    display: none;
+    pointer-events: none;
+    transition: all 0.3s ease-in-out;
+}
+
+.active {
+    display: block;
+    pointer-events: auto;
+}
+
 /* create wordle box css */
 .create-wordle {
     box-shadow: 0 5px 15px rgb(0 0 0 / 20%);

data/assets/js/createWordle.js

@@ -2,23 +2,19 @@ let customWord = document.querySelector(".custom-word")
 let generateLinkButton = document.querySelector(".generate-word-game-link")
 let wordleGameLink = document.querySelector(".wordle-game-link")
 let copy_btn = document.querySelector(".copy-btn")
-
-
 let wordlePlayButton = document.querySelector("#wordle-play-button")
 let facebookSHareLink = document.querySelector(".facebook-share-link")
 let twitterSHareLink = document.querySelector(".twitter-share-link")
 let whatsappSHareLink = document.querySelector(".whatsapp-share-link")
-
 let form = document.querySelector('#create-wordle-form')
 let openPopup = document.querySelector(".open-popup")
-
 const alertContainer = document.querySelector(".alert-container")
 let errorMsg = document.querySelector("#errorMsg")
-
-
+let modal__wrapper = document.querySelector(".modal")
+function closeModal() {
+    modal__wrapper.classList.remove('active')
+}
 customWord.focus()
-
-
 let dictionary
 async function getData() {
     const response = await fetch("/dictionary.json")
@@ -26,12 +22,9 @@ async function getData() {
     dictionary = data
 }
 getData()
-
-
-
 const createWordle = (e) => {
     e.preventDefault();
-
+  
     if (customWord.value.length < 5) {
         errorMsg.innerHTML = "Not enough letters"
         alertContainer.classList.add("active-alert")
@@ -47,7 +40,8 @@ const createWordle = (e) => {
         }, 1000)
     } else {
         if (customWord.value.length === 5) {
-            openPopup.click()
+            // openPopup.click()
+            modal__wrapper.classList.add('active')
             copy_btn.innerHTML = "Copy Link"
             copy_btn.style.background = "dodgerblue"
             wordlePlayButton.setAttribute("href", `/word-game-play?q=${btoa(customWord.value.toLocaleLowerCase())}`)

data/assets/js/game.js

@@ -30,9 +30,22 @@ let wordleTime = document.querySelector(".wordle-time")
 let gameResultTime = document.querySelector("#game-result-time")
 let wordleRunningTimer = document.querySelector("#wordle-running-timer")
 // wordleRunningTimer.innerHTML = "00:00"
+let modal__wrapper = document.querySelector("#how-to-play-wordle")
+let resutPopup =document.querySelector("#resutPopup")
 
+function closeModal() {
+    modal__wrapper.classList.remove('active')
+}
+function howtoModal() {
+    modal__wrapper.classList.add('active')
+}
 
 
+function btnModal() {
+    console.log(true);
+    resutPopup.classList.remove('active')
+}
+
 let tile = document.querySelector('.tile')
 let x = window.matchMedia("(min-width: 768px)")
 if (x.matches) {
@@ -276,6 +289,7 @@ const gameOver = (guessWord, tiles) => {
                                                                          Can you do better ? Try this wordle: ${window.location.protocol + "//" + window.location.hostname}/word-game-play?q=${(serachValue)}`)
 
         startConfetti()
+        resutPopup.classList.add('active')
         showAlertMessage("You WON! 🏆")
         stopAllEventListeners()
         danceTiles(tiles)

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: word-games-theme
 version: !ruby/object:Gem::Version
-  version: 1.9.2
+  version: 1.9.3
 platform: ruby
 authors:
 - manpreet-appscms
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-04-29 00:00:00.000000000 Z
+date: 2023-05-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll