This commit is contained in:
Van 2015-01-01 22:15:54 +08:00
parent 82b6da0a41
commit a588c3ed5c
8 changed files with 161 additions and 44 deletions

View File

@ -56,7 +56,7 @@
"find_previous": "Find Previous", "find_previous": "Find Previous",
"replace": "Replace", "replace": "Replace",
"replace_all": "Replace All", "replace_all": "Replace All",
"restore_bottom": "Bottom Windows Restore", "restore_bottom": "Restore Bottom Windows",
"file_format": "File Extension", "file_format": "File Extension",
"keyword": "Keyword", "keyword": "Keyword",
"user_guide": "User Guide", "user_guide": "User Guide",
@ -166,5 +166,6 @@
"govet": "go vet", "govet": "go vet",
"start-vet": "START [go vet]", "start-vet": "START [go vet]",
"vet-succ": "[go vet] SUCCESS", "vet-succ": "[go vet] SUCCESS",
"vet-error": "[go vet] ERROR" "vet-error": "[go vet] ERROR",
"restore_outline": "Restore Outline"
} }

View File

@ -30,7 +30,23 @@
.side .tabs-panel { .side .tabs-panel {
overflow: auto; overflow: auto;
} }
/* start side */ /* end side */
/* start side right */
.side-right {
height: 70%;
position: absolute;
right: 0;
width: 20%;
z-index: 8;
}
.side-right-max {
width: 100%;
height: 100%;
z-index: 11;
}
/* end side right */
/* start tree */ /* start tree */
.ztree { .ztree {

View File

@ -19,6 +19,11 @@
border-right: 1px solid #000; border-right: 1px solid #000;
} }
.side-right {
background-color: #303130;
border-left: 1px solid #000;
}
.footer { .footer {
background-color: #181B1D; background-color: #181B1D;
border-top: 1px solid #000000; border-top: 1px solid #000000;

View File

@ -19,6 +19,11 @@
border-right: 1px solid #919191; border-right: 1px solid #919191;
} }
.side-right {
background-color: #FFF;
border-right: 1px solid #919191;
}
.footer { .footer {
border-top: 1px solid #919191; border-top: 1px solid #919191;
background-color: #F0F0F0; background-color: #F0F0F0;

View File

@ -333,7 +333,7 @@
width: 80%; width: 80%;
position: absolute; position: absolute;
left: 20%; left: 20%;
width: 80%; width: 60%;
height: 70%; height: 70%;
overflow: hidden; overflow: hidden;
} }

View File

@ -41,11 +41,6 @@ var hotkeys = {
$(".side").css({ $(".side").css({
"left": "0" "left": "0"
}); });
if ($(".footer .ico-restore:eq(1)").css("display") === "inline") {
// 当底部最小化时
$(".bottom-window-group").css("top", "100%").hide();
}
} }
$("#files").focus(); $("#files").focus();
@ -58,22 +53,27 @@ var hotkeys = {
shiftKey: false, shiftKey: false,
which: 50, which: 50,
fun: function () { fun: function () {
if (!wide.curEditor) { if ($(".footer .ico-restore:eq(2)").css("display") === "inline") {
return; // 当文件树最小化时
$(".side-right").css({
"right": "0"
});
} }
var request = newWideRequest(); $("#outline").focus();
request.code = wide.curEditor.getValue();
$.ajax({ // var request = newWideRequest();
type: 'POST', // request.code = wide.curEditor.getValue();
url: config.context + '/outline', //
data: JSON.stringify(request), // $.ajax({
dataType: "json", // type: 'POST',
success: function (data) { // url: config.context + '/outline',
console.log(data); // data: JSON.stringify(request),
} // dataType: "json",
}); // success: function (data) {
// console.log(data);
// }
// });
} }
}, },
// Ctrl-4 // Ctrl-4

View File

