mirror of
https://github.com/danpros/htmly.git
synced 2026-04-21 04:56:23 +05:30
Added a focus mode to the Add/Edit for Posts/Pages
Added a focus mode that hides all extra information using CSS/Javascript to hide DIVs. This works for both new and draft pages/posts.
This commit is contained in:
KuJoe
parent
4a78e486f2
commit
f7c8fede7a
5 changed files with 70 additions and 6 deletions
|
|
@ -90,7 +90,7 @@ $( function() {
|
|||
<div class="row">
|
||||
<div class="wmd-panel" style="width:100%;">
|
||||
<form method="POST">
|
||||
<div class="row">
|
||||
<div id="post-settings" class="row">
|
||||
<div class="col-sm-6">
|
||||
<label for="pTitle"><?php echo i18n('Title');?> <span class="required">*</span></label>
|
||||
<input autofocus type="text" class="form-control text <?php if (isset($postTitle)) { if (empty($postTitle)) { echo 'error';}} ?>" id="pTitle" name="title" value="<?php if (isset($postTitle)) { echo $postTitle;} ?>"/>
|
||||
|
|
@ -181,7 +181,7 @@ $( function() {
|
|||
<label for="wmd-input"><?php echo i18n('Content');?> <span class="required">*</span></label>
|
||||
<div id="wmd-button-bar" class="wmd-button-bar"></div>
|
||||
<textarea id="wmd-input" class="form-control wmd-input <?php if (isset($postContent)) { if (empty($postContent)) { echo 'error'; } } ?>" name="content" cols="20" rows="15"><?php if (isset($postContent)) { echo $postContent;} ?></textarea><br>
|
||||
<input type="submit" name="publish" class="btn btn-primary submit" value="<?php echo i18n('Publish');?>"/> <input type="submit" name="draft" class="btn btn-primary draft" value="<?php echo i18n('Save_as_draft');?>"/>
|
||||
<input type="submit" name="publish" class="btn btn-primary submit" value="<?php echo i18n('Publish');?>"/> <input type="submit" name="draft" class="btn btn-primary draft" value="<?php echo i18n('Save_as_draft');?>"/> <input type="button" id="hideButton" class="btn btn-secondary" value="<?php echo i18n('Focus_mode');?>"/>
|
||||
<br><br>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -319,6 +319,21 @@ $('.img-container').on("click", ".the-img", function(e) {
|
|||
$('#insertImageDialogURL').val($(e.target).attr('src'));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
function toggleDivs() {
|
||||
var div1 = document.getElementById('post-settings');
|
||||
if (div1.style.display === 'none') {
|
||||
div1.style.display = '';
|
||||
document.body.classList.add("sidebar-mini");
|
||||
document.body.classList.remove("sidebar-collapse")
|
||||
} else {
|
||||
div1.style.display = 'none';
|
||||
document.body.classList.remove("sidebar-mini")
|
||||
document.body.classList.add("sidebar-collapse");
|
||||
}
|
||||
}
|
||||
document.getElementById('hideButton').addEventListener('click', toggleDivs);
|
||||
</script>
|
||||
<?php if (config('autosave.enable') == 'true' ):?>
|
||||
<script src="<?php echo site_url();?>system/resources/js/save_draft.js"></script>
|
||||
<?php endif;?>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<div class="row">
|
||||
<div class="wmd-panel" style="width:100%;">
|
||||
<form method="POST">
|
||||
<div class="row">
|
||||
<div id="post-settings" class="row">
|
||||
<div class="col-sm-6">
|
||||
<label for="pTitle"><?php echo i18n('Title');?> <span class="required">*</span></label>
|
||||
<input type="text" class="form-control text <?php if (isset($postTitle)) {if (empty($postTitle)) {echo 'error';}} ?>" id="pTitle" name="title" value="<?php if (isset($postTitle)) {echo $postTitle;} ?>"/>
|
||||
|
|
@ -48,6 +48,7 @@
|
|||
<?php if ($type == 'is_category') :?>
|
||||
<input type="submit" name="submit" class="btn btn-primary submit" value="<?php echo i18n('Add_category');?>"/>
|
||||
<?php endif;?>
|
||||
<input type="button" id="hideButton" class="btn btn-secondary" value="<?php echo i18n('Focus_mode');?>"/>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label><?php echo i18n('Preview');?></label>
|
||||
|
|
@ -145,6 +146,21 @@ $('.img-container').on("click", ".the-img", function(e) {
|
|||
$('#insertImageDialogURL').val($(e.target).attr('src'));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
function toggleDivs() {
|
||||
var div1 = document.getElementById('post-settings');
|
||||
if (div1.style.display === 'none') {
|
||||
div1.style.display = '';
|
||||
document.body.classList.add("sidebar-mini");
|
||||
document.body.classList.remove("sidebar-collapse")
|
||||
} else {
|
||||
div1.style.display = 'none';
|
||||
document.body.classList.remove("sidebar-mini")
|
||||
document.body.classList.add("sidebar-collapse");
|
||||
}
|
||||
}
|
||||
document.getElementById('hideButton').addEventListener('click', toggleDivs);
|
||||
</script>
|
||||
<?php if (config('autosave.enable') == 'true' ):?>
|
||||
<script src="<?php echo site_url();?>system/resources/js/save_draft.js"></script>
|
||||
<?php endif;?>
|
||||
|
|
|
|||
|
|
@ -135,7 +135,7 @@ $( function() {
|
|||
<div class="row">
|
||||
<div class="wmd-panel" style="width:100%;">
|
||||
<form method="POST">
|
||||
<div class="row">
|
||||
<div id="post-settings" class="row">
|
||||
<div class="col-sm-6">
|
||||
<label for="pTitle"><?php echo i18n('Title');?> <span class="required">*</span></label>
|
||||
<input autofocus type="text" id="pTitle" name="title" class="form-control text <?php if (isset($postTitle)) { if (empty($postTitle)) { echo 'error';} } ?>" value="<?php echo $oldtitle ?>"/>
|
||||
|
|
@ -233,6 +233,7 @@ $( function() {
|
|||
<?php } else { ?>
|
||||
<input type="submit" name="updatepost" class="btn btn-primary submit" value="<?php echo i18n('Update_post');?>"/> <input type="submit" name="revertpost" class="btn btn-primary revert" value="<?php echo i18n('Revert_to_draft');?>"/> <a class="btn btn-danger" href="<?php echo $delete ?>"><?php echo i18n('Delete');?></a>
|
||||
<?php }?>
|
||||
<input type="button" id="hideButton" class="btn btn-secondary" value="<?php echo i18n('Focus_mode');?>"/>
|
||||
<br><br>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -369,6 +370,21 @@ $('.img-container').on("click", ".the-img", function(e) {
|
|||
$('#insertImageDialogURL').val($(e.target).attr('src'));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
function toggleDivs() {
|
||||
var div1 = document.getElementById('post-settings');
|
||||
if (div1.style.display === 'none') {
|
||||
div1.style.display = '';
|
||||
document.body.classList.add("sidebar-mini");
|
||||
document.body.classList.remove("sidebar-collapse")
|
||||
} else {
|
||||
div1.style.display = 'none';
|
||||
document.body.classList.remove("sidebar-mini")
|
||||
document.body.classList.add("sidebar-collapse");
|
||||
}
|
||||
}
|
||||
document.getElementById('hideButton').addEventListener('click', toggleDivs);
|
||||
</script>
|
||||
<?php if (config('autosave.enable') == 'true' ):?>
|
||||
<?php if ($isdraft[4] == 'draft') : ?>
|
||||
<script src="<?php echo site_url();?>system/resources/js/save_draft.js"></script>
|
||||
|
|
|
|||
|
|
@ -99,7 +99,7 @@ $images = image_gallery(null, 1, 40);
|
|||
<div class="row">
|
||||
<div class="wmd-panel" style="width:100%;">
|
||||
<form method="POST">
|
||||
<div class="row">
|
||||
<div id="post-settings" class="row">
|
||||
<div class="col-sm-6">
|
||||
<label for="pTitle"><?php echo i18n('Title');?> <span class="required">*</span></label>
|
||||
<input type="text" id="pTitle" name="title" class="form-control text <?php if (isset($postTitle)) { if (empty($postTitle)) { echo 'error'; } } ?>" value="<?php echo $oldtitle ?>"/>
|
||||
|
|
@ -159,6 +159,7 @@ $images = image_gallery(null, 1, 40);
|
|||
<input type="submit" name="submit" class="btn btn-primary submit" value="<?php echo i18n('Save');?>"/> <?php if (empty($dd) && empty($dr) && $type != 'is_page'):?><input type="submit" name="revertpage" class="btn btn-primary revert" value="<?php echo i18n('Revert_to_draft');?>"/> <a class="btn btn-danger" href="<?php echo $delete ?>"><?php echo i18n('Delete');?></a><?php endif;?>
|
||||
<?php } ?>
|
||||
<?php } ?>
|
||||
<input type="button" id="hideButton" class="btn btn-secondary" value="<?php echo i18n('Focus_mode');?>"/>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<label><?php echo i18n('Preview');?></label>
|
||||
|
|
@ -296,6 +297,21 @@ $('.img-container').on("click", ".the-img", function(e) {
|
|||
$('#insertImageDialogURL').val($(e.target).attr('src'));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
function toggleDivs() {
|
||||
var div1 = document.getElementById('post-settings');
|
||||
if (div1.style.display === 'none') {
|
||||
div1.style.display = '';
|
||||
document.body.classList.add("sidebar-mini");
|
||||
document.body.classList.remove("sidebar-collapse")
|
||||
} else {
|
||||
div1.style.display = 'none';
|
||||
document.body.classList.remove("sidebar-mini")
|
||||
document.body.classList.add("sidebar-collapse");
|
||||
}
|
||||
}
|
||||
document.getElementById('hideButton').addEventListener('click', toggleDivs);
|
||||
</script>
|
||||
<?php if (config('autosave.enable') == 'true' ):?>
|
||||
<?php if (stripos($dir . '/', '/draft/') !== false): ?>
|
||||
<script src="<?php echo site_url();?>system/resources/js/save_draft.js"></script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue