simple_form-bootstrap 1.2.0 → 1.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 26489ef93ca2d29986f6fc2d779623da2c704f43
-  data.tar.gz: a454186a41d7d02312d8112171226a86eae7ce2d
+  metadata.gz: a661ed8effde4d148bc4742b5830e7d3ad159424
+  data.tar.gz: 6f46a48bfc692ef807c69c0efa0c3b367e911405
 SHA512:
-  metadata.gz: 07fa325718226174d0578ee1a50e63303ef02496a428c848a6eade551e3f10e3692af548120d27ff0157778d5ac09c7513dc81d229f98fc1d1f91e693eb22634
-  data.tar.gz: da29bb5246335fa3a0133618bf87932e7c1db353ff949393b07d3a77eb8b2fcc92bd3bf8c0a36d2309e69677a62e436c42f85292bc56a33947cf011557f296e0
+  metadata.gz: 261fdb832ac3350e5f14354c3e1713b98ae529a7db33e61162f090b36a58a748b86cff640f8d3970f5a94f80fe5990e8e20799535c85dfe3212381ca7dda66ed
+  data.tar.gz: 5a36a3a2245b91af251ed9c8716f4caa94c1fda3513e1a0c7ae45cfdc5d9b45e1b08d3839df7af59c76f8dcd06eecac15ff03909236c8ed3668e8a85be9257ea

data/.gitignore

@@ -1,34 +1,34 @@
-*.gem
-*.rbc
-/.config
-/coverage/
-/InstalledFiles
-/pkg/
-/spec/reports/
-/test/tmp/
-/test/version_tmp/
-/tmp/
-
-## Specific to RubyMotion:
-.dat*
-.repl_history
-build/
-
-## Documentation cache and generated files:
-/.yardoc/
-/_yardoc/
-/doc/
-/rdoc/
-
-## Environment normalisation:
-/.bundle/
-/lib/bundler/man/
-
-# for a library or gem, you might want to ignore these files since the code is
-# intended to run in multiple environments; otherwise, check them in:
-# Gemfile.lock
-# .ruby-version
-# .ruby-gemset
-
-# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
-.rvmrc
+*.gem
+*.rbc
+/.config
+/coverage/
+/InstalledFiles
+/pkg/
+/spec/reports/
+/test/tmp/
+/test/version_tmp/
+/tmp/
+
+## Specific to RubyMotion:
+.dat*
+.repl_history
+build/
+
+## Documentation cache and generated files:
+/.yardoc/
+/_yardoc/
+/doc/
+/rdoc/
+
+## Environment normalisation:
+/.bundle/
+/lib/bundler/man/
+
+# for a library or gem, you might want to ignore these files since the code is
+# intended to run in multiple environments; otherwise, check them in:
+# Gemfile.lock
+# .ruby-version
+# .ruby-gemset
+
+# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
+.rvmrc

data/.rspec

@@ -1,2 +1,2 @@
---color
---require spec_helper
+--color
+--require spec_helper

data/CHANGELOG.md

@@ -4,6 +4,16 @@
 
 ### bug fixes
 
+## 1.3.0
+
+### enhancements
+ * Implement support for token fields. Use the `as: :token` on a Simple Form input field.
+
+### bug fixes
+ * Do not change selects to the Bootstrap select class unless they are explicitly select fields. 
+   Other types of controls also give select fields -- typeaheads and the like.
+ * Fix compatibility layer for Bootstrap selects when the `bootstrap-select-rails` is not installed.
+
 ## 1.2.0
 
 ### enhancements

data/Gemfile

@@ -1,3 +1,3 @@
-source 'https://rubygems.org'
-
-gemspec
+source 'https://rubygems.org'
+
+gemspec

data/LICENSE

@@ -1,22 +1,22 @@
-The MIT License (MIT)
-
-Copyright (c) 2015 Joel Low
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-
+The MIT License (MIT)
+
+Copyright (c) 2015 Joel Low
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

data/README.md

@@ -14,6 +14,20 @@ Integrating Bootstrap-looking form controls with Simple Form.
     1. If you want to use Date/Time pickers, install the `bootstrap3-datetimepicker-rails` gem.
     2. If you want to use the nicely styled Bootstrap Select picker, install the
        `bootstrap-select-rails` gem.
