Vote By Mail / Paula Friedrich

voteByMailTool = html`${await voteByMail(lang)}`

mutable analyticsFired = ({

embed: false,

complete: false

})

voteByMail = async(lang) => {

//Only fire analytics on first render

if (!analyticsFired.embed) {

await triggerEmbedAnalytics(`Vote by mail tool (${lang})`);

mutable analyticsFired.embed = true;

}

return html `

${ style() }

${viewof voterForm}

</div>

${resultsSection(lang)}

</div>

${footer("Paula Friedrich, Claudia Morell/WBEZ; Patrick Sier/City Bureau; Traducido por Gisela Orozco", "")}

</div>

`}

voterForm

getStepCopy = (formResults, stepNumber, lang) => {

const resultStrs = new Object;

let titleKey = '';

let descKey = '';

let deadlineKey = '';

let deadline = '';

let step = '';

let calendarKey = '';

let calLinkURL = '';

let noteKey = '';

let electionAuthority = electionAuthorities.find(d => d.county === formResults.electionAuthorities);

let registrationLink = electionAuthority.registration_link;

let checkLink = electionAuthority.check_link;

let authorityLink = electionAuthority.box_link;

let applicationLink = electionAuthority.application_link;

if (stepNumber === 0) {

calLinkURL = registrationLink;

deadline = new Date (electionAuthority.registration_deadline);

step = 1;

//registration step

if (formResults.registered === "No") {

titleKey = "results.register.title";

descKey = "results.register.description";

calendarKey = "results.register.calendarLink";

} else if (formResults.registered === "Not sure") {

titleKey = "results.checkRegistration.title";

descKey = "results.checkRegistration.description";

calendarKey = "results.checkRegistration.calendarLink";

} else if (formResults.didMove === "Yes") {

titleKey = "results.checkRegistration.title";

descKey = "results.checkRegistration.descriptionMoved";

calendarKey = "results.checkRegistration.calendarLink";

} else if (formResults.willMove === "Yes") {

titleKey = "results.updateRegistration.title";

descKey = "results.updateRegistration.description";

calendarKey = "results.updateRegistration.calendarLink";

} else {

return ``

}

} else if (stepNumber === 1) {

calLinkURL = applicationLink;

deadline = new Date (electionAuthority.application_deadline);

noteKey = "results.defaultApply.note";

step = formResults.registered === "No" || formResults.willMove === "Yes" || formResults.didMove === "Yes" || formResults.registered === "Not sure" ? 2 : 1;

//application step

if (formResults.registered === "No") {

titleKey = "results.applyOnline.title";

descKey = "results.applyOnline.description";

deadlineKey = "results.applyOnline.deadline";

calendarKey = "results.applyOnline.calendarLink";

} else if (formResults.willMove === "Yes" || formResults.didMove === "Yes") {

titleKey = "results.movedApply.title";

descKey = "results.movedApply.description";

deadlineKey = "results.movedApply.deadline";

calendarKey = "results.applyOnline.calendarLink";

} else if (formResults.voted === "No") {

titleKey = "results.applyOnline.title";

descKey = "results.applyOnline.description";

deadlineKey = "results.applyOnline.deadline";

calendarKey = "results.applyOnline.calendarLink";

} else if (formResults.registered === "Not sure" ) {

titleKey = "results.defaultApply.title";

descKey = "results.defaultApply.description";

deadlineKey = "results.defaultApply.deadline";

calendarKey = "results.defaultApply.calendarLink";

} else {

titleKey = "results.defaultApply.title";

descKey = "results.defaultApply.description";

deadlineKey = "results.defaultApply.deadline";

calendarKey = "results.defaultApply.calendarLink";

}

} else if (stepNumber === 2) {

step = formResults.registered === "No" || formResults.willMove === "Yes" || formResults.didMove === "Yes" || formResults.registered === "Not sure" ? 3 : 2;

deadline = new Date (electionAuthority.mail_deadline);

//mail step

titleKey = "results.mail.title";

descKey = "results.mail.description";

deadlineKey = "results.mail.deadline";

calendarKey = "results.mail.calendarLink";

noteKey = "results.mail.note";

} else if (stepNumber === 3) {

//tracking step

if (electionAuthority === "Chicago") {

titleKey = "results.track.title";

descKey = "results.track.description";

} else {

return ''

}

//Format and translate text

resultStrs.title = messageFormatter(titleKey, lang).format();

resultStrs.desc = messageFormatter(descKey, lang).format({

p: str => html`<p>${str}</p>`,

electionAuthority: electionAuthority ? electionAuthority.election_authority_name : '' ,

registration_link: str => html`<a href="${registrationLink}" target="_blank" rel="noreferrer">${str}</a>`,

check_link: str => html`<a href="${checkLink}" target="_blank" rel="noreferrer">${str}</a>`,

application_link: str => html`<a href="${applicationLink}" target="_blank" rel="noreferrer">${str}</a>`,

authority_link: str => html`<a href="${authorityLink}" target="_blank" rel="noreferrer">${str}</a>`,

b: str => html`<b>${str}</b>`

});

resultStrs.deadline = deadline.toLocaleString(lang, {

month: "long",

day: "numeric"

});

resultStrs.note = messageFormatter(noteKey, lang).format({

b: str => html`<b>${str}</b>`

});

resultStrs.step = messageFormatter(`step_${step}`, lang).format();

resultStrs.calendarLink = calendarLink({

start: deadline,

end: deadline,

allDay: true,

title: messageFormatter(calendarKey, lang).format(),

url: calLinkURL,

filename: "votebymail.ics",

label: messageFormatter("calendar", lang).format(),

attributes: {

class: "calendar-link"

}

});

resultStrs.googleCalendarLink = googleCalendarLink({

start: deadline,

end: deadline,

allDay: true,

title: messageFormatter(calendarKey, lang).format(),

url: calLinkURL,

filename: "votebymail.ics",

label: messageFormatter("googleCalendar", lang).format(),

attributes: {

class: "calendar-link"

}

})

resultStrs.calendarLink.addEventListener("click", a => {

triggerEmbedAnalyticsEvent(

`Vote by mail tool calendar event add (${lang})`

);

});

resultStrs.googleCalendarLink.addEventListener("click", a => {

triggerEmbedAnalyticsEvent(

`Vote by mail tool Google calendar event add (${lang})`

);

});

return html`

<h3><span class="step">${resultStrs.step}</span>: ${resultStrs.title}</h3>

<p>${resultStrs.desc}</p>

${ resultStrs.deadline != '' ? html `<div class="deadline" >

<p><i class="material-icons">calendar_today</i> <b>${messageFormatter("deadline", lang).format()}</b>:

${resultStrs.deadline} | ${resultStrs.calendarLink} | ${resultStrs.googleCalendarLink}</p>

${ resultStrs.note ? html`<p>${resultStrs.note}</p></div>` : ``}

`: `` }

`

}

resultsSection = (lang) => {

let formResults = voterForm;

let electionAuthority = electionAuthorities.find(d => d.county === formResults.electionAuthorities);

//Trigger completion event only if actually completed

if (Object.keys(formResults).length === 5 && formResults.electionAuthorities.length > 0) {

//Only fire analytics on first render

if (!analyticsFired.complete) {

triggerEmbedAnalyticsEvent(

`Vote by mail tool quiz complete (${lang})`,

electionAuthority.election_authority_name, `registered - ${formResults.registered}`

);

mutable analyticsFired.complete = true;

}

return Object.keys(formResults).length === 5 && formResults.electionAuthorities.length > 0 ?

html `

<h2>${ messageFormatter("resultsTitle", lang).format() }</h2>

${getStepCopy(formResults, 0, lang)}

${getStepCopy(formResults, 1, lang)}

${getStepCopy(formResults, 2, lang)}

${ messageFormatter("issues", lang).format({

b: str => html`<b>${str}</b>`,

electionAuthority: electionAuthority.election_authority_name,

phone: electionAuthority.contact

}) }

</p>

</div>

`

: html`<p class="help"><i class="material-icons">arrow_circle_up</i> ${messageFormatter("instructions", lang).format() }</p>`

}

translations = (

{ en: {

resultsTitle: "Your instructions",

step_1: "Step 1",

step_2: "Step 2",

step_3: "Step 3",

step_4: "Step 4",

deadline: "Your deadline",

instructions: "Answer the five questions above to get your step-by-step instructions.",

counties: {

chicago: "Chicago",

suburbanCook: "Suburban Cook County",

dupage: "DuPage County",

kane: "Kane County",

kendall: "Kendall County",

lake: "Lake County",

mchenry: "McHenry County",

will: "Will County"

},

whereVote: "Where will you cast your ballot?",

registered: {

title: "Are you registered to vote?",

options: ["Yes","No", "Not sure"]

},

didMove: {

title: "Have you moved since Aug. 1?",

options: ["Yes","No"]

},

willMove: {

title: "Will you move before November?",

options: ["Yes","No"]

},

voted: {

title: "Have you voted in Illinois at least once in the last two years?",

options: ["Yes","No"]

},

results: {

register: { title: "You should register to vote",

description: "You can register online <registration_link>here</registration_link>.",

calendarLink: "Deadline to register to vote"

},

checkRegistration: { title: "Check your voter registration",

description: "You can check if you are registered to vote <check_link>here</check_link>. If you're not registered, you can register online or change your registration address <registration_link>here</registration_link>.",

descriptionMoved: "Did you change your voter registration when you moved? If not, your address may need to be updated. Go online <check_link>here</check_link> to check. You can change your registration address <registration_link>here</registration_link>, the same spot you'd submit a new registration.",

calendarLink: "Deadline to update voter registration"

},

updateRegistration: { title: "Update your voter registration",

description: "If you know where you're moving to (and it's in Illinois), you'll want to update your address to ensure your ballot arrives. You can do that <registration_link>here</registration_link>, the same spot you'd submit a new registration."},

applyOnline: {

title: "Apply for a mail-in ballot online",

description: "You can apply for a mail-in ballot online <application_link>here</application_link>. You can expect to get your ballot by late September, depending on when you submit your application.",

calendarLink: "Deadline to apply for a mail-in ballot"

},

movedApply: {

title: "Apply for a mail-in ballot online",

description: "Election authorities had until Aug. 1 to send mail-in ballot applications, but since you've moved, or will move, your best bet is to apply for a mail-in ballot online <application_link>here</application_link>, after you update your voter registration address. You can expect to get your ballot by late September, depending on when you submit your application.",

calendarLink: "Deadline to apply for a mail-in ballot"

},

defaultApply: {

title: "Apply for a mail-in ballot",

description: "You should have received a vote-by-mail application in the mail. Fill out that application and send it back to { electionAuthority }. You can also apply online <application_link>here</application_link>. You can expect to get your ballot by late September, depending on when you submit your application.",

calendarLink: "Deadline to apply for mail-in ballot",

note: "<b>Don't procrastinate!</b> Though Illinois' official deadline for requesting ballots is Oct. 29 (5 days before Election Day), some officials are suggesting you budget for a 15-day window to allow for slow processing."

},

mail: {

title: "Mail or drop off your ballot ",

description: "Fill it out, put it in the provided envelope and drop it off at a mailbox. Postage is free. But the U.S. Postal Service isn't your only option for dropping off your ballot this year. If you don't trust the mail or are worried your ballot won't get postmarked in time, you can drop your ballot at election drop boxes at early voting sites and elsewhere starting Oct. 14. Check with the <authority_link> { electionAuthority }</authority_link> to see if they offer this option.",

calendarLink: "Deadline to drop off mail-in ballot",

note: "<b>Don't procrastinate!</b> Your ballot will count as long as it is postmarked by Nov. 3 and received within 14 days of the election. But that doesn’t mean you should wait. The Postal Service has warned that Illinois' timeline for mail-in balloting could make it difficult for all ballots to be processed on time. Make sure to check collection times if you do drop it in a mailbox."

},

tracking: {

title: "Track your ballot",

description: "If you requested a mailed ballot online, you will get email alerts from the Chicago Board of Elections. This includes a confirmation email that your application was processed, a notice that your ballot is en route to your house, confirmation your ballot return envelope has been received by the election board and a notice when your ballot has been approved for counting. If there is a problem with your ballot that prevents it from being counted, you will also be notified."

},

"calendar": "Add this deadline to your calendar",

"googleCalendar": "Add to Google calendar",

"issues": "<b>Having an issue with your mail-in ballot or have another question about voting?</b> You can contact the { electionAuthority } at { phone }."

},

es: {

resultsTitle: "Sus instrucciones",

step_1: "Primero paso",

step_2: "Segundo paso",

step_3: "Tercero paso",

step_4: "Cuarto paso",

deadline: "Tu fecha límite",

instructions: "Responde las cinco preguntas para saber las instrucciones paso a paso.",

counties: {

chicago: "Chicago",

suburbanCook: "Suburbios del Condado de Cook",

dupage: "Condado de DuPage",

kane: "Condado de Kane",

kendall: "Condado de Kendall",

lake: "Condado de Lake",

mchenry: "Condado de McHenry",

will: "Condado de Will"

},

whereVote: "¿Dónde vas a votar?",

registered: {

title: "Are you registered to vote?",

options: ["Sí","No", "No sé"]

},

didMove: {

title: "¿Te mudaste después del 1.º de agosto?",

options: ["Sí","No"]

},

willMove: {

title: "¿Te mudarás antes de noviembre?",

options: ["Sí","No"]

},

voted: {

title: "¿Has votado en Illinois al menos una vez en los últimos dos años?",

options: ["Sí","No"]

},

results: {

register: { title: "Debes registrarte para votar",

description: "Te puede registrar en línea <registration_link>here</registration_link>.",

calendarLink: "Fecha límite para registrarse para votar"

},

checkRegistration: { title: "Revisa tu registro de votante",

description: "Puedes revisar si estás registrado para votar <check_link>here</check_link>. If you're not registered, you can register online or change your registration address <registration_link>here<registration_link>.",

descriptionMoved: "¿Al mudarte cambiaste tu registro de votantes? Si no, tu dirección necesitaría ser actualizada. Para revisar, visita <check_link>here</check_link> to check. Puedes cambiar tu dirección de registro <registration_link>here</registration_link>, el mismo sitio a donde enviarías tu nuevo registro.",

calendarLink: "Fecha límite para actualizar el registro de votante"

},

updateRegistration: { title: "Actualiza tu registro de votante",

description: "Si sabes a dónde te vas a mudar (y es en Illinois), querrás actualizar tu dirección para asegurarte que llegue tu boleta. Puedes hacerlo <registration_link>here</registration_link>, el mismo sitio a donde enviarías tu nuevo registro."},

applyOnline: {

title: "Solicita en línea el voto por correo",

description: "Puedes solicitar en línea el voto por correo <application_link>here</application_link>. Puedes esperar recibir tu boleta a finales de septiembre, dependiendo de cuando enviaste la solicitud.",

calendarLink: "Fecha límite para solicitar el voto por correo"

},

movedApply: {

title: "Apply for a mail-in ballot online",

description: "Las autoridades electorales tienen hasta el 1.º de agosto para enviar las solicitudes para el voto por correo, pero dado a que ya te mudaste o te mudarás, tu mejor opción es solicitar en línea una boleta por correo <application_link>here</application_link>, luego que actualices tu dirección de registro de votante. Puedes esperar recibir tu boleta para votar a finales de septiembre, dependiendo de cuando enviaste tu solicitud.",

calendarLink: "Deadline to apply for a mail-in ballot"

},

defaultApply: {

title: "Solicita el voto por correo",

description: "Deberías haber recibido tu solicitud de voto por correo. Llena la solicitud y envíala a { electionAuthority }.También puedes solicitarla en línea <application_link>here</application_link>. Puedes esperar recibir tu boleta para votar a finales de septiembre, dependiendo de cuando enviaste tu solicitud.",

calendarLink: "Fecha límite para solicitar el voto por correo",

note: "<b>¡No esperes más!</b> Aunque en Illinois la fecha límite oficial para solicitar las boletas es el 29 de Oct. (5 días antes del día de las elecciones), algunos oficiales sugieren hasta un lapso de quince días para dar tiempo si el proceso es lento."

},

mail: {

title: "Envía tu voto por correo o llévalo a los sitios de votación",

description: "Llénala, ponla en el sobre proporcionado y colócala en un buzón del correo. El envío es gratis. Sin embargo, el Servicio Postal de EEUU no es tu única opción para enviar tu boleta. Si no confías en el correo o te preocupa que tu boleta no sea sellada a tiempo, puedes dejarla en las urnas electorales en los sitios de votación temprana <b>starting Oct. 14</b>. Consulta con tu <authority_link>local election authority</authority_link> para saber si ofrecen esa opción.",

calendarLink: "Fecha límite para enviar el voto por correo ",

note: "<b>¡No esperes más!</b> Tu boleta contará siempre y cuando esté sellada para el 3 de noviembre y se reciba dentro de los 14 días de la elección. Pero eso no significa que debes esperar. El Servicio Postal ha advertido que el cronograma de Illinois para la votación por correo podría dificultar que todas las boletas sean procesadas a tiempo. Si la llevas al buzón, asegúrate de verificar los tiempos de colecta."

},

tracking: {

title: "Síguele la pista a tu voto",

description: "Si solicitaste en línea tu boleta por correo, recibirás notificaciones por correo electrónico de la Junta Electoral de Chicago. Esto incluye un correo electrónico informándote que tu solicitud fue procesada; un aviso de que tu boleta está en camino; una confirmación de que tu sobre con la boleta ha sido recibido por la junta electoral, y un aviso de que tu boleta ha sido aprobada para el conteo. Si hubiese un problema con tu boleta que impida que se cuente, también se te avisará."

},

"calendar": "Agrega a tu calendario esta fecha límite ",

"googleCalendar": "Agrégala al calendario de Google",

"issues": "<b>¿Tienes algún problema con tu boleta por correo o alguna otra pregunta sobre las votaciones?</b> Puedes llamar a { electionAuthority } al { phone }."

},

})

d3 = require("d3")

import { triggerEmbedAnalytics, triggerEmbedAnalyticsEvent } from "@chicagoreporter/coronavirus-illinois-county-counts"

import {footer} from "@chicagoreporter/covid-19-in-illinois-restore-metrics"

import {calendarLink, googleCalendarLink} from "@pjsier/add-to-calendar-links"

import {form} from "@mbostock/form-input"

import { radio, select } from "@jashkenas/inputs"

One platform to build and deploy the best data apps