/lib/controls/code_editor.js

 1/*
 2 * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
 3 * 
 4 * Licensed under the Apache License, Version 2.0 (the "License");
 5 * you may not use this file except in compliance with the License.
 6 * You may obtain a copy of the License at
 7 * 
 8 *     http://www.apache.org/licenses/LICENSE-2.0
 9 * 
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 */
16
17(function(){
18    
19    function CodeEditor(el) {
20        CodeEditor.$super.call(this);
21
22        // For performance reasons we will keep the code-mirror editor in a absolute posioned element
23        // attached directly to body. This way we will avoid long layouts and long paint times due to
24        // flex-box implementation.
25        // We will keep the original element around to make it easy to steal its coordinates.
26        this.uiElement = el;
27
28        this.element = $("<div />").addClass("code-editor").appendTo("#codemirror-editors-view");
29        this.isSupported = true;
30             
31        if (typeof CodeMirror !== 'function'){
32            console.warn("Missing CodeMirror library. See README file")
33            this.isSupported = false;
34            return
35        }   
36
37        var self = this;
38        this.editor = new CodeMirror(this.element[0], {
39            lineNumbers: true,
40            matchBrackets: true,
41            mode: "text/x-csrc",
42            onChange: function() {
43                self.fire("valueChanged", [self.getValue()]);
44            }
45        });
46    }
47
48    Global.Utils.extend(CodeEditor).from(Global.EventDispatcher);
49
50    $.extend(CodeEditor.prototype, {
51        setValue: function(value) {
52            this.editor.setValue(value);
53        },
54
55        getValue: function() {
56            return this.editor.getValue();
57        },
58
59        setActive: function(active) {
60            this.element.toggleClass("active-shader-view", active);
61            if (active)
62                this.refresh();
63        },
64
65        refresh: function() {
66            if (!this.isSupported){
67                return
68            }
69            var clientRect = this.uiElement[0].getBoundingClientRect();
70            this.element.css({
71                "left": clientRect.left,
72                "top": clientRect.top,
73                "width": clientRect.width,
74                "height": clientRect.height
75            });
76            $(this.editor.getScrollerElement()).height(clientRect.height);
77            this.editor.refresh();
78        }
79    });
80
81    Global.CodeEditor = CodeEditor;
82
83})();