Commit 2486eb1e authored by SamJanis's avatar SamJanis
Browse files

Post header sticks during editing

When editing long pages, the recipients field and cancel button were scrolled
out of view. Now they have been placed in their own container (along with other
post credits that show at the top of a post) and a class added during editing,
keeping the container always visible, even when scrolling during editing a long
post.

Another bug was fixed where clicking a "Reply" link would crash the javascript
if another post was being edited.
parent 82297feb
......@@ -7899,6 +7899,7 @@ function index_js_sendNewPost_AjaxFunction()
if ((ajaxcommand == "new_post") || (ajaxcommand == "new_postreply")
|| (ajaxcommand == "edit_post") || (ajaxcommand == "edit_message")) {
index_js_emptyElementById('editpostsuggestions');
$('postheader_'+id).classList.remove('postheadersticky');
$('editpostcancel').style.display = "none";
$('editpostcontrols').style.display = "none";
$('post_NEWPOST').appendChild($('editpostcancel'));
......@@ -9173,8 +9174,14 @@ function index_js_setupPostEditor_AjaxFunction()
index_js_emptyElementById(hostdivid);
 
index_editposthostdiv = $(hostdivid);
index_editposthostdiv.style.paddingTop = "24px";
index_editposthostdiv.appendChild($('editpostcancel'));
/* Add header to accept recipients editor and cancel button */
let headerdiv = document.createElement('div');
headerdiv.className = 'postheader postheadersticky';
headerdiv.style.paddingTop = "24px";
$(hostdivid).appendChild(headerdiv);
headerdiv.appendChild($('editpostcancel'));
 
/* Set up recipients editor */
var recipientsdiv = document.createElement('div');
......@@ -9185,7 +9192,7 @@ function index_js_setupPostEditor_AjaxFunction()
recipientsul.id = 'postrecipientsUL_NEWPOST';
recipientsul.className = "inlinelist";
recipientsdiv.appendChild(recipientsul);
$(hostdivid).appendChild(recipientsdiv)
headerdiv.appendChild(recipientsdiv)
index_editrecipientsdiv = recipientsdiv;
index_js_setEditorRecipients('NEWPOST', 'post', true, recipients);
 
......@@ -9272,6 +9279,9 @@ function index_js_setupPostEditor(ev, hostdivid, phylum, parentid, inlinereply,
if (!confirm("Another post is being edited.\n\nDiscard edited post?"))
return; /* Don't discard already edited post. */
 
/* id = 0 && parent = 0 == NEWPOST */
let cancelled = index_js_cancelEditPost(true);
index_editdescription.contentEditable = "false";
}
 
/* Transfer variables from this function to the ajax_function */
......@@ -9358,7 +9368,8 @@ function index_js_editPost_AjaxFunction()
if (editpostphylum == 'post') {
$('editpostajaxcommand').value = "edit_post";
/* Without .firstElementChild() the edit controls would appear AFTER the replies. */
$('postblock_'+editpostid).insertBefore($('editpostcancel'), $('postblock_'+editpostid).firstChild);
$('postheader_'+editpostid).insertBefore($('editpostcancel'), $('postheader_'+editpostid).firstChild);
$('postheader_'+editpostid).classList.add('postheadersticky');
$('postblock_'+editpostid).appendChild($('editpostcontrols'));
// was $('post'+editpostid).firstElementChild.appendChild($('editpostcontrols'));
$('editpostcancel').style.display = "block";
......@@ -9499,6 +9510,10 @@ function index_js_cancelEditPost(forceCancel)
index_editposthostdiv.style.paddingTop = '';
}
 
if (index_editpostid != 'NEWPOST') {
$('postheader_'+index_editpostid).classList.remove('postheadersticky');
}
var cancelpostformdata = new FormData();
cancelpostformdata.append("ajax_command", "cancel_edit_post");
cancelpostformdata.append("canceleditpostid", index_editpostid);
......@@ -11068,6 +11083,9 @@ function index_js_showeditorpopup(popupbuttonid, popupdivid, setpopupids)
index_editorpopupdivid = popupdivid;
}
 
if (!popupdivid || !popupbuttonid)
return;
let popupbutton = $(index_editorpopupbuttonid);
let popupdiv = $(index_editorpopupdivid);
 
......@@ -11306,7 +11324,7 @@ function index_js_updatePostPermissions(editor, id)
}
 
