trestle-mobility 0.2.0 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b024ad069d14e6c5e42fb4a0cfc42d6e5469316f4ab1c3c3bb1e4274f34b044a
-  data.tar.gz: 1b0ea2bb3aeac07751382ba28b6ba151fee47c3da098d948c4624b0e4deabf4e
+  metadata.gz: 4e6d354d0c59601aba494962abac3bd8ed37a00ec1f5b364c233cd656f962312
+  data.tar.gz: 488ed9a24935e94a825d96f6f9429845d8ec932abb3eaacdfd9ca9f5e5d1125b
 SHA512:
-  metadata.gz: dcbce616ed0a7a43c1b79877da54c7804fd7634054870d1a41f46f89fd7b684b4cd4a120dc0e0af14d280c8863e8727b3ae90b39532efcdae1fdef71a557a801
-  data.tar.gz: dcbf2ea3f704dfa59fc25a2cd6c7537ec3f467bd0f5792e673ed01979450e9f1aa7a5d7cb0abec29570791cc9feec91785af4a67e804eeadfccca15e1cfa83db
+  metadata.gz: '0791933b2b6732b353a663ac9dc4e0d6c2326da3a6312a4cc4627569cc93827600ad1b5da8205e2a7d528479e7d817ed68af6b5d61358d5e6073c3dceafcc7a8'
+  data.tar.gz: 4708fc86e840507be062dae338c3b92715872754b59c1c175209e951dfefa15dc9af0b3fc9af16faaff763281af64f9df574b634cf01772854059e1c566aa33f

data/README.md

@@ -10,11 +10,11 @@
 - Supports Postgres container back-end
 - Probably works with other back-ends but has not been tested
 
-![Trestle Mobility screenshot](/screenshot.png?raw=true "Trestle Mobility screenshot")
+<img src="/screenshot.png?raw=true" width="529" height="242" alt="Trestle Mobility screenshot" />
 
 ## Usage
 
