Chapril/mobilizon.chapril.org-mobilizon
Chapril
/
mobilizon.chapril.org-mobilizon
24
0
Fork 0
Code Issues Pull Requests Releases Activity

Improve emails 

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-10-15 15:58:49 +02:00
parent aca2ed612e
commit bd4fad3c58
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
15 changed files with 211 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
lib/web/templates/email/date/event_tz_date.html.heex Normal file
View File

@ -0,0 +1,8 @@
<%= if @event.options.timezone == nil do %>
<%= @date |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale , :short) %>
<% else %>
<strong><%= @date |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale, :short) %></strong><br />
<%= if @event.options.timezone != @timezone do %>
<span style="font-size: 13px;"><%= gettext "🌐 %{timezone} %{offset}", timezone: @event.options.timezone, offset: @date |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %></span>
<% end %>
<% end %>

1
lib/web/templates/email/date/event_tz_date.text.eex Normal file
View File

@ -0,0 +1 @@
<%= if @event.options.timezone == nil do %><%= @date |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %><% else %><%= if @event.options.timezone != @timezone do %><%= gettext "%{date_time} (%{timezone} %{offset})", date_time: @date |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale), timezone: @event.options.timezone, offset: @date |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %><% else %><%= gettext "%{date_time} (in your timezone %{timezone} %{offset})", date_time: @date |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale), timezone: @event.options.timezone, offset: @date |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %><% end %><% end %>

14
lib/web/templates/email/date/event_tz_date_range.html.heex Normal file
View File

@ -0,0 +1,14 @@
<%= cond do %>
<%= @end_date == nil -> %>
<%= render("date/event_tz_date.html", date: @start_date, event: @event, timezone: @timezone, locale: @locale) %>
<% is_same_day?(@start_date, @end_date) -> %>
<strong><%= gettext "On %{date} from %{start_time} to %{end_time}", date: datetime_to_date_string(@start_date, @locale), start_time: datetime_to_time_string(@start_date, @locale), end_time: datetime_to_time_string(@end_date, @locale) %></strong><br />
<%= if @event.options.timezone != @timezone do %>
<span style="font-size: 13px;"><%= gettext "🌐 %{timezone} %{offset}", timezone: @event.options.timezone, offset: Cldr.DateTime.Formatter.zone_gmt(@start_date) %></span>
<% end %>
<% true -> %>
<strong><%= gettext "From the %{start} to the %{end}", start: datetime_to_string(@start_date, @locale, :short), end: datetime_to_string(@end_date, @locale, :short) %></strong><br />
<%= if @event.options.timezone != @timezone do %>
<span style="font-size: 13px;"><%= gettext "🌐 %{timezone} %{offset}", timezone: @event.options.timezone, offset: Cldr.DateTime.Formatter.zone_gmt(@start_date) %></span>
<% end %>
<% end %>

6
lib/web/templates/email/email.html.heex
View File

@ -42,7 +42,9 @@
div[style*="margin: 16px 0;"] { margin: 0 !important; }
</style>
<%= if @jsonLDMetadata do %>
<script type="application/ld+json"><%= @jsonLDMetadata |> raw %></script>
<script type="application/ld+json">
<%= @jsonLDMetadata |> raw %>
</script>
<% end %>
</head>
<body style="background-color: #ECEBF2; margin: 0 !important; padding: 0 !important;mso-line-height-rule: exactly;">
@ -59,7 +61,7 @@
<tr>
<td align="center" valign="top" style="padding: 40px 10px 40px 10px;">
<a href={"#{ Mobilizon.Web.Endpoint.url() }"} target="_blank">
<img alt={"#{ @instance_name }"} src={"#{ "#{Mobilizon.Web.Endpoint.url()}/img/mobilizon_logo.png" }"} width="366" height="108" style="display: block; width: 366px; max-width: 366px; min-width: 366px; font-family: 'Roboto', Helvetica, Arial, sans-serif; color: #ffffff; font-size: 18px;" border="0">
<img alt={"#{ @instance_name }"} src={"#{ "#{Mobilizon.Web.Endpoint.url()}/img/mobilizon_logo.png" }"} width="340" height="108" style="display: block; width: 340px; max-width: 370px; min-width: 340px; font-family: 'Roboto', Helvetica, Arial, sans-serif; color: #ffffff; font-size: 18px;" border="0">
</a>
</td>
</tr>

18
lib/web/templates/email/event_updated.html.heex
View File

@ -74,21 +74,7 @@
<%= gettext "Start" %>
</td>
<td bgcolor="#ffffff" align="left">
<%= if @event.options.timezone == nil do %>
<b><%= @event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %></b>
<% else %>
<span style="font-size: 14px;">
<%= if @event.options.timezone != @timezone do %>
<%# Event with different timezone than user %>
<b><%= @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale) %></b><br />
<%= gettext "🌐 %{timezone} %{offset}", timezone: @event.options.timezone, offset: @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %>
<% else %>
<%# Event with same timezone than user %>
<b><%= @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale) %></b><br />
<%= gettext "In your timezone (%{timezone} %{offset})", timezone: @event.options.timezone, offset: @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %>
<% end %>
</span>
<% end %>
<%= render("date/event_tz_date.html", event: @event, date: @event.begins_on, timezone: @timezone, locale: @locale) %>
</td>
</tr>
<% end %>
@ -98,7 +84,7 @@
<%= gettext "End" %>
</td>
<td bgcolor="#ffffff" align="left">
<b><%= @event.ends_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %></b>
<%= render("date/event_tz_date.html", event: @event, date: @event.ends_on, timezone: @timezone, locale: @locale) %>
</td>
</tr>
<% end %>

11
lib/web/templates/email/event_updated.text.eex
View File

@ -14,16 +14,9 @@
<%= if MapSet.member?(@changes, :title) do %>
<%= gettext "New title: %{title}", title: @event.title %>
<% end %>
<%= if MapSet.member?(@changes, :begins_on) do %><%= cond do %><% @event.options.timezone != nil and @event.options.timezone != @timezone -> %><%# Event with different timezone than user %>
<%= gettext "Start %{begins_on} (🌐 %{timezone} %{offset})", begins_on: @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale), timezone: @event.options.timezone, offset: @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> Cldr.DateTime.Formatter.zone_gmt() %>
<%# Event with same timezone than user %><% @event.options.timezone != nil and @event.options.timezone == @timezone -> %>
<%= gettext "Start %{begins_on} (your timezone)", begins_on: @event.begins_on |> datetime_tz_convert(@event.options.timezone) |> datetime_to_string(@locale) %>
<%# Event with no timezone (show in user timezone) %><% true -> %>
<%= gettext "Start %{begins_on}", begins_on: @event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %>
<%= if MapSet.member?(@changes, :begins_on) do %><%= render("date/event_tz_date.text", event: @event, date: @event.begins_on, timezone: @timezone, locale: @locale) %>
<% end %>
<% end %>
<%= if MapSet.member?(@changes, :ends_on) && !is_nil(@event.ends_on) do %>
<%= gettext "End %{ends_on}", ends_on: @event.ends_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %>
<%= if MapSet.member?(@changes, :ends_on) && !is_nil(@event.ends_on) do %><%= render("date/event_tz_date.text", event: @event, date: @event.ends_on, timezone: @timezone, locale: @locale) %>
<% end %>
<%= gettext "Visit the updated event page: %{link}", link: Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid) %>
<%= ngettext "Would you wish to cancel your attendance, visit the event page through the link above and click the « Attending » button.", "Would you wish to cancel your attendance to one or several events, visit the event pages through the links above and click the « Attending » button.", 1 %>

22
lib/web/templates/email/notification_each_week.html.heex
View File

