Changes for presidential election, switch order of preferred candidat…

…e and email collection pages (#725)
kalkulacka-one · Dec 6, 2024 · 0e54d7c · 0e54d7c
1 parent 8b66180
commit 0e54d7c
Show file tree

Hide file tree

Showing 18 changed files with 565 additions and 69 deletions.
diff --git a/data/avatars/presidential-2024/Georgescu.png b/data/avatars/presidential-2024/Georgescu.png
diff --git a/data/avatars/presidential-2024/Lasconi.png b/data/avatars/presidential-2024/Lasconi.png
diff --git a/data/kalkulacka/calculators.json b/data/kalkulacka/calculators.json
@@ -14,6 +14,21 @@
       },
       "from": "2024-12-01T00:00:00",
       "to": "2024-12-01T14:00:00"
+    },
+    {
+      "id": "presidential-2024",
+      "key": "presidential-2024",
+      "name": "Alegeri prezidențiale în România 2024",
+      "description": "Alegeri prezidențiale în România 2024",
+      "instructions": {
+        "header": "presidential - header",
+        "step_1_1": "",
+        "step_1_2": "",
+        "step_1_link": "",
+        "step_2_1": ""
+      },
+      "from": "2024-12-01T00:00:00",
+      "to": "2024-12-01T14:00:00"
     }
   ],
   "calculators": [
@@ -26,6 +41,16 @@
       "description": "[[MISSING]]",
       "on_hp_from": "2024-12-01T00:00:00",
       "on_hp_to": "2024-12-01T14:00:00"
+    },
+    {
+      "calculator_id": "788008c2-7d94-48a6-8aec-5d6bb56ec5d0",
+      "election_id": "presidential-2024",
+      "district_code": "global",
+      "show_district_code": false,
+      "name": "calculator",
+      "description": "[[MISSING]]",
+      "on_hp_from": "2024-12-01T00:00:00",
+      "on_hp_to": "2024-12-01T14:00:00"
     }
   ]
 }
diff --git a/data/kalkulacka/presidential-2024/global.json b/data/kalkulacka/presidential-2024/global.json
diff --git a/frontend/index.html b/frontend/index.html
@@ -10,7 +10,7 @@
     <meta property="og:title" content="TestVot 2024" />
     <meta
       property="og:description"
-      content="Ce partid îți va reprezenta cel mai bine opinia la alegerile parlamentare?"
+      content="Ce partid îți va reprezenta cel mai bine opinia la alegerile prezidențiale?"
     />
     <meta
       property="og:image"
@@ -27,7 +27,7 @@
     <meta name="twitter:title" content="TestVot 2024" />
     <meta
       name="twitter:description"
-      content="Ce partid îți va reprezenta cel mai bine opinia la alegerile parlamentare?"
+      content="Ce partid îți va reprezenta cel mai bine opinia la alegerile prezidențiale?"
     />
     <meta
       name="twitter:image"

diff --git a/frontend/src/components/FooterMultiWord.vue b/frontend/src/components/FooterMultiWord.vue
@@ -30,7 +30,7 @@ const router = useRouter();
                   Un proiect al Median Research Centre (MRC)
                 </BodyText>
               </a>
-              <a target="_blank" href="https://www.openpolitics.ro/tot-ce-ai-nevoie-sa-stii-despre-aplicatia-testvot-2024/">
+              <a target="_blank" href="https://www.openpolitics.ro/testvot-alegerile-prezidentiale-2024/">
                 <BodyText size="small">
                   Metodologia proiectului
                 </BodyText>

diff --git a/frontend/src/components/design-system/containers/FilledCircle.vue b/frontend/src/components/design-system/containers/FilledCircle.vue
@@ -31,7 +31,7 @@ const classes = computed(() => ({
   align-items: center;
   justify-content: center;
   border-radius: 50%;
-  overflow: visible;
+  overflow: hidden;
 
   &--extra-small {
     width: var(--sizing-medium);

diff --git a/frontend/src/components/design-system/other/AvatarComponent.vue b/frontend/src/components/design-system/other/AvatarComponent.vue
@@ -124,7 +124,7 @@ const initials = computed(() => {
   }
 
   .image {
-    object-fit: contain;
+    object-fit: cover;
     width: 100%;
     height: 100%;
   }

diff --git a/frontend/src/routes/email-collection/EmailCollectionPage.vue b/frontend/src/routes/email-collection/EmailCollectionPage.vue
@@ -46,7 +46,7 @@ const message = ref();
 
 const handlePreviousClick = () => {
   router.push({
-    name: appRoutes.recap.name,
+    name: appRoutes.preferredCandidate.name,
     params: { ...route.params },
     query: { ...route.query },
   });
@@ -80,7 +80,7 @@ const onSubmit = async () => {
     userStore.setUser(user);
 
     router.push({
-      name: appRoutes.preferredCandidate.name,
+      name: appRoutes.result.name,
       query: { ...route.query },
     });
   } else {
@@ -153,7 +153,7 @@ const onRefuse = async () => {
           <SecondaryNavigationBar centered-title>
             <template #before>
               <IconButton @click="handlePreviousClick">
-                <IconComponent :icon="mdiArrowLeft" title="Recapitulare" />
+                <IconComponent :icon="mdiArrowLeft" title="Candidat" />
               </IconButton>
             </template>
             <TitleText tag="h2" size="medium"
@@ -165,7 +165,7 @@ const onRefuse = async () => {
           <SecondaryNavigationBar centered-title>
             <template #before>
               <IconButton @click="handlePreviousClick">
-                <IconComponent :icon="mdiArrowLeft" title="Recapitulare" />
+                <IconComponent :icon="mdiArrowLeft" title="Candidat" />
               </IconButton>
             </template>
             <TitleText tag="h2" size="large"
@@ -178,7 +178,7 @@ const onRefuse = async () => {
         <StepWrapper centered>
           <template #before />
           <StackComponent spacing="small">
-            <BodyText size="medium">
+            <!-- <BodyText size="medium">
               Ne-am bucura să ne spui ce crezi despre TestVot sau despre
               alegeri. Poți să ne scrii la
               <a target="_blank" href="mailto:[email protected]"
@@ -194,6 +194,14 @@ const onRefuse = async () => {
             <BodyText size="medium">
               Iți vom trimite pe același email și un rezumat a ceea ce a
               reieșit din analiza statistică a răspunsurilor la TestVot.
+            </BodyText> -->
+            <BodyText size="medium">
+              Am dori să vă trimitem prin e-mail analiza noastră statistică
+              a răspunsurilor alegătorilor la TestVot. Ne puteți da adresa
+              dumneavoastră aici? Vă reamintim că răspunsurile dumneavoastră
+              vor fi folosite doar în formă anonimă și nu vom oferi datele
+              dumneavoastră nimănui, doar vă vom întreba despre TestVot și
+              problemele din alegeri.
             </BodyText>
           </StackComponent>
           <template #after />

diff --git a/frontend/src/routes/guide/GuidePage.vue b/frontend/src/routes/guide/GuidePage.vue
@@ -256,7 +256,7 @@ const handlePreviousClick = () => {
               Ce face TestVot
             </HeadingComponent>
             <BodyText size="medium">
-              Indiferent dacă știi cu cine vei vota, din TestVot poți afla mai multe despre viziunea și pozițiile partidelor pe probleme care îi preocupa pe români.
+              Indiferent dacă știi cu cine vei vota, din TestVot poți afla mai multe despre viziunea și pozițiile candidaților pe probleme care îi preocupa pe români.
             </BodyText>
             <BodyText size="medium">
               <MarkdownIt :markdown="`Aplicația TestVot, realizată de [OpenPolitics.ro](https://www.openpolitics.ro/) și [Median Research Centre](https://www.medianresearch.ro/) (MRC), este singura de acest gen din România care a fost disponibilă la toate alegerile naționale începând cu 2008.`"/>
@@ -266,7 +266,7 @@ const handlePreviousClick = () => {
             <HeadingComponent kind="title" size="medium">
               Cum funcționează TestVot
             </HeadingComponent>
-            <BodyText size="medium">Versiunea pentru alegerile parlamentare din 2024 are 24 de afirmații cu 2 variante de răspuns (sunt de acord / nu sunt de acord).</BodyText>
+            <BodyText size="medium">Versiunea pentru alegerile prezidențiale din 2024 are 21 de afirmații cu 2 variante de răspuns (sunt de acord / nu sunt de acord).</BodyText>
             <CardComponent
               corner="bottom-right"
               border

diff --git a/frontend/src/routes/index/IndexPage.vue b/frontend/src/routes/index/IndexPage.vue
@@ -48,7 +48,7 @@ const hasCheckedPrivacy = ref(false);
             <div class="card-content">
               <div class="card-content-text">
                 <TitleText tag="h3" size="medium">
-                  TestVot 2024 alegeri parlamentare
+                  TestVot 2024 alegeri prezidențiale
                 </TitleText>
                 <BodyText size="medium">
                   Pentru a folosi aplicația trebuie să fii de acord cu <router-link to="/protectia-datelor">politica de confidențialitate</router-link> a datelor.
@@ -70,7 +70,7 @@ const hasCheckedPrivacy = ref(false);
                     name: appRoutes.guide.name,
                     params: {
                       ...route.params,
-                      election: 'parliamentary-2024',
+                      election: 'presidential-2024',
                       district: 'global',
                     },
                     query: { ...route.query },

diff --git a/frontend/src/routes/preferred-candidate/CandidateCard.vue b/frontend/src/routes/preferred-candidate/CandidateCard.vue
@@ -32,9 +32,12 @@ const route = useRoute();
 
 const handleVote = (candidateId: string | null) => {
   if (!candidateId) return;
+  if (!userStore.user) {
+    userStore.setUser({ id: 'anonymous' });
+  }
   userStore.saveVote(candidateId);
   router.push({
-    name: appRoutes.result.name,
+    name: appRoutes.emailCollection.name,
     params: { ...route.params },
     query: { ...route.query },
   });
@@ -55,7 +58,7 @@ const hovered = ref(false);
   >
     <div class="avatar desktop">
       <AvatarComponent
-        size="medium"
+        size="extra-large"
         background-color="rgb(var(--palette-primary-90))"
         :background-image="
           candidate?.img_url ||
@@ -68,7 +71,7 @@ const hovered = ref(false);
     </div>
     <div class="avatar mobile">
       <AvatarComponent
-        size="medium"
+        size="large"
         :background-color="
           order === 1
             ? 'rgb(var(--palette-primary-50))'
@@ -84,19 +87,19 @@ const hovered = ref(false);
       </AvatarComponent>
     </div>
     <div class="text">
-      <BodyText class="desktop" tag="p" size="medium">
+      <BodyText class="desktop" tag="p" size="large">
         <strong>{{ candidate?.name }}</strong>
       </BodyText>
       <BodyText class="mobile" tag="p" size="medium">
-        <strong>{{ candidate?.short_name }}</strong>
+        <strong>{{ candidate?.name }}</strong>
       </BodyText>
     </div>
     <ButtonComponent
         v-show="true"
         class="vote-button"
         kind="outlined"
         color="neutral"
-        size="small"
+        size="medium"
         selected
         @click="handleVote(candidate?.id ?? null)"
         @mouseover="hovered = true"
@@ -154,7 +157,7 @@ const hovered = ref(false);
   }
 
   @media (max-width: 700px) {
-    grid-template-columns: 3rem 1fr auto;
+    grid-template-columns: 4rem 1fr auto;
     column-gap: var(--responsive-spacing-extra-small);
   }
 

diff --git a/frontend/src/routes/preferred-candidate/CandidateList.vue b/frontend/src/routes/preferred-candidate/CandidateList.vue
@@ -7,7 +7,7 @@ import StackComponent from '../../components/design-system/layout/StackComponent
 import { useElectionStore } from '@/stores/electionStore';
 import ButtonComponent from '@/components/design-system/input/ButtonComponent.vue';
 import DividerComponent from '@/components/design-system/containers/DividerComponent.vue';
-import { useSubscriberStore } from '@/stores/subscriberStore';
+import { useUserStore } from '@/stores/userStore';
 import { appRoutes } from '@/main';
 import { useRoute, useRouter } from 'vue-router';
 import { mdiArrowRight } from '@mdi/js';
@@ -23,7 +23,7 @@ const route = useRoute();
 const electionStore = useElectionStore();
 const candidates = computed(() => randomize(electionStore.calculator!.candidates));
 
-const subscriberStore = useSubscriberStore();
+const userStore = useUserStore();
 
 const randomize = (arr: any[]) => {
   return arr.sort(() => Math.random() - 0.5);
@@ -32,9 +32,9 @@ const randomize = (arr: any[]) => {
 const handleVote = (option: string | null) => {
   if (!option) return;
   if (option === 'no-vote') {
-    subscriberStore.saveVote('will-not-vote');
+    userStore.saveVote('will-not-vote');
   } else if (option === 'no-answer') {
-    subscriberStore.saveVote('did-not-answer');
+    userStore.saveVote('did-not-answer');
   } 
   router.push({
     name: appRoutes.result.name,

diff --git a/frontend/src/routes/preferred-candidate/PreferredCandidatePage.vue b/frontend/src/routes/preferred-candidate/PreferredCandidatePage.vue
@@ -172,11 +172,9 @@ const handleShowComparsionClick = () => {
         >
           <StackComponent spacing="small">
             <BodyText size="medium">
-              De asemenea, am dori să arătăm cum cred susținătorii diferitelor partide
-              despre întrebarea de mai sus. Pentru a face acest lucru, trebuie să știm
-              cum intenționează să voteze cei care au răspuns la întrebările noastre.
-              Ne-ați spune, vă rog, pe ce partide ați vota, cel mai probabil, dacă ați
-              vota la alegerile parlamentare din acest an?
+              Am dori să vă arătăm cum răspund susținătorii lui Georgescu și
+              Lasconi la întrebările de mai sus. Pentru a facilita acest lucru,
+              vă rugăm să ne spuneți pentru ce candidat intenționați să votați?
             </BodyText>
           </StackComponent>
           <CandidateList

diff --git a/frontend/src/routes/recap/RecapPage.vue b/frontend/src/routes/recap/RecapPage.vue
@@ -57,13 +57,13 @@ const handlePreviousClick = () => {
   });
 };
 
-// const goToPreferredCandidatePage = () => {
-//   router.push({
-//     name: appRoutes.preferredCandidate.name,
-//     params: { ...route.params },
-//     query: { ...route.query },
-//   });
-// };
+ const goToPreferredCandidatePage = () => {
+   router.push({
+     name: appRoutes.preferredCandidate.name,
+     params: { ...route.params },
+     query: { ...route.query },
+   });
+ };
 
 // const goToResultPage = () => {
 //   router.push({
@@ -73,13 +73,13 @@ const handlePreviousClick = () => {
 //   });
 // };
 
-const goToEmailCollection = () => {
+/* const goToEmailCollection = () => {
   router.push({
     name: appRoutes.emailCollection.name,
     params: { ...route.params },
     query: { ...route.query },
   });
-};
+}; */
 
 const availableTags: Set<string> = new Set(['All']);
 const selectedTag = ref('All');
@@ -174,12 +174,12 @@ const isCardHidden = (index: number) => {
                 class="desktop"
                 kind="filled"
                 color="primary"
-                @click="goToEmailCollection"
+                @click="goToPreferredCandidatePage()"
               >
                 <template #icon>
                   <IconComponent :icon="vkiLogoPercent" />
                 </template>
-                Arată rezultatele
+                Întrebarea următoare
                 <template #iconAfter>
                   <IconComponent :icon="mdiArrowRight" />
                 </template>
@@ -190,9 +190,9 @@ const isCardHidden = (index: number) => {
       </template>
       <BottomBarWrapper>
         <StackComponent class="main" spacing="small">
-          <BodyText size="small">
-            Aici poți verifica și ajusta răspunsurile și greutatea lor, dacă
-            este necesar.
+          <BodyText size="medium">
+            Aici iți poți verifica și ajusta răspunsurile și
+            importanța lor, dacă ți se pare necesar.
           </BodyText>
           <StackComponent class="list" spacing="small">
             <RecapQuestionCard
@@ -217,9 +217,9 @@ const isCardHidden = (index: number) => {
                 <ButtonComponent
                   kind="filled"
                   color="primary"
-                  @click="goToEmailCollection"
+                  @click="goToPreferredCandidatePage()"
                 >
-                  Spre rezultatele
+                  Întrebarea următoare
                   <template #iconAfter>
                     <IconComponent :icon="mdiArrowRight" />
                   </template>

diff --git a/frontend/src/routes/result/ResultCategory.vue b/frontend/src/routes/result/ResultCategory.vue
@@ -50,7 +50,7 @@ console.debug(visibleCandidates.value);
       class="expand-btn"
       @click="handleExpandClick"
     >
-      {{ isExpanded ? 'Ascunde partidele' : 'Arată toate partidele' }}
+      {{ isExpanded ? 'Ascunde candidați' : 'Arată toate candidați' }}
       <template #iconAfter>
         <IconComponent
           :class="[

diff --git a/frontend/src/routes/result/ResultPage.vue b/frontend/src/routes/result/ResultPage.vue
@@ -94,7 +94,7 @@ const handleShowComparsionClick = () => {
 };
 
 onBeforeMount(async () => {
-  if (election.key === 'parliamentary-2024') {
+  if (election.key === 'presidential-2024') {
     if (userStore.user || userStore.user === null) {
       const res = await electionStore.saveResults({
         embedName: currentEmbed,
@@ -245,7 +245,7 @@ const shareModal = ref<InstanceType<typeof ResultShareModal> | null>(null);
             <template #after>
               <div class="navbar-btn-wrapper">
                 <ButtonComponent
-                  v-if="election.key === 'parliamentary-2024'"
+                  v-if="election.key === 'presidential-2024'"
                   kind="outlined"
                   color="primary"
                   @click="handleShowComparsionClick"