diff --git a/README.md b/README.md index 6301207e..4973ca17 100644 --- a/README.md +++ b/README.md @@ -21,7 +21,7 @@ end ```ruby # if you are using Rails 4 or Strong Parameters: -permit_params translations_attributes: [:locale, :title, :content] +permit_params translations_attributes: [:locale, :id, :title, :content] index do diff --git a/app/assets/javascripts/active_admin/active_admin_globalize.js.coffee b/app/assets/javascripts/active_admin/active_admin_globalize.js.coffee index 53c47c1c..74bb157a 100644 --- a/app/assets/javascripts/active_admin/active_admin_globalize.js.coffee +++ b/app/assets/javascripts/active_admin/active_admin_globalize.js.coffee @@ -2,6 +2,25 @@ $ -> translations = -> + # Hides or shows the + button and the remove button. + updateLocaleButtonsStatus = ($dom) -> + $localeList = $dom.find('.add-locale ul li:not(.hidden)') + if $localeList.length == 0 + $dom.find('.add-locale').hide() + else + $dom.find('.add-locale').show() + + + # Hides or shows the locale tab and its corresponding element in the add menu. + toggleTab = ($tab, active) -> + $addButton = $tab.parents('ul').find('.add-locale li:has(a[href="' + $tab.attr('href') + '"])') + if active + $tab.addClass('hidden').show().removeClass('hidden') + $addButton.hide().addClass('hidden') + else + $tab.addClass('hidden').hide().addClass('hidden') + $addButton.show().removeClass('hidden') + $(".activeadmin-translations > ul").each -> $dom = $(this) if !$dom.data("ready") @@ -9,21 +28,91 @@ $ -> $tabs = $("li > a", this) $contents = $(this).siblings("fieldset") - $tabs.click -> + $tabs.click (e) -> $tab = $(this) $tabs.not($tab).removeClass("active") $tab.addClass("active") $contents.hide() $contents.filter($tab.attr("href")).show() - false + e.preventDefault() $tabs.eq(0).click() + # Collect tha available locales. + availableLocales = [] + $tabs.not('.default').each -> + availableLocales.push($('
  • ').append($(this).clone().removeClass('active'))) + + # Create a new tab as the root of the drop down menu. + $addLocaleButton = $('
  • +
  • ') + $addLocaleButton.append($('').append(availableLocales)) + + # Handle locale addition + $addLocaleButton.find('ul a').click (e) -> + href = $(this).attr('href') + $tab = $tabs.filter('[href="' + href + '"]') + toggleTab($tab, true) + $tab.click() + updateLocaleButtonsStatus($dom) + e.preventDefault() + + # Remove a locale from the tab. + $removeButton = $('x').click (e) -> + e.stopImmediatePropagation() + e.preventDefault() + $tab = $(this).parent() + toggleTab($tab, false) + if $tab.hasClass('active') + $tabs.not('.hidden').eq(0).click() + + updateLocaleButtonsStatus($dom) + + # Add the remove button to every tab. + $tabs.not('.default').append($removeButton) + + # Add the new button at the end of the locale list. + $dom.append($addLocaleButton) + $tabs.each -> $tab = $(@) $content = $contents.filter($tab.attr("href")) containsErrors = $content.find(".input.error").length > 0 $tab.toggleClass("error", containsErrors) + # Find those tabs that are in use. + hide = true + # We will not hide the tabs that have any error. + if $tab.hasClass('error') || $tab.hasClass('default') + hide = false + else + # Check whether the input fields are empty or not. + $content.find('[name]').not('[type="hidden"]').each -> + if $(this).val() + # We will not hide the tab because it has some data. + hide = false + return false + + if hide + toggleTab($tab, false) + else + toggleTab($tab, true) + + # Remove the fields of hidden locales before form submission. + $form = $dom.parents('form') + if !$form.data('ready') + $form.data('ready') + $form.submit -> + # Get all translations (the nested ones too). + $('.activeadmin-translations > ul').each -> + # Get the corresponding fieldsets. + $fieldsets = $(this).siblings('fieldset') + $("li:not(.add-locale) > a", this).each -> + # Remove them if the locale is hidden. + if $(this).hasClass('hidden') + $fieldsets.filter($(this).attr('href')).remove() + + #Initially update the buttons' status + updateLocaleButtonsStatus($dom) + $tabs.filter('.default').click() # this is to handle elements created with has_many $("a").bind "click", -> diff --git a/app/assets/stylesheets/active_admin/active_admin_globalize.css.sass b/app/assets/stylesheets/active_admin/active_admin_globalize.css.sass index 362a73c1..468e7768 100644 --- a/app/assets/stylesheets/active_admin/active_admin_globalize.css.sass +++ b/app/assets/stylesheets/active_admin/active_admin_globalize.css.sass @@ -21,6 +21,7 @@ padding: 8px 15px padding-bottom: 8px + 4px margin-bottom: 0 + position: relative &.error color: #932419 @@ -34,6 +35,72 @@ text-shadow: 0 1px 0 white color: #666 !important + &> span + font-size: 0.75em + font-weight: bold + position: absolute + top: 2px + right: 4px + display: none + + &:hover + +text-shadow(red, 1px, 1px, 2px) + + &:hover + span + display: block + + span.hidden + display: none + + &> li.add-locale + font-weight: bold + position: relative + z-index: 100 + + &> ul + display: none + font-size: 17px + font-weight: normal + padding: 0 + +border-bottom-radius(4px) + position: absolute + +shadow(3px, 3px, 5px, #aaa) + background: #f4f4f4 + z-index: 100 + + &> li + font-size: 17px + padding: 8px 15px + padding-bottom: 8px + 4px + margin-bottom: 0 + + &:hover + background: #ddd + background: -webkit-linear-gradient(left, $secondary-gradient-stop, #f4f4f4) + background: -moz-linear-gradient(left, $secondary-gradient-stop, #f4f4f4) + background: linear-gradient(left, $secondary-gradient-stop, #f4f4f4) + + &> a + text-decoration: none + color: #666 + + &> li:first-child + border-top-right-radius: 4px + + &:hover + background: #f4f4f4 + +inset-shadow(0, 4px, 4px, #ddd) + +border-top-radius(4px) + margin-bottom: 0 + +gradient($secondary-gradient-stop, #f4f4f4) + text-shadow: 0 1px 0 white + color: #666 !important + + &> ul + display: block + + &> fieldset.inputs margin-bottom: 0 diff --git a/config/locales/fr.yml b/config/locales/fr.yml new file mode 100644 index 00000000..d2ee44ad --- /dev/null +++ b/config/locales/fr.yml @@ -0,0 +1,14 @@ +fr: + active_admin: + globalize: + translations: "Traductions" + language: + de: "Allemand" + en: "Anglais" + es: "Espagnol" + fr: "Français" + hu: "Hongrois" + it: "Italien" + pt-BR: "Portugais (Brésil)" + pt-PT: "Portugais (Portugal)" + tr: "Turc" diff --git a/lib/active_admin/globalize/engine.rb b/lib/active_admin/globalize/engine.rb index b0cc2a65..8dd58f6b 100644 --- a/lib/active_admin/globalize/engine.rb +++ b/lib/active_admin/globalize/engine.rb @@ -1,7 +1,7 @@ module ActiveAdmin module Globalize class Engine < ::Rails::Engine - initializer "Active Admin precompile hook", group: :assets do |app| + initializer "Active Admin precompile hook", group: :all do |app| app.config.assets.precompile += [ "active_admin/active_admin_globalize.css", "active_admin/active_admin_globalize.js" diff --git a/lib/active_admin/globalize/form_builder_extension.rb b/lib/active_admin/globalize/form_builder_extension.rb index cc62d73b..2ba0c876 100644 --- a/lib/active_admin/globalize/form_builder_extension.rb +++ b/lib/active_admin/globalize/form_builder_extension.rb @@ -10,9 +10,10 @@ def translated_inputs(name = "Translations", options = {}, &block) form_buffers.last << template.content_tag(:div, class: "activeadmin-translations") do template.content_tag(:ul, class: "available-locales") do (auto_sort ? I18n.available_locales.sort : I18n.available_locales).map do |locale| + default = 'default' if locale == I18n.default_locale template.content_tag(:li) do I18n.with_locale(switch_locale ? locale : I18n.locale) do - template.content_tag(:a, I18n.t(:"active_admin.globalize.language.#{locale}"), href:".locale-#{locale}") + template.content_tag(:a, I18n.t(:"active_admin.globalize.language.#{locale}"), href:".locale-#{locale}", :class => default) end end end.join.html_safe