@ -10,7 +10,7 @@
<tr>
<td bgcolor="#ffffff" align="center" valign="top" style="padding: 40px 20px 20px 20px; border-radius: 4px 4px 0px 0px; color: #3A384C; font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 48px; font-weight: 400; line-height: 48px;">
<h1 style="font-size: 48px; font-weight: 400; margin: 0;">
<%= gettext "What's up this week?" %>
<%= gettext "On the agenda this week" %>
</h1>
</td>
</tr>
@ -40,27 +40,17 @@
</td>
</tr>
<tr>
<td bgcolor="#ffffff" align="left" style="padding: 20px 30px 0px 30px; color: #474467; font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 18px; font-weight: 400; line-height: 25px;" >
<td bgcolor="#ffffff" align="left" style="padding: 20px 15px 0px 15px; color: #474467; font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 18px; font-weight: 400; line-height: 25px;" >
<%= if @total > 1 do %>
<ul style="margin: 0;">
<ul style="margin: 0;padding: 0;list-style-type: none;">
<%= for participation <- @participations do %>
<li>
<strong>
<%= participation.event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %>
</strong>
<a href={"#{ Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) }"} target="_blank">
<%= participation.event.title %>
</a>
<li style="padding: 0; border: 1px solid rgba(0,0,0,.125); border-radius: .25rem; margin-bottom: 10px">
<%= render("participation/event_card.html", event: participation.event, timezone: @timezone, locale: @locale) %>
</li>
<% end %>
</ul>
<% else %>
<strong>
<%= @participation.event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %>
</strong>
<a href={"#{ Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) }"} target="_blank">
<%= @participation.event.title %>
</a>
<%= render("participation/event_card.html", event: @participation.event, timezone: @timezone, locale: @locale) %>
<% end %>
</td>
</tr>

6
lib/web/templates/email/notification_each_week.text.eex
View File

@ -1,11 +1,11 @@
<%= gettext "What's up this week?" %>
<%= gettext "On the agenda this week" %>
==
<%= ngettext "You have one event this week:", "You have %{total} events this week:", @total, total: @total %>
<%= if @total > 1 do %>
<%= for participation <- @participations do %>
- <%= participation.event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %> - <%= participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) %>
- <%= render("date/event_tz_date.text", event: participation.event, date: participation.event.begins_on, timezone: @timezone, locale: @locale) %> - <%= participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) %>
<% end %>
<% else %>
<%= @participation.event.begins_on |> datetime_tz_convert(@timezone) |> datetime_to_string(@locale) %> - <%= @participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) %>
<%= render("date/event_tz_date.text", event: @participation.event, date: @participation.event.begins_on, timezone: @timezone, locale: @locale) %> - <%= @participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) %>
<% end %>
<%= ngettext "Would you wish to cancel your attendance, visit the event page through the link above and click the « Attending » button.", "Would you wish to cancel your attendance to one or several events, visit the event pages through the links above and click the « Attending » button.", @total %>

14
lib/web/templates/email/on_day_notification.html.heex
View File

@ -45,22 +45,12 @@
<ul style="margin: 0;">
<%= for participation <- @participations do %>
<li>
<strong>
<%= participation.event.begins_on |> DateTime.shift_zone!(@timezone) |> datetime_to_time_string(@locale) %>
</strong>
<a href={"#{ Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) }"} target="_blank">
<%= participation.event.title %>
</a>
<%= render("participation/event_card.html", event: participation.event, timezone: @timezone, locale: @locale) %>
</li>
<% end %>
</ul>
<% else %>
<strong>
<%= @participation.event.begins_on |> DateTime.shift_zone!(@timezone) |> datetime_to_time_string(@locale) %>
</strong>
<a href={"#{ Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) }"} target="_blank">
<%= @participation.event.title %>
</a>
<%= render("participation/event_card.html", event: @participation.event, timezone: @timezone, locale: @locale) %>
<% end %>
</td>
</tr>

7
lib/web/templates/email/on_day_notification.text.eex
View File

@ -1,14 +1,11 @@
<%= gettext "What's up today?" %>
==
<%= ngettext "You have one event today:", "You have %{total} events today:", @total, total: @total %>
<%= if @total > 1 do %>
<%= for participation <- @participations do %>
- <%= participation.event.begins_on |> DateTime.shift_zone!(@timezone) |> datetime_to_time_string(@locale) %> - <%= participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) %>
- <%= render("date/event_tz_date.text", event: participation.event, date: participation.event.begins_on, timezone: @timezone, locale: @locale) %> - <%= participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, participation.event.uuid) %>
<% end %>
<% else %>
<%= DateTime.shift_zone!(@participation.event.begins_on, @timezone) |> datetime_to_time_string(@locale) %> - <%= @participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) %>
<%= render("date/event_tz_date.text", event: @participation.event, date: @participation.event.begins_on, timezone: @timezone, locale: @locale) %> - <%= @participation.event.title %> <%= Routes.page_url(Mobilizon.Web.Endpoint, :event, @participation.event.uuid) %>
<% end %>
<%= ngettext "Would you wish to cancel your attendance, visit the event page through the link above and click the « Attending » button.", "Would you wish to cancel your attendance to one or several events, visit the event pages through the links above and click the « Attending » button.", @total %>

91
lib/web/templates/email/participation/card/_metadata.html.heex Normal file
View File

@ -0,0 +1,91 @@
<table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: 100%; display: table; margin: 0; padding: 0; border: 0;">
<thead style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
<div style="vertical-align: baseline; border-bottom-color: rgb(224,224,224); border-bottom-style: solid; margin: 0; padding: 0; border-width: 0 0 1px;">
</div>
</td>
</tr>
</thead>
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 16px 0; border: 0;" valign="middle" align="left">
<div style="vertical-align: baseline; margin: 0 0 0 10px; padding: 0; border: 0;">
<div class="event__content_info" style="vertical-align: baseline; display: inline-block; margin: 0; padding: 0; border: 0;">
<table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<!-- row for datetime -->
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0 12px 24px 0; border: 0;" valign="baseline" align="left">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAABgAAAAYADwa0LPAAAAf0lEQVRIx2NgGEDwH4opUsdEa1eiW+DNwMDwBM1F/wlgZHWPGRgYPPFZ+JgIAwnhR8gGMmIJT2oAuLl0jwOqAxZCXiQRYATx0A+iAYsDfABbUsYZZ0M/iIa+BeREMkmZkO5B9ARKk1tUMzBAinycwJOBsjrhEQMDgwetQ2WYAQCSDEUsvZlgYAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMS0xMC0xNFQxNDo1MTowNyswMDowMCvAzKIAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjEtMTAtMTRUMTQ6NTE6MDcrMDA6MDBanXQeAAAAAElFTkSuQmCC" style="outline: none; text-decoration: none; width: 21px; max-width: 100%; clear: both; display: block; vertical-align: baseline; margin: 0; padding: 0; border: 0;">
</td>
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0 0 12px; border: 0;" valign="top" align="left">
<p style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: 300; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<%= render("date/event_tz_date_range.html", event: @event, start_date: datetime_tz_convert(@event.begins_on, @event.options.timezone), end_date: datetime_tz_convert(@event.ends_on, @event.options.timezone), timezone: @timezone, locale: @locale) %>
</p>
</td>
</tr>
<!-- row for datetime end -->
<%= if @event.physical_address do %>
<!-- venue block -->
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0 12px 24px 0; border: 0;" valign="baseline" align="left">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAABgAAAAYADwa0LPAAABHklEQVRIx+XUsUoDQRQF0EMUtNPGYGsULMTeNuonqJ8SsNZ/kLSW/kEaLQykMvoJNoKdGkWCQrTYDS6b3c1O1i4XbjHz3rt35u2+YR5Qxznu8RGzj7M4VgnHGOAnhwMcVREfFYiPOZrFpD7l5Gm+YS1LaCHH4BSHqb1XXOIOW1hOxJYwxE3ZGzykTviCjUS8ERsmc/ohLXpPFV9k5LRNfvAJ1HIMvkrk1abUFKKX0aJGIr6Z0aJeltBijsEt9hLrVVGPr+L1CVYyakpjR/lfdMzdEAPoBoh3Q8XhIMBgfxYD6JQQ78wqTjSxnwXiQ2xXMYBWgUGrqjjRQGW16lr+WxaMOp4S4s9Y/y/xMZr4jtksWxRyxUfRk9HxN9FzgF/m1ZTuGrd6hAAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMS0xMC0xNFQxNDo1Mjo0NyswMDowMES9eVsAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjEtMTAtMTRUMTQ6NTI6NDcrMDA6MDA14MHnAAAAAElFTkSuQmCC" style="outline: none; text-decoration: none; width: 21px; max-width: 100%; clear: both; display: block; vertical-align: baseline; margin: 0; padding: 0; border: 0;">
</td>
<td class="m_8261046153705514309event__content_local" style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="top" align="left">
<p style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: 300; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<%= render_address(@event.physical_address) %>
</p>
</td>
</tr>
<!-- venue block end -->
<% end %>
<%= if @event.options.is_online do %>
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0 12px 24px 0; border: 0;" valign="baseline" align="left">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAABgAAAAYADwa0LPAAABWUlEQVRIx+WUP04CURDGf5pIQsROOAMHsNSgVmpp9AZ6AG1MiA1CsZ6DCxiwMx5BtKNQGs2uLf9aFov9DC8s++ftNiZOMpmdnW/mm8x78+A/SAVoAa/AVNoDmorlknNgDMwjdAyc5Snuq9ADUAM2pftARzE/C0nF6PwmBlcXZgSUbQhaRucABeAe8AAXcPQPoCvsnQ3Bm5Jq8h3C83cUO5DfsyGYKKkk31tB8K3YFosDD8l6BME8wQeYya7FYCIJBrI7su0VmPYSZoCFNNVRR36BYOYu4UN+FLZhQ2Be03oM7laYIbBtQwDB8vwuWpfgtpSkh0bnPnBqW9wkGRH9VAzzFC/KlgmW6IXg+k703TDGUrQtfgK8A7spsHvAh3JSyQbQN8bwBFwAVRaPXRW4BJ4NXF+5iXIdM/MkvUpD4OUgcJeLrdrkGdklVe4x8JWh+0/gKEdzf1R+ADQolKDXzQqjAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDIxLTEwLTE1VDEzOjA5OjAzKzAwOjAwbhSTzgAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyMS0xMC0xNVQxMzowOTowMyswMDowMB9JK3IAAAAASUVORK5CYII=" style="outline: none; text-decoration: none; width: 21px; max-width: 100%; clear: both; display: block; vertical-align: baseline; margin: 0; padding: 0; border: 0;">
</td>
<td class="m_8261046153705514309event__content_local" style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="top" align="left">
<p style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: 300; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<%= gettext "Online event" %>
</p>
</td>
</tr>
<% end %>
</tbody>
</table>
</div>
<div class="event__content_attend" style="vertical-align: middle; margin: 0; padding: 0; border: 0;">
<table class="button btn-attend event__content_position" style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: auto; margin: 0; padding: 0; border: 0;">
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
<table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="FE3859" align="center">
<a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: bold; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 16px; display: inline-block; border-radius: 3px; white-space: nowrap; margin: 0; padding: 12px 32px; border: none;" target="_blank">
<%= gettext("Manage your participation") %>
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
<tfoot style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
<div style="vertical-align: baseline; border-bottom-color: rgb(224,224,224); border-bottom-style: solid; margin: 0; padding: 0; border-width: 0 0 1px;">
</div>
</td>
</tr>
</tfoot>
</table>