@ -17,9 +17,11 @@
var windows = { var windows = {
isMaxEditor: false, isMaxEditor: false,
init: function () { init: function () {
// bottom windows
$(".footer .ico-restore:eq(1)").click(function () { $(".footer .ico-restore:eq(1)").click(function () {
windows.restoreBottom(); windows.restoreBottom();
if ($(".footer .ico-restore:eq(0)").css("display") === "none") { if ($(".footer .ico-restore:eq(0)").css("display") === "none"
&& $(".footer .ico-restore:eq(2)").css("display") === "none") {
$(".toolbars .ico-restore").removeClass("ico-restore").addClass("ico-max") $(".toolbars .ico-restore").removeClass("ico-restore").addClass("ico-max")
.attr({ .attr({
"title": config.label.max_editor, "title": config.label.max_editor,
@ -30,7 +32,8 @@ var windows = {
$(".bottom-window-group .ico-min").click(function () { $(".bottom-window-group .ico-min").click(function () {
windows.minBottom(); windows.minBottom();
if ($(".footer .ico-restore:eq(0)").css("display") === "inline") { if ($(".footer .ico-restore:eq(0)").css("display") === "inline"
&& $(".footer .ico-restore:eq(2)").css("display") === "inline") {
$(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore") $(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore")
.attr({ .attr({
"title": config.label.restore_editor, "title": config.label.restore_editor,
@ -43,9 +46,11 @@ var windows = {
windows.maxBottom(); windows.maxBottom();
}); });
// side
$(".footer .ico-restore:eq(0)").click(function () { $(".footer .ico-restore:eq(0)").click(function () {
windows.restoreSide(); windows.restoreSide();
if ($(".footer .ico-restore:eq(1)").css("display") === "none") { if ($(".footer .ico-restore:eq(1)").css("display") === "none"
&& $(".footer .ico-restore:eq(2)").css("display") === "none") {
$(".toolbars .ico-restore").removeClass("ico-restore").addClass("ico-max") $(".toolbars .ico-restore").removeClass("ico-restore").addClass("ico-max")
.attr({ .attr({
"title": config.label.max_editor, "title": config.label.max_editor,
@ -56,7 +61,8 @@ var windows = {
$(".side .ico-min").click(function () { $(".side .ico-min").click(function () {
windows.minSide(); windows.minSide();
if ($(".footer .ico-restore:eq(1)").css("display") === "inline") { if ($(".footer .ico-restore:eq(1)").css("display") === "inline"
&& $(".footer .ico-restore:eq(2)").css("display") === "inline") {
$(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore") $(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore")
.attr({ .attr({
"title": config.label.restore_editor, "title": config.label.restore_editor,
@ -69,11 +75,41 @@ var windows = {
windows.maxSide(); windows.maxSide();
}); });
// side right
$(".footer .ico-restore:eq(2)").click(function () {
windows.restoreSideRight();
if ($(".footer .ico-restore:eq(1)").css("display") === "none"
&& $(".footer .ico-restore:eq(0)").css("display") === "none") {
$(".toolbars .ico-restore").removeClass("ico-restore").addClass("ico-max")
.attr({
"title": config.label.max_editor,
"onclick": "windows.maxEditor()"
});
}
});
$(".side-right .ico-min").click(function () {
windows.minSideRight();
if ($(".footer .ico-restore:eq(1)").css("display") === "inline"
&& $(".footer .ico-restore:eq(0)").css("display") === "inline") {
$(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore")
.attr({
"title": config.label.restore_editor,
"onclick": "windows.restoreEditor()"
});
}
});
$(".side-right .tabs").dblclick(function () {
windows.maxSideRight();
});
$(window).click(function (event) { $(window).click(function (event) {
if ($(event.target).closest(".footer").length === 1 if ($(event.target).closest(".footer").length === 1
|| $(event.target).closest(".bottom-window-group").length === 1 || $(event.target).closest(".bottom-window-group").length === 1
|| $(event.target).closest(".toolbars").length === 1 || $(event.target).closest(".toolbars").length === 1
|| $(event.target).closest(".side").length === 1) { || $(event.target).closest(".side").length === 1
|| $(event.target).closest(".side-right").length === 1) {
} else { } else {
windows.clearFloat(); windows.clearFloat();
} }
@ -107,6 +143,14 @@ var windows = {
$it.addClass("side-max"); $it.addClass("side-max");
} }
}, },
maxSideRight: function () {
var $it = $(".side-right");
if ($it.hasClass("side-right-max")) {
windows.restoreSideRight();
} else {
$it.addClass("side-right-max");
}
},
restoreBottom: function () { restoreBottom: function () {
var $it = $(".bottom-window-group"); var $it = $(".bottom-window-group");
$it.removeClass("bottom-window-group-max").attr("style", ""); $it.removeClass("bottom-window-group-max").attr("style", "");
@ -117,7 +161,7 @@ var windows = {
$it.animate({ $it.animate({
"top": "70%" "top": "70%"
}, function () { }, function () {
$(".edit-panel").css("height", "70%"); $(".edit-panel, .side-right").css("height", "70%");
var editorDatas = editors.data, var editorDatas = editors.data,
height = $(".edit-panel").height() - $(".edit-panel .tabs").height(); height = $(".edit-panel").height() - $(".edit-panel .tabs").height();
@ -146,11 +190,33 @@ var windows = {
"width": "80%" "width": "80%"
}); });
if ($(".footer .ico-restore:eq(2)").css("display") === "inline") {
// 当outline最小化时
$(".edit-panel").css("width", "80%");
} else {
$(".edit-panel").css("width", "60%");
}
$(".footer .ico-restore:eq(0)").hide(); $(".footer .ico-restore:eq(0)").hide();
}).removeClass("side-max"); }).removeClass("side-max");
}, },
restoreSideRight: function () {
$(".side-right").animate({
"right": "0"
}, function () {
if ($(".footer .ico-restore:eq(0)").css("display") === "inline") {
// 当文件树最小化时
$(".edit-panel").css("width", "80%");
} else {
$(".edit-panel").css("width", "60%");
}
$(".footer .ico-restore:eq(2)").hide();
}).removeClass("side-right-max");
;
},
minBottom: function () { minBottom: function () {
$(".edit-panel").css("height", "100%"); $(".edit-panel, .side-right").css("height", "100%");
var editorDatas = editors.data, var editorDatas = editors.data,
height = $(".content").height() - $(".edit-panel .tabs").height(); height = $(".content").height() - $(".edit-panel .tabs").height();
@ -164,12 +230,36 @@ var windows = {
minSide: function () { minSide: function () {
$(".side").css("left", "-20%").removeClass("side-max"); $(".side").css("left", "-20%").removeClass("side-max");
var width = '80%';
if ($(".footer .ico-restore:eq(2)").css("display") === "inline") {
// 当 outline 最小化时
width = '100%';
}
$(".edit-panel, .bottom-window-group").css({ $(".edit-panel, .bottom-window-group").css({
"left": "0", "left": "0",
"width": "100%" "width": width
}); });
$(".bottom-window-group").css({
"left": "0",
"width": '100%'
});
$(".footer .ico-restore:eq(0)").show(); $(".footer .ico-restore:eq(0)").show();
}, },
minSideRight: function () {
$(".side-right").css("right", "-20%");
$(".footer .ico-restore:eq(2)").show();
if ($(".footer .ico-restore:eq(0)").css("display") === "inline") {
// 当文件树最小化时
$(".edit-panel").css("width", "100%");
} else {
$(".edit-panel").css("width", "80%");
}
},
maxEditor: function () { maxEditor: function () {
$(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore") $(".toolbars .ico-max").removeClass("ico-max").addClass("ico-restore")
.attr({ .attr({
@ -179,6 +269,7 @@ var windows = {
windows.minBottom(); windows.minBottom();
windows.minSide(); windows.minSide();
windows.minSideRight();
if (wide.curEditor) { if (wide.curEditor) {
wide.curEditor.focus(); wide.curEditor.focus();
} }
@ -194,6 +285,7 @@ var windows = {
windows.restoreBottom(); windows.restoreBottom();
windows.restoreSide(); windows.restoreSide();
windows.restoreSideRight();
if (wide.curEditor) { if (wide.curEditor) {
wide.curEditor.focus(); wide.curEditor.focus();
} }
@ -210,6 +302,11 @@ var windows = {
// 当底部最小化时 // 当底部最小化时
windows.minBottom(); windows.minBottom();
} }
if ($(".footer .ico-restore:eq(2)").css("display") === "inline") {
// 当 outline 最小化时
windows.minSideRight();
}
}, },
flowBottom: function () { flowBottom: function () {
if ($(".footer .ico-restore:eq(1)").css("display") === "inline") { if ($(".footer .ico-restore:eq(1)").css("display") === "inline") {
@ -220,11 +317,6 @@ var windows = {
"width": "100%", "width": "100%",
"z-index": "8" "z-index": "8"
}).show(); }).show();
if ($(".footer .ico-restore:eq(0)").css("display") === "inline") {
// 当文件最小化时
$(".side").css("left", "-20%");
}
} }
} }
}; };

View File

@ -468,22 +468,19 @@
<div class="tabs-panel"></div> <div class="tabs-panel"></div>
</div> </div>
<!-- <div class="side-right">
TODO: https://github.com/b3log/wide/issues/199
<div style="height: 70%;position: absolute;right: 0;background-color: #FFF;width: 20%;">
<span title="{{.i18n.min}}" class="font-ico ico-min"></span> <span title="{{.i18n.min}}" class="font-ico ico-min"></span>
<div class="tabs"> <div class="tabs">
<div class="current"> <div class="current" data-index="outline">
<span title="{{.i18n.outline}}">{{.i18n.outline}}</span> <span title="{{.i18n.outline}}">{{.i18n.outline}}</span>
</div> </div>
</div> </div>
<div class="tabs-panel"> <div class="tabs-panel">
<div id="outline"> <div id="outline" tabindex="-1" data-index="outline">
this is outline this is outline
</div> </div>
</div> </div>
</div> </div>
-->
<div class="bottom-window-group"> <div class="bottom-window-group">
<span title="{{.i18n.min}}" class="font-ico ico-min"></span> <span title="{{.i18n.min}}" class="font-ico ico-min"></span>
@ -532,6 +529,7 @@
<div class="fn-left"> <div class="fn-left">
<span title="{{.i18n.restore_side}}" class="font-ico ico-restore fn-none"></span> <span title="{{.i18n.restore_side}}" class="font-ico ico-restore fn-none"></span>
<span title="{{.i18n.restore_bottom}}" class="font-ico ico-restore fn-none"></span> <span title="{{.i18n.restore_bottom}}" class="font-ico ico-restore fn-none"></span>
<span title="{{.i18n.restore_outline}}" class="font-ico ico-restore fn-none"></span>
</div> </div>
<div class="fn-right"> <div class="fn-right">
<span class="cursor"></span> <span class="cursor"></span>