Updated newsfeed.js - improved fullscreen iframe

Had much better performance using 100vw (viewport width) than 100% (why - idk), but with 100% about 5% of my screen (1080x1920) to the right of the scroll bar was left black/blank, with 100vw I legitimately takes up the whole screen/viewport width. 

With the 10000 height the articles would always load about half way scrolled down. So I reduced the height and style.height to 3000. At my resolution at least, which I assume is fairly common, I had much better results. Unfortunately 3000 also isn't perfect - this still requires some tweaking. The article loads perfectly at the top of the iframe at 2500, but 2500 is much too small for most articles. 3000 seemed a good compromise, I could scroll far enoguh to read most articles on Reuters, and also load far enoguh up to read the beginning of the article.

And finally I added a "scroll back up" button notification. This seems to work flawlessly.
This commit is contained in:
Nico Domino 2018-04-17 00:25:58 +02:00 committed by GitHub
parent 05ef68e079
commit c90a1ab6dc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -180,10 +180,10 @@ Module.register("newsfeed",{
if (this.config.showFullArticle) { if (this.config.showFullArticle) {
var fullArticle = document.createElement("iframe"); var fullArticle = document.createElement("iframe");
fullArticle.className = ""; fullArticle.className = "";
fullArticle.style.width = "100%"; fullArticle.style.width = "100vw";
// very large height value to allow scrolling // very large height value to allow scrolling
fullArticle.height = "10000"; fullArticle.height = "3000";
fullArticle.style.height = "10000"; fullArticle.style.height = "3000";
fullArticle.style.top = "0"; fullArticle.style.top = "0";
fullArticle.style.left = "0"; fullArticle.style.left = "0";
fullArticle.style.border = "none"; fullArticle.style.border = "none";
@ -378,6 +378,13 @@ Module.register("newsfeed",{
Log.info(this.name + " - showing " + this.config.showDescription ? "article description" : "full article"); Log.info(this.name + " - showing " + this.config.showDescription ? "article description" : "full article");
this.updateDom(100); this.updateDom(100);
} }
} else if(notification == "ARTICLE_SCROLL_UP"){
if(this.config.showFullArticle == true){
this.scrollPosition -= this.config.scrollLength;
window.scrollTo(0, this.scrollPosition);
Log.info(this.name + " - scrolling up");
Log.info(this.name + " - ARTICLE_SCROLL_UP, scroll position: " + this.config.scrollLength);
}
} else if(notification == "ARTICLE_LESS_DETAILS"){ } else if(notification == "ARTICLE_LESS_DETAILS"){
this.resetDescrOrFullArticleAndTimer(); this.resetDescrOrFullArticleAndTimer();
Log.info(this.name + " - showing only article titles again"); Log.info(this.name + " - showing only article titles again");