12
lib/web/templates/email/participation/card/_picture.html.heex Normal file
View File

@ -0,0 +1,12 @@
<table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: 100%; display: table; height: 180px; margin: 0 0 24px; padding: 0; border: 0;">
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
<a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: normal; text-align: left; line-height: 1.3; text-decoration: none; vertical-align: baseline; margin: 0; padding: 0; border: 0;" target="_blank">
<div class="event-intro__banner_photo" style={"vertical-align: baseline; height: 180px; background: url(#{@event.picture.file.url}) center 40% / cover; margin: -1px -1px 10px; padding: 0; border: 0;"}>
</div>
</a>
</td>
</tr>
</tbody>
</table>

33
lib/web/templates/email/participation/card/_title.html.heex Normal file
View File

@ -0,0 +1,33 @@
<table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: 100%; display: table; margin: 0; padding: 0; border: 0;">
<tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
<div style="vertical-align: baseline; width: 100%; margin: 0 0 0 10px; padding: 0; border: 0;display: flex;">
<%= cond do %>
<% @event.attributed_to != nil and @event.attributed_to.avatar != nil && @event.attributed_to.avatar.url != nil -> %>
<img style="float: left;border-radius: 75%;margin-right: 8px;max-width: 30px;margin-top: auto;margin-bottom: auto;" src={@event.attributed_to.avatar.url}>
<% @event.organizer_actor.avatar != nil and @event.organizer_actor.avatar.url != nil -> %>
<img style="float: left;border-radius: 75%;margin-right: 8px;max-width: 30px;margin-top: auto;margin-bottom: auto;" src={@event.organizer_actor.avatar.url}>
<% true -> %>
<% end %>
<div class="event-info__title" style="vertical-align: top; float: left; width: 75%; margin: 0; padding: 0; border: 0;">
<a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(66,81,90); font-family: Helvetica,Arial,sans-serif; font-weight: 700; text-align: left; line-height: 1.4; text-decoration: none; vertical-align: baseline; font-size: 22px; letter-spacing: 0.2px; margin: 0 0 30px; padding: 0; border: 0;" target="_blank">
<%= @event.title %>
</a>
<p style="color: rgb(254,56,89); font-family: Helvetica,Arial,sans-serif; font-weight: 400; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<%= if @event.attributed_to do %>
<a href={Routes.page_url(:actor, Mobilizon.Actors.Actor.preferred_username_and_domain(@event.attributed_to))} style="color: rgb(254,56,89); font-family: Helvetica,Arial,sans-serif; font-weight: normal; text-align: left; line-height: 1.3; text-decoration: none; vertical-align: baseline; margin: 0; padding: 0; border: 0;" target="_blank">
<%= @event.attributed_to.name || @event.attributed_to.preferred_username %>
</a>
<% else %>
<span style="color: rgb(254,56,89); font-family: Helvetica,Arial,sans-serif; font-weight: normal; text-align: left; line-height: 1.3; text-decoration: none; vertical-align: baseline; margin: 0; padding: 0; border: 0;">
<%= @event.organizer_actor.name || @event.organizer_actor.preferred_username %>
</span>
<% end %>
</p>
</div>
</div>
</td>
</tr>
</tbody>
</table>

24
lib/web/templates/email/participation/event_card.html.heex Normal file
View File

@ -0,0 +1,24 @@
<%= if @event.picture do %>
<!-- event image -->
<%= render("participation/card/_picture.html", event: @event) %>
<!-- event image end -->
<% end %>
<%= render("participation/card/_title.html", event: @event) %>
<%= render("participation/card/_metadata.html", event: @event, timezone: @timezone, locale: @locale) %>
<%= if @event.description do %>
<div class="event-working" style="vertical-align: baseline; width: 450px; margin: 0 0 0 10px; padding: 7.5px 0 15px; border: 0;">
<p style="color: rgb(46,62,72); font-family: Helvetica,Arial,sans-serif; font-weight: 700; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0 0 7.5px; border: 0;" align="left">
<%= gettext("Details") %>
</p>
<p class="event-working__detail" style="color: rgb(87,100,108); font-family: Helvetica,Arial,sans-serif; font-weight: 300; line-height: 1.5; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<%= process_description(@event.description) %>
</p>
<%= if String.length(@event.description) > 200 do %>
<p style="color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
<a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(254,56,89); font-family: Helvetica,Arial,sans-serif; font-weight: 400; text-align: left; line-height: 1.5; text-decoration: none; vertical-align: baseline; font-size: 16px; margin: 0; padding: 0; border: 0;" target="_blank">
<%= gettext("Read more") %>
</a>
</p>
<% end %>
</div>
<% end %>

7
lib/web/views/email_view.ex
View File

@ -1,8 +1,10 @@
defmodule Mobilizon.Web.EmailView do
use Mobilizon.Web, :view
alias Mobilizon.Service.Address
alias Mobilizon.Service.DateTime, as: DateTimeRenderer
import Mobilizon.Web.Gettext
import Mobilizon.Service.Metadata.Utils, only: [process_description: 1]
defdelegate datetime_to_string(datetime, locale \\ "en", format \\ :medium),
to: DateTimeRenderer
@ -10,6 +12,11 @@ defmodule Mobilizon.Web.EmailView do
defdelegate datetime_to_time_string(datetime, locale \\ "en", format \\ :short),
to: DateTimeRenderer
defdelegate datetime_to_date_string(datetime, locale \\ "en", format \\ :short),
to: DateTimeRenderer
defdelegate datetime_tz_convert(datetime, timezone), to: DateTimeRenderer
defdelegate datetime_relative(datetime, locale \\ "en"), to: DateTimeRenderer
defdelegate render_address(address), to: Address
defdelegate is_same_day?(one, two), to: DateTimeRenderer
end