From a2fc1be187fef508e304cb90279cb995b765787c Mon Sep 17 00:00:00 2001
From: rabuzarus <>
Date: Sat, 16 Jun 2018 13:05:33 +0200
Subject: [PATCH] fix scroll position in stream while ajax update
---
composer.json | 3 +-
composer.lock | 109 ++++++++++++++++++++++++++++-
mod/update_community.php | 4 --
mod/update_display.php | 3 -
mod/update_network.php | 4 --
mod/update_notes.php | 4 --
mod/update_profile.php | 4 --
view/js/main.js | 59 ++++++++--------
view/templates/head.tpl | 1 +
view/theme/frio/templates/head.tpl | 1 +
10 files changed, 143 insertions(+), 49 deletions(-)
diff --git a/composer.json b/composer.json
index 9668b9341c..941464e70c 100644
--- a/composer.json
+++ b/composer.json
@@ -37,7 +37,8 @@
"npm-asset/jquery-datetimepicker": "^2.4.0",
"npm-asset/jgrowl": "^1.4",
"npm-asset/fullcalendar": "^3.0.1",
- "npm-asset/cropperjs": "1.2.2"
+ "npm-asset/cropperjs": "1.2.2",
+ "npm-asset/imagesloaded": "4.1.4"
},
"repositories": [
{
diff --git a/composer.lock b/composer.lock
index dd2665ebbe..7ba8fc1cfd 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#composer-lock-the-lock-file",
"This file is @generated automatically"
],
- "content-hash": "ab5a551aff0505691c4836d063fc5171",
+ "content-hash": "4fcae78061a3eb72f91e4fa81e53af56",
"packages": [
{
"name": "asika/simple-console",
@@ -770,6 +770,49 @@
],
"time": "2018-01-03T13:39:39+00:00"
},
+ {
+ "name": "npm-asset/ev-emitter",
+ "version": "1.1.1",
+ "dist": {
+ "type": "tar",
+ "url": "https://registry.npmjs.org/ev-emitter/-/ev-emitter-1.1.1.tgz",
+ "reference": null,
+ "shasum": "8f18b0ce5c76a5d18017f71c0a795c65b9138f2a"
+ },
+ "type": "npm-asset-library",
+ "extra": {
+ "npm-asset-bugs": {
+ "url": "https://github.com/metafizzy/ev-emitter/issues"
+ },
+ "npm-asset-main": "ev-emitter.js",
+ "npm-asset-directories": {
+ "test": "test"
+ },
+ "npm-asset-repository": {
+ "type": "git",
+ "url": "git+https://github.com/metafizzy/ev-emitter.git"
+ },
+ "npm-asset-scripts": {
+ "test": "mocha test/test"
+ }
+ },
+ "license": [
+ "MIT"
+ ],
+ "authors": [
+ {
+ "name": "David DeSandro"
+ }
+ ],
+ "description": "lil' event emitter",
+ "homepage": "https://github.com/metafizzy/ev-emitter#readme",
+ "keywords": [
+ "emitter",
+ "event",
+ "pubsub"
+ ],
+ "time": "2017-07-06T13:46:38+00:00"
+ },
{
"name": "npm-asset/fullcalendar",
"version": "3.8.2",
@@ -882,6 +925,70 @@
],
"time": "2018-01-30T23:49:01+00:00"
},
+ {
+ "name": "npm-asset/imagesloaded",
+ "version": "4.1.4",
+ "dist": {
+ "type": "tar",
+ "url": "https://registry.npmjs.org/imagesloaded/-/imagesloaded-4.1.4.tgz",
+ "reference": null,
+ "shasum": "1376efcd162bb768c34c3727ac89cc04051f3cc7"
+ },
+ "require": {
+ "npm-asset/ev-emitter": ">=1.0.0,<2.0.0"
+ },
+ "require-dev": {
+ "npm-asset/chalk": ">=1.1.1,<2.0.0",
+ "npm-asset/cheerio": ">=0.19.0,<0.20.0",
+ "npm-asset/gulp": ">=3.9.0,<4.0.0",
+ "npm-asset/gulp-jshint": ">=1.11.2,<2.0.0",
+ "npm-asset/gulp-json-lint": ">=0.1.0,<0.2.0",
+ "npm-asset/gulp-rename": ">=1.2.2,<2.0.0",
+ "npm-asset/gulp-replace": ">=0.5.4,<0.6.0",
+ "npm-asset/gulp-requirejs-optimize": "dev-github:metafizzy/gulp-requirejs-optimize",
+ "npm-asset/gulp-uglify": ">=1.4.2,<2.0.0",
+ "npm-asset/gulp-util": ">=3.0.7,<4.0.0",
+ "npm-asset/highlight.js": ">=8.9.1,<9.0.0",
+ "npm-asset/marked": ">=0.3.5,<0.4.0",
+ "npm-asset/minimist": ">=1.2.0,<2.0.0",
+ "npm-asset/transfob": ">=1.0.0,<2.0.0"
+ },
+ "type": "npm-asset-library",
+ "extra": {
+ "npm-asset-bugs": {
+ "url": "https://github.com/desandro/imagesloaded/issues"
+ },
+ "npm-asset-main": "imagesloaded.js",
+ "npm-asset-directories": {
+ "test": "test"
+ },
+ "npm-asset-repository": {
+ "type": "git",
+ "url": "git://github.com/desandro/imagesloaded.git"
+ },
+ "npm-asset-scripts": {
+ "test": "echo \"Error: no test specified\" && exit 1"
+ }
+ },
+ "license": [
+ "MIT"
+ ],
+ "authors": [
+ {
+ "name": "David DeSandro"
+ }
+ ],
+ "description": "JavaScript is all like _You images done yet or what?_",
+ "homepage": "https://github.com/desandro/imagesloaded",
+ "keywords": [
+ "dom",
+ "images",
+ "jquery-plugin",
+ "loaded",
+ "ui"
+ ],
+ "time": "2018-01-02T16:56:03+00:00"
+ },
{
"name": "npm-asset/jgrowl",
"version": "1.4.6",
diff --git a/mod/update_community.php b/mod/update_community.php
index d64ea5d709..088da0143c 100644
--- a/mod/update_community.php
+++ b/mod/update_community.php
@@ -19,10 +19,6 @@ function update_community_content(App $a) {
$text = '';
}
- $pattern = "/<img([^>]*) src=\"([^\"]*)\"/";
- $replace = "<img\${1} dst=\"\${2}\"";
- $text = preg_replace($pattern, $replace, $text);
-
if (PConfig::get(local_user(), "system", "bandwidth_saver")) {
$replace = "<br />".L10n::t("[Embedded content - reload page to view]")."<br />";
$pattern = "/<\s*audio[^>]*>(.*?)<\s*\/\s*audio>/i";
diff --git a/mod/update_display.php b/mod/update_display.php
index 48df9797de..4b6d26cb7f 100644
--- a/mod/update_display.php
+++ b/mod/update_display.php
@@ -19,9 +19,6 @@ function update_display_content(App $a)
echo "<section>";
$text = display_content($a, true, $profile_uid);
- $pattern = "/<img([^>]*) src=\"([^\"]*)\"/";
- $replace = "<img\${1} dst=\"\${2}\"";
- $text = preg_replace($pattern, $replace, $text);
if (PConfig::get(local_user(), "system", "bandwidth_saver")) {
$replace = "<br />" . L10n::t("[Embedded content - reload page to view]") . "<br />";
diff --git a/mod/update_network.php b/mod/update_network.php
index 962701627a..6c02e4a8fa 100644
--- a/mod/update_network.php
+++ b/mod/update_network.php
@@ -25,10 +25,6 @@ function update_network_content(App $a)
$text = "";
}
- $pattern = "/<img([^>]*) src=\"([^\"]*)\"/";
- $replace = "<img\${1} dst=\"\${2}\"";
- $text = preg_replace($pattern, $replace, $text);
-
if (PConfig::get(local_user(), "system", "bandwidth_saver")) {
$replace = "<br />" . L10n::t("[Embedded content - reload page to view]") . "<br />";
$pattern = "/<\s*audio[^>]*>(.*?)<\s*\/\s*audio>/i";
diff --git a/mod/update_notes.php b/mod/update_notes.php
index 892e71d782..7db60e78e0 100644
--- a/mod/update_notes.php
+++ b/mod/update_notes.php
@@ -32,10 +32,6 @@ function update_notes_content(App $a) {
$text = notes_content($a, $profile_uid);
- $pattern = "/<img([^>]*) src=\"([^\"]*)\"/";
- $replace = "<img\${1} dst=\"\${2}\"";
- $text = preg_replace($pattern, $replace, $text);
-
if (PConfig::get(local_user(), "system", "bandwidth_saver")) {
$replace = "<br />".L10n::t("[Embedded content - reload page to view]")."<br />";
$pattern = "/<\s*audio[^>]*>(.*?)<\s*\/\s*audio>/i";
diff --git a/mod/update_profile.php b/mod/update_profile.php
index 1a05130e0a..984fd7949c 100644
--- a/mod/update_profile.php
+++ b/mod/update_profile.php
@@ -31,10 +31,6 @@ function update_profile_content(App $a) {
$text = profile_content($a, $profile_uid);
- $pattern = "/<img([^>]*) src=\"([^\"]*)\"/";
- $replace = "<img\${1} dst=\"\${2}\"";
- $text = preg_replace($pattern, $replace, $text);
-
if (PConfig::get(local_user(), "system", "bandwidth_saver")) {
$replace = "<br />".L10n::t("[Embedded content - reload page to view]")."<br />";
$pattern = "/<\s*audio[^>]*>(.*?)<\s*\/\s*audio>/i";
diff --git a/view/js/main.js b/view/js/main.js
index b5043601ce..4c55546aaa 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -418,6 +418,9 @@ function liveUpdate(src) {
if ($(document).scrollTop() == 0) {
force_update = true;
}
+
+ var orgHeight = $("section").height();
+
var udargs = ((netargs.length) ? '/' + netargs : '');
var update_url = 'update_' + src + udargs + '&p=' + profile_uid + '&page=' + profile_page + '&force=' + ((force_update) ? 1 : 0) + '&item=' + update_item;
@@ -426,42 +429,42 @@ function liveUpdate(src) {
force_update = false;
update_item = 0;
- // add a new thread
- $('.toplevel_item',data).each(function() {
- var ident = $(this).attr('id');
-
- if ($('#' + ident).length == 0 && profile_page == 1) {
- $('img',this).each(function() {
- $(this).attr('src',$(this).attr('dst'));
- });
- $('#' + prev).after($(this));
- } else {
- // Find out if the hidden comments are open, so we can keep it that way
- // if a new comment has been posted
- var id = $('.hide-comments-total', this).attr('id');
- if (typeof id != 'undefined') {
- id = id.split('-')[3];
- var commentsOpen = $("#collapsed-comments-" + id).is(":visible");
- }
+ $('.wall-item-body', data).imagesLoaded(function() {
+ // add a new thread
+ $('.toplevel_item',data).each(function() {
+ var ident = $(this).attr('id');
+
+ // Add new top-level item.
+ if ($('#' + ident).length == 0 && profile_page == 1) {
+ $('#' + prev).after($(this));
+
+ // Replace already existing thread.
+ } else {
+ // Find out if the hidden comments are open, so we can keep it that way
+ // if a new comment has been posted
+ var id = $('.hide-comments-total', this).attr('id');
+ if (typeof id != 'undefined') {
+ id = id.split('-')[3];
+ var commentsOpen = $("#collapsed-comments-" + id).is(":visible");
+ }
- $('img',this).each(function() {
- $(this).attr('src',$(this).attr('dst'));
- });
- $('html').height($('html').height());
- $('#' + ident).replaceWith($(this));
+ $('#' + ident).replaceWith($(this));
- if (typeof id != 'undefined') {
- if (commentsOpen) {
- showHideComments(id);
+ if (typeof id != 'undefined') {
+ if (commentsOpen) {
+ showHideComments(id);
+ }
}
}
- $('html').height('auto');
- }
- prev = ident;
+ prev = ident;
+ });
});
callAddonHooks("postprocess_liveupdate");
+ // Update the scroll position.
+ $(window).scrollTop($(window).scrollTop() + $("section").height() - orgHeight);
+
$('.like-rotator').hide();
if (commentBusy) {
commentBusy = false;
diff --git a/view/templates/head.tpl b/view/templates/head.tpl
index b3dfbc1f4e..aadbfcd8ee 100644
--- a/view/templates/head.tpl
+++ b/view/templates/head.tpl
@@ -42,6 +42,7 @@
<script type="text/javascript" src="view/asset/jgrowl/jquery.jgrowl.min.js"></script>
<script type="text/javascript" src="view/asset/jquery-datetimepicker/build/jquery.datetimepicker.full.min.js"></script>
<script type="text/javascript" src="view/asset/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js" ></script>
+<script type="text/javascript" src="view/asset/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script type="text/javascript" src="view/js/acl.js" ></script>
<script type="text/javascript" src="view/asset/base64/base64.min.js" ></script>
<script type="text/javascript" src="view/js/addon-hooks.js" ></script>
diff --git a/view/theme/frio/templates/head.tpl b/view/theme/frio/templates/head.tpl
index f4bcabdae8..ef1cd810b0 100644
--- a/view/theme/frio/templates/head.tpl
+++ b/view/theme/frio/templates/head.tpl
@@ -66,6 +66,7 @@
<script type="text/javascript" src="view/asset/jgrowl/jquery.jgrowl.min.js"></script>
<script type="text/javascript" src="view/asset/jquery-datetimepicker/build/jquery.datetimepicker.full.min.js"></script>
<script type="text/javascript" src="view/asset/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js"></script>
+<script type="text/javascript" src="view/asset/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script type="text/javascript" src="view/js/acl.js"></script>
<script type="text/javascript" src="view/asset/base64/base64.min.js"></script>
<script type="text/javascript" src="view/js/addon-hooks.js" ></script>
--
2.39.5