Page 1 of 1

v3 code: new way to scroll iframe

Posted: Wed Feb 27, 2019 10:05 am
by axew3
I've think to resolve finally this long time now, then an easy solution come out.
The problem is the iframe and the way it scroll (as is at date of this post the online v3 code):
it scroll phpBB page to a specified position, before the reload of the requested page, where on overall_footer.html added code there is this line:

Code: Select all

if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top
How to work around this?
The solution seem possible inverting things: as you see actually on this online example, the page not scroll immediately, but after the iframe loaded, and with smooth effect.
The applied trick on this online example need to be optimized, but you can in the while report any issue testing may reporting impressions about. Yeah, should be cool ;)

Re: v3 code: new way to scroll iframe

Posted: Wed Feb 27, 2019 4:06 pm
by FerminSi
Seems very intuitive! I can't wait to try this out.

Re: v3 code: new way to scroll iframe

Posted: Wed Feb 27, 2019 4:24 pm
by axew3
Hi there!
This is the v4 (released when will be ready) going on code as it is applied on this example at moment:

open page-forum(or whatever you named it).php into your active wp template folder and where this code:

Code: Select all

history.pushState({w3all_passed_url: w3all_passed_url}, \"Forum\", w3all_passed_url_push);
immediately after add this:

Code: Select all

jQuery('#w3all_phpbb_iframe').load(function(){
var scto = window.pageYOffset - 200;
window.scrollBy({
  top: -scto,
  behavior: 'smooth'
});
});
now on the overall_footer.html added code, where:

Code: Select all

if( /posting\.php\?mode=[reply|post|bump]/ig.exec(href) !== null || /mcp\.php\?/ig.exec(href) !== null ){
var w3allNOappend = true;
}
change into:

Code: Select all

if( /posting\.php\?mode=[reply|post|bump|contactadmin]/ig.exec(href) !== null || /mcp\.php\?/ig.exec(href) !== null ){
var w3allNOappend = true;
if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top
return;
}
(but this step need and will be surely changed into something else)

then where this code:

Code: Select all

if ( w3all_onclick_smile == false && w3all_onview_attach == false && w3all_onreview_post == null ) {
  if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top
  }
change into

Code: Select all

if ( w3all_onclick_smile == false && w3all_onview_attach == false && w3all_onreview_post == null ) {
  //if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top
  }
and recompile phpBB template.
The idea is good, but still lack of some adjustment: whenever you or someone apply, please report issues to be fixed.
I will log patches here until the code will be stable and acceptable then will be so published as v4 procedure.

P.s another fix: for the print view mode on iframe, the good solution that will be added is:
where this code:

Code: Select all

if( /\/adm\//ig.exec(href) !== null ){
e.preventDefault();
window.open(href,'_blank');
return;
}
will be simply changed into:

Code: Select all

if( /\/adm\//ig.exec(href) !== null || href.indexOf('view=print') > -1){
e.preventDefault();
window.open(href,'_blank');
return;
}
Hope to not forget nothing, Cheers!

Re: v3 code: new way to scroll iframe

Posted: Sun Mar 03, 2019 10:00 pm
by axew3
The way to scroll after and not before content loaded, seem to be the most beautiful.
It little lack of some adjustments, even if the result is +- complete (instruction into above post to test out) on current example at date of this post.
With big fantasy, it will be released as v4 iframe code when completely fixed.

P.s one bug is the fact that when i insert a post, actually page scroll top, while should scroll to last post position.
And on edit if the edit is not on last topic post. Just a memo stick.