multi-select-rails 0.8.0.1

data/.gitignore

@@ -0,0 +1,17 @@
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp

data/Gemfile

@@ -0,0 +1,4 @@
+source 'http://rubygems.org'
+
+# Specify your gem's dependencies in bootstrap-rails.gemspec
+gemspec

data/README.md

@@ -0,0 +1,28 @@
+# Multiselect for Rails asset pipeline
+
+[multi-select](https://github.com/lou/multi-select) is a tiny jQuery plugin to customize selects with the multiple attribute. 
+
+The `multi-select-rails` gem integrates `multi-select` with the Rails asset pipeline.
+
+## Usage
+
+### Install multi-select-rails gem
+
+Include `multi-select-rails` in Gemfile
+
+    gem 'multi-select-rails'
+
+Then run `bundle install`
+
+### Include multiselect javascript assets
+
+Add to your `app/assets/javascripts/application.js`
+
+    //= require multi-select
+
+### Include multiselect stylesheet assets
+
+Add to your `app/assets/stylesheets/application.css`
+
+    *= require multi-select
+

data/lib/multi-select-rails.rb

@@ -0,0 +1,12 @@
+require "rails"
+require "multi-select-rails/version"
+
+module MultiSelectRails
+  module Rails
+    if ::Rails.version < "3.1"
+      require "multi-select-rails/railtie"
+    else
+      require "multi-select-rails/engine"
+    end
+  end
+end

data/lib/multi-select-rails/engine.rb

@@ -0,0 +1,6 @@
+module MultiSelectRails
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/multi-select-rails/railtie.rb

@@ -0,0 +1,5 @@
+module MultiSelectRails
+  module Rails
+    class Railtie < ::Rails::Railtie; end
+  end
+end

data/lib/multi-select-rails/version.rb

@@ -0,0 +1,5 @@
+module MultiSelectRails
+  module Rails
+    VERSION = "0.8.0.1"
+  end
+end

data/multi-select-rails.gemspec

@@ -0,0 +1,19 @@
+# -*- encoding: utf-8 -*-
+require File.expand_path('../lib/multi-select-rails/version', __FILE__)
+
+Gem::Specification.new do |gem|
+  gem.authors       = ["Per Andersson"]
+  gem.email         = ["klenis@klenis.org"]
+  gem.description   = %q{Multiselect jQuery plugin for Rails asset pipeline}
+  gem.homepage      = "https://github.com/klenis/multi-select-rails"
+  gem.summary       = gem.description
+
+  gem.name          = "multi-select-rails"
+  gem.require_paths = ["lib"]
+  gem.files         = `git ls-files`.split("\n")
+  gem.version       = MultiSelectRails::Rails::VERSION
+
+  gem.add_dependency "railties", ">= 3.0"
+  gem.add_development_dependency "bundler", ">= 1.0"
+  gem.add_development_dependency "rake"
+end

data/vendor/assets/javascripts/multi-select.js

@@ -0,0 +1,334 @@
+/*
+* MultiSelect v0.8
+* Copyright (c) 2012 Louis Cuny
+*
+* This program is free software. It comes without any warranty, to
+* the extent permitted by applicable law. You can redistribute it
+* and/or modify it under the terms of the Do What The Fuck You Want
+* To Public License, Version 2, as published by Sam Hocevar. See
+* http://sam.zoy.org/wtfpl/COPYING for more details.
+*/
+
+(function($){
+  var msMethods = {
+    'init' : function(options){
+      this.settings = {
+        disabledClass : 'disabled',
+        selectCallbackOnInit: false,
+        keepOrder : false,
+        dblClick : false
+      };
+      if(options) {
+        this.settings = $.extend(this.settings, options);
+      }
+      var multiSelects = this;
+      multiSelects.css('position', 'absolute').css('left', '-9999px');
+      return multiSelects.each(function(){
+        var ms = $(this);
+
+        if (ms.next('.ms-container').length == 0){
+          ms.attr('id', ms.attr('id') ? ms.attr('id') : 'ms-'+Math.ceil(Math.random()*1000));
+          var container = $('<div id="ms-'+ms.attr('id')+'" class="ms-container"></div>'),
+              selectableContainer = $('<div class="ms-selectable"></div>'),
+              selectedContainer = $('<div class="ms-selection"></div>'),
+              selectableUl = $('<ul class="ms-list"></ul>'),
+              selectedUl = $('<ul class="ms-list"></ul>');
+
+          ms.data('settings', multiSelects.settings);
+
+          var optgroupLabel = null,
+              optgroupId = null,
+              optgroupCpt = 0,
+              scroll = 0;
+          ms.find('optgroup,option').each(function(){
+            if ($(this).is('optgroup')){
+              optgroupLabel = $(this).attr('label');
+              optgroupId = 'ms-'+ms.attr('id')+'-optgroup-'+optgroupCpt;
+              selectableUl.append($('<li class="ms-optgroup-container" id="'+
+                                  optgroupId+'"><ul class="ms-optgroup"><li class="ms-optgroup-label">'+
+                                  optgroupLabel+'</li></ul></li>'));
+              optgroupCpt++;
+            } else {
+              var klass = $(this).attr('class') ? ' '+$(this).attr('class') : '';
+              var selectableLi = $('<li class="ms-elem-selectable'+klass+'" ms-value="'+$(this).val()+'">'+$(this).text()+'</li>');
+
+              if ($(this).attr('title'))
+                selectableLi.attr('title', $(this).attr('title'));
+              if ($(this).attr('disabled') || ms.attr('disabled')){
+                selectableLi.attr('disabled', 'disabled');
+                selectableLi.addClass(multiSelects.settings.disabledClass);
+              }
+              if(multiSelects.settings.dblClick) {
+                selectableLi.dblclick(function(){
+                  ms.multiSelect('select', $(this).attr('ms-value'));
+                });
+              } else {
+                selectableLi.click(function(){
+                  ms.multiSelect('select', $(this).attr('ms-value'));
+                });
+              }
+              var container = optgroupId ? selectableUl.children('#'+optgroupId).find('ul').first() : selectableUl;
+              container.append(selectableLi);
+            }
+          });
+          if (multiSelects.settings.selectableHeader){
+            selectableContainer.append(multiSelects.settings.selectableHeader);
+          }
+          selectableContainer.append(selectableUl);
+          if (multiSelects.settings.selectedHeader){
+            selectedContainer.append(multiSelects.settings.selectedHeader);
+          }
+          selectedContainer.append(selectedUl);
+          container.append(selectableContainer);
+          container.append(selectedContainer);
+          ms.after(container);
+          ms.find('option:selected').each(function(){
+            ms.multiSelect('select', $(this).val(), 'init');
+          });
+
+          $('.ms-elem-selectable', selectableUl).on('mouseenter', function(){
+            $('li', container).removeClass('ms-hover');
+            $(this).addClass('ms-hover');
+          }).on('mouseout', function(){
+            $('li', container).removeClass('ms-hover');
+          });
+
+
+
+          selectableUl.on('focusin', function(){
+            $(this).addClass('ms-focus');
+            selectedUl.focusout();
+          }).on('focusout', function(){
+            $(this).removeClass('ms-focus');
+            $('li', container).removeClass('ms-hover');
+          });
+
+          selectedUl.on('focusin', function(){
+            $(this).addClass('ms-focus');
+          }).on('focusout', function(){
+            $(this).removeClass('ms-focus');
+            $('li', container).removeClass('ms-hover');
+          });
+
+          ms.on('focusin', function(){
+            selectableUl.focus();
+          }).on('focusout', function(){
+            selectableUl.removeClass('ms-focus');
+            selectedUl.removeClass('ms-focus');
+          });
+
+          ms.onKeyDown = function(e, keyContainer){
+            var selectables = $('.'+keyContainer+' li:visible:not(.ms-optgroup-label, .ms-optgroup-container)', container),
+                selectablesLength = selectables.length,
+                selectableFocused = $('.'+keyContainer+' li.ms-hover', container),
+                selectableFocusedIndex = $('.'+keyContainer+' li:visible:not(.ms-optgroup-label, .ms-optgroup-container)', container).index(selectableFocused),
+                liHeight = selectables.first().outerHeight(),
+                numberOfItemsDisplayed = Math.ceil(container.outerHeight()/liHeight),
+                scrollStart = Math.ceil(numberOfItemsDisplayed/4);
+
+            selectables.removeClass('ms-hover');
+            if (e.keyCode == 32){ // space
+              var method = keyContainer == 'ms-selectable' ? 'select' : 'deselect';
+              ms.multiSelect(method, selectableFocused.first().attr('ms-value'));
+
+            } else if (e.keyCode == 40){ // Down
+              var nextIndex = (selectableFocusedIndex+1 != selectablesLength) ? selectableFocusedIndex+1 : 0,
+                  nextSelectableLi = selectables.eq(nextIndex);
+
+              nextSelectableLi.addClass('ms-hover');
+              if (nextIndex > scrollStart){
+                scroll += liHeight;
+              } else if (nextIndex == 0){
+                scroll = 0;
+              }
+              $('.'+keyContainer+' ul', container).scrollTop(scroll);
+            } else if (e.keyCode == 38){ // Up
+              var prevIndex = (selectableFocusedIndex-1 >= 0) ? selectableFocusedIndex-1 : selectablesLength-1,
+                  prevSelectableLi = selectables.eq(prevIndex);
+              selectables.removeClass('ms-hover');
+              prevSelectableLi.addClass('ms-hover');
+              if (selectablesLength-prevIndex+1 < scrollStart){
+                scroll = liHeight*(selectablesLength-scrollStart);
+              } else {
+                scroll -= liHeight;
+              }
+              $('.'+keyContainer+' ul', container).scrollTop(scroll);
+            } else if (e.keyCode == 37 || e.keyCode == 39){ // Right and Left
+              if (selectableUl.hasClass('ms-focus')){
+                selectableUl.focusout();
+                selectedUl.focusin();
+              } else {
+                selectableUl.focusin();
+                selectedUl.focusout();
+              }
+            }
+          }
+
+          ms.on('keydown', function(e){
+            if (ms.is(':focus')){
+              var keyContainer = selectableUl.hasClass('ms-focus') ? 'ms-selectable' : 'ms-selection';
+              ms.onKeyDown(e, keyContainer);
+            }
+          });
+        }
+      });
+    },
+    'refresh' : function() {
+      $("#ms-"+$(this).attr("id")).remove();
+      $(this).multiSelect("init", $(this).data("settings"));
+    },
+    'select' : function(value, method){
+      var ms = this,
+          selectedOption = ms.find('option[value="'+value +'"]'),
+          text = selectedOption.text(),
+          klass = selectedOption.attr('class'),
+          titleAttr = selectedOption.attr('title');
+
+      var selectedLi = $('<li class="ms-elem-selected'+(klass ? ' '+klass : '')+'" ms-value="'+value+'">'+text+'</li>'),
+          selectableUl = $('#ms-'+ms.attr('id')+' .ms-selectable ul'),
+          selectedUl = $('#ms-'+ms.attr('id')+' .ms-selection ul'),
+          selectableLi = selectableUl.children('li[ms-value="'+value+'"]'),
+          haveToSelect = null;
+
+      if (method == 'init'){
+        haveToSelect = !selectableLi.hasClass(ms.data('settings').disabledClass) && selectedOption.prop('selected');
+      } else {
+        haveToSelect = !selectableLi.hasClass(ms.data('settings').disabledClass);
+        ms.focus();
+      }
+      if (haveToSelect && selectedUl.children('li[ms-value="'+value+'"]').length == 0){
+        var parentOptgroup = selectableLi.parent('.ms-optgroup');
+        if (parentOptgroup.length > 0)
+          if (parentOptgroup.children('.ms-elem-selectable:not(:hidden)').length == 1)
+            parentOptgroup.children('.ms-optgroup-label').hide();
+        selectableLi.addClass('ms-selected');
+        selectableLi.hide();
+        selectedOption.prop('selected', true);
+        if(titleAttr){
+          selectedLi.attr('title', titleAttr)
+        }
+        if (selectableLi.hasClass(ms.data('settings').disabledClass)){
+          selectedLi.addClass(ms.data('settings').disabledClass);
+        } else {
+          if(ms.data('settings').dblClick) {
+            selectedLi.dblclick(function(){
+              ms.multiSelect('deselect', $(this).attr('ms-value'));
+            });
+          } else {
+            selectedLi.click(function(){
+              ms.multiSelect('deselect', $(this).attr('ms-value'));
+            });
+          }
+        }
+
+        var selectedUlLis = selectedUl.children('.ms-elem-selected');
+        if (method != 'init' && ms.data('settings').keepOrder && selectedUlLis.length > 0) {
+
+          var getIndexOf = function(value) {
+            elems = selectableUl.children('.ms-elem-selectable');
+            return(elems.index(elems.closest('[ms-value="'+value+'"]')));
+          }
+
+          var index = getIndexOf(selectedLi.attr('ms-value'));
+          if (index == 0)
+            selectedUl.prepend(selectedLi);
+          else {
+            for (i = index - 1; i >= 0; i--){
+              if (selectedUlLis[i] && getIndexOf($(selectedUlLis[i]).attr('ms-value')) < index) {
+                $(selectedUlLis[i]).after(selectedLi);
+                break;
+              } else if (i == 0) {
+                $(selectedUlLis[i]).before(selectedLi);
+              }
+            }
+          }
+        } else {
+          selectedUl.append(selectedLi);
+        }
+        selectedLi.on('mouseenter', function(){
+          $('li', selectedUl).removeClass('ms-hover');
+          $(this).addClass('ms-hover');
+        }).on('mouseout', function(){
+          $('li', selectedUl).removeClass('ms-hover');
+        });
+        if (method == "select_all" && parentOptgroup.children('.ms-elem-selectable').length > 0){
+          parentOptgroup.children('.ms-optgroup-label').hide();
+        }
+        if(method != 'init' || ms.data('settings').selectCallbackOnInit){
+          ms.trigger('change');
+          selectedUl.trigger('change');
+          selectableUl.trigger('change');
+          if (typeof ms.data('settings').afterSelect == 'function' &&
+              (method != 'init' || ms.data('settings').selectCallbackOnInit)) {
+            ms.data('settings').afterSelect.call(this, value, text);
+          }
+        }
+      }
+    },
+    'deselect' : function(value){
+      var ms = this,
+          selectedUl = $('#ms-'+ms.attr('id')+' .ms-selection ul'),
+          selectedOption = ms.find('option[value="'+value +'"]'),
+          selectedLi = selectedUl.children('li[ms-value="'+value+'"]');
+
+      if(selectedLi){
+        selectedUl.focusin();
+        var selectableUl = $('#ms-'+ms.attr('id')+' .ms-selectable ul'),
+            selectedUl = $('#ms-'+ms.attr('id')+' .ms-selection ul'),
+            selectableLi = selectableUl.children('li[ms-value="'+value+'"]'),
+            selectedLi = selectedUl.children('li[ms-value="'+value+'"]');
+
+        var parentOptgroup = selectableLi.parent('.ms-optgroup');
+        if (parentOptgroup.length > 0){
+          parentOptgroup.children('.ms-optgroup-label').addClass('ms-collapse').show();
+          parentOptgroup.children('.ms-elem-selectable:not(.ms-selected)').show();
+        }
+        selectedOption.prop('selected', false);
+        selectableLi.show();
+        selectableLi.removeClass('ms-selected');
+        selectedLi.remove();
+        selectedUl.trigger('change');
+        selectableUl.trigger('change');
+        ms.trigger('change');
+        if (typeof ms.data('settings').afterDeselect == 'function') {
+          ms.data('settings').afterDeselect.call(this, value, selectedLi.text());
+        }
+      }
+    },
+    'select_all' : function(visible){
+      var ms = this,
+          selectableUl = $('#ms-'+ms.attr('id')+' .ms-selectable ul');
+
+      ms.find("option:not(:selected)").each(function(){
+        var value = $(this).val();
+        if (visible){
+          var selectableLi = selectableUl.children('li[ms-value="'+value+'"]');
+          if (selectableLi.filter(':visible').length > 0){
+            ms.multiSelect('select', value, 'select_all');
+          }
+        } else {
+          ms.multiSelect('select', value, 'select_all');
+        }
+      });
+    },
+    'deselect_all' : function(){
+      var ms = this,
+          selectedUl = $('#ms-'+ms.attr('id')+' .ms-selection ul');
+
+      ms.find("option:selected").each(function(){
+        ms.multiSelect('deselect', $(this).val(), 'deselect_all');
+      });
+    }
+  };
+
+  $.fn.multiSelect = function(method){
+    if ( msMethods[method] ) {
+      return msMethods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
+    } else if ( typeof method === 'object' || ! method ) {
+      return msMethods.init.apply( this, arguments );
+    } else {
+      if(console.log) console.log( 'Method ' +  method + ' does not exist on jquery.multiSelect' );
+    }
+    return false;
+  };
+})(jQuery);

data/vendor/assets/stylesheets/multi-select.scss

@@ -0,0 +1,86 @@
+.ms-container{
+  background: transparent image-url("switch.png") no-repeat 170px 80px;
+}
+
+.ms-container:after{
+  content: "."; display: block; height: 0; line-height: 0; font-size: 0; clear: both; min-height: 0; visibility: hidden;
+}
+
+.ms-container .ms-selectable, .ms-container .ms-selection{
+
+  background: #fff;
+  color: #555555;
+  float: left;
+}
+
+.ms-container .ms-list{
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
+  -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
+  -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
+  -o-transition: border linear 0.2s, box-shadow linear 0.2s;
+  transition: border linear 0.2s, box-shadow linear 0.2s;
+    border: 1px solid #cccccc;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
+}
+
+
+.ms-selected{
+  display:none;
+}
+.ms-container .ms-selectable{
+  margin-right: 40px;
+}
+
+.ms-container .ms-list.ms-focus{
+  border-color: rgba(82, 168, 236, 0.8);
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
+  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
+  outline: 0;
+  outline: thin dotted \9;
+}
+
+.ms-container ul{
+  margin: 0;
+  list-style-type: none;
+}
+
+.ms-container ul.ms-list{
+  width: 160px;
+  height: 200px;
+  padding: 0px 0px;
+  overflow-y: auto;
+}
+
+.ms-container .ms-selectable li.ms-elem-selectable,
+.ms-container .ms-selection li.ms-elem-selected{
+  border-bottom: 1px #eee solid;
+  padding: 2px 10px;
+  color: #555;
+  font-size: 14px;
+}
+
+.ms-container .ms-selectable li.disabled,
+.ms-container .ms-selection li.disabled{
+  background-color: #eee;
+  color: #aaa;
+}
+
+.ms-container .ms-optgroup-label{
+  padding: 5px 0px 0px 5px;
+  cursor: pointer;
+  color: #999;
+}
+
+.ms-container li.ms-elem-selectable:not(.disabled).ms-hover,
+.ms-container .ms-selection li:not(.disabled).ms-hover{
+  cursor: pointer;
+  color: #ffffff;
+  text-decoration: none;
+  background-color: #0088cc;
+}

metadata

@@ -0,0 +1,104 @@
+--- !ruby/object:Gem::Specification
+name: multi-select-rails
+version: !ruby/object:Gem::Version
+  version: 0.8.0.1
+  prerelease: 
+platform: ruby
+authors:
+- Per Andersson
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2012-11-23 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: railties
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '3.0'
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '1.0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '1.0'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+description: Multiselect jQuery plugin for Rails asset pipeline
+email:
+- klenis@klenis.org
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- README.md
+- lib/multi-select-rails.rb
+- lib/multi-select-rails/engine.rb
+- lib/multi-select-rails/railtie.rb
+- lib/multi-select-rails/version.rb
+- multi-select-rails.gemspec
+- vendor/assets/images/switch.png
+- vendor/assets/javascripts/multi-select.js
+- vendor/assets/stylesheets/multi-select.scss
+homepage: https://github.com/klenis/multi-select-rails
+licenses: []
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.8.24
+signing_key: 
+specification_version: 3
+summary: Multiselect jQuery plugin for Rails asset pipeline
+test_files: []