diff --git a/static/css/base.css b/static/css/base.css
index b467133..ca3fc14 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -235,23 +235,18 @@ ul {
/* end editor */
/* start output */
-.output .tabs {
+.bottom-window-group .tabs {
background-color: #CAD3E3;
border-top: 1px solid #8E97A7;
border-bottom: 1px solid #8E97A7;
}
-.output .tabs > div {
- background-color: #B5BDCC;
- border-left-color: #9096A2;
+.bottom-window-group .tabs > div {
+ cursor: pointer;
}
-.output .tabs > div.current {
- background-color: #8B99B3;
- color: #FFF;
-}
-
-#output {
+#output,
+#notification {
border-width: 0;
color: #555555;
height: 130px;
diff --git a/static/js/hotkeys.js b/static/js/hotkeys.js
index cc27fa2..9802ac3 100644
--- a/static/js/hotkeys.js
+++ b/static/js/hotkeys.js
@@ -26,6 +26,9 @@ var hotkeys = {
// TODO: 滚动处理
$("#files").keydown(function(event) {
switch (event.which) {
+ case 46: // 删除
+ tree.removeIt();
+ break;
case 13: // 回车
if (!wide.curNode) {
return false;
@@ -60,8 +63,8 @@ var hotkeys = {
var preNode = wide.curNode.getPreNode();
if (preNode && preNode.iconSkin === "ico-ztree-dir "
&& preNode.open) {
- // 当前节点的上一个节点是目录且打开时
- node = preNode.children[preNode.children.length - 1];
+ // 当前节点的上一个节点是目录且打开时，获取打开节点中的最后一个节点
+ node = tree.getCurrentNodeLastNode(preNode);
}
}
@@ -75,8 +78,7 @@ var hotkeys = {
if (!wide.curNode) { // 没有选中节点时，默认选中第一个
node = tree.fileTree.getNodeByTId("files_1");
} else {
- if (wide.curNode && wide.curNode.isLastNode && !wide.curNode.open
- && wide.curNode.getParentNode().isLastNode) {
+ if (wide.curNode && tree.isBottomNode(wide.curNode)) {
// 当前节点为最底部的节点
return false;
}
@@ -87,10 +89,11 @@ var hotkeys = {
node = wide.curNode.children[0];
}
- if (wide.curNode.isLastNode && wide.curNode.level !== 0
- && wide.curNode.getParentNode().getNextNode()) {
- // 当前节点为最后一个节点，但其父节点还有下一个节点
- node = wide.curNode.getParentNode().getNextNode();
+ var nextShowNode = tree.getNextShowNode(wide.curNode);
+ if (wide.curNode.isLastNode && wide.curNode.level !== 0 && !wide.curNode.open
+ && nextShowNode) {
+ // 当前节点为最后一个叶子节点，但其父或祖先节点还有下一个节点
+ node = nextShowNode;
}
}
diff --git a/static/js/tree.js b/static/js/tree.js
index f5e6d49..f862158 100644
--- a/static/js/tree.js
+++ b/static/js/tree.js
@@ -1,12 +1,52 @@
var tree = {
- getTIdByPath: function (path) {
- var nodes = tree.fileTree.transformToArray(tree.fileTree.getNodes());
+ // 递归获取当前节点展开中的最后一个节点
+ getCurrentNodeLastNode: function(node) {
+ var returnNode = node.children[node.children.length - 1];
+ if (returnNode.open) {
+ return tree.getCurrentNodeLastNode(returnNode);
+ } else {
+ return returnNode;
+ }
+ },
+ // 按照树展现获取下一个节点
+ getNextShowNode: function(node) {
+ if (node.level !== 0) {
+ if (node.getParentNode().getNextNode()) {
+ return node.getParentNode().getNextNode();
+ } else {
+ return tree.getNextShowNode(node.getParentNode());
+ }
+ } else {
+ return node.getNextNode();
+ }
+ },
+ isBottomNode: function(node) {
+ if (node.open) {
+ return false;
+ }
+
+ if (node.getParentNode()) {
+ if (node.getParentNode().isLastNode) {
+ return tree.isBottomNode(node.getParentNode());
+ } else {
+ return false;
+ }
+ } else {
+ if (node.isLastNode) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+ },
+ getTIdByPath: function(path) {
+ var nodes = tree.fileTree.transformToArray(tree.fileTree.getNodes());
for (var i = 0, ii = nodes.length; i < ii; i++) {
if (nodes[i].path === path) {
return nodes[i].tId;
}
}
-
+
return undefined;
},
fileTree: undefined,
diff --git a/static/js/wide.js b/static/js/wide.js
index 59834c1..a6484a7 100644
--- a/static/js/wide.js
+++ b/static/js/wide.js
@@ -1,9 +1,9 @@
var outputWS = new WebSocket(config.channel.output + '/output/ws');
-outputWS.onopen = function () {
+outputWS.onopen = function() {
console.log('[output onopen] connected');
};
-outputWS.onmessage = function (e) {
+outputWS.onmessage = function(e) {
console.log('[output onmessage]' + e.data);
var data = JSON.parse(e.data);
@@ -21,10 +21,10 @@ outputWS.onmessage = function (e) {
url: '/run',
data: JSON.stringify(request),
dataType: "json",
- beforeSend: function (data) {
+ beforeSend: function(data) {
$('#output').text('');
},
- success: function (data) {
+ success: function(data) {
}
});
@@ -55,27 +55,34 @@ outputWS.onmessage = function (e) {
$('#output').text($('#output').text() + data.output);
}
};
-outputWS.onclose = function (e) {
+outputWS.onclose = function(e) {
console.log('[output onclose] disconnected (' + e.code + ')');
delete outputWS;
};
-outputWS.onerror = function (e) {
+outputWS.onerror = function(e) {
console.log('[output onerror] ' + e);
};
var wide = {
curNode: undefined,
curEditor: undefined,
- _initLayout: function () {
+ _initLayout: function() {
var mainH = $(window).height() - $(".menu").height() - $(".footer").height() - 2;
$(".content, .ztree").height(mainH);
- $(".edit-panel").height(mainH - $(".output").height());
+ $(".edit-panel").height(mainH - $(".bottom-window-group").height());
},
- init: function () {
+ _initBottomWindowGroup: function() {
+ new Tabs({
+ id: ".bottom-window-group"
+ });
+ },
+ init: function() {
this._initLayout();
+
+ this._initBottomWindowGroup();
- $("body").bind("mousedown", function (event) {
+ $("body").bind("mousedown", function(event) {
if (!(event.target.id === "dirRMenu" || $(event.target).closest("#dirRMenu").length > 0)) {
$("#dirRMenu").hide();
}
@@ -92,7 +99,7 @@ var wide = {
});
},
- saveFile: function () {
+ saveFile: function() {
var request = {
file: $(".edit-header .current span:eq(0)").attr("title"),
code: wide.curEditor.getValue()
@@ -102,24 +109,24 @@ var wide = {
url: '/file/save',
data: JSON.stringify(request),
dataType: "json",
- success: function (data) {
+ success: function(data) {
}
});
},
- saveAllFiles: function () {
+ saveAllFiles: function() {
// TODO: save all files
},
- closeFile: function () {
+ closeFile: function() {
// TODO: close file
},
- closeAllFiles: function () {
+ closeAllFiles: function() {
// TODO: close all files
},
- exit: function () {
+ exit: function() {
// TODO: exit
},
// 构建 & 运行.
- run: function () {
+ run: function() {
var request = {
file: $(".edit-header .current span:eq(0)").attr("title"),
code: wide.curEditor.getValue()
@@ -132,14 +139,14 @@ var wide = {
url: '/build',
data: JSON.stringify(request),
dataType: "json",
- beforeSend: function (data) {
+ beforeSend: function(data) {
$('#output').text('');
},
- success: function (data) {
+ success: function(data) {
}
});
},
- goget: function () {
+ goget: function() {
var request = {
file: $(".edit-header .current span:eq(0)").attr("title")
};
@@ -149,14 +156,14 @@ var wide = {
url: '/go/get',
data: JSON.stringify(request),
dataType: "json",
- beforeSend: function (data) {
+ beforeSend: function(data) {
$('#output').text('');
},
- success: function (data) {
+ success: function(data) {
}
});
},
- goinstall: function () {
+ goinstall: function() {
var request = {
file: $(".edit-header .current span:eq(0)").attr("title"),
code: wide.curEditor.getValue()
@@ -167,14 +174,14 @@ var wide = {
url: '/go/install',
data: JSON.stringify(request),
dataType: "json",
- beforeSend: function (data) {
+ beforeSend: function(data) {
$('#output').text('');
},
- success: function (data) {
+ success: function(data) {
}
});
},
- fmt: function () {
+ fmt: function() {
var path = $(".edit-header .current span:eq(0)").attr("title");
var mode = wide.curNode.mode;
@@ -192,7 +199,7 @@ var wide = {
url: '/go/fmt',
data: JSON.stringify(request),
dataType: "json",
- success: function (data) {
+ success: function(data) {
if (data.succ) {
wide.curEditor.setValue(data.code);
}
@@ -206,7 +213,7 @@ var wide = {
url: '/html/fmt',
data: JSON.stringify(request),
dataType: "json",
- success: function (data) {
+ success: function(data) {
if (data.succ) {
wide.curEditor.setValue(data.code);
}
@@ -233,7 +240,7 @@ var wide = {
}
};
-$(document).ready(function () {
+$(document).ready(function() {
wide.init();
tree.init();
menu.init();
diff --git a/view/index.html b/view/index.html
index 98215de..0718221 100644
--- a/view/index.html
+++ b/view/index.html
@@ -133,20 +133,29 @@
-
+
-
+
Output
+
+ Search
+
+
+ Notification
+
-
-
-
-