marty 0.5.15 → 0.5.16

data/app/components/marty/script_form.rb~

@@ -1,233 +0,0 @@
-require 'delorean_lang'
-require 'coderay'
-
-class Marty::ScriptForm < Marty::CmFormPanel
-  DASH = 0x2012.chr('utf-8')
-
-  css_configure do |c|
-    c.require :codemirror
-    c.require :delorean
-  end
-
-  js_configure do |c|
-    c.require :"Ext.ux.form.field.CodeMirror"
-    c.require :codemirror
-    c.require File.dirname(__FILE__) +
-      "/script_form/javascripts/mode/delorean/delorean.js"
-
-    c.set_action_modes = <<-JS
-    function(a) {
-       this.actions.apply.setDisabled(!a["save"]);
-       // style input field text based on whether it is editable
-       this.getForm().findField('body').editor.setOption(
-          "readOnly", !a["save"]);
-    }
-    JS
-
-    c.get_script_id = <<-JS
-    function() {
-       return this.getForm().findField('id').getValue();
-    }
-    JS
-
-    c.get_script_body = <<-JS
-    function() {
-       return this.getForm().findField('body').getValue();
-    }
-    JS
-
-    # Sets an editor line class (unset any previous line class).  For
-    # now, only one line is classed at a time.
-    c.set_line_error = <<-JS
-    function(line) {
-       line -= 1;
-       var editor = this.getForm().findField('body').editor;
-       if (editor.oldline) {
-          editor.oldline.className = null;
-       }
-       if (line > -1) {
-          editor.oldline = editor.setLineClass(line, "errorline");
-       }
-       editor.refresh();
-    }
-    JS
-
-    ######################################################################
-
-    c.refresh_parent = <<-JS
-    function(script_name) {
-       this.netzkeGetParentComponent().scriptRefresh(script_name);
-    }
-    JS
-
-    ######################################################################
-
-    c.on_print = <<-JS
-    function() {
-       window.open(
-          "/marty/components/#{self.name}.html?script_id=" + this.getScriptId(),
-          "printing",
-          'width=800,height=700,toolbar=no,location=no,directories=no,'+
-          'status=no,menubar=no,scrollbars=yes,copyhistory=no,resizable=yes');
-    }
-    JS
-  end
-
-  ######################################################################
-
-  endpoint :netzke_load do |params, this|
-
-    return this.netzke_feedback("Permission Denied") unless
-      self.class.has_any_perm?
-
-    script_name = params[:script_name]
-    tag_id = root_sess[:selected_tag_id]
-
-    # logic from basepack's form_panel.service -- need to set @record.
-    @record = script = Marty::Script.find_script(script_name, tag_id)
-
-    title = [script.name, script.find_tag.try(:name)].
-      join(" #{Marty::ScriptForm::DASH} ") if script
-
-    # create an empty record if no script
-    js_data = @record ? js_record_data : {
-      "body" => "",
-      "id"   => -1,
-      "meta" => {},
-    }
-
-    this.set_form_values(js_data)
-    this.set_title title
-    this.set_readonly_mode !can_save?(script)
-
-    modes = {
-      save: can_save?(script),
-    }
-
-    this.set_action_modes(modes)
-  end
-
-  def can_save?(script)
-    script && self.class.has_dev_perm? && Mcfly.is_infinity(script.obsoleted_dt)
-  end
-
-  ######################################################################
-
-  action :apply do |a|
-    a.text     = I18n.t("script_form.save")
-    a.tooltip  = I18n.t("script_form.save")
-    a.icon     = :database_save
-    a.disabled = true
-  end
-
-  endpoint :netzke_submit do |params, this|
-
-    return this.netzke_feedback("Permission Denied") unless
-      self.class.has_any_perm?
-
-    # copied from corresponding method in form_panel.services
-    data = ActiveSupport::JSON.decode(params[:data])
-    data.each_pair do |k,v|
-      data[k] = nil if v.blank? || v == "null"
-    end
-
-    @record = script = Marty::Script.find_by_id(data["id"])
-
-    unless script
-      this.netzke_feedback "no record"
-      return
-    end
-
-    if script.body == data["body"]
-      this.netzke_feedback "no save needed"
-      # clear the error line if any
-      this.set_line_error -1
-      return
-    end
-
-    unless can_save?(script)
-      this.netzke_feedback "Permission denied"
-      return
-    end
-
-    begin
-      dev = Marty::Tag.find_by_name("DEV")
-      Marty::ScriptSet.new(dev).parse_check(script.name, data["body"])
-    rescue Delorean::ParseError => exc
-      this.netzke_feedback exc.message
-      this.apply_form_errors({})
-      this.set_line_error(exc.line)
-      return
-    end
-
-    script.body = data["body"]
-
-    if script.save
-      this.set_form_values(js_record_data)
-      this.netzke_set_result(true)
-      this.refresh_parent(script.name)
-      return
-    end
-
-    data_adapter.errors_array(script).each do |error|
-      flash error: error
-    end
-
-    this.netzke_feedback @flash
-    this.apply_form_errors(build_form_errors(record))
-  end
-
-  ######################################################################
-
-  action :print do |a|
-    a.text    = I18n.t("script_form.print")
-    a.tooltip = I18n.t("script_form.print")
-    a.icon    = :printer
-    a.handler = :on_print
-  end
-
-  ######################################################################
-
-  def configure_bbar(c)
-    c[:bbar] = [
-                :apply,
-                :print,
-               ]
-  end
-
-  ######################################################################
-
-  # used for printing
-  def export_content(format, title, params={})
-    raise "unknown format: #{format}" unless format == "html"
-
-    r = Marty::Script.find_by_id(params[:script_id])
-    res = CodeRay.scan(r.body, :ruby).div(line_numbers: :table)
-
-    [res, "text/html", "inline", "#{title}.html"]
-  end
-
-  def configure(c)
-    super
-
-    c.title = "Script Form"
-    c.model = "Marty::Script"
-    c.items =
-      [
-       {
-	 mode:			"text/x-delorean",
-	 line_numbers:		true,
-	 indent_unit:		4,
-	 tab_mode:		"shift",
-	 match_brackets:	true,
-	 hide_label:		true,
-	 xtype:			:codemirror,
-	 name:			:body,
-	 empty_text:		"No script selected.",
-	 getter:		lambda { |r| r.body },
-       },
-      ]
-  end
-end
-
-ScriptForm = Marty::ScriptForm

