From 2bff02355086bdf46de781d930f038c455abee3b Mon Sep 17 00:00:00 2001 From: Van Date: Wed, 24 Sep 2014 16:25:26 +0800 Subject: [PATCH] fullscreen --- conf/wide.json | 8 +++-- static/css/base.css | 68 +++++++++++++++++++++----------------- static/css/side.css | 7 ++++ static/js/wide.js | 38 ++++++++++++++++++--- view/index.html | 80 ++++++++++++++++++++++----------------------- 5 files changed, 123 insertions(+), 78 deletions(-) diff --git a/conf/wide.json b/conf/wide.json index 7e2ce5a..2c8f53c 100644 --- a/conf/wide.json +++ b/conf/wide.json @@ -16,10 +16,14 @@ "Workspace": "{pwd}/data/user_workspaces/admin", "LatestSessionContent": { "FileTree": [ - "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest" + "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest", + "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest\\time", + "D:\\go\\src\\pkg", + "D:\\go\\src\\pkg\\archive" ], "Files": [ - "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest\\1123" + "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest\\1123", + "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest\\time\\main.go" ], "CurrentFile": "E:\\Work\\go\\src\\github.com\\b3log\\wide\\data\\user_workspaces\\admin\\src\\mytest\\1123" } diff --git a/static/css/base.css b/static/css/base.css index c1c9a3f..6814640 100644 --- a/static/css/base.css +++ b/static/css/base.css @@ -153,43 +153,31 @@ ul { /* end tabs */ /* start framework */ -.menu { - background-color: #F0F0F0; - border-bottom: 1px solid #A5A5A5; - height: 25px; -} - .content { position: relative; } .side { + background-color: #FFF; width: 20%; position: absolute; border-right: 1px solid #9B9B9B; height: 100%; } -.ztree { - position: absolute; - overflow: auto; +.side-fullscreen { width: 100%; - padding: 0; -} - -.main { - width: 80%; - position: absolute; - left: 20%; -} - -.footer { - border-top: 1px solid #919191; - background-color: #F0F0F0; + z-index: 1000; } /* end framework */ /* start menu */ +.menu { + background-color: #F0F0F0; + border-bottom: 1px solid #A5A5A5; + height: 25px; +} + .menu > ul > li { float: left; } @@ -218,8 +206,12 @@ ul { /* start editor */ .edit-panel { + width: 80%; + position: absolute; + left: 20%; background-color: #D7D7D7; - width: 100% + width: 80%; + height: 70%; } .edit-header .ico { @@ -238,6 +230,24 @@ ul { /* end editor */ /* start bottom-window-group */ +.bottom-window-group { + width: 80%; + position: absolute; + left: 20%; + width: 80%; + height: 30%; + top: 70%; + background-color: #fff; +} + +.bottom-window-group-fullscreen { + height: 100%; + left: 0; + top: -1px; + width: 100%; + z-index: 1000; +} + .bottom-window-group .tabs { background-color: #E6E6E6; border-top: 1px solid #A4A4A4; @@ -256,22 +266,15 @@ ul { color: #FFF; } -.bottom-window-group .tabs-panel { - height: 133px; -} - .bottom-window-group textarea.output { border-width: 0; background-color: #FFF; color: #555555; width: 100%; - height: 132px; } .bottom-window-group .notification, -.bottom-window-group .search, -.bottom-window-group .output { - height: 133px; +.bottom-window-group .search { overflow: auto; } @@ -292,6 +295,11 @@ ul { /* end bottom-window-group */ /* start footer */ +.footer { + border-top: 1px solid #919191; + background-color: #F0F0F0; +} + .notification-count { float: right; display: none; diff --git a/static/css/side.css b/static/css/side.css index 40b2cf5..321af67 100644 --- a/static/css/side.css +++ b/static/css/side.css @@ -1,4 +1,11 @@ /* start tree */ +.ztree { + position: absolute; + overflow: auto; + width: 100%; + padding: 0; +} + .ztree li a.curSelectedNode { background-color: #3875d7; border-width: 0; diff --git a/static/js/wide.js b/static/js/wide.js index 1b6fc7d..a6a8974 100644 --- a/static/js/wide.js +++ b/static/js/wide.js @@ -210,10 +210,12 @@ var wide = { }); }, _initLayout: function () { - var mainH = $(window).height() - $(".menu").height() - $(".footer").height() - 2; + var mainH = $(window).height() - $(".menu").height() - $(".footer").height() - 2, + bottomH = Math.floor(mainH * 0.3); $(".content, .ztree").height(mainH); - $(".edit-panel").height(mainH - $(".bottom-window-group").height()); + $(".bottom-window-group .output, notification").height(bottomH - 23); + $(".bottom-window-group .notification, .bottom-window-group .search").height(bottomH - 20); }, _initBottomWindowGroup: function () { this.bottomWindowTab = new Tabs({ @@ -294,10 +296,34 @@ var wide = { console.log('[output onerror] ' + e); }; }, - init: function () { - this._initWS(); + _initFullscreen: function () { + $(".bottom-window-group .tabs").dblclick(function () { + var $it = $(".bottom-window-group"); + if ($it.hasClass("bottom-window-group-fullscreen")) { + $(".bottom-window-group").removeClass("bottom-window-group-fullscreen"); - this._initLayout(); + } else { + var bottomH = $(".content, .ztree").height(); + $(".bottom-window-group .output, notification").height(bottomH - 22); + $(".bottom-window-group .notification, .bottom-window-group .search").height(bottomH - 19); + + $(".bottom-window-group").addClass("bottom-window-group-fullscreen"); + } + }); + + $(".side").dblclick(function () { + var $it = $(this); + if ($it.hasClass("side-fullscreen")) { + $it.removeClass("side-fullscreen"); + } else { + $it.addClass("side-fullscreen"); + } + }); + }, + init: function () { + this._initFullscreen(); + + this._initWS(); this._initBottomWindowGroup(); @@ -318,6 +344,8 @@ var wide = { }); this._initDialog(); + + this._initLayout(); }, _save: function () { var request = newWideRequest(); diff --git a/view/index.html b/view/index.html index 8068dab..ce10dec 100644 --- a/view/index.html +++ b/view/index.html @@ -128,36 +128,34 @@ -
-
-
-
-
-
+
+
+
+
+
-
-
-
- Output -
-
- Search -
-
- Notification -
+
+
+
+ Output
-
-
- -
-
-
-
-
-
-
+
+ Search +
+
+ Notification +
+
+
+
+ +
+
+
+
+
+
@@ -185,20 +183,20 @@