From 0315077daf3c2d112737fb27b05abf90fc45212a Mon Sep 17 00:00:00 2001
From: Mario Vavti <mario@mariovavti.com>
Date: Sat, 10 Dec 2016 15:08:49 +0100
Subject: wiki fullscreen optimisation

---
 view/css/mod_wiki.css             |  9 +++++++++
 view/theme/redbasic/css/style.css |  6 ++++++
 view/tpl/wiki.tpl                 | 28 ++++++++++++++++++++--------
 3 files changed, 35 insertions(+), 8 deletions(-)

(limited to 'view')

diff --git a/view/css/mod_wiki.css b/view/css/mod_wiki.css
index 30cbe0896..83f17c820 100644
--- a/view/css/mod_wiki.css
+++ b/view/css/mod_wiki.css
@@ -2,11 +2,20 @@
 	position: relative;        
 	width: 100%;
 	height: 500px;
+	border: 1px solid #ccc;
+	border-top: 0px;
 }
 
 #editor {
 	width: 100%;
 	height: 500px;
+	border: 1px solid #ccc;
+	border-top: 0px;
+	display: inherit;
+}
+
+#id_commitMsg_wrapper {
+	margin-top: 3px;
 }
 
 .fade.in {
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index ae4853ec6..ff0e1c509 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -2040,6 +2040,12 @@ dl.bb-dl > dd > li {
 	max-width: 100%;
 }
 
+#ace-editor,
+#editor {
+	border-bottom-left-radius: $radiuspx;
+	border-bottom-right-radius: $radiuspx;
+}
+
 .sub-menu {
 	margin-top: 10px;
 	padding-left: 15px;
diff --git a/view/tpl/wiki.tpl b/view/tpl/wiki.tpl
index 7d698b493..11c0cb2ca 100644
--- a/view/tpl/wiki.tpl
+++ b/view/tpl/wiki.tpl
@@ -18,7 +18,7 @@
 				</ul>
 			</div>	
 			{{/if}}
-			<button id="fullscreen-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen();"><i class="fa fa-expand"></i></button>
+			<button id="fullscreen-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(); adjustFullscreenEditorHeight();"><i class="fa fa-expand"></i></button>
 			<button id="inline-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(false);"><i class="fa fa-compress"></i></button>
 		</div>
 		<h2>
@@ -52,11 +52,13 @@
 				{{if !$mimeType || $mimeType == 'text/markdown'}}
 				<div id="ace-editor"></div>
 				{{else}}
-				<textarea id="editor">{{$content}}</textarea>
+				<div id="editor-wrapper">
+					<textarea id="editor">{{$content}}</textarea>
+				</div>
 				{{/if}}
 				{{if $showPageControls}}
 				<div>
-					<div id="id_{{$commitMsg.0}}_wrapper" class="form-group field input">
+					<div id="id_{{$commitMsg.0}}_wrapper" class="field input">
 						<div class="input-group">
 							<input class="widget-input" name="{{$commitMsg.0}}" id="id_{{$commitMsg.0}}" type="text" value="{{$commitMsg.2}}"{{if $commitMsg.5}} {{$commitMsg.5}}{{/if}}>
 							<div class="input-group-btn">
@@ -147,9 +149,6 @@
 
 		wrap: true,
 
-		minLines: 30,
-		maxLines: Infinity,
-
 		printMargin: false
 	});
 
@@ -168,8 +167,9 @@
 	{{/if}}
 
 	$('#edit-pane-tab').click(function (ev) {
-		setTimeout(function() {window.editor.focus();}, 500); // Return the focus to the editor allowing immediate text entry
-			$('#page-tools').show();
+		setTimeout(function() {window.editor.focus(); adjustFullscreenEditorHeight();}, 500); // Return the focus to the editor allowing immediate text entry
+		$('#page-tools').show();
+
 	});
 
 	$('#wiki-get-preview').click(function (ev) {
@@ -324,6 +324,14 @@
 		}, 'json');
 	}
 
+	function adjustFullscreenEditorHeight() {
+		$('#editor, #ace-editor').height($(window).height() - $('#id_commitMsg_wrapper').outerHeight(true) - $('.section-title-wrapper').outerHeight(true) - $('#wiki-nav-tabs').outerHeight(true) - 17);
+	}
+
+	function adjustInlineEditorHeight() {
+		$('#editor, #ace-editor').height($(window).height() - $('#id_commitMsg_wrapper').outerHeight(true) - $('.section-title-wrapper').outerHeight(true) - $('nav').outerHeight(true) - 23);
+	}
+
 	$('#embed-image').click(function (ev) {
 		initializeEmbedPhotoDialog();
 		ev.preventDefault();
@@ -437,4 +445,8 @@
 		window.editor.bbco_autocomplete('bbcode');
 		{{/if}}
 	});
+
+	$(window).resize(function () {
+		adjustFullscreenEditorHeight();
+	});
 </script>
-- 
cgit v1.2.3