diff --git a/data/src/hello/main1.go b/data/src/hello/main1.go
new file mode 100644
index 0000000..b52696a
--- /dev/null
+++ b/data/src/hello/main1.go
@@ -0,0 +1,12 @@
+package main
+
+import (
+	"fmt"
+	"time"
+)
+
+func main() {
+		fmt.Println("Hello, 世界")
+
+		time.Sleep(time.Second)
+}
diff --git a/static/css/base.css b/static/css/base.css
index 64f90f0..660e6c6 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -1,6 +1,6 @@
 ul {
-	padding: 0;
-	margin: 0;
+    padding: 0;
+    margin: 0;
 }
 
 .fn-clear:before,
@@ -14,54 +14,65 @@ ul {
 }
 
 .fn-none {
-	display: none;
+    display: none;
 }
 
 .content {
-	position: relative;
-	height: 460px;
+    position: relative;
+    height: 460px;
 }
 
 .ztree {
-	position: absolute;
-	width: 20%;
-	height: 440px;
-	overflow: auto;
+    position: absolute;
+    width: 20%;
+    height: 440px;
+    overflow: auto;
 }
 
 #dirRMenu, #fileRMenu {
-	position: absolute;
-	border: 1px solid #DDD;
-	background-color: #444;
-	color: #FFF;
+    position: absolute;
+    border: 1px solid #DDD;
+    background-color: #444;
+    color: #FFF;
 }
 
 #dirRMenu li, #fileRMenu li {
-	padding: 5px 10px;
-	cursor: pointer;
-	font-size: 12px;
+    padding: 5px 10px;
+    cursor: pointer;
+    font-size: 12px;
 }
 
 
 .edit-panel {
-	position: absolute;
-	width: 80%;
-	left: 20%;
+    background-color: #262626;
+    height: 450px;
+    left: 20%;
+    position: absolute;
+    width: 80%;
+}
+
+.edit-panel .tabs span {
+    background-color: #FFF;
+    cursor: pointer;
+}
+
+.edit-panel .tabs span.current {
+    background-color: #EEEEEE;
 }
 
 .output {
-	width: 49%
+    width: 49%
 }
 
 .shell {
-	float: right;
-	width: 49%
+    float: right;
+    width: 49%
 }
 
 .shellInput, .shellOutput {	
-	width: 99%
+    width: 99%
 }
 
 .shellOutput {
-	height: 125px;
+    height: 125px;
 }
\ No newline at end of file
diff --git a/static/js/editor.js b/static/js/editor.js
index 9b4dc7a..b820da7 100644
--- a/static/js/editor.js
+++ b/static/js/editor.js
@@ -1,58 +1,123 @@
-(function(mod) {
-    mod(CodeMirror);
-})(function(CodeMirror) {
-    "use strict";
+var editors = {
+    data: [],
+    init: function() {
+        editors._initAutocomplete();
+        editors._initTabs();
+    },
+    _initAutocomplete: function() {
+        CodeMirror.registerHelper("hint", "go", function(editor, options) {
+            var cur = editor.getCursor();
 
-    CodeMirror.registerHelper("hint", "go", function(editor, options) {
-        var cur = editor.getCursor();
+            var request = {
+                code: editor.getValue(),
+                cursorLine: editor.getCursor().line,
+                cursorCh: editor.getCursor().ch
+            };
 
-        var request = {
-            code: editor.getValue(),
-            cursorLine: editor.getCursor().line,
-            cursorCh: editor.getCursor().ch
-        };
+            // XXX: 回调有问题，暂时不使用 WS 协议
+            //editorWS.send(JSON.stringify(request));
 
-        // XXX: 回调有问题，暂时不使用 WS 协议
-        //editorWS.send(JSON.stringify(request));
+            var autocompleteHints = [];
 
-        var autocompleteHints = [];
+            $.ajax({
+                async: false, // 同步执行
+                type: 'POST',
+                url: '/autocomplete',
+                data: JSON.stringify(request),
+                dataType: "json",
+                success: function(data) {
+                    var autocompleteArray = data[1];
 
-        $.ajax({
-            async: false, // 同步执行
-            type: 'POST',
-            url: '/autocomplete',
-            data: JSON.stringify(request),
-            dataType: "json",
-            success: function(data) {
-                var autocompleteArray = data[1];
-
-                for (var i = 0; i < autocompleteArray.length; i++) {
-                    autocompleteHints[i] = autocompleteArray[i].name;
+                    for (var i = 0; i < autocompleteArray.length; i++) {
+                        autocompleteHints[i] = autocompleteArray[i].name;
+                    }
                 }
-            }
+            });
+
+            return {list: autocompleteHints, from: cur, to: cur};
         });
 
-        return {list: autocompleteHints, from: cur, to: cur};
-    });
-});
+        CodeMirror.commands.autocomplete = function(cm) {
+            cm.showHint({hint: CodeMirror.hint.go});
+        };
+    },
+    _initTabs: function() {
+        var $tabsPanel = $(".edit-panel .tabs-panel"),
+                $tabs = $(".edit-panel .tabs");
 
-CodeMirror.commands.autocomplete = function(cm) {
-    cm.showHint({hint: CodeMirror.hint.go});
+        $tabs.on("click", "span", function() {
+            var $it = $(this);
+            if ($it.hasClass("current")) {
+                return false;
+            }
+            
+            var id = $it.data("id");
+
+            $tabs.children("span").removeClass("current");
+            $tabsPanel.children("div").hide();
+
+            $it.addClass("current");
+            $("#editor" + id).parent().show();
+            
+            // set tree node selected
+            var node = tree.fileTree.getNodeByTId(id);
+            tree.fileTree.selectNode(node);
+            wide.curNode = node;
+        });
+    },
+    _selectTab: function(id) {
+        var $tabsPanel = $(".edit-panel .tabs-panel"),
+                $tabs = $(".edit-panel .tabs");
+
+        var $currentTab = $tabs.children(".current");
+        if ($currentTab.data("id") === id) {
+            return false;
+        }
+
+        $tabs.children("span").removeClass("current");
+        $tabsPanel.children("div").hide();
+
+        $tabs.children("span[data-id='" + id + "']").addClass("current");
+        $("#editor" + id).parent().show();
+    },
+    newEditor: function(data) {
+        var id = wide.curNode.tId;
+        for (var i = 0, ii = editors.data.length; i < ii; i++) {
+            if (editors.data[i].id === id) {
+                editors._selectTab(id);
+                return false;
+            }
+        }
+
+        var $tabsPanel = $(".edit-panel .tabs-panel"),
+                $tabs = $(".edit-panel .tabs");
+
+        $tabs.children("span").removeClass("current");
+        $tabsPanel.children("div").hide();
+
+        $tabsPanel.append('<div><textarea id="editor' + id + '" name="code"></textarea></div>');
+        $tabs.append('<span data-id="' + id + '" class="current">' + wide.curNode.name + '</span>');
+
+        var editor = CodeMirror.fromTextArea(document.getElementById("editor" + id), {
+            lineNumbers: true,
+            theme: 'lesser-dark',
+            extraKeys: {
+                "Ctrl-\\": "autocomplete"
+            }
+        });
+        editor.setSize('100%', 450);
+        editor.setValue(data.content);
+        editor.setOption("mode", data.mode);
+
+        wide.curEditor = editor;
+        editors.data.push({
+            "editor": editor,
+            "id": id
+        });
+    },
+    removeEditor: function() {
+
+    }
 };
 
-var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
-    lineNumbers: true,
-    theme: 'lesser-dark',
-    extraKeys: {
-        "Ctrl-\\": "autocomplete"
-    }
-});
-
-editor.setSize('100%', 450);
-
-editor.addKeyMap({
-});
-
-editor.on('keyup', function(cm, event) {
-
-});
\ No newline at end of file
+editors.init();
\ No newline at end of file
diff --git a/static/js/tree.js b/static/js/tree.js
index 7a6c4c7..56558d5 100644
--- a/static/js/tree.js
+++ b/static/js/tree.js
@@ -115,10 +115,10 @@ var tree = {
                                         data: JSON.stringify(request),
                                         dataType: "json",
                                         success: function(data) {
-                                            if (data.succ) {
-                                                editor.setValue(data.content);
-                                                editor.setOption("mode", data.mode);
+                                            if (!data.succ) {
+                                                return false;
                                             }
+                                            editors.newEditor(data);
                                         }
                                     });
                                 }
@@ -126,6 +126,7 @@ var tree = {
                         }
                     };
                     tree.fileTree = $.fn.zTree.init($("#files"), setting, data.root.children);
