[Rt-commit] rt branch, 4.4/ticket-history-infinite-scroll, repushed
Dustin Graves
dustin at bestpractical.com
Thu Oct 8 17:50:35 EDT 2015
The branch 4.4/ticket-history-infinite-scroll was deleted and repushed:
was f17a6a1836bcd82a436bbb4459d0168001dc6fba
now f6596c4047af1366672b6cdc5581d1a1dc89e318
1: f17a6a1 ! 1: f6596c4 add infinite scrolling and infinite scroll with gradual link to load page
@@ -12,7 +12,7 @@
WidgetArguments => {
Description => 'Show history', #loc
- Values => [qw(delay click always)],
-+ Values => [qw(delay click always continuous gradual)],
++ Values => [qw(delay click always continuous)],
ValuesLabel => {
- delay => "after the rest of the page loads", #loc
- click => "after clicking a link", #loc
@@ -20,8 +20,7 @@
+ delay => "after the rest of the page loads", #loc
+ click => "after clicking a link", #loc
+ always => "immediately", #loc
-+ continuous => "as you scroll", #loc
-+ gradual => "after clicking to load one page", #loc
++ continuous => "as you scroll", #loc
},
},
},
@@ -85,8 +84,6 @@
+$AttachmentContent => $Object->TextAttachments
+$ShowHeaders => 0
+$PathPrefix => ''
-+$Page => 1
-+$Rows => 10
+</%ARGS>
+<%INIT>
+my $trans_content = {};
@@ -127,10 +124,7 @@
+$m->callback( %ARGS, Object => $Object, CallbackName => 'BeforeTransactions' );
+
+# Properly set starting index
-+my $i = ($Page - 1) * $Rows;
-+
-+$Transactions->RowsPerPage( $Rows );
-+$Transactions->GotoPage( $Page - 1 );
++my $i = 0;
+
+my $Transaction;
+
@@ -146,7 +140,7 @@
+ # skip the Set transactions. This complication is necessary to avoid
+ # creating backdated transactions on upgrade which normalize to one type or
+ # another.
-+ #
++ #
+ # These conditions assumes ticket Owner is a single-member denormalized
+ # role group, which is safe since that is unlikely to ever change in the
+ # future.
@@ -192,6 +186,19 @@
+</%perl>
+<script type="text/javascript">ReplaceUserReferences()</script>
+diff --git a/share/html/Elements/ShowTransaction b/share/html/Elements/ShowTransaction
+--- a/share/html/Elements/ShowTransaction
++++ b/share/html/Elements/ShowTransaction
+@@
+ %# those contributions and any derivatives thereof.
+ %#
+ %# END BPS TAGGED BLOCK }}}
+-<div class="<% join ' ', @classes %>">
++<div class="<% join ' ', @classes %>" data-transaction-id="<% $Transaction->id %>">
+ <div class="metadata">
+ <span class="type">
+ <a name="txn-<% $Transaction->id %>" \
+
diff --git a/share/html/Helpers/TicketHistoryPage b/share/html/Helpers/TicketHistoryPage
new file mode 100644
--- /dev/null
@@ -246,7 +253,9 @@
+%# END BPS TAGGED BLOCK }}}
+<%ARGS>
+$id
-+$page => 1
++$oldestTransactionsFirst
++$lastTransactionId => undef
++$transactionId => undef
+</%ARGS>
+<%INIT>
+my $TicketObj = RT::Ticket->new($session{'CurrentUser'});
@@ -256,13 +265,37 @@
+my $attachment_content = $TicketObj->TextAttachments;
+my %extra_args;
+$m->callback( CallbackName => 'ExtraShowHistoryArguments', Ticket => $TicketObj, ExtraArgs => \%extra_args );
++
++my $transactions = $TicketObj->Transactions;
++my $order = $oldestTransactionsFirst ? 'ASC' : 'DESC';
++if ($lastTransactionId) {
++ $transactions->Limit(
++ FIELD => 'id',
++ OPERATOR => $oldestTransactionsFirst ? '>' : '<',
++ VALUE => $lastTransactionId
++ );
++}
++$transactions->OrderByCols(
++ { FIELD => 'Created', ORDER => $order },
++ { FIELD => 'id', ORDER => $order },
++);
++if ($transactionId) {
++ $transactions->Limit(
++ FIELD => 'id',
++ OPERATOR => $oldestTransactionsFirst ? '<=' : '>=',
++ VALUE => $transactionId
++ );
++} else {
++ $transactions->RowsPerPage(10);
++ $transactions->FirstPage();
++}
+</%INIT>
+<& /Elements/ShowHistoryPage,
+ Object => $TicketObj,
+ ShowHeaders => $ARGS{'ShowHeaders'},
+ Attachments => $attachments,
+ AttachmentContent => $attachment_content,
-+ Page => $page,
++ Transactions => $transactions,
+ %extra_args,
+ &>
+% $m->abort();
@@ -279,11 +312,6 @@
+ <& /Ticket/Elements/ContinuousShowHistory,
+ Ticket => $TicketObj
+ &>
-+% } elsif ($ShowHistory eq "gradual") {
-+ <& /Ticket/Elements/ContinuousShowHistory,
-+ Ticket => $TicketObj,
-+ Gradual => '1'
-+ &>
+% } elsif ($ShowHistory eq "delay") {
<& /Ticket/Elements/DelayShowHistory,
Ticket => $TicketObj,
@@ -343,12 +371,10 @@
+%# END BPS TAGGED BLOCK }}}
+<%ARGS>
+$Ticket
-+$Gradual => 0
+</%ARGS>
+<%INIT>
+my %params = %ARGS;
+delete $params{Ticket};
-+delete $params{Gradual};
+
+my $url = RT->Config->Get('WebPath') . "/Helpers/TicketHistoryPage?" .
+ $m->comp('/Elements/QueryString', %params, id => $Ticket->id );
@@ -362,6 +388,8 @@
+
+my $record_type = $Ticket->RecordType;
+my $histid = "\L$record_type\E-" . $Ticket->id . "-history";
++
++my $oldestTransactionsFirst = RT->Config->Get("OldestTransactionsFirst", $session{CurrentUser});
+</%INIT>
+<div id="delayed_ticket_history">
+<div class="history <% lc $record_type %>" id="<% $histid %>">
@@ -400,10 +428,6 @@
+
+<div class="history-container">
+
-+% if ($Gradual) {
-+ <a href="#" class="load-history-page"><% loc('Show ticket history') %></a>
-+% }
-+
+% if ($ShowDisplayModes or $ShowTitle) {
+ <& /Widgets/TitleBoxEnd &>
+% }
@@ -414,73 +438,117 @@
+
+<script type="text/javascript">
+jQuery(function(){
-+ var page = 1,
-+ loading = false, // prevent multiple simultaneous load events
-+ gradual = false;
-+
-+% if ($Gradual) {
-+ gradual = true;
-+% }
-+
-+ function removeLoadingMessage() {
++ var isLoading = false, // prevent multiple simultaneous load events
++ disableLoading = false, // prevent repeated fruitless attempts
++ loadDistanceFromBottom = 600, // to load before bottom of page is reached
++ lastTransactionId = null,
++ hash = window.location.hash,
++ hashTransactionId = null;
++
++ var oldestTransactionsFirst = <% $oldestTransactionsFirst || 0 %>;
++
++ var removeLoadingMessage = function() {
+ var loadingMessages = jQuery('.loading-message');
+ if (loadingMessages.length) loadingMessages.remove();
-+ }
-+
-+ function showLoadingMessage() {
-+ var placeholder = jQuery('#history-placeholder');
-+ if (!placeholder.length) {
-+ removeLoadingMessage();
-+ var loadingMessage = jQuery('<span class="loading-message"><&|/l&>Loading...</&></span>');
-+ jQuery(".history-container").append(loadingMessage);
++ };
++
++ var removeLoadLink = function() {
++ var loadLink = jQuery('.error-load-history');
++ if (loadLink.length) loadLink.remove();
++ };
++
++ var showLoadingMessage = function() {
++ removeLoadingMessage();
++ var loadingMessage = jQuery('<span class="loading-message"><&|/l&>Loading...</&></span>');
++ jQuery(".history-container").append(loadingMessage);
++ };
++
++ var loadingError = function(reason) {
++ removeLoadingMessage();
++ disableLoading = true;
++ removeLoadLink();
++ var loadLink = jQuery('<div class="error-load-history"><&|/l&>Could not load ticket history. Reason: </&>' + reason + '.<br/><a href="#"><&|/l&>Try again</&></a></div>');
++ jQuery(".history-container").append(loadLink);
++ };
++
++ var loadHistoryPage = function() {
++ if (isLoading || disableLoading) return;
++
++ isLoading = true;
++ showLoadingMessage();
++
++ var queryString = '&oldestTransactionsFirst=' + oldestTransactionsFirst;
++ if (lastTransactionId) queryString += '&lastTransactionId=' + lastTransactionId;
++
++ // check for link to specific transaction and make sure we load enough to view it
++ if (hash && !lastTransactionId) {
++ var matches = hash.match(/^#txn-(\d+)$/);
++ if (matches) {
++ hashTransactionId = matches[1];
++ queryString += '&transactionId=' + hashTransactionId;
++ }
+ }
-+ }
-+
-+ function addLoadPageLink() {
-+ var loadPageLink = jQuery('<a href="#" class="load-history-page"><% loc('Load more') %></a>');
-+ jQuery(".history-container").append(loadPageLink);
-+ }
-+
-+ var loadHistoryPage = function() {
-+ if (loading) return;
-+
-+ loading = true;
-+ showLoadingMessage();
+
+ jQuery.ajax({
-+ url: "<% $url %>" + '&page=' + page,
++ url: "<% $url %>" + queryString,
+ success: function(html) {
+ if(html) {
++ lastTransactionId = jQuery(html).filter('div.transaction').last().data('transactionId');
+ jQuery(".history-container").append(html);
-+ page += 1;
++
++ if (hashTransactionId) { // focus transaction if we are following a link to it
++ hashTransactionId = null;
++ location.href = hash;
++ }
++ } else {
++ disableLoading = true;
+ }
-+ loading = false;
-+
++
++ isLoading = false;
+ removeLoadingMessage();
-+ if (gradual) addLoadPageLink();
+ },
+ error: function(xhr, reason) {
-+ alert('<&|/l&>Could not load ticket history. Reason: </&>' + reason);
-+ loading = false;
-+
-+ removeLoadingMessage();
-+ if (gradual) addLoadPageLink();
++ isLoading = false;
++ loadingError(reason);
+ }
+ });
+ };
+
-+ if (gradual) {
-+ jQuery('.load-history-page').click(function(e) {
-+ jQuery('.load-history-page').remove();
++ jQuery(window).scroll(function() {
++ if(jQuery(window).scrollTop() >= jQuery(document).height() - jQuery(window).height() - loadDistanceFromBottom) {
+ loadHistoryPage();
-+ e.preventDefault();
-+ });
-+ } else {
-+ jQuery(window).scroll(function() {
-+ if(jQuery(window).scrollTop() >= jQuery(document).height() - jQuery(window).height()) {
-+ loadHistoryPage();
-+ }
-+ });
-+ }
++ }
++ });
++
++ jQuery('.history-container').on('click', '.error-load-history a', function(e) {
++ e.preventDefault();
++ removeLoadLink();
++ disableLoading = false;
++ loadHistoryPage();
++ });
++
++ loadHistoryPage();
+});
+</script>
+
+diff --git a/share/static/css/base/misc.css b/share/static/css/base/misc.css
+--- a/share/static/css/base/misc.css
++++ b/share/static/css/base/misc.css
+@@
+ .dashboard-subscription tr.frequency .value input {
+ margin-bottom: 0.75em;
+ }
++
++/* infinite history error message */
++
++.error-load-history {
++ background-color: #b32;
++ padding: 10px;
++ border-radius: 5px;
++ color: white;
++}
++
++.error-load-history a {
++ text-decoration: underline !important;
++ color: white !important;
++}
More information about the rt-commit
mailing list