From 1a09e944f2b0a24746c5038ac40fd0cbf36078dd Mon Sep 17 00:00:00 2001
From: shreyasen27 <122675418+shreyasen27@users.noreply.github.com>
Date: Mon, 1 Jul 2024 12:22:20 +0530
Subject: [PATCH] Update app.js

- Corrected the initial account variable to be a string.
-Moved setting the account within initWeb3 directly.
-Added error handling and console logs for better debugging.
-Removed commented-out code to improve readability.
-Improved code comments and code structure.
---
 src/js/app.js | 272 +++++++++++++++++++++-----------------------------
 1 file changed, 115 insertions(+), 157 deletions(-)

diff --git a/src/js/app.js b/src/js/app.js
index 7fd83d7..64614b3 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -1,12 +1,11 @@
-var phaseEnum; // for changing phases of voting
+var phaseEnum; // For changing phases of voting
 App = {
   web3Provider: null,
   contracts: {},
-  account:0x0,
+  account: '0x0',
 
   init: async function() {
-    // Load pets.
-   
+    // Initialize web3 and contract
     return await App.initWeb3();
   },
 
@@ -14,10 +13,10 @@ App = {
     if (window.ethereum) {
       try {
         const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
-        setAccounts(accounts);
+        App.account = accounts[0];
       } catch (error) {
         if (error.code === 4001) {
-          // User rejected request
+          console.error("User rejected the request.");
         }
       }
     }
@@ -26,242 +25,201 @@ App = {
   },
 
   initContract: function() {
-    
-    $.getJSON("Contest.json",function(contest){
-      App.contracts.Contest=TruffleContract(contest);
-
+    $.getJSON("Contest.json", function(contest) {
+      App.contracts.Contest = TruffleContract(contest);
       App.contracts.Contest.setProvider(web3.currentProvider);
 
-  
       return App.render();
     });
   },
 
-  render: function(){
-    
+  render: function() {
     var contestInstance;
-    var loader=$("#loader");
-    var content=$("#content"); 
+    var loader = $("#loader");
+    var content = $("#content"); 
     loader.show();
     content.hide();
     $("#after").hide();
 
-    web3.eth.getCoinbase(function(err,account){
-      if(err===null){
-        App.account=account;
-        $("#accountAddress").html("Your account: "+account);
+    web3.eth.getCoinbase(function(err, account) {
+      if (err === null) {
+        App.account = account;
+        $("#accountAddress").html("Your account: " + account);
       }
     });
 
-    
-
-    // ------------- fetching candidates to front end from blockchain code-------------
-    App.contracts.Contest.deployed().then(function(instance){
-      contestInstance=instance;
+    // Fetching candidates to front end from blockchain
+    App.contracts.Contest.deployed().then(function(instance) {
+      contestInstance = instance;
       return contestInstance.contestantsCount();
-    }).then(function(contestantsCount){
-      // var contestantsResults=$("#contestantsResults");
-      // contestantsResults.empty();
-
-      // var contestantSelect=$("#contestantSelect");
-      // contestantSelect.empty();
-
-      // for(var i=1; i<=contestantsCount; i++){
-      //   contestInstance.contestants(i).then(function(contestant){
-      //     var id=contestant[0];
-      //     var name=contestant[1];
-      //     var voteCount=contestant[2];
-      //     var fetchedParty=contestant[3];
-      //     var fetchedAge = contestant[4];
-      //     var fetchedQualification = contestant[5]
-
-      //     var contestantTemplate="<tr><th>"+id+"</th><td>"+name+"</td><td>"+fetchedAge+"</td><td>"+fetchedParty+"</td><td>"+fetchedQualification+"</td><td>"+voteCount+"</td></tr>";
-      //     contestantsResults.append(contestantTemplate)  ;
-
-      //     var contestantOption="<option value='"+id+"'>"+name+"</option>";
-      //     contestantSelect.append(contestantOption);
-
-      var contestantsResults=$("#test");
+    }).then(function(contestantsCount) {
+      var contestantsResults = $("#test");
       contestantsResults.empty();
-      var contestantsResultsAdmin=$("#contestantsResultsAdmin");
+      var contestantsResultsAdmin = $("#contestantsResultsAdmin");
       contestantsResultsAdmin.empty();
-
-      var contestantSelect=$("#contestantSelect");
+      var contestantSelect = $("#contestantSelect");
       contestantSelect.empty();
 
-      for(var i=1; i<=contestantsCount; i++){
-        contestInstance.contestants(i).then(function(contestant){
-          var id=contestant[0];
-          var name=contestant[1];
-          var voteCount=contestant[2];
-          var fetchedParty=contestant[3];
+      for (var i = 1; i <= contestantsCount; i++) {
+        contestInstance.contestants(i).then(function(contestant) {
+          var id = contestant[0];
+          var name = contestant[1];
+          var voteCount = contestant[2];
+          var fetchedParty = contestant[3];
           var fetchedAge = contestant[4];
-          var fetchedQualification = contestant[5]
-
-          var contestantTemplate="<div class='card' style='width: 15rem; margin: 1rem;'><img class='card-img-top'src='../img/Sample_User_Icon.png' alt=''><div class='card-body text-center'><h4 class='card-title'>" 
-          + name + "</h4>"+
-          "<button type='button' class='btn btn-info' data-toggle='modal' data-target='#modal"+id+"'>Click Here to Vote</button>" 
-          + "<div class='modal fade' id='modal"+id+"' tabindex='-1' role='dialog' aria-labelledby='exampleModalCenterTitle' aria-hidden='true'>"
-          + "<div class='modal-dialog modal-dialog-centered' role='document'>"
-          + "<div class='modal-content'>"
-          + "<div class='modal-header'>"
-          + "<h5 class='modal-title' id='exampleModalLongTitle'> <b>" + name + "</b></h5>"
-          + "<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>"
-          + "</div>"
-          + "<div class='modal-body'> <b> Party : " + fetchedParty +"<br>Age : " + fetchedAge + "<br>Qualification : " + fetchedQualification + "<br></b></div>"
-          + "<div class='modal-footer'>"
-          + "<button class='btn btn-info' onClick='App.castVote("+id.toString()+")'>VOTE</button>"
-          +"<button type='button' class='btn btn-info' data-dismiss='modal'>Close</button></div>"
-          + "</div></div></div>"
-          + "</div></div>";
-          contestantsResults.append(contestantTemplate)  ;
-
-          var contestantOption="<option style='padding: auto;' value='"+id+"'>"+name+"</option>";
+          var fetchedQualification = contestant[5];
+
+          var contestantTemplate = "<div class='card' style='width: 15rem; margin: 1rem;'><img class='card-img-top'src='../img/Sample_User_Icon.png' alt=''><div class='card-body text-center'><h4 class='card-title'>" + name + "</h4>" +
+            "<button type='button' class='btn btn-info' data-toggle='modal' data-target='#modal" + id + "'>Click Here to Vote</button>" +
+            "<div class='modal fade' id='modal" + id + "' tabindex='-1' role='dialog' aria-labelledby='exampleModalCenterTitle' aria-hidden='true'>" +
+            "<div class='modal-dialog modal-dialog-centered' role='document'>" +
+            "<div class='modal-content'>" +
+            "<div class='modal-header'>" +
+            "<h5 class='modal-title' id='exampleModalLongTitle'> <b>" + name + "</b></h5>" +
+            "<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>" +
+            "</div>" +
+            "<div class='modal-body'> <b> Party : " + fetchedParty + "<br>Age : " + fetchedAge + "<br>Qualification : " + fetchedQualification + "<br></b></div>" +
+            "<div class='modal-footer'>" +
+            "<button class='btn btn-info' onClick='App.castVote(" + id.toString() + ")'>VOTE</button>" +
+            "<button type='button' class='btn btn-info' data-dismiss='modal'>Close</button></div>" +
+            "</div></div></div>" +
+            "</div></div>";
+          contestantsResults.append(contestantTemplate);
+
+          var contestantOption = "<option style='padding: auto;' value='" + id + "'>" + name + "</option>";
           contestantSelect.append(contestantOption);
 
-          var contestantTemplateAdmin="<tr><th>"+id+"</th><td>"+name+"</td><td>"+fetchedAge+"</td><td>"+fetchedParty+"</td><td>"+fetchedQualification+"</td><td>"+voteCount+"</td></tr>";
-          contestantsResultsAdmin.append(contestantTemplateAdmin)  ;
-        }); 
+          var contestantTemplateAdmin = "<tr><th>" + id + "</th><td>" + name + "</td><td>" + fetchedAge + "</td><td>" + fetchedParty + "</td><td>" + fetchedQualification + "</td><td>" + voteCount + "</td></tr>";
+          contestantsResultsAdmin.append(contestantTemplateAdmin);
+        });
       }
       loader.hide();
       content.show();
-    }).catch(function(error){
+    }).catch(function(error) {
       console.warn(error);
     });
 
-    // ------------- fetching current phase code -------------
-    App.contracts.Contest.deployed().then(function (instance){
+    // Fetching current phase
+    App.contracts.Contest.deployed().then(function(instance) {
       return instance.state();
-    }).then(function(state){
+    }).then(function(state) {
       var fetchedState;
       var fetchedStateAdmin;
       phaseEnum = state.toString();
-      if(state == 0){
-        fetchedState = "Registration phase is on , go register yourself to vote !!";
+      if (state == 0) {
+        fetchedState = "Registration phase is on, go register yourself to vote!!";
         fetchedStateAdmin = "Registration";
-      }else if(state == 1){
-        fetchedState = "Voting is now live !!!";
+      } else if (state == 1) {
+        fetchedState = "Voting is now live!!!";
         fetchedStateAdmin = "Voting";
-      }else {
-        fetchedState = "Voting is now over !!!";
+      } else {
+        fetchedState = "Voting is now over!!!";
         fetchedStateAdmin = "Election over";
       }
-      
-      var currentPhase = $("#currentPhase");//for user
+
+      var currentPhase = $("#currentPhase"); // For user
       currentPhase.empty();
-      var currentPhaseAdmin = $("#currentPhaseAdmin");//for admin
+      var currentPhaseAdmin = $("#currentPhaseAdmin"); // For admin
       currentPhaseAdmin.empty();
-      var phaseTemplate = "<h1>"+fetchedState+"</h1>";
-      var phaseTemplateAdmin = "<h3> Current Phase : "+fetchedStateAdmin+"</h3>";
+      var phaseTemplate = "<h1>" + fetchedState + "</h1>";
+      var phaseTemplateAdmin = "<h3> Current Phase: " + fetchedStateAdmin + "</h3>";
       currentPhase.append(phaseTemplate);
       currentPhaseAdmin.append(phaseTemplateAdmin);
-    }).catch(function(err){
+    }).catch(function(err) {
       console.error(err);
-    })
+    });
 
-    // ------------- showing result -------------
-    App.contracts.Contest.deployed().then(function (instance){
+    // Showing results
+    App.contracts.Contest.deployed().then(function(instance) {
       return instance.state();
-    }).then(function(state){
+    }).then(function(state) {
       var result = $('#Results');
-      if(state == 2){
+      if (state == 2) {
         $("#not").hide();
-        contestInstance.contestantsCount().then(function(contestantsCount){
-          for(var i=1; i<=contestantsCount; i++){
-            contestInstance.contestants(i).then(function(contestant){
-              var id=contestant[0];
-              var name=contestant[1];
-              var voteCount=contestant[2];
-              var fetchedParty=contestant[3];
+        contestInstance.contestantsCount().then(function(contestantsCount) {
+          for (var i = 1; i <= contestantsCount; i++) {
+            contestInstance.contestants(i).then(function(contestant) {
+              var id = contestant[0];
+              var name = contestant[1];
+              var voteCount = contestant[2];
+              var fetchedParty = contestant[3];
               var fetchedAge = contestant[4];
               var fetchedQualification = contestant[5];
 
-              var resultTemplate="<tr><th>"+id+"</th><td>"+name+"</td><td>"+fetchedAge+"</td><td>"+fetchedParty+"</td><td>"+fetchedQualification+"</td><td>"+voteCount+"</td></tr>";
-              result.append(resultTemplate)  ;
+              var resultTemplate = "<tr><th>" + id + "</th><td>" + name + "</td><td>" + fetchedAge + "</td><td>" + fetchedParty + "</td><td>" + fetchedQualification + "</td><td>" + voteCount + "</td></tr>";
+              result.append(resultTemplate);
             });
           }
-        })
-         
+        });
       } else {
         $("#renderTable").hide();
       }
-    }).catch(function(err){
+    }).catch(function(err) {
       console.error(err);
-    })
+    });
   },
 
-  
-  
-
-  // ------------- voting code -------------
-  castVote: function(id){
-    
-    var contestantId=id;
-    App.contracts.Contest.deployed().then(function (instance){
-      return instance.vote(contestantId,{from: App.account});
-    }).then(function(result){
-      // $("#test").hide();
-      // $("#after").show();
-    }).catch(function(err){
+  // Voting function
+  castVote: function(id) {
+    App.contracts.Contest.deployed().then(function(instance) {
+      return instance.vote(id, { from: App.account });
+    }).then(function(result) {
+      console.log("Vote casted");
+    }).catch(function(err) {
       console.error(err);
-    })
-
+    });
   },
 
-  // ------------- adding candidate code -------------
-  addCandidate: function(){
+  // Adding candidate function
+  addCandidate: function() {
     $("#loader").hide();
-    var name=$('#name').val();
+    var name = $('#name').val();
     var age = $('#age').val();
     var party = $('#party').val();
     var qualification = $('#qualification').val();
-    
-    App.contracts.Contest.deployed().then(function(instance){
-      return instance.addContestant(name,party,age,qualification);
-    }).then(function(result){
+
+    App.contracts.Contest.deployed().then(function(instance) {
+      return instance.addContestant(name, party, age, qualification);
+    }).then(function(result) {
       $("#loader").show();
       $('#name').val('');
       $('#age').val('');
       $('#party').val('');
       $('#qualification').val('');
-    }).catch(function(err){
+    }).catch(function(err) {
       console.error(err);
-    })
+    });
   },
 
-  // ------------- changing phase code -------------
-  
-  changeState: function(){
-    phaseEnum ++;
-    // console.log(phaseEnum);
-    App.contracts.Contest.deployed().then(function(instance){
+  // Changing phase function
+  changeState: function() {
+    phaseEnum++;
+    App.contracts.Contest.deployed().then(function(instance) {
       return instance.changeState(phaseEnum);
-    }).then(function(result){
+    }).then(function(result) {
       $("#content").hide();
       $("#loader").show();
-    }).catch(function(err){
+    }).catch(function(err) {
       console.error(err);
-    })
+    });
   },
 
-  // ------------- registering voter code -------------
-  registerVoter: function(){
-    var add=$('#accadd').val();
-    App.contracts.Contest.deployed().then(function(instance){
+  // Registering voter function
+  registerVoter: function() {
+    var add = $('#accadd').val();
+    App.contracts.Contest.deployed().then(function(instance) {
       return instance.voterRegisteration(add);
-    }).then(function(result){
+    }).then(function(result) {
       $("#content").hide();
       $("#loader").show();
-    }).catch(function(err){
+    }).catch(function(err) {
       console.error(err);
-    })
+    });
   }
-
 };
 
-
 $(function() {
   $(window).load(function() {
     App.init();
   });
-});
\ No newline at end of file
+});