Replace add userby email textinput in admin/roles#show with searchable combobox

Gemfile

@@ -91,6 +91,8 @@ source 'https://rails-assets.org' do
   gem 'rails-assets-bootstrap-markdown'
   gem 'rails-assets-to-markdown'
   gem 'rails-assets-markdown'
+  # for searchable selects
+  gem 'rails-assets-bootstrap-select'
 end
 
 # as date picker

Gemfile.lock

@@ -335,6 +335,8 @@ GEM
       rails-assets-jquery (>= 1.9.1, < 3)
     rails-assets-bootstrap-markdown (2.10.0)
       rails-assets-bootstrap (~> 3)
+    rails-assets-bootstrap-select (1.10.0)
+      rails-assets-jquery (>= 1.8)
     rails-assets-date.format (1.2.3)
     rails-assets-holderjs (2.9.1)
     rails-assets-jquery (2.2.0)
@@ -547,6 +549,7 @@ DEPENDENCIES
   quiet_assets
   rails (~> 4.2)
   rails-assets-bootstrap-markdown!
+  rails-assets-bootstrap-select!
   rails-assets-date.format!
   rails-assets-holderjs!
   rails-assets-jquery-smooth-scroll!

app/assets/javascripts/application.js

@@ -40,6 +40,8 @@
 //= require osem-commercials
 //= require unobtrusive_flash
 //= require unobtrusive_flash_bootstrap
+//= require bootstrap-select
+//= require osem-selectpicker
 
 $(document).ready(function() {
     $('a[disabled=disabled]').click(function(event){

app/assets/javascripts/osem-selectpicker.js

@@ -0,0 +1,3 @@
+$(function () {
+  $('.selectpicker').selectpicker();
+});

app/assets/stylesheets/application.css

@@ -14,4 +14,6 @@
  *= require bootstrap-datetimepicker
  *= require leaflet
  *= require bootstrap3-switch
+ *= require bootstrap-select
+ *= require osem-selectpicker
 */

app/assets/stylesheets/osem-selectpicker.css

@@ -0,0 +1,2 @@
+/* Align  bootstrap-select  with the Add button */
+.add-user-role > .select { display: inline; }

app/views/admin/roles/show.html.haml

@@ -16,8 +16,8 @@
     = semantic_form_for :user, url: toggle_user_admin_conference_role_path(@conference.short_title, @role.name), method: :post do |u|
 
       = u.label 'Add user by email: '
-      .input-group
-        = u.input :email, label: false, placeholder: "User's email"
+      .input-group.add-user-role
+        = u.input :email, label: false, :collection => User.pluck(:email), :input_html => { class: "selectpicker", data: { live_search: "true", size: "10" } ,title: "Select User's email" }
         .input-group-btn
           = u.submit 'Add', id: 'user-add', class: 'btn btn-primary'