🏡 index : github.com/shreyas-satish/govote.git

author Nemo <me@captnemo.in> 2023-12-07 22:57:16.0 +05:30:00
committer Nemo <me@captnemo.in> 2023-12-07 22:57:16.0 +05:30:00
commit
56b93cfa933acd2a4776ee956e4ea5ee98472c5b [patch]
tree
c10288d8655d2ee5cde549d7a062dd2ef613a886
parent
e8b185657029d2a294d54a2c75f0f85678e5f4d4
download
56b93cfa933acd2a4776ee956e4ea5ee98472c5b.tar.gz

pincode



Diff

 index.html            | 62 +++++++++++++++++++++++++++++++++++++++++++++-----------------
 _layouts/default.html | 18 ++++++++++++++++++
 assets/pincodes.json  |  2 +-
 assets/script.js      | 15 +++++++++++++++
 4 files changed, 67 insertions(+), 30 deletions(-)

diff --git a/index.html b/index.html
index eafba1f..086ed86 100644
--- a/index.html
+++ a/index.html
@@ -34,22 +34,22 @@
<div id="section2" class="section margin-top-bottom">
    <div class="card">
      <div class="card-body">
        <h4 class="card-title">1. EPIC</h4>
        <h4 class="card-title">1. EPIC (Voter ID)</h4>
        <p class="card-text">
            <p>
                EPIC is your voter ID number. Click Next if you already have yours.
                EPIC is your voter ID number. Click Next if you already have it with you, or if you've never registered to vote in India.
            </p>
            <p>
            If you don't, open <a href="https://electoralsearch.eci.gov.in/" target="_blank">this site.</a>
            It will be on your existing Voter ID card. If you can't find your Voter ID, open <a href="https://electoralsearch.eci.gov.in/" target="_blank">electoralsearch.eci.gov.in</a>.
            </p>
            <p>
                Enter the following info on that site:
                <ul>
                    <li>State you were registered</li>
                    <li>First name</li>
                    <li>Relative's first name (Mostly your father)</li>
                    <li>Date of birth</li>
                    <li>Gender</li>
                    <li>State where your last Voter ID was issued.</li>
                    <li>Your first name</li>
                    <li>Your relative's first name (Mostly your father)</li>
                    <li>Your date of birth</li>
                    <li>Your gender</li>
                    <li>Captcha</li>
                </ul>
        
@@ -57,11 +57,11 @@
            And hit Search.
        </p>
        <p>
            Found your EPIC number? Awesome, copy it somewhere.
            Found your EPIC number? Awesome, copy it somewhere and click Next</p>
        </p>
            
        <p>
            <strong>Stuck?</strong> Reach out for help on <a href="https://t.me/+gkKLJTPgIlM1Nzhl">Telegram</a> or <a href="#">WhatsApp</a>
        </p>
    </p>
        <button class="prev-button" onclick="navigate('prev', 2)">Previous</button>
        <button onclick="navigate('next', 2)">Next</button>
      </div>
@@ -71,22 +71,30 @@
<div id="section3" class="section margin-top-bottom">
    <div class="card">
      <div class="card-body">
        <h4 class="card-title">2. Location</h4>
        <h4 class="card-title">2. Address</h4>
        <p class="card-text">
            <p>Let's find your district, post office, assembly constituency.</p>
            <p>
            Type your address, or click the crosshair button
            if you're on your phone - it might take a few seconds.
            </p>
            <p>
                Copy the Assembly Constituency for the next step.
            </p>
        </p>
            <p>Let's find your voting district, post office, and your assembly constituency.</p>
            <div id=pinholder class="form-group">
                <label for="pincode">Pincode:</label>
                <input pattern="56\d{4}" title="Please enter a valid Bangalore pincode" required id="pincode" type="text" maxlength="6"  minlength=6 size=6 placeholder="56____">
            </div>
            <div id="pincode-message" style="display:none">Your Post Office is <strong><span id="post-office"></span></strong></div>
            <!-- TODO: Give an option to skip the pincode? -->
            <div id="mapholder" style="display:none">
                <p><strong>Next: Constituency</strong></p>
                <p>
                    Type your address (or a building close enough to your residential address), or click the crosshair button
                    to automatically detect your address
                    if you're on your phone - it might take a few seconds. You will have to grant location permissions.
                </p>
                <p>
                    Click next once you've. If you're confused, you can view a more detailed map at <a href="/map">/map</a>.
                </p>
                <input id="addressInput" type="text" placeholder="Enter address" value="">

        <input id="addressInput" type="text" placeholder="Enter address" value="">

        <div id="map"></div>

                <div id="map"></div>
            </div>
        </p>
        <button class="prev-button margin-top-2" onclick="navigate('prev', 3)">Previous</button>
        <button onclick="navigate('next', 3)">Next</button>
      </div>
@@ -97,13 +105,13 @@
<div id="section4" class="section margin-top-bottom">
    <div class="card">
      <div class="card-body">
        <h4 class="card-title">3. File</h4>
        <h4 class="card-title">3. Fill your Form 6/8</h4>
        <p class="card-text">
            <p>
                1. Sign up for an account at <a href="https://voters.eci.gov.in/signup" target="_blank">voters.eci.gov.in</a>. If you had an account at
                nvsp.in earlier, the same one is valid here.
            </p>
            <p>2. Go <a href="https://voters.eci.gov.in/login" target="_blank">here</a>, and file your application using the credentials you signed up with.</p>
            <p>2. Go <a href="https://voters.eci.gov.in/login" target="_blank">here</a>, and submit Form 8 (or Form 6 if you've never had a voter ID) using the credentials you signed up with.</p>
            <p>
                For address proof, you can use any of:
            </p>
diff --git a/_layouts/default.html b/_layouts/default.html
index 6ec0830..f12b388 100644
--- a/_layouts/default.html
+++ a/_layouts/default.html
@@ -121,10 +121,22 @@
            font-size: 20px;
        }

        /* We don't like the paper shadow effect, since it creates jitter */
        .card {
            width: 90%;
            margin: 1rem;
            box-shadow: none !important;
        }
        .card:hover {
          transform: none ! important;
          box-shadow: none !important;
        }
        input:invalid {
          background-color: ivory;
          border: none;
          outline: 2px solid red;
          border-radius: 5px;
        }
        #map {
      height: 400px;
      width: 100%;
@@ -145,7 +157,9 @@
  .custom-control img {
    width: 20px;
    height: 20px;
  }</style>
  }

    </style>
  <script defer data-domain="blr.vote" src="https://plausible.io/js/script.js"></script>
</head>
<body>
@@ -172,7 +186,7 @@


<script src="https://unpkg.com/@turf/turf@latest"></script>
<script src="/script.js"></script>
<script src="/assets/script.js"></script>

</body>
</html>
diff --git a/assets/pincodes.json b/assets/pincodes.json
index 891d78c..99fad66 100644
--- a/assets/pincodes.json
+++ a/assets/pincodes.json
@@ -261,5 +261,5 @@
  "562157": "Vidyanagara",
  "562162": "Dasanapura",
  "562162": "Madanayakanahalli",
  "562164": "Avathi",
  "562164": "Avathi"
}
diff --git a/assets/script.js b/assets/script.js
index 3ba2203..e4b6117 100644
--- a/assets/script.js
+++ a/assets/script.js
@@ -16,6 +16,21 @@
    return matchingFeatures;
}

loadJSONFile("/assets/pincodes.json").then((pincodeMap) =>{
  const pincodeInput = document.getElementById('pincode');
  pincodeInput.addEventListener('input', (e) => {
    console.log(e.target)
    if (e.target.value.length == 6) {
      let postOffice = pincodeMap[pincodeInput.value];
      if (postOffice) {
        document.getElementById('pincode-message').style.display="block";
        window.postOffice = document.getElementById('post-office').innerText = postOffice;
        document.getElementById('mapholder').style.display='block';
      }
    }
  });
})

// Example usage:
const geojsonFile = "/assets/bbmp-2023.geojson";