wiki fullscreen optimisation

This commit is contained in:
Mario Vavti 2016-12-10 15:08:49 +01:00
parent 0a6916e1b9
commit 0315077daf
3 changed files with 35 additions and 8 deletions

View File

@ -2,11 +2,20 @@
position: relative; position: relative;
width: 100%; width: 100%;
height: 500px; height: 500px;
border: 1px solid #ccc;
border-top: 0px;
} }
#editor { #editor {
width: 100%; width: 100%;
height: 500px; height: 500px;
border: 1px solid #ccc;
border-top: 0px;
display: inherit;
}
#id_commitMsg_wrapper {
margin-top: 3px;
} }
.fade.in { .fade.in {

View File

@ -2040,6 +2040,12 @@ dl.bb-dl > dd > li {
max-width: 100%; max-width: 100%;
} }
#ace-editor,
#editor {
border-bottom-left-radius: $radiuspx;
border-bottom-right-radius: $radiuspx;
}
.sub-menu { .sub-menu {
margin-top: 10px; margin-top: 10px;
padding-left: 15px; padding-left: 15px;

View File

@ -18,7 +18,7 @@
</ul> </ul>
</div> </div>
{{/if}} {{/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> <button id="inline-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(false);"><i class="fa fa-compress"></i></button>
</div> </div>
<h2> <h2>
@ -52,11 +52,13 @@
{{if !$mimeType || $mimeType == 'text/markdown'}} {{if !$mimeType || $mimeType == 'text/markdown'}}
<div id="ace-editor"></div> <div id="ace-editor"></div>
{{else}} {{else}}
<textarea id="editor">{{$content}}</textarea> <div id="editor-wrapper">
<textarea id="editor">{{$content}}</textarea>
</div>
{{/if}} {{/if}}
{{if $showPageControls}} {{if $showPageControls}}
<div> <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"> <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}}> <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"> <div class="input-group-btn">
@ -147,9 +149,6 @@
wrap: true, wrap: true,
minLines: 30,
maxLines: Infinity,
printMargin: false printMargin: false
}); });
@ -168,8 +167,9 @@
{{/if}} {{/if}}
$('#edit-pane-tab').click(function (ev) { $('#edit-pane-tab').click(function (ev) {
setTimeout(function() {window.editor.focus();}, 500); // Return the focus to the editor allowing immediate text entry setTimeout(function() {window.editor.focus(); adjustFullscreenEditorHeight();}, 500); // Return the focus to the editor allowing immediate text entry
$('#page-tools').show(); $('#page-tools').show();
}); });
$('#wiki-get-preview').click(function (ev) { $('#wiki-get-preview').click(function (ev) {
@ -324,6 +324,14 @@
}, 'json'); }, '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) { $('#embed-image').click(function (ev) {
initializeEmbedPhotoDialog(); initializeEmbedPhotoDialog();
ev.preventDefault(); ev.preventDefault();
@ -437,4 +445,8 @@
window.editor.bbco_autocomplete('bbcode'); window.editor.bbco_autocomplete('bbcode');
{{/if}} {{/if}}
}); });
$(window).resize(function () {
adjustFullscreenEditorHeight();
});
</script> </script>