From fb6423fd8d2e0068c9c5b5bb8a643ea991e59739 Mon Sep 17 00:00:00 2001
From: Aurélien Bompard <aurelien@bompard.org>
Date: Tue, 14 May 2013 13:44:42 +0200
Subject: Speed up page loading on long threads

Speed up page loading on threads with many replies by loading the
replies asynchronously.

Preserve search engine indexation by detecting bots and serving the
usual page in one go.
---
 hyperkitty/templates/thread.html               | 25 +++++++++----------------
 hyperkitty/templates/threads/participants.html | 14 ++++++++++++++
 hyperkitty/templates/threads/replies.html      | 11 +++++++++++
 hyperkitty/templates/threads/right_col.html    | 15 ++++++---------
 4 files changed, 40 insertions(+), 25 deletions(-)
 create mode 100644 hyperkitty/templates/threads/participants.html
 create mode 100644 hyperkitty/templates/threads/replies.html

(limited to 'hyperkitty/templates')

diff --git a/hyperkitty/templates/thread.html b/hyperkitty/templates/thread.html
index 9de03b1..a198014 100644
--- a/hyperkitty/templates/thread.html
+++ b/hyperkitty/templates/thread.html
@@ -50,14 +50,11 @@
 			</p>
 
 			<div class="replies">
-				{% for email in replies %}
-				<div class="{% cycle 'even' 'odd' %}"
-					{% if email.level %}style="margin-left:{{ email.level|multiply:"2" }}em;"{% endif %}>
-					<!-- Start email -->
-					{% include 'messages/message.html' %}
-					<!-- End of email -->
-				</div>
-				{% endfor %}
+			{% if is_bot %}
+				{% include 'threads/replies.html' %}
+			{% else %}
+				<img alt="Loading..." class="ajaxloader" src="{{ STATIC_URL }}img/ajax-loader.gif" />
+			{% endif %}
 			</div>
 
 		</section>
@@ -80,14 +77,10 @@
 
 <script type="text/javascript">
 	$(document).ready(function() {
-		// hide quotes by default in the thread view
-		$('div.email-body .quoted-text').each(function() {
-			var linescount = $(this).text().split("\n").length;
-			if (linescount > 3) {
-				// hide if the quote is more than 3 lines long
-				$(this).hide();
-			}
-		});
+		// Hide quotes by default in the thread view
+		fold_quotes()
+		// Load the replies
+		update_thread_replies("{% url 'thread_replies' threadid=threadid mlist_fqdn=mlist.name %}?sort={{sort_mode}}");
 	});
 </script>
 
diff --git a/hyperkitty/templates/threads/participants.html b/hyperkitty/templates/threads/participants.html
new file mode 100644
index 0000000..b40445b
--- /dev/null
+++ b/hyperkitty/templates/threads/participants.html
@@ -0,0 +1,14 @@
+{% load url from future %}
+{% load gravatar %}
+{% load hk_generic %}
+
+		<span id="participants_title">participants</span> ({{participants|length}})
+		<ul>
+			{% for name, email in participants.items|sort %}
+			<li>
+				{% gravatar email 20 %}
+				{{ name|escapeemail }}
+			</li>
+			{% endfor %}
+		</ul>
+
diff --git a/hyperkitty/templates/threads/replies.html b/hyperkitty/templates/threads/replies.html
new file mode 100644
index 0000000..19ee0e2
--- /dev/null
+++ b/hyperkitty/templates/threads/replies.html
@@ -0,0 +1,11 @@
+{% load url from future %}
+{% load hk_generic %}
+
+				{% for email in replies %}
+				<div class="{% cycle 'even' 'odd' %}"
+					{% if email.level %}style="margin-left:{{ email.level|multiply:"2" }}em;"{% endif %}>
+					<!-- Start email -->
+					{% include 'messages/message.html' %}
+					<!-- End of email -->
+				</div>
+				{% endfor %}
diff --git a/hyperkitty/templates/threads/right_col.html b/hyperkitty/templates/threads/right_col.html
index cbc7772..8744f66 100644
--- a/hyperkitty/templates/threads/right_col.html
+++ b/hyperkitty/templates/threads/right_col.html
@@ -44,15 +44,12 @@
 		</form>
 	</div>
 	<div id="participants">
-		<span id="participants_title">participants</span> ({{participants|length}})
-		<ul>
-			{% for name, email in participants.items|sort %}
-			<li>
-				{% gravatar email 20 %}
-				{{ name|escapeemail }}
-			</li>
-			{% endfor %}
-		</ul>
+		{% if is_bot %}
+			{% include 'threads/participants.html' %}
+		{% else %}
+			<span id="participants_title">participants</span>
+			<img alt="Loading..." class="ajaxloader" src="{{ STATIC_URL }}img/ajax-loader.gif" />
+		{% endif %}
 	</div>
 </section>
 
-- 
cgit