+    3. If you want to use the Token picker, you need to
+       a. Install the `bootstrap_tokenfield_rails` and `twitter-typeahead-rails` gems.
+       b. Require `twitter/typeahead` and `bootstrap-tokenfield` in that order in `application.js`.
+       c. Require `tokenfield-typeahead` and `bootstrap-tokenfield` in that order in
+          `application.css`.
+       d. These extra `@extend`s are needed for Typeahead.js 0.11:
+          ```scss
+          .tt-menu {
+            @extend .tt-dropdown-menu;
+          }
+          .tt-suggestion.tt-selectable:hover {
+            @extend .tt-suggestion.tt-cursor;
+          }
+          ```
 
  2. Add to your application's javascript: `//= require simple_form-bootstrap`
  3. Empty the Simple Form initializer:

data/Rakefile

@@ -1,12 +1,12 @@
-begin
-  require 'bundler/setup'
-rescue LoadError
-  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
-end
-
-require "rspec/core/rake_task"
-
-RSpec::Core::RakeTask.new
-
-task :default => :spec
-task :test => :spec
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require "rspec/core/rake_task"
+
+RSpec::Core::RakeTask.new
+
+task :default => :spec
+task :test => :spec

data/app/assets/javascripts/simple_form-bootstrap.js

@@ -1,24 +1,30 @@
-//= require simple_form-bootstrap/date_time_input
-
-(function($) {
-  'use strict';
-  function initializeComponents(node) {
-    // Enable our date/time pickers
-    var datePickers = $('input.bootstrap-datepicker', node);
-    datePickers.datetimepicker();
-
-    // Enable our styled Bootstrap select controls, except Twitter Typeahead controls.
-    var selects = $('select.form-control:not(.typeahead)', node);
-    selects.selectpicker();
-  }
-
-  $(document).on('ready', function(e) {
-    initializeComponents(document);
-  });
-  $(document).on('DOMNodeInserted', function(e) {
-    initializeComponents(e.target);
-  });
-  $(document).on('nested:fieldAdded', function(e) {
-    initializeComponents(e.field);
-  });
-})(jQuery);
+//= require simple_form-bootstrap/date_time_input
+//= require simple_form-bootstrap/select_input
+//= require simple_form-bootstrap/token_input
+
+(function($) {
+  'use strict';
+  function initializeComponents(node) {
+    // Enable our date/time pickers
+    var datePickers = $('input.bootstrap-datepicker', node);
+    datePickers.datetimepicker();
+
+    // Enable our styled Bootstrap select controls, only when using the default select collection.
+    var selects = $('select.select.form-control', node);
+    selects.selectpicker();
+
+    // Token fields for select inputs.
+    var tokenfields = $('.token select.token', node);
+    tokenfields.tokenfield();
+  }
+
+  $(document).on('ready', function(e) {
+    initializeComponents(document);
+  });
+  $(document).on('DOMNodeInserted', function(e) {
+    initializeComponents(e.target);
+  });
+  $(document).on('nested:fieldAdded', function(e) {
+    initializeComponents(e.field);
+  });
+})(jQuery);

data/app/assets/javascripts/simple_form-bootstrap/select_input.js

@@ -1,12 +1,12 @@
-// Hijacks the default Bootstrap date-time picker to always format dates in the specified format
-// through the use of a hidden field.
-(function($) {
-  'use strict';
-  if ($.fn.selectpicker) {
-    return;
-  }
-
-  $.fn.selectpicker = function(arg) {
-    return methods.initialise.call(this, arg);
-  };
-}(jQuery));
+// Hijacks the default Bootstrap date-time picker to always format dates in the specified format
+// through the use of a hidden field.
+(function($) {
+  'use strict';
+  if ($.fn.selectpicker) {
+    return;
+  }
+
+  $.fn.selectpicker = function() {
+    return this;
+  };
+}(jQuery));

data/app/assets/javascripts/simple_form-bootstrap/token_input.js

