tinymce-knockout-binding

A KnockoutJS custom binding that applys a TinyMCE Editor to the bound HTML element

by Michael Papworth

HTML

<script src="http://tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<script src="http://tinymce.cachefly.net/4.0/jquery.tinymce.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
<div>
            <textarea data-bind="wysiwyg: content, wysiwygConfig: { plugins : ['wordcount'] }, wysiwygExtensions: ['wordcount', 'dirty'], wysiwygDirty: isDirty, wysiwygWordCount: wordcount"></textarea>
</div>

<div id="preview" data-bind="html: content"></div>

<div>

      <h3>extension values</h3>
      <p>Words:&nbsp;<span data-bind="text: wordcount"></span></p>
      <p>Dirty?&nbsp;<span data-bind="text: isDirty() ? 'Yes' : 'No'"></span></p>
    
      <h3>update</h3>
      <textarea rows="6" data-bind="value: update"></textarea>
      <button data-bind="click: replace">Replace</button>

</div>

CSS

#preview {
    border: solid 1px #000;
    margin: 0.5em 0;
}

JavaScript

/*tinymce-knockout-binding v1.1.0|(c) 2014 Michael Papworth|https://raw.github.com/michaelpapworth/tinymce-knockout-binding/master/LICENSE*/
!function(a,b){var c={after:["attr","value"],defaults:{},extensions:{},init:function(e,f,g,h,i){if(!b.isWriteableObservable(f()))throw"valueAccessor must be writeable and observable";var j=g.has("wysiwygConfig")?g.get("wysiwygConfig"):null,k=g.has("wysiwygExtensions")?g.get("wysiwygExtensions"):[],l=d(c.defaults,k,j,arguments);return a(e).text(f()()),setTimeout(function(){a(e).tinymce(l)},0),b.utils.domNodeDisposal.addDisposeCallback(e,function(){a(e).tinymce().remove()}),{controlsDescendantBindings:!0}},update:function(b,c,d,e,f){var g=a(b).tinymce(),h=c()();g&&g.getContent()!==h&&(g.setContent(h),g.execCommand("keyup"))}},d=function(d,e,f,g){var h=a.extend(!0,{},d);f&&(b.utils.objectForEach(f,function(a){"[object Array]"===Object.prototype.toString.call(f[a])&&(h[a]||(h[a]=[]),f[a]=b.utils.arrayGetDistinctValues(h[a].concat(f[a])))}),a.extend(!0,h,f)),h.plugins?a.inArray("paste",h.plugins)&&h.plugins.push("paste"):h.plugins=["paste"];var i=function(a){a.on("change keyup nodechange",function(b){g[1]()(a.getContent());for(var d in e)e.hasOwnProperty(d)&&c.extensions[e[d]](a,b,g[2],g[4])})};if("function"==typeof h.setup){var j=h.setup;h.setup=function(a){j(a),i(a)}}else h.setup=i;return h};b.bindingHandlers.wysiwyg=c}(jQuery,ko),function(a){a.extensions.dirty=function(a,b,c,d){if(c.has("wysiwygDirty")){var e=c.get("wysiwygDirty");if(!ko.isWriteableObservable(e))throw"wysiwygDirty must be writeable and observable";e(a.isDirty())}else d.$root.isDirty=a.isDirty()}}(ko.bindingHandlers.wysiwyg),function(a){a.extensions.wordcount=function(a,b,c,d){var e=a.plugins.wordcount;if(e&&c.has("wysiwygWordCount")){var f=c.get("wysiwygWordCount");if(!ko.isWriteableObservable(f))throw"wysiwygWordCount must be writeable and observable";f(e.getCount())}}}(ko.bindingHandlers.wysiwyg);
//# sourceMappingURL=wysiwyg.min.map

(function( $, ko ) {

 ...