Ext.namespace('Ext.ux', 'Ext.ux.plugins');

Ext.ux.plugins.FhlExtImageInserter = function () {

    this.init = function(htmlEditor) {
        this.editor = htmlEditor;
        this.editor.on('render', onRender, this);
    }

    function onRender() {
        var iframe = this.editor.iframe;
        var editor = this.editor;

        this.editor.iframe.onload = function ()
        {
            iframe.contentDocument.body.onpaste = function(event) {

                var items = (event.clipboardData || event.originalEvent.clipboardData).items;

                for (index in items) {
                    var item = items[index];
                    if (item.kind === 'file') {
                    var blob = item.getAsFile();
                    var reader = new FileReader();
                    reader.onload = function(event){
                        console.log('data', event.target.result)
                        editor.relayCmd('insertimage', event.target.result);
                    };

                    reader.readAsDataURL(blob);
                    }
                }
            }
        }

    }
}

htmlEditor = new Ext.Panel({
    title: 'Ext Test Editor',
	layout: 'fit',
    items: [new Ext.form.HtmlEditor({
        title: 'Test Editor',
        enableColors: true,
        enableAlignments: true,
        enableFont: true,
        enableFontSize: true,
        enableFormat: true,
        enableLink: true,
        enableLists: true,
        enableSourceEdit: true,
		plugins: [
            		new Ext.ux.plugins.FhlExtImageInserter()
		]
    })]});

htmlEditor.render(Ext.getBody());