bug fix

ishaanndas · Jan 8, 2022 · 4b243e9 · 4b243e9
1 parent 80e9ab3
commit 4b243e9
Show file tree

Hide file tree

Showing 9 changed files with 129 additions and 65 deletions.
diff --git a/public/Vector.png b/public/Vector.png
diff --git a/public/css/dash.css b/public/css/dash.css
@@ -39,17 +39,19 @@ textarea:focus, input:focus, select:focus{
 }
 .dash{
     display: grid;
-    grid-template-columns: 1fr 2fr;
+    grid-template-columns: 2fr 1fr;
     margin-top: 40px;
     padding-left: 75px;
+
     column-gap: 30px;    
     padding-right: 75px;
 }
 
-.dash-2{
-    grid-template-columns: 2fr 1fr;
-
+.charts{
+    display: flex;
+    flex-direction: column;
 }
+
 /* .dash-wrap{
     display: flex;
     flex-direction: column;
@@ -128,6 +130,7 @@ textarea:focus, input:focus, select:focus{
 .line{
    margin-left: 0;
    padding: 50px 100px;
+   margin-bottom: 30px;
 }
 .download{
     color:white;
@@ -136,4 +139,6 @@ textarea:focus, input:focus, select:focus{
     padding: 15px 15px;
     text-align: center;
     font-size: 18px;
+    margin-top: 30px;
+    cursor: pointer;
 }
diff --git a/public/css/players.css b/public/css/players.css
@@ -177,11 +177,28 @@ textarea:focus, input:focus, select:focus{
 }
 
 .no-player{
-    font-family: "Game Of Squids";
     color: white;
-    margin-left: 75px;
+    flex-direction: column;
+    margin-left: 90px;
     font-size: 2vw;
-    margin-top: 250px;
+    justify-content: center;
+    display: flex;
+    align-items: center;
+    margin-top: 150px;
+}
+
+.no-player h1{
+    font-family: "Game Of Squids";
+    font-size: 3.2vw;
+    padding: 0;
+    margin: 0;
+}
+
+.no-player p{
+    margin: 0;
+    margin-top: 30px;
+    font-size: 1.6vw;
+    font-weight: 300;
 }
 
 .user-image{

diff --git a/public/css/staff.css b/public/css/staff.css
@@ -329,4 +329,29 @@ form label{
 
 .search-box input{
     width: 90%;
-}
+}
+
+select {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 100%;
+  }
+
+  .select-wrapper {
+    position: relative;
+  }
+
+  .select-wrapper::after {
+    content: "";
+    color: black;
+    width: 13px;
+    height: 13px;
+    background-size: contain;
+    pointer-events: none;
+    font-size: 1rem;
+    background-image: url('../Vector.png');
+    top: 15px;
+    background-repeat: no-repeat;
+    right: 18px;
+    position: absolute;
+  }
diff --git a/public/down.png b/public/down.png
diff --git a/views/dash.ejs b/views/dash.ejs
@@ -22,12 +22,46 @@
         <a href="/frontman" class="nav active">Dashboard</a>
         <a href="/frontman/players" class="nav">Players</a>
         <a href="/frontman/workers" class="nav ">Staff</a>
-        <a href="/frontman/home" class="nav">Games</a>
+        <a href="/frontman/games" class="nav">Games</a>
     </nav>
-
-
-    <div class="dash">
+    <div class="dash" style="margin-bottom: 30px;">
+        <div class="charts">
+            <div class="chart-wrap line">
+                <div class="legend-wrap">
+                    <h1>Total Players</h1>
+                    <div class="legend">
+                        <div class="circle" style="background-color: #B8FFB7; "></div>
+                        <p>Active</p>
+                    </div>
+                    <div class="legend">
+                        <div class="circle" style="background-color: #BE4D68; "></div>
+                        <p>Eliminated</p>
+                    </div>
+                </div>
+                <canvas id="pie" style="margin-left: 50px;">  
+            </canvas>
+            </div>
+            <div class="chart-wrap">       
+                <canvas id="line-chart">
+                </canvas>
+        </div>
+        </div>
+
         <div class="dash-wrap">
+            <div class="dash-box box-2"  id="players-click">
+                <div class="box-wrap">
+                    <div class="title"> <i class="far fa-user"></i>&nbsp; &nbsp; Players Remaining</div>
+                    <p id="players">4,200,200,000</p>
+                </div>
+                <img src="./arrow.png" width="17">
+            </div>
+            <div class="dash-box box-2"  id="players-click1">
+                <div class="box-wrap">
+                    <div class="title"> <i class="far fa-user"></i>&nbsp; &nbsp; Players Eliminated</div>
+                    <p id="players-dead">4,200,200,000</p>
+                </div>
+                <img src="./arrow.png" width="17">
+            </div>
             <div class="dash-box">
                 <div class="title"> <i class="fas fa-rupee-sign"></i>&nbsp; &nbsp; Current Prize Money</div>
                 <p id="money"> 4,200,200,000</p>
@@ -38,63 +72,28 @@
                     <p id="money-total"></p>
                 </div>
             </div>
-            <div class="dash-box box-2" style="margin-bottom: 0;">
+            <div class="dash-box box-2"  id="game-click" style="margin-bottom: 0;">
                 <div class="box-wrap">
                 <div class="title"> <i class="far fa-play-circle"></i>&nbsp; &nbsp; Current Game</div>
                 <p id="current">4,200,200,000</p>
                 </div>
                 <img src="./arrow.png" width="17">
             </div>
-        </div>
-        <div class="chart-wrap">       
-            <canvas id="line-chart">
-            </canvas>
-    </div>
-    </div>
-    <div class="dash dash-2" style="margin-bottom: 30px;">
-        <div class="chart-wrap line">
-            <div class="legend-wrap">
-                <h1>Total Players</h1>
-                <div class="legend">
-                    <div class="circle" style="background-color: #B8FFB7; "></div>
-                    <p>Active</p>
-                </div>
-                <div class="legend">
-                    <div class="circle" style="background-color: #BE4D68; "></div>
-                    <p>Eliminated</p>
-                </div>
-            </div>
-            <canvas id="pie">  
-        </canvas>
-
-        </div>
-        <div class="dash-wrap">
-            <div class="dash-box box-2">
-                <div class="box-wrap">
-                    <div class="title"> <i class="far fa-user"></i>&nbsp; &nbsp; Players Remaining</div>
-                    <p id="players">4,200,200,000</p>
-                </div>
-                <img src="./arrow.png" width="17">
-            </div>
-            <div class="dash-box box-2">
-                <div class="box-wrap">
-                    <div class="title"> <i class="far fa-user"></i>&nbsp; &nbsp; Players Dead</div>
-                    <p id="players-dead">4,200,200,000</p>
-                </div>
-                <img src="./arrow.png" width="17">
-            </div>
             <div class="download">
                 <i class="far fa-arrow-alt-circle-down"></i> Download CSV Report
             </div>
         </div>
     </div>
 
+    <a href="/frontman/downloadInfo" target="_blank" id="download-csv" hidden> </a>
 
 
     <script type="text/javascript">
         var playersLeft =<%-JSON.stringify(playersLeft)%>;
         var playersDead =<%-JSON.stringify(playersDead)%>;
         var currentGame =<%-JSON.stringify(currentGame)%>;
+        var mortalityRates =<%-JSON.stringify(mortalityRates)%>;
+
         $('#money').html((playersDead*10000000).toLocaleString('en-IN'));
         $('#money-total').html((100*10000000).toLocaleString('en-IN'));
         $('#players').html(playersLeft);
@@ -140,7 +139,7 @@
     ],
             datasets: [{
                 label: 'Mortality Rate',
-                data: [65, 80, 100, 150, 170, 300],
+                data: mortalityRates,
                 fill: true,
                 borderColor: 'rgb(255, 255, 255)',
                 tension: 0.2
@@ -177,8 +176,18 @@
             }
             }
         });
-
-        
+        document.querySelector('.download').addEventListener('click',()=>{
+            document.getElementById('download-csv').click();
+        });
+        document.getElementById('game-click').addEventListener('click',()=>{
+            window.location.href='/frontman/games'
+        })
+        document.getElementById('players-click').addEventListener('click',()=>{
+            window.location.href='/frontman/players'
+        })
+        document.getElementById('players-click1').addEventListener('click',()=>{
+            window.location.href='/frontman/players'
+        })
 
     </script>
 </body>

diff --git a/views/frontmanGames.ejs b/views/frontmanGames.ejs
@@ -39,7 +39,7 @@
     <nav>
         <a href="/frontman/" class="nav">Dashboard</a>
         <a href="/frontman/players" class="nav">Players</a>
-        <a href="/frontman/staff" class="nav">Staff</a>
+        <a href="/frontman/workers" class="nav">Staff</a>
         <a href="/frontman/games" class="nav active">Games</a>
     </nav>
 

diff --git a/views/players.ejs b/views/players.ejs
@@ -40,7 +40,7 @@
         <a href="/frontman" class="nav">Dashboard</a>
         <a href="/frontman/players" class="nav active">Players</a>
         <a href="/frontman/workers" class="nav">Staff</a>
-        <a href="/frontman/home" class="nav">Games</a>
+        <a href="/frontman/games" class="nav">Games</a>
     </nav>
 
     <section style="display: flex; justify-content: space-between;">
@@ -54,7 +54,10 @@
                         Create New Player
                         </button>
                 </div>
-                <p class="no-player">no player selected</p>
+                <div class="no-player">
+                    <h1>Squid Game</h1>
+                    <p>Select a player for more options.</p>
+                </div>
                 <div class="user-model">
                     <div class="profile-wrap">
                         <div class="user-image"></div>
@@ -274,7 +277,6 @@
             let elem;
             let string = document.querySelector('.search-name').value;
             if(string.length==0){
-                $('.no-player').html('No Player Selected');
                 $('.no-player').show();
                 prevSelected.querySelector('.status-overlay').style.opacity = 0;
 
@@ -294,7 +296,6 @@
             if(found==1)
             selectSearch(elem,i+1);
             else{
-                $('.no-player').html('No Player Found')
                 $('.no-player').show()
             $('.user-model').hide();
             }

diff --git a/views/staff.ejs b/views/staff.ejs
@@ -35,7 +35,7 @@
         <a href="/frontman" class="nav">Dashboard</a>
         <a href="/frontman/players" class="nav">Players</a>
         <a href="/frontman/workers" class="nav active">Staff</a>
-        <a href="/frontman/game" class="nav">Games</a>
+        <a href="/frontman/games" class="nav">Games</a>
     </nav>
     <div class="header">
         <div class="srch">
@@ -103,17 +103,21 @@
 
         <div class="create-dialog">
             <h1>Create New Staff</h1>
-            <form method="post" action="/" id="create-form">
+            <form method="post" action="/frontman/worker/new" id="create-form">
                 <label for="form-name">Name</label>
                 <input type="text" name="name" id="form-name" placeholder="John Doe" required>
                 <label for="form-designation">Designation</label>
+                <div class="select-wrapper">
                 <select id="form-designation" name="designation" required>
                     <option value="" disabled selected>Select a designation</option>
                     <option value="Manager">Manager</option>
                     <option value="Guard">Guard</option>
                     <option value="Utility">Utility</option>
                 </select>
+                </div>
                 <label for="form-task">Task</label>
+                <div class="select-wrapper">
+
                 <select id="form-task" name="task" required>
                     <option value="" disabled selected>Select a task</option>
                     <option value="Disposal">Disposal</option>
@@ -122,7 +126,8 @@
                     <option value="Patrol">Patrol</option>
                     <option value="Venue Preparation">Venue Preparation</option>
                     <option value="Maintenance">Maintenance</option>
-                </select>            
+                </select>   
+                </div>         
             </form>
             <button type="submit" value="Create" form="create-form">Create Staff</button>
     
@@ -133,9 +138,10 @@
             <div class="desig">
                 <div class="icon"></div>
                 <p>Manager</p></div>
-            <form method="post" action="/" id="edit-form">
-                <input type="text" value='' id="name" hidden>
+            <form method="post" action="/frontman/worker/edit" id="edit-form">
+                <input type="text" value='' id="id" hidden>
                 <label for="form-task">Task</label>
+                <div class="select-wrapper">
                 <select id="form-task" name="task" required>
                     <option value="" disabled >Select a task</option>
                     <option value="Disposal">Disposal</option>
@@ -145,6 +151,7 @@
                     <option value="Venue Preparation">Venue Preparation</option>
                     <option value="Maintenance">Maintenance</option>
                 </select>            
+                </div>
             </form>
             <button type="submit" value="edit" form="edit-form">Save Changes</button>
     
@@ -194,7 +201,7 @@
 
         function openStaff(index){
             let elem = list[index];
-            document.querySelector('.edit-dialog #name').value=elem.name;
+            document.querySelector('.edit-dialog #id').value=elem._id;
             $('.edit-dialog h1').html(elem.name);
             $('.edit-dialog .desig .icon').css('background-image','url('+elem.roleUrl+')');
             $('.edit-dialog .desig p').html(elem.role)