-Trestle Mobility requires you to enable [Mobility's `locale_accessors` plugin](https://github.com/shioyama/mobility#getset) to be enabled.
+Trestle Mobility requires you to enable [Mobility's `locale_accessors` plugin](https://github.com/shioyama/mobility#getset).
 
 Assuming you've setup your models with Mobility's `translates` directives, you can use the `mobility_text_field` and `mobility_text_area` field types:
 
@@ -36,10 +36,26 @@ By default Trestle Mobility uses `I18n.available_locales` to generate the form f
 mobility_text_field :title, locales: %w(nl de fr)
 ```
 
-Quoting from Mobility's README:
+Quoting Mobility's README:
 
 > (Note however that Mobility will complain if you have I18n.enforce_available_locales set to true and you try accessing a locale not present in I18n.available_locales; set it to false if you want to allow any locale.)
 
+### Default language selection
+
+Trestle Mobility allows you to specify the language that is selected by default. This is possible on an application-wide basis but also per field.
+
+To set the default language that should be selected for all fields, add the following line to your Trestle initializer:
+
+```ruby
+config.mobility.selected = "nl"
+```
+
+Or specify it per field:
+
+```ruby
+mobility_text_field :subtitle, selected: "nl"
+```
+
 ## Installation
 
 These instructions assume you have a working Trestle application. To integrate trestle-mobility, first add it to your application's Gemfile:

data/app/assets/javascript/trestle/mobility_fields.js

@@ -0,0 +1,46 @@
+Trestle.ready(function() {
+  function init() {
+    $('.mobility').each(function() {
+      new Mobility(this);
+    })
+  }
+
+  function Mobility (element) {
+    var element = $(element);
+    var activeLocale = element.data('active');
+    var button = element.find('.mobility-active');
+    var inputFields = element.find('.mobility-field');
+    var dropdownItems = element.find('.dropdown-item');
+
+    function toggle (flag) {
+      $(inputFields).each(function() {
+        var field = $(this);
+        var active = field.data('locale') !== activeLocale;
+
+        field.toggleClass('hidden', active)
+      })
+
+      $(dropdownItems).each(function() {
+        var field = $(this);
+        var active = field.data('locale') === activeLocale;
+
+        field.toggleClass('active', active)
+      })
+
+      if (flag) {
+        button.text(flag);
+      }
+    }
+
+    element.find('.dropdown-item').on('click', function () {
+      var item = $(this);
+      activeLocale = item.data('locale');
+
+      toggle(item.text());
+    });
+
+    toggle()
+  }
+
+  init();
+});

data/app/views/trestle/mobility/_text_area.html.erb

@@ -1,17 +1,13 @@
-<div>
-  <ul class="nav nav-tabs" role="tablist">
-    <% locales.each.with_index do |locale, index| %>
-      <li role="presentation"<%= ' class=active' if index.zero? %>>
-        <a href="#<%= "#{field_name}_#{locale}" %>" aria-controls="<%= locale %>" role="tab" data-toggle="tab"><%= EmojiFlag.new(locale) %></a>
-      </li>
+<div class="input-group mobility" data-active="<%= selected %>">
+  <button type="button" class="btn btn-default dropdown-toggle input-group-addon" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+    <span class="mobility-active"><%= "#{EmojiFlag.new(selected)} #{selected.upcase}" %></span> <span class="caret"></span>
+  </button>
+  <ul class="dropdown-menu">
+    <% locales.each do |locale| %>
+      <li><a href="#<%= "#{field_name}_#{locale}" %>" class="dropdown-item" data-locale="<%= locale %>"><%= "#{EmojiFlag.new(locale)} #{locale.upcase}" %></a></li>
     <% end %>
   </ul>
-
-  <div class="tab-content">
-    <% locales.each.with_index do |locale, index| %>
-      <div role="tabpanel" class="tab-pane<%= " active" if index.zero? %>" id="<%= "#{field_name}_#{locale}" %>">
-        <%= form.text_area "#{field_name}_#{locale}", label: false, placeholder: "#{field_name.capitalize} (#{locale.upcase})", rows: rows %>
-      </div>
-    <% end %>
-  </div>
+  <% locales.each do |locale, index| %>
+    <%= form.raw_text_area "#{field_name}_#{locale}", class: "form-control mobility-field#{locale == selected ? '' : ' hidden'}", placeholder: "#{field_name.to_s.humanize} (#{locale.upcase})", rows: rows, data: { locale: locale } %>
+  <% end %>
 </div>

data/app/views/trestle/mobility/_text_field.html.erb

@@ -1,17 +1,15 @@
-<div>
-  <ul class="nav nav-tabs" role="tablist">
-    <% locales.each.with_index do |locale, index| %>
-      <li role="presentation"<%= ' class=active' if index.zero? %>>
-        <a href="#<%= "#{field_name}_#{locale}" %>" aria-controls="<%= locale %>" role="tab" data-toggle="tab"><%= EmojiFlag.new(locale) %></a>
-      </li>
-    <% end %>
-  </ul>
-
-  <div class="tab-content">
-    <% locales.each.with_index do |locale, index| %>
-      <div role="tabpanel" class="tab-pane<%= " active" if index.zero? %>" id="<%= "#{field_name}_#{locale}" %>">
-        <%= form.text_field "#{field_name}_#{locale}", label: false, placeholder: "#{field_name.capitalize} (#{locale.upcase})" %>
-      </div>
-    <% end %>
+<div class="input-group mobility" data-active="<%= selected %>">
+  <div class="input-group-btn">
+    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+      <span class="mobility-active"><%= "#{EmojiFlag.new(selected)} #{selected.upcase}" %></span> <span class="caret"></span>
+    </button>
+    <ul class="dropdown-menu">
+      <% locales.each do |locale| %>
+        <li><a href="#<%= "#{field_name}_#{locale}" %>" class="dropdown-item" data-locale="<%= locale %>"><%= "#{EmojiFlag.new(locale)} #{locale.upcase}" %></a></li>
+      <% end %>
+    </ul>
   </div>
+  <% locales.each do |locale| %>
+    <%= form.raw_text_field "#{field_name}_#{locale}", class: "form-control mobility-field#{locale == selected ? '' : ' hidden'}", placeholder: "#{field_name.to_s.humanize} (#{locale.upcase})", data: { locale: locale } %>
+  <% end %>
 </div>

data/config/initializers/trestle.rb

@@ -2,6 +2,10 @@ require "trestle/mobility/text_area"
 require "trestle/mobility/text_field"
 
 Trestle.configure do |config|
+  config.hook(:javascripts) do
+    javascript_include_tag('trestle/mobility_fields.js')
+  end
+
   config.form_field :mobility_text_area, Trestle::Mobility::TextArea
   config.form_field :mobility_text_field, Trestle::Mobility::TextField
 end

data/lib/trestle/mobility/configuration.rb

@@ -0,0 +1,9 @@
+module Trestle
+  module Mobility
+    class Configuration
+      include Configurable
+
+      option :selected
+    end
+  end
+end

data/lib/trestle/mobility/engine.rb

@@ -1,6 +1,7 @@
 module Trestle
   module Mobility
     class Engine < Rails::Engine
+      config.assets.precompile << 'trestle/mobility_fields.js'
     end
   end
 end

data/lib/trestle/mobility/text_area.rb

@@ -4,10 +4,16 @@ module Trestle
       def field
         instance = builder.object
         locales = options[:locales] || I18n.available_locales.sort
+        selected = options[:selected] || Trestle.config.mobility.selected || locales.first
         rows = options[:rows] || 5
 
         @template.render partial: "trestle/mobility/text_area",
-                         locals: { field_name: name, locales: locales, rows: rows }
+                         locals: {
+                           field_name: name,
+                           locales: locales,
+                           selected: selected,
+                           rows: rows
+                         }
       end
     end
   end

data/lib/trestle/mobility/text_field.rb

@@ -4,9 +4,14 @@ module Trestle
       def field
         instance = builder.object
         locales = options[:locales] || I18n.available_locales.sort
+        selected = options[:selected] || Trestle.config.mobility.selected || locales.first
 
         @template.render partial: "trestle/mobility/text_field",
-                         locals: { field_name: name, locales: locales }
+                         locals: {
+                           field_name: name,
+                           locales: locales,
+                           selected: selected
+                         }
       end
     end
   end

data/lib/trestle/mobility/version.rb

@@ -1,5 +1,5 @@
 module Trestle
   module Mobility
-    VERSION = "0.2.0"
+    VERSION = "0.3.0"
   end
 end

data/lib/trestle/mobility.rb

@@ -1,4 +1,8 @@
 require "emoji_flag"
+
 require "trestle"
 require "trestle/mobility/version"
+require "trestle/mobility/configuration"
 require "trestle/mobility/engine" if defined?(Rails)
+
+Trestle::Configuration.option :mobility, Trestle::Mobility::Configuration.new

data/trestle-mobility.gemspec

@@ -24,6 +24,7 @@ Gem::Specification.new do |spec|
   spec.require_paths = ["lib"]
 
   spec.add_dependency "emoji_flag", "~> 0.1"
+  spec.add_dependency "mobility", "~> 0.8"
 
   spec.add_development_dependency "bundler", "~> 2.0"
   spec.add_development_dependency "rake", "~> 10.0"

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: trestle-mobility
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.3.0
 platform: ruby
 authors:
 - Richard Venneman
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2019-04-08 00:00:00.000000000 Z
+date: 2019-04-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: emoji_flag
@@ -24,6 +24,20 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '0.1'
+- !ruby/object:Gem::Dependency
+  name: mobility
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.8'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.8'
 - !ruby/object:Gem::Dependency
   name: bundler
   requirement: !ruby/object:Gem::Requirement
@@ -79,12 +93,14 @@ files:
 - LICENSE.md
 - README.md
 - Rakefile
+- app/assets/javascript/trestle/mobility_fields.js
 - app/views/trestle/mobility/_text_area.html.erb
 - app/views/trestle/mobility/_text_field.html.erb
 - bin/console
 - bin/setup
 - config/initializers/trestle.rb
 - lib/trestle/mobility.rb
+- lib/trestle/mobility/configuration.rb
 - lib/trestle/mobility/engine.rb
 - lib/trestle/mobility/text_area.rb
 - lib/trestle/mobility/text_field.rb