in_place_edit_with_datepicker 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 71091b6f9913d5cef546bfbc8fc9a052b2593d08
+  data.tar.gz: c33ba645faa7b55b314a7bcd63a70bcdd8039988
+SHA512:
+  metadata.gz: a6a45e8ce37580aa70aa5ba05a39636eb753159731c8a025bfa8c3b9820734519fed9a4943c74656554e6956d0bb4344fa81a79b356aa282d4babbb6faa7815e
+  data.tar.gz: 0116203acfdbb1255a068888063963866e8984acc1b3659072c68e3dc52f2965967103691a2905d0492a713bf09f11f8e0575df21f762888dd47f788e2ed8802

data/.gitignore

@@ -0,0 +1,14 @@
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/
+*.bundle
+*.so
+*.o
+*.a
+mkmf.log

data/Gemfile

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

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2015 Aastha Kesarwani-TCS
+
+MIT License
+
+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

@@ -0,0 +1,31 @@
+# InPlaceEditWithDatepicker
+
+TODO: Write a gem description
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'in_place_edit_with_datepicker'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install in_place_edit_with_datepicker
+
+## Usage
+
+TODO: Write usage instructions here
+
+## Contributing
+
+1. Fork it ( https://github.com/[my-github-username]/in_place_edit_with_datepicker/fork )
+2. Create your feature branch (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Add some feature'`)
+4. Push to the branch (`git push origin my-new-feature`)
+5. Create a new Pull Request

data/Rakefile

@@ -0,0 +1,2 @@
+require "bundler/gem_tasks"
+

data/in_place_edit_with_datepicker.gemspec

@@ -0,0 +1,24 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'in_place_edit_with_datepicker/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "in_place_edit_with_datepicker"
+  spec.version       = InPlaceEditWithDatepicker::VERSION
+  spec.authors       = ["Aastha Kesarwani","Ekta Verma"]
+  spec.email         = ["aastha.baloda@gmail.com","eku4evr@gmail.com"]
+  spec.summary       = %q{"This gem extends best_in_place gem to include a datepicker"}
+  spec.description   = %q{"It uses javascript to invoke jquery ui datepicker and timepicker to inline edit datetime fields"}
+  spec.homepage      = ""
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files -z`.split("\x0")
+  spec.executables   = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
+  spec.test_files    = spec.files.grep(%r{^(test|spec|features)/})
+  spec.require_paths = ["lib"]
+
+  spec.add_development_dependency "bundler", "~> 1.7"
+  spec.add_development_dependency "rake", "~> 10.0"
+  spec.add_development_dependency "best_in_place", "~> 3.0.1"
+end

data/lib/assets/javascripts/best_in_place.jquery-ui.js

@@ -0,0 +1,58 @@
+/*
+ * BestInPlace 3.0.0.alpha (2014)
+ *
+ * Depends:
+ *	best_in_place.js
+ *	jquery.ui.datepicker.js
+ */
+/*global BestInPlaceEditor */
+BestInPlaceEditor.forms.date = {
+    activateForm: function () {
+        'use strict';
+        var that = this,
+            output = jQuery(document.createElement('form'))
+                .addClass('form_in_place')
+                .attr('action', 'javascript:void(0);')
+                .attr('style', 'display:inline'),
+            input_elt = jQuery(document.createElement('input'))
+                .attr('type', 'text')
+                .attr('name', this.attributeName)
+                .attr('value', this.sanitizeValue(this.display_value));
+                
+        if (this.inner_class !== null) {
+            input_elt.addClass(this.inner_class);
+        }
+        output.append(input_elt);
+
+        this.element.html(output);
+        this.setHtmlAttributes();
+        this.element.find('input')[0].select();
+        this.element.find("form").bind('submit', {editor: this}, BestInPlaceEditor.forms.input.submitHandler);
+        this.element.find("input").bind('keyup', {editor: this}, BestInPlaceEditor.forms.input.keyupHandler);
+
+        this.element.find('input')
+            .datepicker({
+                onClose: function () {
+                    that.update();
+                }
+            })
+            .datepicker('show');
+    },
+
+    getValue: function () {
+        'use strict';
+        return this.sanitizeValue(this.element.find("input").val());
+    },
+
+    submitHandler: function (event) {
+        'use strict';
+        event.data.editor.update();
+    },
+
+    keyupHandler: function (event) {
+        'use strict';
+        if (event.keyCode === 27) {
+            event.data.editor.abort();
+        }
+    }
+}

data/lib/assets/javascripts/best_in_place.js

@@ -0,0 +1,663 @@
+/*
+ * BestInPlace (for jQuery)
+ * version: 3.0.0.alpha (2014)
+ *
+ * By Bernat Farrero based on the work of Jan Varwig.
+ * Examples at http://bernatfarrero.com
+ *
+ * Licensed under the MIT:
+ * http://www.opensource.org/licenses/mit-license.php
+ *
+ * @requires jQuery
+ *
+ * Usage:
+ *
+ * Attention.
+ * The format of the JSON object given to the select inputs is the following:
+ * [["key", "value"],["key", "value"]]
+ * The format of the JSON object given to the checkbox inputs is the following:
+ * ["falseValue", "trueValue"]
+
+ */
+//= require jquery.autosize
+
+function BestInPlaceEditor(e) {
+    'use strict';
+    this.element = e;
+    this.initOptions();
+    this.bindForm();
+    this.initPlaceHolder();
+    jQuery(this.activator).bind('click', {editor: this}, this.clickHandler);
+}
+
+BestInPlaceEditor.prototype = {
+    // Public Interface Functions //////////////////////////////////////////////
+
+    activate: function () {
+        'use strict';
+        var to_display;
+        if (this.isPlaceHolder()) {
+            to_display = "";
+        } else if (this.original_content) {
+            to_display = this.original_content;
+        } else {
+            switch (this.formType) {
+                case 'input':
+                case 'textarea':
+                    if (this.display_raw) {
+                        to_display = this.element.html().replace(/&/gi, '&');
+                    }
+                    else {
+                        var value = this.element.data('bipValue');
+                        if (typeof value === 'undefined') {
+                            to_display = '';
+                        } else if (typeof value === 'string') {
+                            to_display = this.element.data('bipValue').replace(/&/gi, '&');
+                        } else {
+                            to_display = this.element.data('bipValue');
+                        }
+                    }
+                    break;
+                case 'select':
+                    to_display = this.element.html();
+
+            }
+        }
+
+        this.oldValue = this.isPlaceHolder() ? "" : this.element.html();
+        this.display_value = to_display;
+        jQuery(this.activator).unbind("click", this.clickHandler);
+        this.activateForm();
+        this.element.trigger(jQuery.Event("best_in_place:activate"));
+    },
+
+    abort: function () {
+        'use strict';
+        this.activateText(this.oldValue);
+        jQuery(this.activator).bind('click', {editor: this}, this.clickHandler);
+        this.element.trigger(jQuery.Event("best_in_place:abort"));
+        this.element.trigger(jQuery.Event("best_in_place:deactivate"));
+    },
+
+    abortIfConfirm: function () {
+        'use strict';
+        if (!this.useConfirm) {
+            this.abort();
+            return;
+        }
+
+        if (confirm(BestInPlaceEditor.defaults.locales[''].confirmMessage)) {
+            this.abort();
+        }
+    },
+
+    update: function () {
+        'use strict';
+        var editor = this,
+            value = this.getValue();
+
+        // Avoid request if no change is made
+        if (this.formType in {"input": 1, "textarea": 1} && value === this.oldValue) {
+            this.abort();
+            return true;
+        }
+
+        editor.ajax({
+            "type": BestInPlaceEditor.defaults.ajaxMethod,
+            "dataType": BestInPlaceEditor.defaults.ajaxDataType,
+            "data": editor.requestData(),
+            "success": function (data, status, xhr) {
+                editor.loadSuccessCallback(data, status, xhr);
+            },
+            "error": function (request, error) {
+                editor.loadErrorCallback(request, error);
+            }
+        });
+
+
+        switch (this.formType) {
+            case "select":
+                this.previousCollectionValue = value;
+
+                // search for the text for the span
+                $.each(this.values, function(index, arr){ if (String(arr[0]) === String(value)) editor.element.html(arr[1]); });
+                break;
+
+            case "checkbox":
+                $.each(this.values, function(index, arr){ if (String(arr[0]) === String(value)) editor.element.html(arr[1]); });
+                break;
+
+            default:
+                if (value !== "") {
+                    if (this.display_raw) {
+                        editor.element.html(value);
+                    } else {
+                        editor.element.text(value);
+                    }
+                } else {
+                    editor.element.html(this.placeHolder);
+                }
+        }
+
+        editor.element.data('bipValue', value);
+        editor.element.attr('data-bip-value', value);
+
+        editor.element.trigger(jQuery.Event("best_in_place:update"));
+
+
+    },
+
+    activateForm: function () {
+        'use strict';
+        alert(BestInPlaceEditor.defaults.locales[''].uninitializedForm);
+    },
+
+    activateText: function (value) {
+        'use strict';
+        this.element.html(value);
+        if (this.isPlaceHolder()) {
+            this.element.html(this.placeHolder);
+        }
+    },
+
+    // Helper Functions ////////////////////////////////////////////////////////
+
+    initOptions: function () {
+        // Try parent supplied info
+        'use strict';
+        var self = this;
+        self.element.parents().each(function () {
+            var $parent = jQuery(this);
+            self.url = self.url || $parent.data("bipUrl");
+            self.activator = self.activator || $parent.data("bipActivator");
+            self.okButton = self.okButton || $parent.data("bipOkButton");
+            self.okButtonClass = self.okButtonClass || $parent.data("bipOkButtonClass");
+            self.cancelButton = self.cancelButton || $parent.data("bipCancelButton");
+            self.cancelButtonClass = self.cancelButtonClass || $parent.data("bipCancelButtonClass");
+            self.skipBlur = self.skipBlur || $parent.data("bipSkipBlur");
+        });
+
+        // Load own attributes (overrides all others)
+        self.url = self.element.data("bipUrl") || self.url || document.location.pathname;
+        self.collection = self.element.data("bipCollection") || self.collection;
+        self.formType = self.element.data("bipType") || "input";
+        self.objectName = self.element.data("bipObject") || self.objectName;
+        self.attributeName = self.element.data("bipAttribute") || self.attributeName;
+        self.activator = self.element.data("bipActivator") || self.element;
+        self.okButton = self.element.data("bipOkButton") || self.okButton;
+        self.okButtonClass = self.element.data("bipOkButtonClass") || self.okButtonClass || BestInPlaceEditor.defaults.okButtonClass;
+        self.cancelButton = self.element.data("bipCancelButton") || self.cancelButton;
+        self.cancelButtonClass = self.element.data("bipCancelButtonClass") || self.cancelButtonClass || BestInPlaceEditor.defaults.cancelButtonClass;
+        self.skipBlur = self.element.data("bipSkipBlur") || self.skipBlur || BestInPlaceEditor.defaults.skipBlur;
+
+        // Fix for default values of 0
+        if (self.element.data("bipPlaceholder") == null) {
+          self.placeHolder = BestInPlaceEditor.defaults.locales[''].placeHolder;
+        } else {
+          self.placeHolder = self.element.data("bipPlaceholder");
+        }
+
+        self.inner_class = self.element.data("bipInnerClass");
+        self.html_attrs = self.element.data("bipHtmlAttrs");
+        self.original_content = self.element.data("bipOriginalContent") || self.original_content;
+
+        // if set the input won't be satinized
+        self.display_raw = self.element.data("bip-raw");
+
+        self.useConfirm = self.element.data("bip-confirm");
+
+        if (self.formType === "select" || self.formType === "checkbox") {
+            self.values = self.collection;
+            self.collectionValue = self.element.data("bipValue") || self.collectionValue;
+        }
+    },
+
+    bindForm: function () {
+        'use strict';
+        this.activateForm = BestInPlaceEditor.forms[this.formType].activateForm;
+        this.getValue = BestInPlaceEditor.forms[this.formType].getValue;
+    },
+
+
+    initPlaceHolder: function () {
+        'use strict';
+        // TODO add placeholder for select and checkbox
+        if (this.element.html() === "") {
+            this.element.html(this.placeHolder);
+        }
+    },
+
+    isPlaceHolder: function () {
+        'use strict';
+        // TODO: It only work when form is deactivated.
+        // Condition will fail when form is activated
+        return this.element.html() === "" || this.element.html() === this.placeHolder;
+    },
+
+    getValue: function () {
+        'use strict';
+        alert(BestInPlaceEditor.defaults.locales[''].uninitializedForm);
+    },
+
+    // Trim and Strips HTML from text
+    sanitizeValue: function (s) {
+        'use strict';
+        return jQuery.trim(s);
+    },
+
+    /* Generate the data sent in the POST request */
+    requestData: function () {
+        'use strict';
+        // To prevent xss attacks, a csrf token must be defined as a meta attribute
+        var csrf_token = jQuery('meta[name=csrf-token]').attr('content'),
+            csrf_param = jQuery('meta[name=csrf-param]').attr('content');
+
+        var data = "_method=" + BestInPlaceEditor.defaults.ajaxMethod;
+        data += "&" + this.objectName + '[' + this.attributeName + ']=' + encodeURIComponent(this.getValue());
+
+        if (csrf_param !== undefined && csrf_token !== undefined) {
+            data += "&" + csrf_param + "=" + encodeURIComponent(csrf_token);
+        }
+        return data;
+    },
+
+    ajax: function (options) {
+        'use strict';
+        options.url = this.url;
+        options.beforeSend = function (xhr) {
+            xhr.setRequestHeader("Accept", "application/json");
+        };
+        return jQuery.ajax(options);
+    },
+
+    // Handlers ////////////////////////////////////////////////////////////////
+
+    loadSuccessCallback: function (data, status, xhr) {
+        'use strict';
+        data = jQuery.trim(data);
+        //Update original content with current text.
+        if (this.display_raw) {
+          this.original_content = this.element.html();
+        } else {
+          this.original_content = this.element.text();
+        }
+
+        if (data && data !== "") {
+            var response = jQuery.parseJSON(data);
+            if (response !== null && response.hasOwnProperty("display_as")) {
+                this.element.data('bip-original-content', this.element.text());
+                this.element.html(response.display_as);
+            }
+        }
+
+        this.element.trigger(jQuery.Event("best_in_place:success"), [data, status, xhr]);
+        this.element.trigger(jQuery.Event("ajax:success"), [data, status, xhr]);
+
+        // Binding back after being clicked
+        jQuery(this.activator).bind('click', {editor: this}, this.clickHandler);
+        this.element.trigger(jQuery.Event("best_in_place:deactivate"));
+
+        if (this.collectionValue !== null && this.formType === "select") {
+            this.collectionValue = this.previousCollectionValue;
+            this.previousCollectionValue = null;
+        }
+    },
+
+    loadErrorCallback: function (request, error) {
+        'use strict';
+        this.activateText(this.oldValue);
+
+        this.element.trigger(jQuery.Event("best_in_place:error"), [request, error]);
+        this.element.trigger(jQuery.Event("ajax:error"), request, error);
+
+        // Binding back after being clicked
+        jQuery(this.activator).bind('click', {editor: this}, this.clickHandler);
+        this.element.trigger(jQuery.Event("best_in_place:deactivate"));
+    },
+
+    clickHandler: function (event) {
+        'use strict';
+        event.preventDefault();
+        event.data.editor.activate();
+    },
+
+    setHtmlAttributes: function () {
+        'use strict';
+        var formField = this.element.find(this.formType);
+
+        if (this.html_attrs) {
+            var attrs = this.html_attrs;
+            $.each(attrs, function (key, val) {
+                formField.attr(key, val);
+            });
+        }
+    },
+
+    placeButtons: function (output, field) {
+        'use strict';
+        if (field.okButton) {
+            output.append(
+                jQuery(document.createElement('input'))
+                    .attr('type', 'submit')
+                    .attr('class', field.okButtonClass)
+                    .attr('value', field.okButton)
+            );
+        }
+        if (field.cancelButton) {
+            output.append(
+                jQuery(document.createElement('input'))
+                    .attr('type', 'button')
+                    .attr('class', field.cancelButtonClass)
+                    .attr('value', field.cancelButton)
+            );
+        }
+    }
+};
+
+
+// Button cases:
+// If no buttons, then blur saves, ESC cancels
+// If just Cancel button, then blur saves, ESC or clicking Cancel cancels (careful of blur event!)
+// If just OK button, then clicking OK saves (careful of blur event!), ESC or blur cancels
+// If both buttons, then clicking OK saves, ESC or clicking Cancel or blur cancels
+BestInPlaceEditor.forms = {
+    "input": {
+        activateForm: function () {
+            'use strict';
+            var output = jQuery(document.createElement('form'))
+                .addClass('form_in_place')
+                .attr('action', 'javascript:void(0);')
+                .attr('style', 'display:inline');
+            var input_elt = jQuery(document.createElement('input'))
+                .attr('type', 'text')
+                .attr('name', this.attributeName)
+                .val(this.display_value);
+
+            // Add class to form input
+            if (this.inner_class) {
+                input_elt.addClass(this.inner_class);
+            }
+
+            output.append(input_elt);
+            this.placeButtons(output, this);
+
+            this.element.html(output);
+            this.setHtmlAttributes();
+
+            this.element.find("input[type='text']")[0].select();
+            this.element.find("form").bind('submit', {editor: this}, BestInPlaceEditor.forms.input.submitHandler);
+            if (this.cancelButton) {
+                this.element.find("input[type='button']").bind('click', {editor: this}, BestInPlaceEditor.forms.input.cancelButtonHandler);
+            }
+            if (!this.okButton) {
+                this.element.find("input[type='text']").bind('blur', {editor: this}, BestInPlaceEditor.forms.input.inputBlurHandler);
+            }
+            this.element.find("input[type='text']").bind('keyup', {editor: this}, BestInPlaceEditor.forms.input.keyupHandler);
+            this.blurTimer = null;
+            this.userClicked = false;
+        },
+
+        getValue: function () {
+            'use strict';
+            return this.sanitizeValue(this.element.find("input").val());
+        },
+
+        // When buttons are present, use a timer on the blur event to give precedence to clicks
+        inputBlurHandler: function (event) {
+            'use strict';
+            if (event.data.editor.okButton) {
+                event.data.editor.blurTimer = setTimeout(function () {
+                    if (!event.data.editor.userClicked) {
+                        event.data.editor.abort();
+                    }
+                }, 500);
+            } else {
+                if (event.data.editor.cancelButton) {
+                    event.data.editor.blurTimer = setTimeout(function () {
+                        if (!event.data.editor.userClicked) {
+                            event.data.editor.update();
+                        }
+                    }, 500);
+                } else {
+                    event.data.editor.update();
+                }
+            }
+        },
+
+        submitHandler: function (event) {
+            'use strict';
+            event.data.editor.userClicked = true;
+            clearTimeout(event.data.editor.blurTimer);
+            event.data.editor.update();
+        },
+
+        cancelButtonHandler: function (event) {
+            'use strict';
+            event.data.editor.userClicked = true;
+            clearTimeout(event.data.editor.blurTimer);
+            event.data.editor.abort();
+            event.stopPropagation(); // Without this, click isn't handled
+        },
+
+        keyupHandler: function (event) {
+            'use strict';
+            if (event.keyCode === 27) {
+                event.data.editor.abort();
+                event.stopImmediatePropagation();
+            }
+        }
+    },
+
+    "select": {
+        activateForm: function () {
+            'use strict';
+            var output = jQuery(document.createElement('form'))
+                    .attr('action', 'javascript:void(0)')
+                    .attr('style', 'display:inline'),
+                selected = '',
+                select_elt = jQuery(document.createElement('select'))
+                    .attr('class', this.inner_class !== null ? this.inner_class : ''),
+                currentCollectionValue = this.collectionValue,
+                key, value,
+                a = this.values;
+
+            $.each(a, function(index, arr){
+                key = arr[0];
+                value = arr[1];
+                var option_elt = jQuery(document.createElement('option'))
+                    .val(key)
+                    .html(value);
+                if (String(key) === String(currentCollectionValue)) option_elt.attr('selected', 'selected');
+                select_elt.append(option_elt);
+            });
+            output.append(select_elt);
+
+            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('keyup', {editor: this}, BestInPlaceEditor.forms.select.keyupHandler);
+            this.element.find("select")[0].focus();
+
+            // 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
+            }
+        },
+
+        getValue: function () {
+            'use strict';
+            return this.sanitizeValue(this.element.find("select").val());
+        },
+
+        blurHandler: function (event) {
+            'use strict';
+            event.data.editor.update();
+        },
+
+        keyupHandler: function (event) {
+            'use strict';
+            if (event.keyCode === 27) {
+                event.data.editor.abort();
+            }
+        }
+    },
+
+    "checkbox": {
+        activateForm: function () {
+            'use strict';
+            this.collectionValue = !this.getValue();
+            this.setHtmlAttributes();
+            this.update();
+        },
+
+        getValue: function () {
+            'use strict';
+            return this.collectionValue;
+        }
+    },
+
+    "textarea": {
+        activateForm: function () {
+            'use strict';
+            // grab width and height of text
+            var width = this.element.css('width');
+            var height = this.element.css('height');
+
+            // construct form
+            var output = jQuery(document.createElement('form'))
+                .addClass('form_in_place')
+                .attr('action', 'javascript:void(0);')
+                .attr('style', 'display:inline');
+            var textarea_elt = jQuery(document.createElement('textarea'))
+                .attr('name', this.attributeName)
+                .val(this.sanitizeValue(this.display_value));
+
+            if (this.inner_class !== null) {
+                textarea_elt.addClass(this.inner_class);
+            }
+
+            output.append(textarea_elt);
+
+            this.placeButtons(output, this);
+
+            this.element.html(output);
+            this.setHtmlAttributes();
+
+            // set width and height of textarea
+            jQuery(this.element.find("textarea")[0]).css({'min-width': width, 'min-height': height});
+            jQuery(this.element.find("textarea")[0]).autosize();
+
+            this.element.find("textarea")[0].focus();
+            this.element.find("form").bind('submit', {editor: this}, BestInPlaceEditor.forms.textarea.submitHandler);
+
+            if (this.cancelButton) {
+                this.element.find("input[type='button']").bind('click', {editor: this}, BestInPlaceEditor.forms.textarea.cancelButtonHandler);
+            }
+
+            if (!this.skipBlur) {
+                this.element.find("textarea").bind('blur', {editor: this}, BestInPlaceEditor.forms.textarea.blurHandler);
+            }
+            this.element.find("textarea").bind('keyup', {editor: this}, BestInPlaceEditor.forms.textarea.keyupHandler);
+            this.blurTimer = null;
+            this.userClicked = false;
+        },
+
+        getValue: function () {
+            'use strict';
+            return this.sanitizeValue(this.element.find("textarea").val());
+        },
+
+        // When buttons are present, use a timer on the blur event to give precedence to clicks
+        blurHandler: function (event) {
+            'use strict';
+            if (event.data.editor.okButton) {
+                event.data.editor.blurTimer = setTimeout(function () {
+                    if (!event.data.editor.userClicked) {
+                        event.data.editor.abortIfConfirm();
+                    }
+                }, 500);
+            } else {
+                if (event.data.editor.cancelButton) {
+                    event.data.editor.blurTimer = setTimeout(function () {
+                        if (!event.data.editor.userClicked) {
+                            event.data.editor.update();
+                        }
+                    }, 500);
+                } else {
+                    event.data.editor.update();
+                }
+            }
+        },
+
+        submitHandler: function (event) {
+            'use strict';
+            event.data.editor.userClicked = true;
+            clearTimeout(event.data.editor.blurTimer);
+            event.data.editor.update();
+        },
+
+        cancelButtonHandler: function (event) {
+            'use strict';
+            event.data.editor.userClicked = true;
+            clearTimeout(event.data.editor.blurTimer);
+            event.data.editor.abortIfConfirm();
+            event.stopPropagation(); // Without this, click isn't handled
+        },
+
+        keyupHandler: function (event) {
+            'use strict';
+            if (event.keyCode === 27) {
+                event.data.editor.abortIfConfirm();
+            }
+        }
+    }
+};
+
+BestInPlaceEditor.defaults = {
+    locales: {},
+    ajaxMethod: "put",  //TODO Change to patch when support to 3.2 is dropped
+    ajaxDataType: 'text',
+    okButtonClass: '',
+    cancelButtonClass: '',
+    skipBlur: false
+};
+
+// Default locale
+BestInPlaceEditor.defaults.locales[''] = {
+    confirmMessage: "Are you sure you want to discard your changes?",
+    uninitializedForm: "The form was not properly initialized. getValue is unbound",
+    placeHolder: '-'
+};
+
+jQuery.fn.best_in_place = function () {
+    'use strict';
+    function setBestInPlace(element) {
+        if (!element.data('bestInPlaceEditor')) {
+            element.data('bestInPlaceEditor', new BestInPlaceEditor(element));
+            return true;
+        }
+    }
+
+    jQuery(this.context).delegate(this.selector, 'click', function () {
+        var el = jQuery(this);
+        if (setBestInPlace(el)) {
+            el.click();
+        }
+    });
+
+    this.each(function () {
+        setBestInPlace(jQuery(this));
+    });
+
+    return this;
+};
+
+
+