data/app/components/marty/script_form/javascripts/Ext.ux.form.field.CodeMirror.js~

@@ -1,909 +0,0 @@
-/*
-
-This is a modified version of the ExtJS Codemirror component from
-http://www.mzsolutions.eu/Extjs-CodeMirror-component.html.  It's been
-modified to remove the toolbar and also it uses delorean mode by
-default.
-
-*/
-
-/**
-* @private
-* @class Ext.ux.layout.component.field.CodeMirror
-* @extends Ext.layout.component.field.Field
-* @author Adrian Teodorescu (ateodorescu@gmail.com)
-* 
-* Layout class for {@link Ext.ux.form.field.CodeMirror} fields. Handles sizing the codemirror field.
-*/
-Ext.define('Ext.ux.layout.component.field.CodeMirror', {
-    extend: 'Ext.layout.component.field.Field',
-    alias: ['layout.codemirror'],
-
-    type: 'codemirror',
-
-    beginLayout: function(ownerContext) {
-        this.callParent(arguments);
-
-        ownerContext.textAreaContext = ownerContext.getEl('textareaEl');
-        ownerContext.editorContext   = ownerContext.getEl('editorEl');
-    },
-
-    renderItems: Ext.emptyFn,
-
-    getRenderTarget: function() {
-        return this.owner.bodyEl;
-    },
-
-    publishInnerHeight: function (ownerContext, height) {
-        var me = this,
-            innerHeight = height - me.measureLabelErrorHeight(ownerContext) -
-                          ownerContext.bodyCellContext.getPaddingInfo().height;
-
-        
-        if (Ext.isNumber(innerHeight)) {
-            ownerContext.textAreaContext.setHeight(innerHeight);
-            ownerContext.editorContext.setHeight(innerHeight);
-        } else {
-            me.done = false;
-        }
-    },
-
-    publishInnerWidth: function (ownerContext, width) {
-        var me = this;
-        
-        if (Ext.isNumber(width)) {
-            ownerContext.textAreaContext.setWidth(width);
-            ownerContext.editorContext.setWidth(width);
-        } else {
-            me.done = false;
-        }
-    }
-});
-
-/**
-* @class Ext.ux.form.field.CodeMirror
-* @extends Ext.form.field.Base
-* @author Adrian Teodorescu (ateodorescu@gmail.com; http://www.mzsolutions.eu)
-* @docauthor Adrian Teodorescu (ateodorescu@gmail.com; http://www.mzsolutions.eu)
-* @license [MIT][1]
-* 
-* @version 1.5
-* 
-* 
-* Provides a [CodeMirror][2] component wrapper for Sencha. The supported and tested CodeMirror versions are 2.2, 2.3 and 2.4.
-* The component works with Extjs 4.1.x. 
-* 
-* [1]: http://www.mzsolutions.eu/extjs/license.txt
-* [2]: http://codemirror.net/
-* 
-* 
-* The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not
-* enabled by default unless the global {@link Ext.tip.QuickTipManager} singleton is {@link Ext.tip.QuickTipManager#init initialized}.
-*
-* If you include the modes script files by yourself then ignore the {@link #modes} property.
-* If you also include the extensions script files by yourself then ignore the {@link #extensions} property.
-* 
-* 
-* 
-#Example usage:#
-
-{@img Ext.ux.form.field.CodeMirror.png Ext.ux.form.field.CodeMirror component}
-
-    var form = Ext.create('Ext.form.Panel', {
-        title:          'Function info',
-        bodyPadding:    10,
-        width:          500,
-        renderTo: Ext.getBody(),        
-        items: [{
-            xtype:      'textfield',
-            name:       'name',
-            anchor:     '100%',
-            fieldLabel: 'Name',
-            allowBlank: false  // requires a non-empty value
-        }, {
-            xtype:      'codemirror',
-            name:       'function',
-            fieldLabel: 'Code',
-            anchor:     '100%'
-        }],
-        
-        buttons: [{
-            text: 'Save',
-            handler: function(){
-                if(form.getForm().isValid()){
-                    alert(form.getForm().getValues().function);
-                }
-            }
-        }]
-    }); 
-
-    
-#Plugin example for the CodeMirror component:#
-
-    Ext.define('Ext.ux.form.plugin.CodeMirror', {
-        mixins: {
-            observable: 'Ext.util.Observable'
-        },
-        alternateClassName: 'Ext.form.plugin.CodeMirror',
-        requires: [
-            'Ext.tip.QuickTipManager',
-            'Ext.ux.form.field.CodeMirror'
-        ],
-
-        constructor: function(config) {
-            Ext.apply(this, config);
-        },
-            
-        init: function(codemirror){
-            var me = this;
-            me.codemirror = codemirror;
-            me.mon(codemirror, 'initialize', me.onInitialize, me);
-        },
-
-        onInitialize: function(){
-            var me = this, undef,
-                items = [],
-                baseCSSPrefix = Ext.baseCSSPrefix,
-                tipsEnabled = Ext.tip.QuickTipManager && Ext.tip.QuickTipManager.isEnabled();
-            
-            function btn(id, toggle, handler){
-                return {
-                    itemId : id,
-                    cls : baseCSSPrefix + 'btn-icon',
-                    iconCls: baseCSSPrefix + 'edit-'+id,
-                    enableToggle:toggle !== false,
-                    scope: me,
-                    handler:handler||me.relayBtnCmd,
-                    clickEvent:'mousedown',
-                    tooltip: tipsEnabled ? me.buttonTips[id] || undef : undef,
-                    overflowText: me.buttonTips[id].title || undef,
-                    tabIndex:-1
-                };
-            }
-
-            items.push(btn('test', false));
-            if(items.length > 0){
-                me.codemirror.getToolbar().add(items);
-            }
-        },
-        
-        relayBtnCmd: function(btn){
-            alert('test');
-        },
-
-        buttonTips : {
-            test : {
-                title: 'Test',
-                text: 'Test button.',
-                cls: Ext.baseCSSPrefix + 'html-editor-tip'
-            }
-        }
-        
-    });
-
-
-*/
-Ext.define('Ext.ux.form.field.CodeMirror', {
-    extend: 'Ext.Component',
-    mixins: {
-        labelable: 'Ext.form.Labelable',
-        field: 'Ext.form.field.Field'
-    },
-    alias: 'widget.codemirror',
-    alternateClassName: 'Ext.form.CodeMirror',
-    requires: [
-        'Ext.tip.QuickTipManager',
-        'Ext.util.Format',
-        'Ext.ux.layout.component.field.CodeMirror'
-    ],
-
-    childEls: [
-        'editorEl', 'textareaEl'
-    ],
-
-    fieldSubTpl: [
-        '<textarea id="{cmpId}-textareaEl" name="{name}" tabIndex="-1" class="{textareaCls}" ',
-            'style="{size}" autocomplete="off"></textarea>',
-        '<div id="{cmpId}-editorEl" class="{editorCls}" name="{editorName}" style="{size}"></div>',
-        {
-            disableFormats: true
-        }
-    ],
-
-    componentLayout: 'codemirror',
-
-    editorWrapCls: Ext.baseCSSPrefix + 'html-editor-wrap',
-    
-    maskOnDisable: true,
-
-    afterBodyEl: '</div>',
-
-    /**
-    * @cfg {String} mode The default mode to use when the editor is initialized. When not given, this will default to the first mode that was loaded. 
-    * It may be a string, which either simply names the mode or is a MIME type associated with the mode. Alternatively, 
-    * it may be an object containing configuration options for the mode, with a name property that names the mode 
-    * (for example {name: "javascript", json: true}). The demo pages for each mode contain information about what 
-    * configuration parameters the mode supports.
-    */
-    mode:               'text/plain',
-
-    /**
-    * @cfg {Boolean} showAutoIndent Enable auto indent button for indenting the selected range 
-    */
-    showAutoIndent:     true,
-
-    /**
-    * @cfg {Boolean} showLineNumbers Enable line numbers button in the toolbar.
-    */
-    showLineNumbers:    true,
-
-    /**
-    * @cfg {Boolean} enableMatchBrackets Force matching-bracket-highlighting to happen 
-    */
-    enableMatchBrackets:    true,
-
-    /**
-    * @cfg {Boolean} enableElectricChars Configures whether the editor should re-indent the current line when a character is typed 
-    * that might change its proper indentation (only works if the mode supports indentation). 
-    */
-    enableElectricChars:    false,
-
-    /**
-    * @cfg {Boolean} enableIndentWithTabs Whether, when indenting, the first N*tabSize spaces should be replaced by N tabs.
-    */
-    enableIndentWithTabs:   true,
-
-    /**
-    * @cfg {Boolean} enableSmartIndent Whether to use the context-sensitive indentation that the mode provides (or just indent the same as the line before).
-    */
-    enableSmartIndent:      true,
-
-    /**
-    * @cfg {Boolean} enableLineWrapping Whether CodeMirror should scroll or wrap for long lines.
-    */
-    enableLineWrapping:     false,
-
-    /**
-    * @cfg {Boolean} enableLineNumbers Whether to show line numbers to the left of the editor.
-    */
-    enableLineNumbers:      true,
-
-    /**
-    * @cfg {Boolean} enableGutter Can be used to force a 'gutter' (empty space on the left of the editor) to be shown even 
-    * when no line numbers are active. This is useful for setting markers.
-    */
-    enableGutter:           true,
-
-    /**
-    * @cfg {Boolean} enableFixedGutter When enabled (off by default), this will make the gutter stay visible when the 
-    * document is scrolled horizontally.
-    */
-    enableFixedGutter:      false,
-
-    /**
-    * @cfg {Number} firstLineNumber At which number to start counting lines.
-    */
-    firstLineNumber:         1,
-
-    /**
-     * @cfg {Boolean} readOnly <tt>true</tt> to mark the field as readOnly.
-     */
-    readOnly : false,
-
-    /**
-    * @cfg {Number} pollInterval Indicates how quickly (miliseconds) CodeMirror should poll its input textarea for changes. 
-    * Most input is captured by events, but some things, like IME input on some browsers, doesn't generate events 
-    * that allow CodeMirror to properly detect it. Thus, it polls.
-    */
-    pollInterval:         100,
-
-    /**
-    * @cfg {Number} indentUnit How many spaces a block (whatever that means in the edited language) should be indented.
-    */
-    indentUnit:         4,
-
-    /**
-    * @cfg {Number} tabSize The width of a tab character.
-    */
-    tabSize:            4,
-
-    /**
-    * @cfg {String} theme The theme to style the editor with. You must make sure the CSS file defining the corresponding 
-    * .cm-s-[name] styles is loaded (see the theme directory in the distribution). The default is "default", for which 
-    * colors are included in codemirror.css. It is possible to use multiple theming classes at once—for example 
-    * "foo bar" will assign both the cm-s-foo and the cm-s-bar classes to the editor.
-    */
-    theme:              'default',
-    
-    /**
-    * @property {String} pathModes Path to the modes folder to dinamically load the required scripts. You could also
-    * include all your required modes in a big script file and this path will be ignored. 
-    * Do not fill in the trailing slash.
-    */
-    pathModes:          'mode',
-    
-    /**
-    * @property {String} pathExtensions Path to the extensions folder to dinamically load the required scripts. You could also
-    * include all your required extensions in a big script file and this path will be ignored. 
-    * Do not fill in the trailing slash. 
-    */
-    pathExtensions:     'lib/util',
-
-    /**
-    * @property {Array} extensions Define here extensions script dependencies; This is used by toolbar buttons to automatically 
-    * load the scripts before using an extension.
-    */
-    extensions:{
-        format: {
-            dependencies: ['formatting.js']
-        }
-    },
-    
-    scriptsLoaded: [],
-    lastMode: '',
-    
-    initComponent : function(){
-        var me = this;
-        
-        me.addEvents(
-            /**
-             * @event initialize
-             * Fires when the editor is fully initialized (including the iframe)
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'initialize',
-            /**
-             * @event activate
-             * Fires when the editor is first receives the focus. Any insertion must wait
-             * until after this event.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'activate',
-            /**
-             * @event deactivate
-             * Fires when the editor looses the focus. 
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'deactivate',
-             /**
-             * @event change
-             * Fires when the content of the editor is changed. 
-             * @param {Ext.ux.form.field.CodeMirror} this
-             * @param {String} newValue New value
-             * @param {String} oldValue Old value
-             * @param {Array} options 
-             */
-            'change',
-             /**
-             * @event modechanged
-             * Fires when the editor mode changes. 
-             * @param {Ext.ux.form.field.CodeMirror} this
-             * @param {String} newMode New mode
-             * @param {String} oldMode Old mode
-             */
-            'modechanged',
-            /**
-             * @event cursoractivity
-             * Fires when the cursor or selection moves, or any change is made to the editor content.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'cursoractivity',
-            /**
-             * @event gutterclick
-             * Fires whenever the editor gutter (the line-number area) is clicked. 
-             * @param {Ext.ux.form.field.CodeMirror} this
-             * @param {Number} lineNumber Zero-based number of the line that was clicked
-             * @param {Object} event The raw mousedown event
-             */
-            'gutterclick',
-            /**
-             * @event scroll
-             * Fires whenever the editor is scrolled.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'scroll',
-            /**
-             * @event highlightcomplete
-             * Fires whenever the editor's content has been fully highlighted.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'highlightcomplete',
-            /**
-             * @event update
-             * Fires whenever CodeMirror updates its DOM display.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             */
-            'update',
-            /**
-             * @event keyevent
-             * Fires on eery keydown, keyup, and keypress event that CodeMirror captures.
-             * @param {Ext.ux.form.field.CodeMirror} this
-             * @param {Object} event This key event is pretty much the raw key event, except that a stop() method is always 
-             * added to it. You could feed it to, for example, jQuery.Event to further normalize it. This function can inspect 
-             * the key event, and handle it if it wants to. It may return true to tell CodeMirror to ignore the event. 
-             * Be wary that, on some browsers, stopping a keydown does not stop the keypress from firing, whereas on others 
-             * it does. If you respond to an event, you should probably inspect its type property and only do something when 
-             * it is keydown (or keypress for actions that need character data).
-             */
-            'keyevent'
-        );
-
-
-        me.callParent(arguments);
-
-        me.initLabelable();
-        me.initField();
-        
-        /* 
-        Fix resize issues as suggested by user koblass on the Extjs forums
-        http://www.sencha.com/forum/showthread.php?167047-Ext.ux.form.field.CodeMirror-for-Ext-4.x&p=860535&viewfull=1#post860535
-        */
-        me.on('resize', function() {
-            if (me.editor) {
-                me.editor.refresh();
-            }
-        }, me);
-        
-    },
-
-    getMaskTarget: function(){
-        return this.bodyEl;    
-    },
-
-    /**
-    * @private override
-    */
-    getSubTplData: function() {
-        var cssPrefix = Ext.baseCSSPrefix;
-        return {
-            $comp           : this,
-            cmpId           : this.id,
-            id              : this.getInputId(),
-            toolbarWrapCls  : cssPrefix + 'html-editor-tb',
-            textareaCls     : cssPrefix + 'hidden',
-            editorCls       : cssPrefix + 'codemirror',
-            editorName      : Ext.id(),
-            //size            : 'height:100px;width:100%'
-	    // PennyMac: setting height to 100%.
-            size            : 'height:100%;width:100%',
-        };
-    },
-
-    getSubTplMarkup: function() {
-        return this.getTpl('fieldSubTpl').apply(this.getSubTplData());
-    },
-
-    finishRenderChildren: function () {
-        this.callParent();
-    },
-
-    /**
-    * @private override
-    */
-    onRender: function() {
-        var me = this;
-
-        me.callParent(arguments);
-        me.inputEl = me.editorEl;
-
-        me.disableItems(true);
-        me.initEditor();
-        
-        me.rendered = true;
-    },
-    
-    initRenderTpl: function() {
-        var me = this;
-        if (!me.hasOwnProperty('renderTpl')) {
-            me.renderTpl = me.getTpl('labelableRenderTpl');
-        }
-        return me.callParent();
-    },
-
-    initRenderData: function() {
-        this.beforeSubTpl = '<div class="' + this.editorWrapCls + '">';
-        return Ext.applyIf(this.callParent(), this.getLabelableRenderData());
-    },
-
-    /**
-    * @private override
-    */
-    initEditor : function(){
-        var me = this,
-        mode = "text/x-delorean";
-        
-        // if no mode is loaded we could get an error like "Object #<Object> has no method 'startState'"
-        // search mime to find script dependencies
-        var item = me.getMime(me.mode);
-        if(item) {
-            mode = me.getMimeMode(me.mode);
-            if(!mode){
-                mode = "text/x-delorean";
-            }
-        }
-        
-        me.editor = CodeMirror(me.editorEl, {
-            matchBrackets:      me.enableMatchBrackets,
-            electricChars:      me.enableElectricChars,
-            autoClearEmptyLines:true,
-            value:              me.rawValue,
-            indentUnit:         me.indentUnit,
-            smartIndent:        me.enableSmartIndent,
-            indentWithTabs:     me.indentWithTabs,
-            pollInterval:       me.pollInterval,
-            lineNumbers:        me.enableLineNumbers,
-            lineWrapping:       me.enableLineWrapping,
-            firstLineNumber:    me.firstLineNumber,
-            tabSize:            me.tabSize,
-            gutter:             me.enableGutter,
-            fixedGutter:        me.enableFixedGutter,
-            theme:              me.theme,
-            mode:               mode,
-            onChange:           function(editor, tc){
-                me.checkChange();
-                //me.fireEvent('change', me, tc.from, tc.to, tc.text, tc.next || null);
-            },
-            onCursorActivity:   function(editor){
-                me.fireEvent('cursoractivity', me);
-            },
-            onGutterClick:      function(editor, line, event){
-                me.fireEvent('gutterclick', me, line, event);
-            },
-            onFocus:            function(editor){
-                me.fireEvent('activate', me);
-            },
-            onBlur:             function(editor){
-                me.fireEvent('deactivate', me);
-            },
-            onScroll:           function(editor){
-                me.fireEvent('scroll', me);
-            },
-            onHighlightComplete: function(editor){
-                me.fireEvent('highlightcomplete', me);
-            },
-            onUpdate:           function(editor){
-                me.fireEvent('update', me);
-            },
-            onKeyEvent:         function(editor, event){
-                event.cancelBubble = true; // fix suggested by koblass user on Sencha forums (http://www.sencha.com/forum/showthread.php?167047-Ext.ux.form.field.CodeMirror-for-Ext-4.x&p=862029&viewfull=1#post862029)
-                me.fireEvent('keyevent', me, event);
-            }
-        });
-        //me.editor.setValue(me.rawValue);
-        me.setMode(me.mode);
-        me.setReadOnly(me.readOnly);
-        me.fireEvent('initialize', me);
-
-        // change the codemirror css
-        var css = Ext.util.CSS.getRule('.CodeMirror');
-        if(css){
-            css.style.height = '100%';
-            css.style.position = 'relative';
-            css.style.overflow = 'hidden';
-        }
-        var css = Ext.util.CSS.getRule('.CodeMirror-Scroll');
-        if(css){
-            css.style.height = '100%';
-        }
-
-	// PennyMac: align the body to the top. Otherwise it ends up
-	// in the center of the enclosing table.
-	var el = document.getElementById(me.bodyEl.id);
-	el.setAttribute("valign", "top");
-    },
-    
-    /**
-    * @private
-    */
-    relayBtnCmd: function(btn){
-        this.relayCmd(btn.getItemId());
-    },
-    
-    /**
-    * @private
-    */
-    relayCmd: function(cmd){
-        Ext.defer(function() {
-            var me = this;
-            me.editor.focus();
-            switch(cmd){
-                // auto formatting
-                case 'justifycenter':
-                    if(!CodeMirror.extensions.autoIndentRange){
-                        me.loadDependencies(me.extensions.format, me.pathExtensions, me.doIndentSelection, me);                        
-                    }else{
-                        me.doIndentSelection();
-                    }
-                break;
-                
-                // line numbers
-                case 'insertorderedlist':
-                    me.doChangeLineNumbers();
-                break;
-            }
-        }, 10, this);
-    },
-    
-    /**
-    * @private
-    * Reload all CodeMirror extensions for the current instance;
-    * 
-    */
-    reloadExtentions: function(){
-        var me = this;
-        
-        for (var ext in CodeMirror.extensions)
-          if (CodeMirror.extensions.propertyIsEnumerable(ext) &&
-              !me.editor.propertyIsEnumerable(ext))
-            me.editor[ext] = CodeMirror.extensions[ext];
-    },
-    
-    doChangeLineNumbers: function(){
-        var me = this;
-        
-        me.enableLineNumbers = !me.enableLineNumbers;
-        me.editor.setOption('lineNumbers', me.enableLineNumbers);
-    },
-    
-    /**
-    * @private
-    */
-    doIndentSelection: function(){
-        var me = this;
-        
-        me.reloadExtentions();
-        
-        try{
-            var range = { from: me.editor.getCursor(true), to: me.editor.getCursor(false) };
-            me.editor.autoIndentRange(range.from, range.to);        
-        }catch(err){}
-    },
-
-    modes: [
-	{
-            mime:           ["text/x-delorean"],
-            dependencies:   []
-	},
-    ],
-    
-    /**
-    * @private
-    */
-    getMime: function(mime){
-        var me = this, item, found = false;
-        
-        for(var i=0;i<me.modes.length;i++){
-            item = me.modes[i];
-            if(Ext.isArray(item.mime)){
-                if(Ext.Array.contains(item.mime, mime)){
-                    found = true;
-                    break;
-                }
-            }else{
-                if(item == mime){
-                    found = true;
-                    break;
-                }
-            }
-        }
-        if(found)
-            return item;
-        else
-            return null;
-    },
-    
-    /**
-    * @private
-    */
-    loadDependencies: function(item, path, handler, scope){
-        var me = this;
-        
-        me.scripts = [];
-        me.scriptIndex = -1;
-        
-        // load the dependencies
-        for(var i=0; i < item.dependencies.length; i++){
-            if(!Ext.Array.contains(me.scriptsLoaded, path + '/' + item.dependencies[i])){
-                var options = {
-                    url: path + '/' + item.dependencies[i],
-                    index: ++me.scriptIndex,
-                    onLoad: function(options){
-                        var ok = true;
-                        for(j=0; j < me.scripts.length; j++){
-                            if(me.scripts[j].called) {// this event could be raised before one script if fetched
-                                ok = ok && me.scripts[j].success;
-                                if(me.scripts[j].success && !Ext.Array.contains(me.scriptsLoaded, me.scripts[j].url)){
-                                    me.scriptsLoaded.push(me.scripts[j].url);
-                                }
-                            }else{
-                                ok = false;
-                            }
-                        }
-                        if(ok){
-                            handler.call(scope || me.editor);
-                        }
-                    }
-                };
-            
-                me.scripts[me.scriptIndex] = {
-                    url: options.url,
-                    success: true,
-                    called: false,
-                    options: options,
-                    onLoad: options.onLoad || Ext.emptyFn,
-                    onError: options.onError || Ext.emptyFn
-                };
-            }
-        }
-        for(var i=0; i < me.scripts.length; i++){
-            me.loadScript(me.scripts[i].options);
-        }
-    },
-    
-    /**
-    * @private
-    */
-    loadScript: function(options){
-        var me = this;
-        Ext.Ajax.request({
-            url: options.url,
-            scriptIndex: options.index,
-            success: function(response, options) {
-                var script = 'Ext.getCmp("' + this.id + '").scripts[' + options.scriptIndex + ']';
-                window.setTimeout('try { ' + response.responseText + ' } catch(e) { '+script+'.success = false; '+script+'.onError('+script+'.options, e); };  ' + script + '.called = true; if ('+script+'.success) '+script+'.onLoad('+script+'.options);', 0);
-            },
-            failure: function(response, options) {
-                var script = this.scripts[options.scriptIndex];
-                script.success = false;
-                script.called = true;
-                script.onError(script.options, response.status);
-            },
-            scope: me
-        });        
-    },
-    
-    /**
-    * @private
-    * Return mode depending on the mime; If the mime is not loaded then return null
-    * 
-    * @param mime
-    */
-    getMimeMode: function(mime){
-        var mode = null;
-        var mimes = CodeMirror.listMIMEs();
-        for(var i=0; i<mimes.length; i++){
-            if(mimes[i].mime == mime){
-                mode = mimes[i].mode;
-                if(typeof mode == "object")
-                    mode = mode.name;
-                break;
-            }
-        }
-        return mode;
-    },
-    
-    /**
-    * Change the CodeMirror mode to the specified mime.
-    * 
-    * @param {String} mime The MIME value according to the CodeMirror documentation
-    */
-    setMode: function(mime){
-        var me = this, 
-            found = false;
-        // search mime to find script dependencies
-        var item = me.getMime(mime);
-        
-        if(!item) {
-            // mime not found
-            return;
-        }
-        
-        var mode = me.getMimeMode(mime);
-
-        if(!mode){
-            me.loadDependencies(item, me.pathModes, function(){
-                var mode = me.getMimeMode(mime);
-                if(typeof mode == "string")
-                    me.editor.setOption('mode', mime);
-                else
-                    me.editor.setOption('mode', mode);
-            });
-        }else{
-            if(typeof mode == "string")
-                me.editor.setOption('mode', mime);
-            else
-                me.editor.setOption('mode', mode);
-        }
-        
-        if(me.modesSelect){
-            me.modesSelect.dom.value = mime;
-        }
-        try{
-            me.fireEvent('modechanged', me, mime, me.lastMode);
-            me.lastMode = mime;
-        }catch(err){}
-    },
-    
-    /**
-    * Set the editor as read only
-    * 
-    * @param {Boolean} readOnly
-    */
-    setReadOnly: function(readOnly) {
-        var me = this;
-        
-        if(me.editor){
-            me.editor.setOption('readOnly', readOnly);
-            me.disableItems(readOnly);
-        }
-    },
-    
-    onDisable: function() {
-        this.bodyEl.mask();
-        this.callParent(arguments);
-    },
-
-    onEnable: function() {
-        this.bodyEl.unmask();
-        this.callParent(arguments);
-    },
-    
-    disableItems: function(disabled) {
-    },
-
-    /**
-    * Sets a data value into the field and runs the change detection. 
-    * @param {Mixed} value The value to set
-    * @return {Ext.ux.form.field.CodeMirror} this
-    */
-    setValue: function(value){
-        var me = this;
-
-        me.mixins.field.setValue.call(me, value);
-        me.rawValue = value;
-        if(me.editor)
-            me.editor.setValue(value);
-        return me;
-    },
-    
-    /**
-    * Return submit value to the owner form.
-    * @return {Mixed} The field value
-    */
-    getSubmitValue: function(){
-        var me = this;
-        return me.getValue();
-    },
-    
-    /**
-    * Return the value of the CodeMirror editor
-    * @return {Mixed} The field value
-    */
-    getValue: function(){
-        var me = this;
-        
-        if(me.editor)
-            return me.editor.getValue();
-        else
-            return null;
-    },
-    
-    /**
-    * @private
-    */
-    onDestroy: function(){
-        var me = this;
-        if(me.rendered){
-            try {
-                Ext.EventManager.removeAll(me.editor);
-                for (prop in me.editor) {
-                    if (me.editor.hasOwnProperty(prop)) {
-                        delete me.editor[prop];
-                    }
-                }
-            }catch(e){}
-        }
-        me.callParent();
-    },
-    
-});