@@ -0,0 +1,170 @@
+(function($) {
+  'use strict';
+  /* global Bloodhound */
+
+  var oldTokenField = $.fn.tokenfield;
+  if (!oldTokenField) {
+    $.fn.tokenfield = function() {};
+    return;
+  }
+
+  /**
+   * Gets the selected options matching the given selector from the given select field.
+   *
+   * The return array of objects use 'value' for the displayed text. This is because Token field
+   * uses the value field when editing tokens, so we stick to its convention. The Select option
+   * is in optionValue.
+   *
+   * @param {Object} $select The select field to query.
+   * @param {String|null} selector The selector to filter the options by, if any.
+   * @returns {Array} The array of values which match the selector.
+   */
+  function getSelectOptions($select, selector) {
+    var $options = $select.find('option');
+    if (selector) {
+      $options = $options.filter(selector);
+    }
+
+    return $options.map(function() {
+      var text = this.text;
+      return {
+        optionValue: this.value || text,
+        value: text
+      };
+    }).get();
+  }
+
+  /**
+   * Finds the given value in the given select field.
+   *
+   * @param {Object} $select The select field.
+   * @param {String} value The value to search in the select.
+   */
+  function findOption($select, value) {
+    return $select.find('option[value="' + value + '"]');
+  }
+
+  /**
+   * Handles the pre-selection of a value.
+   *
+   * This blocks the addition if there is no option by that name.
+   *
+   * @param {Object} $select The select field.
+   * @param e The event triggering the selection.
+   * @returns {boolean} Return false to block the change.
+   */
+  function beforeSelectValue($select, e) {
+    var $option = findOption($select, e.attrs.optionValue);
+    if ($option.length === 0) {
+      return false;
+    }
+  }
+
+  /**
+   * Generates a before-selection event handler for the given select field.
+   * @param {HTMLSelectElement} select The select field to change.
+   * @returns {Function} The handler for the given select field.
+   */
+  function generateBeforeSelectValueHandler(select) {
+    return function(e) {
+      return beforeSelectValue($(select), e);
+    };
+  }
+
+  /**
+   * Handles the selection of a value.
+   *
+   * @param {Object} $select The select field.
+   * @param e The event triggering the selection.
+   * @returns {boolean} Return false to block the change.
+   */
+  function onSelectValue($select, e) {
+    var $option = findOption($select, e.attrs.optionValue);
+    $option.prop('selected', true);
+  }
+
+  /**
+   * Generates a on-selected event handler for the given select field.
+   * @param {HTMLSelectElement} select The select field to change.
+   * @returns {Function} The handler for the given select field.
+   */
+  function generateOnSelectValueHandler(select) {
+    return function(e) {
+      return onSelectValue($(select), e);
+    };
+  }
+
+  /**
+   * Handles the removal of a value.
+   *
+   * @param {Object} $select The select field.
+   * @param e The event triggering the selection.
+   * @returns {boolean} Return false to block the change.
+   */
+  function onRemoveValue($select, e) {
+    var $option = findOption($select, e.attrs.optionValue);
+    if ($option.length !== 0) {
+      $option.prop('selected', false);
+    }
+  }
+
+  /**
+   * Generates a value-removed event handler for the given select field.
+   * @param {HTMLSelectElement} select The select field to change.
+   * @returns {Function} The handler for the given select field.
+   */
+  function generateOnRemoveValueHandler(select) {
+    return function(e) {
+      return onRemoveValue($(select), e);
+    };
+  }
+
+  function initialiseTokenField() {
+    var select = this;
+
+    $(select).hide();
+    var $text = $('<input type="text" />').insertAfter(select);
+    var options = getSelectOptions($(select));
+
+    var bloodhound = new Bloodhound({
+      local: options,
+      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
+      queryTokenizer: Bloodhound.tokenizers.whitespace
+    });
+    bloodhound.initialize();
+
+    var $result = oldTokenField.call($text, {
+      typeahead: [null, { displayKey: 'value', source: bloodhound.ttAdapter() }]
+    });
+
+    oldTokenField.call($result, 'setTokens', getSelectOptions($(select), ':selected'));
+
+    $result.on('tokenfield:createtoken', generateBeforeSelectValueHandler(select));
+    $result.on('tokenfield:createdtoken', generateOnSelectValueHandler(select));
+    $result.on('tokenfield:edittoken', generateBeforeSelectValueHandler(select));
+    $result.on('tokenfield:editedtoken', generateOnSelectValueHandler(select));
+    $result.on('tokenfield:removedtoken', generateOnRemoveValueHandler(select));
+
+    return $result;
+  }
+
+  $.fn.tokenfield = function() {
+    if (arguments.length === 0 || typeof arguments[0] === 'object') {
+      return this.addClass('tokenfield').removeClass('token').map(function() {
+        if ($(this).data('bs.tokenfield')) {
+          return this;
+        }
+
+        return initialiseTokenField.call(this);
+      });
+    } else {
+      return oldTokenField.apply(this, arguments);
+    }
+  };
+
+  for (var i in oldTokenField) {
+    if (oldTokenField.hasOwnProperty(i)) {
+      $.fn.tokenfield[i] = oldTokenField[i];
+    }
+  }
+})(jQuery);