if (checkAgeRating) {
let agerating = $('editpostagerating').value;
let agerating = Math.ceil($('editpostagerating').value);
switch (agerating) {
case 3:
$('editpostpermissionsageratingtitle').innerText = 'General';
......@@ -12875,7 +12893,8 @@ if (window.File && window.FileReader) {
 
function index_js_scrollEvent()
{
if ($('editpostcontrols').style.display == 'block') {
if ($('editpostcontrols')
&& ($('editpostcontrols').style.display == 'block')) {
index_js_showeditorpopup(0, 0, false);
}
 
......@@ -13926,16 +13945,18 @@ if ($index_page == 'page') {
|| ($index_activeuserconfirmedage >= $postflagagerating))
|| !$flagpost) {
?>
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, true, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postid, true, 'title', $index_page, 'full')?>
<div id="postheader_<?=$postid?>" class="postheader">
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, true, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postid, true, 'title', $index_page, 'full')?>
</div>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
</div>
<div id="postmembers_<?=$postid?>" class="postmembers">
<?=index_php_insertPostMembers('post', $postid)?>
</div>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
<?php
}
?>
......@@ -14490,16 +14511,18 @@ if ($index_pinnedposts) {
/* With pinned posts, popuplist always has 'full' for $pageview.
* No need to check for $index_viewmode. */
?>
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, $showparent, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postid, false, 'post', $index_page, 'full')?>
<div id="postheader_<?=$postid?>" class="postheader">
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, $showparent, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postid, false, 'post', $index_page, 'full')?>
</div>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
</div>
<div id="postmembers_<?=$postid?>" class="postmembers">
<?=index_php_insertPostMembers('post', $postid)?>
</div>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
<?php
}
?>
......@@ -14881,17 +14904,19 @@ if ($index_pinnedposts) {
<?php
if (($flagpost && $showflaggedpost) || !$flagpost) {
?>
<div id="postcredits_<?=$postreplyid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postreplyid, false, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postreplyid,
false, 'reply', false, 'full')?>
<div id="postheader_<?=$postreplyid?>" class="postheader">
<div id="postcredits_<?=$postreplyid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postreplyid, false, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postreplyid,
false, 'reply', false, 'full')?>
</div>
<div id="postrecipients_<?=$postreplyid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postreplyid)?>
</div>
</div>
<div id="postmembers_<?=$postreplyid?>" class="postmembers">
<?=index_php_insertPostMembers('post', $postreplyid)?>
</div>
<div id="postrecipients_<?=$postreplyid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postreplyid)?>
</div>
<?php
}
?>
......@@ -15910,6 +15935,11 @@ if ($index_recentposts) {
<div id="postblock_<?=$postid?>" class="<?=$postblockclass?>">
<?php
if (($flagpost && $showflaggedpost) || !$flagpost) {
if ($index_viewmode == 'full') {
?>
<div id="postheader_<?=$postid?>" class="postheader"><!-- Condionally closes below -->
<?php
}
 
$showparent = false;
if ($index_page == 'profile') {
......@@ -15920,9 +15950,9 @@ if ($index_recentposts) {
if ($index_viewmode == 'list')
$moredetail = false;
?>
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, $showparent,
$index_viewmode, $moredetail)?>
<div id="postcredits_<?=$postid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postid, $showparent,
$index_viewmode, $moredetail)?>
<?php
/* Full and thumbnail view have popup list in post credits. */
if (($index_viewmode == 'full') || ($index_viewmode == 'thumbnail')) {
......@@ -15932,18 +15962,19 @@ if ($index_recentposts) {
<?php
}
?>
</div>
</div>
<?php
 
/* Only show other data with full post. */
if ($index_viewmode == 'full') {
?>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
</div><!-- postheader closing tag. Conditionally opens above. -->
<div id="postmembers_<?=$postid?>" class="postmembers">
<?=index_php_insertPostMembers('post', $postid)?>
</div>
<div id="postrecipients_<?=$postid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postid)?>
</div>
<?php
}
}
......@@ -16435,17 +16466,19 @@ if ($index_recentposts) {
<?php
if (($flagpost && $showflaggedpost) || !$flagpost) {
?>
<div id="postcredits_<?=$postreplyid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postreplyid, false, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postreplyid,
false, 'reply', false, 'full')?>
<div id="postheader_<?=$postreplyid?>" class="postheader">
<div id="postcredits_<?=$postreplyid?>" class="postcredits">
<?=index_php_insertPostCredits('post', $postreplyid, false, 'full', true)?>
<?=index_php_insertPostPopupList('post', $postreplyid,
false, 'reply', false, 'full')?>
</div>
<div id="postrecipients_<?=$postreplyid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postreplyid)?>
</div>
</div>
<div id="postmembers_<?=$postreplyid?>" class="postmembers">
<?=index_php_insertPostMembers('post', $postreplyid)?>
</div>
<div id="postrecipients_<?=$postreplyid?>" class="recipientsdiv">
<?=index_php_insertPostRecipients('post', $postreplyid)?>
</div>
<?php
}
?>
......
......@@ -1215,6 +1215,16 @@ p.information {
padding:6px 4px;
}
.postheader {
z-index:1;
background:#fff;
}
.postheadersticky {
position:sticky;
top:0;
}
.postcredits,
.debugpostclass > .postmembers,
.postdescription {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment