Refs #3406: updating ttCombination layout

7 files changed, 53 insertions, 23 deletions

diff --git a/app/assets/javascripts/time_table_combinations.coffee b/app/assets/javascripts/time_table_combinations.coffee
index 8fd9dadb1..8923af958 100644
--- a/app/assets/javascripts/time_table_combinations.coffee
+++ b/app/assets/javascripts/time_table_combinations.coffee
@@ -1,8 +1,6 @@
-$(document).on("change", '#time_table_combination_combined_type', (e) ->
-  el    = $("#time_table_combination_#{$(this).val()}_id")
-  other = $(".tt_combination_target:not(##{el.attr('id')})")
+@combinedTypeToggle = ->
+  $('#time_table_combination_combined_type').on 'click', ->
+    $(this).closest('.has_switch').siblings('.form-group').each ->
+      $(this).toggleClass('hidden')
 
-  if el.length
-    el.prop('disabled', false).parents('.form-group').removeClass('hidden').show()
-  other.prop('disabled', true).parents('.form-group').hide()
-)
+$(document).on 'turbolinks:load', combinedTypeToggle
diff --git a/app/assets/stylesheets/components/_forms.sass b/app/assets/stylesheets/components/_forms.sass
index 46f40291a..7a5323011 100644
--- a/app/assets/stylesheets/components/_forms.sass
+++ b/app/assets/stylesheets/components/_forms.sass
@@ -337,7 +337,7 @@ table, .table
           + .switch-label
             position: relative
             display: inline-block
-            width: 50px
+            width: 100% /* 50px */
             height: 30px
             padding-left: 60px
             line-height: 30px
diff --git a/app/models/time_table_combination.rb b/app/models/time_table_combination.rb
index ec3c74641..9b5111014 100644
--- a/app/models/time_table_combination.rb
+++ b/app/models/time_table_combination.rb
@@ -1,4 +1,5 @@
 class TimeTableCombination
+
   include ActiveModel::Validations
   include ActiveModel::Conversion
   extend ActiveModel::Naming
@@ -10,8 +11,8 @@ class TimeTableCombination
   validates :time_table_id, presence: true, if: "calendar_id.blank?"
   validates :calendar_id, presence: true, if: "time_table_id.blank?"
 
+  validates_inclusion_of :combined_type, :in => %w(time_table calendar)
   validates_inclusion_of :operation, :in =>  %w(union intersection disjunction), :allow_nil => true
-  validates_inclusion_of :combined_type, :in =>  %w(time_table calendar)
 
   def clean
     self.source_id     = nil
@@ -23,13 +24,14 @@ class TimeTableCombination
   end
 
   def self.operations
-    %w( union intersection disjunction)
+    %w(union intersection disjunction)
   end
 
   def initialize(attributes = {})
     attributes.each do |name, value|
       send("#{name}=", value)
     end
+    self.combined_type = "time_table"
   end
 
   def persisted?
diff --git a/app/views/time_table_combinations/_form.html.slim b/app/views/time_table_combinations/_form.html.slim
index 6051bfffa..37e072bbc 100644
--- a/app/views/time_table_combinations/_form.html.slim
+++ b/app/views/time_table_combinations/_form.html.slim
@@ -1,12 +1,22 @@
-h1 = @time_table.comment
-= simple_form_for [@referential, @time_table, @combination], html: {class: 'form-horizontal'}, wrapper: :horizontal_form do |form|
+= simple_form_for [@referential, @time_table, @combination], html: {class: 'form-horizontal', id: 'tt_combination_form'}, wrapper: :horizontal_form do |f|
   .row
     .col-lg-12
-      = form.input :combined_type, as: :select, collection: ['time_table', 'calendar']
-      = form.input :operation, as: :select, collection: TimeTableCombination.operations
+      .form-group.has_switch
+        = f.label :combined_type, class: 'col-sm-4 control-label required' do
+          = 'Type de calendriers'
+          abbr title='Champ requis' *
+        = f.input :combined_type, as: :boolean, checked_value: 'time_table', unchecked_value: 'calendar', required: false, label: content_tag(:span, t("time_table_combinations.combined_type.#{@combination.combined_type}"), class: 'switch-label', data: { checkedValue: 'Calendriers', uncheckedValue: 'Modèles de calendriers' }), wrapper_html: { class: 'col-sm-8' }
 
-      = form.input :time_table_id, as: :select, input_html: {class: 'tt_combination_target', data: { select2_ajax: 'true', term: 'comment_or_objectid_cont', url: referential_autocomplete_time_tables_path(@referential, format: :json)}}, disabled: @combination.combined_type != 'time_table', wrapper_html: {class: @combination.combined_type != 'time_table' ? 'hidden' : ''}
+      = f.input :time_table_id, as: :select, input_html: {class: 'tt_combination_target', style: "width: 100%", data: { 'select2-ajax': 'true', term: 'comment_or_objectid_cont', url: referential_autocomplete_time_tables_path(@referential, format: :json)}}, wrapper_html: {class: @combination.combined_type != 'time_table' ? 'hidden' : ''}
+      
+      = f.input :calendar_id, as: :select, input_html: { class: 'tt_combination_target', style: "width: 100%", data: { 'select2-ajax': 'true', term: 'name_cont', url: autocomplete_calendars_path}}, wrapper_html: {class: @combination.combined_type != 'calendar' ? 'hidden' : ''}
 
-      = form.input :calendar_id, as: :select, input_html: { class: 'tt_combination_target', data: { select2_ajax: 'true', term: 'name_cont', url: autocomplete_calendars_path}}, disabled: @combination.combined_type != 'calendar', wrapper_html: {class: @combination.combined_type != 'calendar' ? 'hidden' : ''}
+  .separator
 
-      = form.button :submit, t('actions.submit')
+  .row
+    .col-lg-12
+      = f.label :operation, class: 'col-sm-4 control-label'
+      = f.input :operation, as: :radio_buttons, label: false, collection: TimeTableCombination.operations, label_method: lambda{|o| t("time_table_combinations.operations.#{o}")}, wrapper_html: { class: 'col-sm-8' }
+
+
+  = f.button :submit, t('actions.submit'), class: 'btn btn-default formSubmitr', form: 'tt_combination_form'
diff --git a/app/views/time_table_combinations/new.html.slim b/app/views/time_table_combinations/new.html.slim
index 9bed24730..e49a10bc6 100644
--- a/app/views/time_table_combinations/new.html.slim
+++ b/app/views/time_table_combinations/new.html.slim
@@ -1,2 +1,12 @@
-= t('time_tables.show.combine_form')
-= render 'form'
+/ PageHeader
+= pageheader 'map-marker',
+             t('time_tables.show.combine_form'),
+             '',
+             ''
+
+/ PageContent
+.page_content
+  .container-fluid
+    .row
+      .col-lg-8.col-lg-offset-2.col-md-8.col-md-offset-2.col-sm-10.col-sm-offset-1
+        = render 'form'
diff --git a/config/locales/time_table_combinations.en.yml b/config/locales/time_table_combinations.en.yml
index e7bf9d90e..142270d13 100644
--- a/config/locales/time_table_combinations.en.yml
+++ b/config/locales/time_table_combinations.en.yml
@@ -2,6 +2,9 @@ en:
   time_table_combinations:
     success: "operation applied on timetable"
     failure: "operation failed on timetable"
+    combined_type:
+      calendar: 'Calendars'
+      time_table: 'Time tables'
     operations:
       union: "merge"
       intersection: "intersect"
@@ -13,3 +16,5 @@ en:
       time_table_combination:
         combined_id: "Time table id"
         operation: "operation"
+        time_table_id: "Search a calendar"
+        calendar_id: "Search a calendar"
diff --git a/config/locales/time_table_combinations.fr.yml b/config/locales/time_table_combinations.fr.yml
index 562c7b58d..5a23cf029 100644
--- a/config/locales/time_table_combinations.fr.yml
+++ b/config/locales/time_table_combinations.fr.yml
@@ -2,14 +2,19 @@ fr:
   time_table_combinations:
     success: "opération appliquée sur le calendrier"
     failure: "opération échouée"
+    combined_type:
+      calendar: 'Modèles de calendriers'
+      time_table: 'Calendriers'
     operations:
-      union: "ajouter les dates"
-      intersection: "conserver les dates communes"
-      disjunction: "soustraire les dates"
+      union: "Ajouter les dates"
+      intersection: "Conserver les dates communes"
+      disjunction: "Soustraire les dates"
     combine_form:
       time_tables: "Calendrier à combiner"
   activemodel:
     attributes:
       time_table_combination:
         combined_id: "Id Calendrier"
-        operation: "opération"
+        operation: "Type d'opération"
+        time_table_id: "Rechercher un calendrier"
+        calendar_id: "Rechercher un calendrier"