Subversion-Projekte lars-tiefland.ci

/**

Bootstrap wysihtml5 editor. Based on [bootstrap-wysihtml5](https://github.com/jhollingworth/bootstrap-wysihtml5).

You should include **manually** distributives of `wysihtml5` and `bootstrap-wysihtml5`:

    <link href="js/inputs-ext/wysihtml5/bootstrap-wysihtml5-0.0.2/bootstrap-wysihtml5-0.0.2.css" rel="stylesheet" type="text/css"></link>

    <script src="js/inputs-ext/wysihtml5/bootstrap-wysihtml5-0.0.2/wysihtml5-0.3.0.min.js"></script>

    <script src="js/inputs-ext/wysihtml5/bootstrap-wysihtml5-0.0.2/bootstrap-wysihtml5-0.0.2.min.js"></script>

And also include `wysihtml5.js` from `inputs-ext` directory of x-editable:

    <script src="js/inputs-ext/wysihtml5/wysihtml5.js"></script>

**Note:** It's better to use fresh bootstrap-wysihtml5 from it's [master branch](https://github.com/jhollingworth/bootstrap-wysihtml5/tree/master/src) as there is update for correct image insertion.

@class wysihtml5

@extends abstractinput

@final

@since 1.4.0

@example

<div id="comments" data-type="wysihtml5" data-pk="1"><h2>awesome</h2> comment!</div>

<script>

$(function(){

    $('#comments').editable({

        url: '/post',

        title: 'Enter comments'

    });

});

</script>

**/

(function ($) {

    "use strict";

    var Wysihtml5 = function (options) {

        this.init('wysihtml5', options, Wysihtml5.defaults);

        //extend wysihtml5 manually as $.extend not recursive

        this.options.wysihtml5 = $.extend({}, Wysihtml5.defaults.wysihtml5, options.wysihtml5);

    };

    $.fn.editableutils.inherit(Wysihtml5, $.fn.editabletypes.abstractinput);

    $.extend(Wysihtml5.prototype, {

        render: function () {

            var deferred = $.Deferred(),

            msieOld;

            //generate unique id as it required for wysihtml5

            this.$input.attr('id', 'textarea_'+(new Date()).getTime());

            this.setClass();

            this.setAttr('placeholder');

            //resolve deffered when widget loaded

            $.extend(this.options.wysihtml5, {

                events: {

                  load: function() {

                      deferred.resolve();

                  }

                }

            });

            this.$input.wysihtml5(this.options.wysihtml5);

            /*

             In IE8 wysihtml5 iframe stays on the same line with buttons toolbar (inside popover).

             The only solution I found is to add <br>. If you fine better way, please send PR.

            */

            msieOld = /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase());

            if(msieOld) {

                this.$input.before('<br><br>');

            }

            return deferred.promise();

        },

        value2html: function(value, element) {

            $(element).html(value);

        },

        html2value: function(html) {

            return html;

        },

        value2input: function(value) {

            this.$input.data("wysihtml5").editor.setValue(value, true);

        },

        activate: function() {

            this.$input.data("wysihtml5").editor.focus();

        }

    });

    Wysihtml5.defaults = $.extend({}, $.fn.editabletypes.abstractinput.defaults, {

        /**

        @property tpl

        @default <textarea></textarea>

        **/

        tpl:'<textarea></textarea>',

        /**

        @property inputclass

        @default editable-wysihtml5

        **/

        inputclass: 'editable-wysihtml5',

        /**

        Placeholder attribute of input. Shown when input is empty.

        @property placeholder

        @type string

        @default null

        **/

        placeholder: null,

        /**

        Wysihtml5 default options.

        See https://github.com/jhollingworth/bootstrap-wysihtml5#options

        @property wysihtml5

        @type object

        @default {stylesheets: false}

        **/

        wysihtml5: {

            stylesheets: false //see https://github.com/jhollingworth/bootstrap-wysihtml5/issues/183

        }

    });

    $.fn.editabletypes.wysihtml5 = Wysihtml5;

}(window.jQuery));