Ember.js 0.9.6 ContentEditable

by pangratz666

HTML

<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-0.9.5.js"></script>
<script type="text/x-handlebars">  
    {{#view "App.ContentEditable"}}
       {{item.name}}            
    {{/view}}
</script>

JavaScript

App = Ember.Application.create({
    ready: function() {},
    customEvents: {
        blur: 'blur',
        paste: 'paste'
    }
});

App.Item = Ember.Object.extend({});

App.ContentEditable = Ember.View.extend({
    item: App.Item.create({
        name: "Editable content"
    }),
    tagName: "span",
    contenteditable: "true",
    attributeBindings: ["contenteditable"],

    click: function() {
        console.log("click");
    },
    focusIn: function() {
        console.log("focusin");
    },
    focusOut: function() {
        console.log("focusout");
    },
    keyUp: function() {
        console.log("keyup");
    },
    blur: function() {
        console.log("blur");
    },
    paste: function() {
        console.log("paste");
    }
});