decidim-elections 0.24.3 → 0.25.0.rc1

data/app/{assets/javascripts/decidim/elections/trustee_zone.js.es6 → packs/src/decidim/elections/trustee/trustee_zone.js}

@@ -1,17 +1,14 @@
 /* eslint-disable require-jsdoc, no-alert, func-style */
-// = require decidim/bulletin_board/decidim-bulletin_board
 
-window.Decidim = window.Decidim || {};
+import { IdentificationKeys } from "@codegram/decidim-bulletin_board";
 
 $(() => {
-  const { IdentificationKeys } = window.decidimBulletinBoard;
-
   function identificationKeys() {
     const $form = $(".trustee_zone form");
-    const $trusteeUniqueId = $("#trustee_unique_id", $form);
+    const $trusteeSlug = $("#trustee_slug", $form);
     const $trusteePublicKey = $("#trustee_public_key", $form);
 
-    window.trusteeIdentificationKeys = new IdentificationKeys($trusteeUniqueId.val(), $trusteePublicKey.val());
+    window.trusteeIdentificationKeys = new IdentificationKeys($trusteeSlug.val(), $trusteePublicKey.val());
     if (!window.trusteeIdentificationKeys.browserSupport) {
       $("#not_supported_browser").addClass("visible");
       return;

data/app/packs/src/decidim/elections/voter/casting-vote.js

@@ -0,0 +1,14 @@
+import { Client } from "@codegram/decidim-bulletin_board";
+
+$(async () => {
+  const $castingVoteWrapper = $(".casting-vote-wrapper");
+
+  const bulletinBoardClient = new Client({
+    apiEndpointUrl: $castingVoteWrapper.data("apiEndpointUrl")
+  });
+  const messageId = $castingVoteWrapper.data("messageId");
+
+  await bulletinBoardClient.waitForPendingMessageToBeProcessed(messageId);
+
+  $("form.update_vote_status").trigger("submit");
+});

data/app/packs/src/decidim/elections/voter/new-vote.js

@@ -0,0 +1,83 @@
+/* eslint-disable no-console */
+import VoteQuestionsComponent from "src/decidim/elections/voter/vote_questions.component";
+// The voting component might come from set-preview.js or setup-vote.js, it depends if it's a preview
+// so in the view template we load the component and attach it to window
+const { setupVoteComponent } = window.Decidim;
+
+$(async () => {
+  // UI Elements
+  const $voteWrapper = $(".vote-wrapper");
+  const $ballotHash = $voteWrapper.find(".ballot-hash");
+  const ballotStyleId = $voteWrapper.data("ballotStyleId");
+
+  // Use the questions component
+  const questionsComponent = new VoteQuestionsComponent($voteWrapper);
+  questionsComponent.init();
+  $(document).on("on.zf.toggler", () => {
+    // continue and back btn
+    questionsComponent.init();
+  });
+
+  // Get the vote component and bind it to all UI events
+  const voteComponent = setupVoteComponent($voteWrapper);
+  await voteComponent.bindEvents({
+    onBindEncryptButton(onEventTriggered) {
+      $(".button.confirm").on("click", onEventTriggered);
+    },
+    onStart() {},
+    onVoteEncryption(validVoteFn) {
+      const getFormData = (formData) => {
+        return formData.serializeArray().reduce((acc, { name, value }) => {
+          if (!acc[name]) {
+            acc[name] = [];
+          }
+          acc[name] = [...acc[name], `${name}_${value}`];
+          return acc;
+        }, {});
+      };
+      const formData = getFormData($voteWrapper.find(".answer_input"));
+      validVoteFn(formData, ballotStyleId);
+    },
+    castOrAuditBallot({ encryptedData, encryptedDataHash }) {
+      $voteWrapper.find("#encrypting").addClass("hide");
+      $ballotHash.text(encryptedDataHash);
+      $voteWrapper.find("#ballot_decision").removeClass("hide");
+
+      const $form = $("form.new_vote");
+      $("#vote_encrypted_data", $form).val(encryptedData);
+      $("#vote_encrypted_data_hash", $form).val(encryptedDataHash);
+    },
+    onBindAuditBallotButton(onEventTriggered) {
+      $(".audit_ballot").on("click", onEventTriggered);
+    },
+    onBindCastBallotButton(onEventTriggered) {
+      $(".cast_ballot").on("click", onEventTriggered);
+    },
+    onAuditBallot(auditedData, auditedDataFileName) {
+      const vote = JSON.stringify(auditedData);
+      const link = document.createElement("a");
+      $voteWrapper.find(".button.cast_ballot").addClass("hide");
+      $voteWrapper.find(".button.back").removeClass("hide");
+      questionsComponent.voteCasted = true;
+
+      link.setAttribute("href", `data:text/plain;charset=utf-8,${vote}`);
+      link.setAttribute("download", auditedDataFileName);
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    },
+    onAuditComplete() {
+      console.log("Audit completed");
+    },
+    onCastBallot() {
+      questionsComponent.voteCasted = true;
+      $(".cast_ballot").prop("disabled", true);
+    },
+    onCastComplete() {
+      console.log("Cast completed");
+    },
+    onInvalid() {
+      console.log("Something went wrong.");
+    }
+  });
+});

data/app/packs/src/decidim/elections/voter/setup-preview.js

@@ -0,0 +1,79 @@
+/* eslint-disable require-jsdoc */
+// The wait time used to simulate the encryption of the vote during the preview
+const FAKE_ENCRYPTION_TIME = 1000;
+
+class PreviewVoteComponent {
+  constructor({ electionUniqueId, voterUniqueId }) {
+    this.electionUniqueId = electionUniqueId;
+    this.voterUniqueId = voterUniqueId;
+  }
+
+  async bindEvents({
+    onBindEncryptButton,
+    onStart,
+    onVoteEncryption,
+    castOrAuditBallot,
+    onBindAuditBallotButton,
+    onBindCastBallotButton,
+    onAuditBallot,
+    onCastBallot,
+    onAuditComplete,
+    onCastComplete,
+    onInvalid
+  }) {
+    onBindEncryptButton(async () => {
+      onStart();
+      onVoteEncryption(
+        (plainVote) => {
+          this.fakeEncrypt(plainVote).then((ballot) => {
+            castOrAuditBallot(ballot);
+            onBindAuditBallotButton(() => {
+              onAuditBallot(
+                ballot,
+                `${this.voterUniqueId}-election-${this.electionUniqueId}.txt`
+              );
+              onAuditComplete();
+            });
+
+            onBindCastBallotButton(async () => {
+              await onCastBallot(ballot);
+              onCastComplete();
+            });
+          });
+        },
+        () => {
+          onInvalid();
+        }
+      );
+    });
+  }
+  async fakeEncrypt(plainVote) {
+    await new Promise((resolve) => setTimeout(resolve, FAKE_ENCRYPTION_TIME));
+
+    return {
+      encryptedData: plainVote,
+      encryptedDataHash: this.generateHexString(64),
+      auditableData: plainVote
+    };
+  }
+  generateHexString(length) {
+    return Array(length).
+      fill("").
+      map(() => Math.random().toString(16).charAt(2)).
+      join("");
+  }
+}
+
+export default function setupVoteComponent($voteWrapper) {
+  const voterUniqueId = $voteWrapper.data("voterId");
+  const electionUniqueId = $voteWrapper.data("electionUniqueId");
+
+  return new PreviewVoteComponent({
+    electionUniqueId,
+    voterUniqueId
+  });
+}
+
+window.Decidim = window.Decidim || {};
+window.Decidim.setupVoteComponent = setupVoteComponent;
+

data/app/packs/src/decidim/elections/voter/setup-vote.js

@@ -0,0 +1,50 @@
+/* eslint-disable require-jsdoc */
+
+import { VoteComponent } from "@codegram/decidim-bulletin_board";
+
+import * as VotingSchemesDummy from "@codegram/voting_schemes-dummy";
+const DummyVoterWrapperAdapter = VotingSchemesDummy.VoterWrapperAdapter;
+import * as VotingSchemesElectionGuard from "@codegram/voting_schemes-electionguard";
+const ElectionGuardVoterWrapperAdapter = VotingSchemesElectionGuard.VoterWrapperAdapter;
+
+export default function setupVoteComponent($voteWrapper) {
+  // Data
+  const bulletinBoardClientParams = {
+    apiEndpointUrl: $voteWrapper.data("apiEndpointUrl")
+  };
+  const electionUniqueId = $voteWrapper.data("electionUniqueId");
+  const authorityPublicKeyJSON = JSON.stringify(
+    $voteWrapper.data("authorityPublicKey")
+  );
+  const voterUniqueId = $voteWrapper.data("voterId");
+  const schemeName = $voteWrapper.data("schemeName");
+
+  // Use the correct voter wrapper adapter
+  let voterWrapperAdapter = null;
+
+  if (schemeName === "dummy") {
+    voterWrapperAdapter = new DummyVoterWrapperAdapter({
+      voterId: voterUniqueId
+    });
+  } else if (schemeName === "electionguard") {
+    voterWrapperAdapter = new ElectionGuardVoterWrapperAdapter({
+      voterId: voterUniqueId,
+      workerUrl: "/assets/electionguard/webworker.js"
+    });
+  } else {
+    throw new Error(`Voting scheme ${schemeName} not supported.`);
+  }
+
+  // Returns the vote component
+  return new VoteComponent({
+    bulletinBoardClientParams,
+    authorityPublicKeyJSON,
+    electionUniqueId,
+    voterUniqueId,
+    voterWrapperAdapter
+  });
+}
+
+window.Decidim = window.Decidim || {};
+window.Decidim.setupVoteComponent = setupVoteComponent;
+

data/app/{assets/javascripts/decidim/elections/vote_verify.js.es6 → packs/src/decidim/elections/voter/verify-vote.js}

@@ -1,10 +1,10 @@
 /* eslint-disable require-jsdoc, prefer-template, func-style, id-length, no-use-before-define, init-declarations, no-invalid-this */
 /* eslint no-unused-vars: ["error", { "args": "none" }] */
-// = require decidim/bulletin_board/decidim-bulletin_board
+
+import { Client } from "@codegram/decidim-bulletin_board";
 
 $(() => {
-  const { Client } = decidimBulletinBoard;
-  const $voteVerifyWrapper = $(".vote-verify-wrapper");
+  const $voteVerifyWrapper = $(".verify-vote-wrapper");
   const $verifySubmitButton = $voteVerifyWrapper.find("a.focus__next.confirm");
 
   let $formData = $voteVerifyWrapper.find(".vote-identifier");
@@ -14,7 +14,7 @@ $(() => {
     onVoteIdentifierChange();
   }
 
-  initStep()
+  initStep();
 
   function onVoteIdentifierChange() {
     $formData.on("keyup input", (event) => {
@@ -26,9 +26,9 @@ $(() => {
 
   function toggleVerifyButton() {
     if ($formData.val().length > 5) {
-      $($verifySubmitButton).removeClass("disabled")
+      $($verifySubmitButton).removeClass("disabled");
     } else {
-      $($verifySubmitButton).addClass("disabled")
+      $($verifySubmitButton).addClass("disabled");
     }
   }
 
@@ -47,25 +47,26 @@ $(() => {
 
   function verifyVoteIdentifier() {
     const bulletinBoardClient = new Client({
-      apiEndpointUrl: $voteVerifyWrapper.data("apiEndpointUrl"),
-      wsEndpointUrl: $voteVerifyWrapper.data("websocketUrl")
+      apiEndpointUrl: $voteVerifyWrapper.data("apiEndpointUrl")
     });
 
-    bulletinBoardClient.getLogEntry({
-      electionUniqueId: $voteVerifyWrapper.data("electionUniqueId"),
-      contentHash: $formData.val()
-    }).then((result) => {
-      if (result) {
-        hideErrorCallout();
-        $voteVerifyWrapper.find(".verify-vote-success").removeClass("hide");
-      } else {
-        hideSuccessCallout();
-        $voteVerifyWrapper.find(".verify-vote-error").removeClass("hide");
-      }
-    })
+    bulletinBoardClient.
+      getLogEntry({
+        electionUniqueId: $voteVerifyWrapper.data("electionUniqueId"),
+        contentHash: $formData.val()
+      }).
+      then((result) => {
+        if (result) {
+          hideErrorCallout();
+          $voteVerifyWrapper.find(".verify-vote-success").removeClass("hide");
+        } else {
+          hideSuccessCallout();
+          $voteVerifyWrapper.find(".verify-vote-error").removeClass("hide");
+        }
+      });
   }
 
   $(document).on("on.zf.toggler", (event) => {
-    initStep()
+    initStep();
   });
 });

data/app/packs/src/decidim/elections/voter/vote_questions.component.js

@@ -0,0 +1,124 @@
+/**
+ * Vote Questions component.
+ */
+
+export default class VoteQuestionsComponent {
+  constructor($voteWrapper) {
+    this.$voteWrapper = $voteWrapper;
+    this.$continueButton = this.$voteWrapper.find("a.focus__next");
+    this.$confirmButton = this.$voteWrapper.find("a.focus__next.confirm");
+    this.$continueSpan = this.$voteWrapper.find("span.disabled-continue");
+    this.$currentStep = "";
+    this.$currentStepMaxSelection = "";
+    this.$answerCounter = 0;
+    this.voteCasted = false;
+    window.onbeforeunload = () => {
+      if (this.voteCasted) {
+        return null;
+      }
+      return "";
+    }
+  }
+
+  init() {
+    this.setCurrentStep();
+    this.toggleContinueButton();
+    this.$confirmButton.addClass("show").removeClass("hide");
+    $(".evote__counter-min").text(this.$answerCounter);
+    this.answerCounter();
+    this.disableCheckbox();
+  }
+
+  setCurrentStep() {
+    this.$currentStep = this.$voteWrapper.find(".focus__step:visible")
+    this.setSelections();
+    this.onSelectionChange();
+  }
+
+  toggleContinueButton() {
+    if (this.checkAnswers()) {
+      // next step enabled
+      this.$continueButton.addClass("show").removeClass("hide")
+      this.$continueSpan.addClass("hide").removeClass("show")
+    } else {
+      // next step disabled
+      this.$continueButton.addClass("hide").removeClass("show")
+      this.$continueSpan.addClass("show").removeClass("hide")
+    }
+  }
+
+  // check if answers are correctly checked
+  checkAnswers() {
+    const currentAnswersChecked = $(`#${this.$currentStep.attr("id")} .answer_input:checked`).length
+    const notaAnswerChecked = $(`#${this.$currentStep.attr("id")} .nota_input:checked`).length
+
+    return ((currentAnswersChecked >= 1 || notaAnswerChecked > 0) && (currentAnswersChecked <= this.$currentStepMaxSelection));
+  }
+
+  answerCounter() {
+    let checked = $(`#${this.$currentStep.attr("id")} .answer_input:checked`).length
+    $(".evote__counter-min").text(checked);
+  }
+
+  // disable checkboxes if NOTA option is selected
+  disableCheckbox() {
+    $("[data-disabled-by]").on("click", (event) => {
+      if ($(event.target).attr("aria-disabled") || $(event.target).hasClass("is-disabled")) {
+        event.preventDefault();
+      }
+    });
+
+    $("[data-disable-check]").on("change", (event) => {
+      let checkId = $(event.target).attr("id");
+      let checkStatus = event.target.checked;
+
+      this.$currentStep.find(`[data-disabled-by='#${checkId}']`).each((_index, element) => {
+        if (checkStatus) {
+          $(element).addClass("is-disabled");
+          $(element).find("input[type=checkbox]").prop("checked", false);
+          $(element).find("input[type=checkbox]").attr("aria-disabled", "");
+        } else {
+          $(element).removeClass("is-disabled");
+          $(element).find("input[type=checkbox]").removeAttr("aria-disabled");
+        }
+      });
+    });
+  }
+
+  setSelections() {
+    this.$currentStepMaxSelection = this.$currentStep.find(".evote__options").data("max-selection")
+  }
+
+
+  onSelectionChange() {
+    let $voteOptions = this.$currentStep.find(".evote__options");
+    $voteOptions.on("change", () => {
+      this.toggleContinueButton();
+      this.toggleConfirmAnswers();
+      this.answerCounter();
+    });
+  }
+
+  // receive confirmed answers
+  toggleConfirmAnswers() {
+    $(".answer_input:checked").each((_index, element) => {
+      const confirmedAnswer = $(".evote__confirm").find(`#${element.value}`);
+      $(confirmedAnswer).removeClass("hide")
+    })
+
+    $(".answer_input").not(":checked").each((_index, element) => {
+      const confirmedAnswer = $(".evote__confirm").find(`#${element.value}`);
+      $(confirmedAnswer).addClass("hide")
+    })
+
+    $(".nota_input:checked").each((_index, element) => {
+      const confirmedAnswer = $(".evote__confirm").find(`.${element.value}`);
+      $(confirmedAnswer).removeClass("hide")
+    })
+
+    $(".nota_input").not(":checked").each((_index, element) => {
+      const confirmedAnswer = $(".evote__confirm").find(`.${element.value}`);
+      $(confirmedAnswer).addClass("hide")
+    })
+  }
+}