Travail sur apparence du formulaire de soumission

app/assets/javascripts/events.js.coffee

@@ -1,9 +1,11 @@
 $(document).ready ->
   # Setup the graphical editor for event's description
   tinyMCE.init
-    selector: 'textarea#event_description',
-    menubar : false,
     schema: 'html5',
+    menubar: false,
+    language: 'fr_FR',
+    selector: 'textarea#event_description',
+    content_css: '/assets/application.css',
     entity_encoding : 'raw',
     add_unload_trigger: true,
     browser_spellcheck: true,

app/assets/stylesheets/all.css.sass

@@ -112,7 +112,7 @@ header.top
     font-weight: normal
     margin-bottom: 21px
 
-main
+main, body.mce-content-body
   position: relative
   & > *
     max-width: 80em
@@ -141,6 +141,13 @@ main
   hr
     margin: 10px 20px
 
+  &.mce-content-body
+    margin: 0
+    height: 100%
+    border: solid thin transparent
+    font-size: initial
+    font-family: georgia, serif
+
 fieldset
   border: none
   margin: 1em auto
@@ -165,10 +172,10 @@ label
   +border-radius(0.4em)
 input, textarea, select, a.button, button, .select2-container ul
   color: black
-  margin: 3px
+  margin: 3px 0
   border: 1px solid darkgray
   outline: none
-  padding: 2px 4px
+  padding: 0.2em 0.4em
   font-size: inherit
   font-family: inherit
   background-color: white

app/assets/stylesheets/events.css.sass

@@ -1,4 +1,5 @@
 @import compass
+@import awesome_mixins
 
 header.calendar-header
   font-size: 1.5em
@@ -9,7 +10,7 @@ header.calendar-header
     &:first-child, &:last-child
       margin: 0 0.3em
 
-.city:after
+span.city:after, strong.city:after, em.city:after
   content: ':'
 
 p.full_address
@@ -165,10 +166,8 @@ aside#lug-list
       margin: 1px 5px 1px 6.6em
       line-height: 0.9em
     label
-      width: 6.3em
+      width: 6.2em
       +inline-block()
-      &:after
-        content: ':'
     input[type=radio] + label
       width: 20em
       &:after
@@ -176,11 +175,37 @@ aside#lug-list
   .actions
     text-align: center
     input
-      margin: 0.4em
       font-size: x-large
 
   .mce-tinymce
     +inline-block()
 
+.field label:before
+  color: gray
+.field.title label
+  +fa-icon('')
+.field.start_time label
+  +fa-icon('')
+.field.end_time label
+  +fa-icon('')
+.field.description label
+  +fa-icon('')
+.field.address label
+  +fa-icon('')
+.field.city label
+  +fa-icon('')
+.field.region label
+  +fa-icon('')
+.field.locality label
+  +fa-icon('')
+.field.contact label
+  +fa-icon('')
+.field.submitter label
+  +fa-icon('')
+.field.url label
+  +fa-icon('')
+.field.tags label
+  +fa-icon('')
+
 .description
   text-align: left

app/models/event.rb

@@ -8,14 +8,15 @@ class Event < ActiveRecord::Base
                          class_name: City
 
   validates :title, presence: true
+  validate :end_after_start
   validates :description, presence: true
   validates :city, presence: true
   validates :related_region, presence: true
-  validates :url, presence: true, format: %r{\Ahttps?:\/\/.*\z}
+  validates :url, presence: true, format: %r{\Ahttps?:\/\/.*\..*\z}
   validates :contact, presence: true
   validates :contact, email: true
   validates :submitter, email: true
-  validate :end_after_start
+  validates :tags, presence: false, format: /\A[\p{Alnum}\s-]*\z/
 
   geocoded_by :full_address, lookup: :nominatim
   # after_validation :geocode, if: -> (obj) { obj.address_changed? }
@@ -42,6 +43,11 @@ class Event < ActiveRecord::Base
   scope :tag, -> tag { where 'tags like ?', "%#{tag}%" }
   scope :geo, -> { where 'latitude is not null and longitude is not null' }
 
+  before_validation do
+    # Tags are always downcased
+    self.tags = tags.mb_chars.downcase if tags
+  end
+
   before_validation on: :create do
     self.submission_time = DateTime.now
     self.decision_time = DateTime.now

app/views/events/_form.html.haml

@@ -9,64 +9,62 @@
       = hidden_field_tag :secret, params[:secret]
 
   .field.title
-    .helper
-      :markdown
-        #{t '.title_helper'}
     = f.label :title
-    = f.text_field :title, required: true, size: 70
+    = f.text_field :title, required: true, size: 70,
+      placeholder: "#{t '.title_helper'}"
   .field.start_time
     = f.label :start_time
     = f.datetime_local_field :start_time, required: true
   .field.end_time
     = f.label :end_time
     = f.datetime_local_field :end_time, required: true
-  .field
+  .field.description
     .helper
       :markdown
         #{t '.description_helper'}
     = f.label :description
     = f.text_area :description, rows: 25, cols: 90
 
-  .field
+  .field.address
     .helper
       :markdown
         #{t '.address_helper'}
     = f.label :address
     = f.text_field :address, size: 70
-  .field
+  .field.city
     = f.label :city
     = f.text_field :city, required: true, size: 70, list: :cities
     %datalist#cities
-      - City.connection.select_values('select distinct name from cities join events on name=city group by city order by count(*) desc').each do |name|
-        %option= name
-  .field
+      - Event.group(:city).order('count(city) desc').pluck(:city).each do |city|
+        %option= city
+  .field.region
     = f.label :region
     = f.select :region,
       options_from_collection_for_select(Region.all, 'id', 'name', @event.region)
-  .field
+  .field.locality
     = f.label :locality
     = f.select :locality,
       options_for_select([[t('attributes.locality_0'), 0], [t('attributes.locality_1'), 1]], @event.locality)
 
-  .field
+  .field.url
     .helper
       :markdown
         #{t '.url_helper'}
     = f.label :url
     = f.url_field :url, required: true, size: 70, placeholder: 'Ex: http://april.org'
-  .field
+  .field.contact
     .helper
       :markdown
         #{t '.contact_helper'}
     = f.label :contact
     = f.email_field :contact, required: true, size: 70
-  .field
+  .field.submitter
     .helper
       :markdown
         #{t '.submitter_helper'}
     = f.label :submitter
     = f.email_field :submitter, size: 70
-  .field
+  .field.tags
     .helper
       :markdown
         #{t '.tags_helper'}

config/locales/views/fr.yml

@@ -74,6 +74,8 @@ fr:
     update:
       ok: Votre événement a été mis à jour
     form:
+      title_helper: Décrivez en moins de 5 mots votre événement, sans y
+        indiquer le lieu, la ville ou la date
       address_helper: "*Associée à la ville et la région, elle générerera une
 carte [OpenStreetMap](http://www.openstreetmap.org), affichée aux côtés de
 l'événement*"

db/seeds.rb

@@ -50,7 +50,7 @@ Si vous soumettez souvent un événement régulier dans l'Agenda du Libre, vous
 " },
 
   { locale: 'fr', key: 'events.form.title_helper',
-    value: '**Décrivez en moins de 5 mots votre événement, sans y indiquer le lieu, la ville ou la date.**' },
+    value: 'Décrivez en moins de 5 mots votre événement, sans y indiquer le lieu, la ville ou la date' },
 
   { locale: 'fr', key: 'events.form.description_helper',
     value: '**Décrivez de la manière la plus complète possible votre événement.**' },

test/fixtures/events.yml

@@ -12,7 +12,7 @@ one:
   contact: test@example.com
   submitter: test@example.com
   moderated: 1
-  tags: MyString
+  tags: my-string
   secret: MyString
   decision_time: <%= 2.days.ago %>
   submission_time: <%= 3.days.ago %>
@@ -31,7 +31,7 @@ two:
   contact: test2@example.com
   submitter: test2@example.com
   moderated: 1
-  tags: MyString
+  tags: my-string
   secret: MyString
   decision_time: 2013-12-28 16:04:56
   submission_time: 2013-12-28 16:04:56
@@ -50,7 +50,7 @@ proposed:
   contact: test2@example.com
   submitter: test2@example.com
   moderated: 0
-  tags: MyString
+  tags: my-string
   secret: MyString
   decision_time: 2013-12-28 16:04:56
   submission_time: 2013-12-28 16:04:56

test/mailers/moderation_mailer_test.rb

@@ -18,7 +18,7 @@ class ModerationMailerTest < ActionMailer::TestCase
     event = Event.last
     older_event = Event.new event.attributes
 
-    event.tags += ', ho'
+    event.tags += ' ho'
     event.start_time += 1.day
     event.description = event.description + '
 hello world'

test/mailers/previews/moderation_mailer_preview.rb

@@ -14,7 +14,7 @@ class ModerationMailerPreview < ActionMailer::Preview
     event = Event.last
     older_event = Event.new event.attributes
 
-    event.tags += ', ho'
+    event.tags += ' ho'
     event.start_time += 1.day
     event.description = event.description + '
 hello world'