From 130f24dc0b98f3cc4fde5d1dff4b5ee84d510b0c Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Mon, 23 Sep 2019 11:51:59 +0200
Subject: [PATCH] Fix event title length limitation

Closes #167

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/i18n/en_US.json      | 1 +
 js/src/i18n/fr_FR.json      | 1 +
 js/src/views/Event/Edit.vue | 8 ++++++--
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/js/src/i18n/en_US.json b/js/src/i18n/en_US.json
index 974a82807..e99badbfa 100644
--- a/js/src/i18n/en_US.json
+++ b/js/src/i18n/en_US.json
@@ -185,6 +185,7 @@
     "The event came from another instance. Your participation will be confirmed after we confirm it with the other instance.": "The event came from another instance. Your participation will be confirmed after we confirm it with the other instance.",
     "The event organizer didn't add any description.": "The event organizer didn't add any description.",
     "The event organizer has chosen to approve manually the participations to this event. You will receive a notification when your participation has been approved": "The event organizer has chosen to approve manually the participations to this event. You will receive a notification when your participation has been approved",
+    "The event title will be ellipsed.": "The event title will be ellipsed.",
     "The page you're looking for doesn't exist.": "The page you're looking for doesn't exist.",
     "The report will be sent to the moderators of your instance. You can explain why you report this content below.": "The report will be sent to the moderators of your instance. You can explain why you report this content below.",
     "The {date} at {time}": "The {date} at {time}",
diff --git a/js/src/i18n/fr_FR.json b/js/src/i18n/fr_FR.json
index 596789f72..b1093854b 100644
--- a/js/src/i18n/fr_FR.json
+++ b/js/src/i18n/fr_FR.json
@@ -185,6 +185,7 @@
     "The event came from another instance. Your participation will be confirmed after we confirm it with the other instance.": "L'événement provient d'une autre instance. Votre participation sera confirmée après que nous ayons la confirmation de l'autre instance.",
     "The event organizer didn't add any description.": "L'organisateur de l'événement n'a pas ajouté de description.",
     "The event organizer has chosen to approve manually the participations to this event. You will receive a notification when your participation has been approved": "L'organisateur⋅ice de l'événement a choisi d'approuver manuellement les participations à cet événement. Vous recevrez une notification lorsque votre participation sera approuvée",
+    "The event title will be ellipsed.": "Le titre de l'événement sera ellipsé.",
     "The page you're looking for doesn't exist.": "La page que vous recherchez n'existe pas.",
     "The report will be sent to the moderators of your instance. You can explain why you report this content below.": "Le signalement sera envoyé aux modérateur⋅ices de votre instance. Vous pouvez expliquer pourquoi vous signalez ce contenu ci-dessous.",
     "The {date} at {time}": "Le {date} à {time}",
diff --git a/js/src/views/Event/Edit.vue b/js/src/views/Event/Edit.vue
index 5763182f1..3ed81b536 100644
--- a/js/src/views/Event/Edit.vue
+++ b/js/src/views/Event/Edit.vue
@@ -17,8 +17,8 @@ import {EventJoinOptions} from "@/types/event.model";
         </h2>
         <picture-upload v-model="pictureFile" />
 
-        <b-field :label="$t('Title')">
-          <b-input aria-required="true" required v-model="event.title" maxlength="64" />
+        <b-field :label="$t('Title')" :type="checkTitleLength[0]" :message="checkTitleLength[1]">
+          <b-input aria-required="true" required v-model="event.title" />
         </b-field>
 
         <tag-input v-model="event.tags" :data="tags" path="title" />
@@ -339,6 +339,10 @@ export default class EditEvent extends Vue {
     }
   }
 
+  get checkTitleLength() {
+    return this.event.title.length > 80 ? ['is-info', this.$t('The event title will be ellipsed.')] : [undefined, undefined];
+  }
+
   // getAddressData(addressData) {
   //   if (addressData !== null) {
   //     this.event.address = {