diff --git a/README.md b/README.md index 3bde7e8d..f9bf60c8 100644 --- a/README.md +++ b/README.md @@ -100,6 +100,17 @@ Options: - **:confirm**: If set to true displays a confirmation message when abandoning changes (pressing the escape key). - **:skip_blur**: If set to true, blurring the input will not cause changes to be abandoned in textareas. +JS Options: + +You can overwrite BestInPlaceEditor default settings like this: + + $(document).ready(function() { + /* Activating Best In Place */ + jQuery(".best_in_place").best_in_place({ + eventType: 'dblclick' + }); + }); + HTML Options: If you provide an option that is not explicitly a best_in_place option it will be passed through when creating the best_in_place span. diff --git a/lib/assets/javascripts/best_in_place.js b/lib/assets/javascripts/best_in_place.js index 3be33774..77aaa4dc 100644 --- a/lib/assets/javascripts/best_in_place.js +++ b/lib/assets/javascripts/best_in_place.js @@ -27,7 +27,7 @@ function BestInPlaceEditor(e) { this.initOptions(); this.bindForm(); this.initPlaceHolder(); - jQuery(this.activator).bind('click', {editor: this}, this.clickHandler); + jQuery(this.activator).bind(BestInPlaceEditor.defaults.eventType, {editor: this}, this.clickHandler); } BestInPlaceEditor.prototype = { @@ -66,7 +66,7 @@ BestInPlaceEditor.prototype = { this.oldValue = this.isPlaceHolder() ? "" : this.element.html(); this.display_value = to_display; - jQuery(this.activator).unbind("click", this.clickHandler); + jQuery(this.activator).unbind(BestInPlaceEditor.defaults.eventType, this.clickHandler); this.activateForm(); this.element.trigger(jQuery.Event("best_in_place:activate")); }, @@ -74,7 +74,7 @@ BestInPlaceEditor.prototype = { abort: function () { 'use strict'; this.activateText(this.oldValue); - jQuery(this.activator).bind('click', {editor: this}, this.clickHandler); + jQuery(this.activator).bind(BestInPlaceEditor.defaults.eventType, {editor: this}, this.clickHandler); this.element.trigger(jQuery.Event("best_in_place:abort")); this.element.trigger(jQuery.Event("best_in_place:deactivate")); }, @@ -293,7 +293,7 @@ BestInPlaceEditor.prototype = { this.element.trigger(jQuery.Event("ajax:success"), [data, status, xhr]); // Binding back after being clicked - jQuery(this.activator).bind('click', {editor: this}, this.clickHandler); + jQuery(this.activator).bind(BestInPlaceEditor.defaults.eventType, {editor: this}, this.clickHandler); this.element.trigger(jQuery.Event("best_in_place:deactivate")); if (this.collectionValue !== null && this.formType === "select") { @@ -310,7 +310,7 @@ BestInPlaceEditor.prototype = { this.element.trigger(jQuery.Event("ajax:error"), request, error); // Binding back after being clicked - jQuery(this.activator).bind('click', {editor: this}, this.clickHandler); + jQuery(this.activator).bind(BestInPlaceEditor.defaults.eventType, {editor: this}, this.clickHandler); this.element.trigger(jQuery.Event("best_in_place:deactivate")); }, @@ -470,24 +470,32 @@ BestInPlaceEditor.forms = { select_elt.append(option_elt); }); output.append(select_elt); + this.okButton = false; + + this.placeButtons(output, this); + this.element.html(output); this.setHtmlAttributes(); this.element.find("select").bind('change', {editor: this}, BestInPlaceEditor.forms.select.blurHandler); - this.element.find("select").bind('blur', {editor: this}, BestInPlaceEditor.forms.select.blurHandler); +// this.element.find("select").bind('blur', {editor: this}, BestInPlaceEditor.forms.select.blurHandler); this.element.find("select").bind('keyup', {editor: this}, BestInPlaceEditor.forms.select.keyupHandler); this.element.find("select")[0].focus(); + if (this.cancelButton) { + this.element.find("input[type='button']").bind('click', {editor: this}, BestInPlaceEditor.forms.select.justAbort); + } + // automatically click on the select so you // don't have to click twice - try { - var e = document.createEvent("MouseEvents"); - e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); - this.element.find("select")[0].dispatchEvent(e); - } - catch(e) { - // browser doesn't support this, e.g. IE8 - } +// try { +// var e = document.createEvent("MouseEvents"); +// e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); +// this.element.find("select")[0].dispatchEvent(e); +// } +// catch(e) { +// // browser doesn't support this, e.g. IE8 +// } }, getValue: function () { @@ -500,6 +508,10 @@ BestInPlaceEditor.forms = { event.data.editor.update(); }, + justAbort: function(event){ + event.data.editor.abort(); + }, + keyupHandler: function (event) { 'use strict'; if (event.keyCode === 27) { @@ -621,6 +633,7 @@ BestInPlaceEditor.forms = { BestInPlaceEditor.defaults = { locales: {}, + eventType: 'click', ajaxMethod: "put", //TODO Change to patch when support to 3.2 is dropped ajaxDataType: 'text', okButtonClass: '', @@ -635,8 +648,11 @@ BestInPlaceEditor.defaults.locales[''] = { placeHolder: '-' }; -jQuery.fn.best_in_place = function () { +jQuery.fn.best_in_place = function (options) { 'use strict'; + + $.extend(BestInPlaceEditor.defaults, options) + function setBestInPlace(element) { if (!element.data('bestInPlaceEditor')) { element.data('bestInPlaceEditor', new BestInPlaceEditor(element)); @@ -644,10 +660,10 @@ jQuery.fn.best_in_place = function () { } } - jQuery(this.context).delegate(this.selector, 'click', function () { + jQuery(this.context).delegate(this.selector, BestInPlaceEditor.defaults.eventType, function () { var el = jQuery(this); if (setBestInPlace(el)) { - el.click(); + el.trigger(BestInPlaceEditor.defaults.eventType); } }); diff --git a/lib/best_in_place/test_helpers.rb b/lib/best_in_place/test_helpers.rb index 68f47b3b..e332acaa 100644 --- a/lib/best_in_place/test_helpers.rb +++ b/lib/best_in_place/test_helpers.rb @@ -12,9 +12,9 @@ def bip_area(model, attr, new_value) wait_for_ajax end - def bip_text(model, attr, new_value) + def bip_text(model, attr, new_value, event_type = 'click') id = BestInPlace::Utils.build_best_in_place_id model, attr - find("##{id}").click + find("##{id}").trigger(event_type) execute_script <<-JS $("##{id} input[name='#{attr}']").val('#{escape_javascript new_value.to_s}'); $("##{id} form").submit(); diff --git a/spec/integration/js_spec.rb b/spec/integration/js_spec.rb index 32ea0837..4ab69871 100644 --- a/spec/integration/js_spec.rb +++ b/spec/integration/js_spec.rb @@ -155,6 +155,19 @@ expect(find('#email')).to have_content('new@email.com') end + it "should be able to use bip_text with double click event type to update a text field" do + @user.save! + visit event_type_user_path(@user) + expect(find('#email')).to have_content('lucianapoli@gmail.com') + + bip_text @user, :email, "new@email.com", 'dblclick' + + expect(find('#email')).to have_content('new@email.com') + + visit user_path(@user) + expect(find('#email')).to have_content('new@email.com') + end + it "should be able to update a field two consecutive times" do @user.save! visit user_path(@user) diff --git a/spec/internal/app/assets/javascripts/application.js b/spec/internal/app/assets/javascripts/application.js index 45cc4aab..dc602041 100644 --- a/spec/internal/app/assets/javascripts/application.js +++ b/spec/internal/app/assets/javascripts/application.js @@ -6,12 +6,6 @@ //= require best_in_place.purr //= require_self -$(document).ready(function() { - /* Activating Best In Place */ - jQuery(".best_in_place").best_in_place(); -}); - - /* Inicialització en català per a l'extenció 'calendar' per jQuery. */ /* Writers: (joan.leon@gmail.com). */ jQuery(function($){ diff --git a/spec/internal/app/controllers/users_controller.rb b/spec/internal/app/controllers/users_controller.rb index 29d30881..e58a6148 100644 --- a/spec/internal/app/controllers/users_controller.rb +++ b/spec/internal/app/controllers/users_controller.rb @@ -27,6 +27,14 @@ def email_field render :action => :email_field, :layout => false end + def event_type + @user = User.find(params[:id]) + @event_type = 'dblclick' + @countries = COUNTRIES_HASH + + render :show + end + def show_ajax @user = User.find(params[:id]) @countries = COUNTRIES_HASH diff --git a/spec/internal/app/views/layouts/application.html.erb b/spec/internal/app/views/layouts/application.html.erb index 87b58033..01dbacfd 100644 --- a/spec/internal/app/views/layouts/application.html.erb +++ b/spec/internal/app/views/layouts/application.html.erb @@ -5,6 +5,14 @@ <%= stylesheet_link_tag "scaffold", "style", "jquery-ui-1.8.16.custom" %> <%= javascript_include_tag "application" %> <%= csrf_meta_tag %> + diff --git a/spec/internal/config/routes.rb b/spec/internal/config/routes.rb index 1f419113..15e62460 100644 --- a/spec/internal/config/routes.rb +++ b/spec/internal/config/routes.rb @@ -4,6 +4,7 @@ get :double_init get :show_ajax get :email_field + get :event_type end end