SG has uploaded a new change for review.
https://gerrit.wikimedia.org/r/141083
Change subject: Infinite scroll load more
......................................................................
Infinite scroll load more
Change-Id: I454c48d1cc184d3c72453083834f6b204763315f
---
M handlebars/compiled/flow_block_topic.handlebars.php
M handlebars/compiled/flow_block_topic_moderate_topic.handlebars.php
M handlebars/compiled/flow_block_topiclist.handlebars.php
M handlebars/flow_load_more.handlebars
M modules/new/components/flow-board.js
5 files changed, 46 insertions(+), 15 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Flow
refs/changes/83/141083/1
diff --git a/handlebars/compiled/flow_block_topic.handlebars.php
b/handlebars/compiled/flow_block_topic.handlebars.php
index 3eea667..f0d8b97 100644
--- a/handlebars/compiled/flow_block_topic.handlebars.php
+++ b/handlebars/compiled/flow_block_topic.handlebars.php
@@ -42,9 +42,9 @@
').'
</div>
<div class="flow-topics">
-
+
'.LCRun3::sec($cx, ((is_array($in) && isset($in['roots'])) ?
$in['roots'] : null), $in, true, function($cx, $in) {return '
-
+
'.LCRun3::hbch($cx, 'eachPost', Array($cx['scopes'][0],$in), $in,
function($cx, $in) {return '
<div class="flow-topic flow-load-interactive
'.((LCRun3::ifvar($cx, ((is_array($in) && isset($in['isModerated'])) ?
$in['isModerated'] : null))) ? 'flow-topic-moderated
flow-topic-collapsed-invert' : '').'"
id="flow-topic-'.htmlentities(((is_array($in) && isset($in['postId'])) ?
$in['postId'] : null), ENT_QUOTES, 'UTF-8').'"
data-flow-id="'.htmlentities(((is_array($in) && isset($in['postId'])) ?
$in['postId'] : null), ENT_QUOTES, 'UTF-8').'"
data-flow-load-handler="topicElement">
<div class="flow-topic '.((!LCRun3::ifvar($cx, ((is_array($in) &&
isset($in['isPreview'])) ? $in['isPreview'] : null))) ? 'flow-load-interactive'
: '').' '.((LCRun3::ifvar($cx, ((is_array($in) && isset($in['isModerated'])) ?
$in['isModerated'] : null))) ? 'flow-topic-moderated
flow-topic-collapsed-invert' : '').'"
id="flow-topic-'.htmlentities(((is_array($in) && isset($in['postId'])) ?
$in['postId'] : null), ENT_QUOTES, 'UTF-8').'"
data-flow-id="'.htmlentities(((is_array($in) && isset($in['postId'])) ?
$in['postId'] : null), ENT_QUOTES, 'UTF-8').'"
data-flow-load-handler="topicElement">
diff --git a/handlebars/compiled/flow_block_topic_moderate_topic.handlebars.php
b/handlebars/compiled/flow_block_topic_moderate_topic.handlebars.php
index 325c011..6461b38 100644
--- a/handlebars/compiled/flow_block_topic_moderate_topic.handlebars.php
+++ b/handlebars/compiled/flow_block_topic_moderate_topic.handlebars.php
@@ -29,7 +29,7 @@
</ul>
' : '').'
-
+
'.LCRun3::sec($cx, ((is_array($in) && isset($in['roots'])) ?
$in['roots'] : null), $in, true, function($cx, $in) {return '
'.LCRun3::hbch($cx, 'eachPost', Array($cx['scopes'][0],$in),
$in, function($cx, $in) {return '
<form method="POST" action="'.LCRun3::ch($cx,
'moderationAction', Array(((is_array($in) && isset($in['actions'])) ?
$in['actions'] : null),((is_array($cx['scopes'][0]['submitted']) &&
isset($cx['scopes'][0]['submitted']['moderationState'])) ?
$cx['scopes'][0]['submitted']['moderationState'] : null)), 'encq').'">
@@ -75,7 +75,7 @@
<div class="flow-post-content">
'.LCRun3::ch($cx, 'escapeContent',
Array(((is_array($in) && isset($in['contentFormat'])) ? $in['contentFormat'] :
null),((is_array($in) && isset($in['content'])) ? $in['content'] : null)),
'encq').'
</div>
-
+
'.((!LCRun3::ifvar($cx, ((is_array($in) &&
isset($in['isPreview'])) ? $in['isPreview'] : null))) ? '
<div class="flow-post-meta">
<span class="flow-post-meta-actions">
@@ -158,7 +158,7 @@
' : '').'
</div>
-
+
'.((!LCRun3::ifvar($cx, ((is_array($in) &&
isset($in['isPreview'])) ? $in['isPreview'] : null))) ? '
<div class="flow-replies">
'.LCRun3::sec($cx, ((is_array($in) &&
isset($in['replies'])) ? $in['replies'] : null), $in, true, function($cx, $in)
{return '
diff --git a/handlebars/compiled/flow_block_topiclist.handlebars.php
b/handlebars/compiled/flow_block_topiclist.handlebars.php
index 36bd238..5a769cb 100644
--- a/handlebars/compiled/flow_block_topiclist.handlebars.php
+++ b/handlebars/compiled/flow_block_topiclist.handlebars.php
@@ -325,10 +325,10 @@
'.((LCRun3::ifvar($cx, ((is_array($in['links']['pagination']) &&
isset($in['links']['pagination']['fwd'])) ? $in['links']['pagination']['fwd'] :
null))) ? '
<a data-flow-interactive-handler="apiRequest"
data-flow-api-handler="loadMore"
- data-flow-api-target="< .flow-component"
+ data-flow-load-handler="loadMore"
href="'.htmlentities(((is_array($in['links']['pagination']['fwd'])
&& isset($in['links']['pagination']['fwd']['url'])) ?
$in['links']['pagination']['fwd']['url'] : null), ENT_QUOTES, 'UTF-8').'"
title="'.htmlentities(((is_array($in['links']['pagination']['fwd'])
&& isset($in['links']['pagination']['fwd']['title'])) ?
$in['links']['pagination']['fwd']['title'] : null), ENT_QUOTES, 'UTF-8').'"
- class="flow-ui-button flow-ui-progressive /*flow-ui-quiet
flow-ui-thin*/"><span class="wikiglyph wikiglyph-article"></span>
'.LCRun3::ch($cx, 'l10n', Array('flow-load-more'), 'encq').'</a>
+ class="flow-ui-button flow-ui-progressive flow-load-interactive
/*flow-ui-quiet flow-ui-thin*/"><span class="wikiglyph
wikiglyph-article"></span> '.LCRun3::ch($cx, 'l10n', Array('flow-load-more'),
'encq').'</a>
' : '').'
</div>
';
diff --git a/handlebars/flow_load_more.handlebars
b/handlebars/flow_load_more.handlebars
index ea3ecd9..dc86cb5 100644
--- a/handlebars/flow_load_more.handlebars
+++ b/handlebars/flow_load_more.handlebars
@@ -1,8 +1,8 @@
{{#if links.pagination.fwd}}
<a data-flow-interactive-handler="apiRequest"
data-flow-api-handler="loadMore"
- data-flow-api-target="< .flow-component"
+ data-flow-load-handler="loadMore"
href="{{links.pagination.fwd.url}}"
title="{{links.pagination.fwd.title}}"
- class="flow-ui-button flow-ui-progressive /*flow-ui-quiet
flow-ui-thin*/"><span class="wikiglyph wikiglyph-article"></span> {{l10n
"flow-load-more"}}</a>
+ class="flow-ui-button flow-ui-progressive flow-load-interactive
/*flow-ui-quiet flow-ui-thin*/"><span class="wikiglyph
wikiglyph-article"></span> {{l10n "flow-load-more"}}</a>
{{/if}}
\ No newline at end of file
diff --git a/modules/new/components/flow-board.js
b/modules/new/components/flow-board.js
index a9ce5cf..11e2b32 100644
--- a/modules/new/components/flow-board.js
+++ b/modules/new/components/flow-board.js
@@ -644,6 +644,27 @@
);
};
+ /**
+ * Stores the load more button for use with infinite scroll.
+ * @param {jQuery} $button
+ */
+ FlowBoardComponent.UI.events.loadHandlers.loadMore = function (
$button ) {
+ var flowBoard =
FlowBoardComponent.prototype.getInstanceByElement( $button );
+
+ if ( !flowBoard.$loadMoreNodes ) {
+ // Create a new $loadMoreNodes list
+ flowBoard.$loadMoreNodes = $();
+ } else {
+ // Remove any loadMore nodes that are no longer
in the body
+ flowBoard.$loadMoreNodes =
flowBoard.$loadMoreNodes.filter( function () {
+ return $( this ).closest( 'body'
).length;
+ } );
+ }
+
+ // Store this new loadMore node
+ flowBoard.$loadMoreNodes =
flowBoard.$loadMoreNodes.add( $button );
+ };
+
////////////////////////////////////////////////////////////
// FlowBoardComponent.UI event interactive handlers
////////////////////
@@ -1377,16 +1398,26 @@
/**
* Called on window.scroll. Checks to see if a FlowBoard needs
to have more content loaded.
- * @todo Find a better way than directly targetting the button
by class
*/
FlowBoardComponent.UI.infiniteScrollCheck = function () {
- var windowPosition = $( window ).scrollTop() + $(
window ).height();
+ var windowHeight = $( window ).height(),
+ scrollPosition = $( window ).scrollTop();
- $.each( FlowBoardComponent.prototype.getInstances(),
function () {
- var flowBoard = this;
+ if ( scrollPosition > 25 ) {
+ $.each(
FlowBoardComponent.prototype.getInstances(), function () {
+ var flowBoard = this,
+ $loadMoreNodes =
flowBoard.$loadMoreNodes || $();
-
- } );
+ // Check each loadMore button
+ $loadMoreNodes.each( function () {
+ // Only count this button as
infinite-scrollable if it appears below the fold
+ // and that we have scrolled at
least 50% of the way to it
+ if ( this.offsetTop >
windowHeight && scrollPosition / ( this.offsetTop - windowHeight ) > .5 ) {
+ $( this ).click();
+ }
+ } );
+ } );
+ }
};
/**
--
To view, visit https://gerrit.wikimedia.org/r/141083
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I454c48d1cc184d3c72453083834f6b204763315f
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Flow
Gerrit-Branch: frontend-rewrite
Gerrit-Owner: SG <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