+                    // TODO: remove
                     tree.fileTree.expandAll(true);
                 }
             }
diff --git a/static/js/wide.js b/static/js/wide.js
index 7a8f1e3..c1400ef 100644
--- a/static/js/wide.js
+++ b/static/js/wide.js
@@ -37,7 +37,8 @@ shellWS.onerror = function(e) {
 };
 
 var wide = {
-    curFile: "",
+    curNode: "",
+    curEditor: "",
     init: function() {
         $('#shellInput').keydown(function(event) {
             if (13 === event.which) {
@@ -61,8 +62,8 @@ var wide = {
     },
     save: function() {
         var request = {
-            "file": wide.curFile,
-            "code": editor.getValue()
+            "file": wide.curNode.path,
+            "code": wide.curEditor.getValue()
         };
         $.ajax({
             type: 'POST',
@@ -76,8 +77,8 @@ var wide = {
     },
     run: function() {
         var request = {
-            "file": wide.curFile,
-            "code": editor.getValue()
+            "file": wide.curNode.path,
+            "code": wide.curEditor.getValue()
         };
         $.ajax({
             type: 'POST',
@@ -94,10 +95,10 @@ var wide = {
     },
     fmt: function() {
         var request = {
-            "file": wide.curFile,
-            "code": editor.getValue(),
-            "cursorLine": editor.getCursor().line,
-            "cursorCh": editor.getCursor().ch
+            "file": wide.curNode.path,
+            "code": wide.curEditor.getValue(),
+            "cursorLine": wide.curEditor.getCursor().line,
+            "cursorCh": wide.curEditor.getCursor().ch
         };
         $.ajax({
             type: 'POST',
@@ -106,7 +107,7 @@ var wide = {
             dataType: "json",
             success: function(data) {
                 if (data.succ) {
-                    editor.setValue(data.code);
+                    wide.curEditor.setValue(data.code);
                 }
             }
         });
diff --git a/templates/index.html b/templates/index.html
index 747d476..67ed9c8 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -32,7 +32,8 @@
             </div>
 
             <div class="edit-panel">
-                <textarea id="code" name="code"></textarea>
+                <div class="tabs"></div>
+                <div class="tabs-panel"></div>
             </div>
         </div>
 
@@ -43,7 +44,7 @@
         </div>
 
         <div>
-            <textarea id="output" class="output" rows="10"></textarea>
+            <textarea id="output" class="output" rows="7"></textarea>
 
             <div class="shell">
                 <div>