UI for replies-to-post (needs theme update)

public/language/en_GB/topic.json

@@ -16,6 +16,7 @@
 	"notify_me": "Be notified of new replies in this topic",
 	"quote": "Quote",
 	"reply": "Reply",
+	"replies_to_this_post": "Replies: %1",
 	"reply-as-topic": "Reply as topic",
 	"guest-login-reply": "Log in to reply",
 	"edit": "Edit",

public/src/client/topic.js

@@ -9,10 +9,11 @@ define('forum/topic', [
 	'forum/topic/postTools',
 	'forum/topic/events',
 	'forum/topic/posts',
+	'forum/topic/replies',
 	'navigator',
 	'sort',
 	'components'
-], function (infinitescroll, threadTools, postTools, events, posts, navigator, sort, components) {
+], function (infinitescroll, threadTools, postTools, events, posts, replies, navigator, sort, components) {
 	var	Topic = {},
 		currentUrl = '';
 
@@ -51,6 +52,7 @@ define('forum/topic', [
 
 		postTools.init(tid);
 		threadTools.init(tid);
+		replies.init(tid);
 		events.init();
 
 		sort.handleSort('topicPostSort', 'user.setTopicSort', 'topic/' + ajaxify.data.slug);

public/src/client/topic/replies.js

@@ -0,0 +1,52 @@
+'use strict';
+
+/* globals define, app, ajaxify, bootbox, socket, templates, utils, config */
+
+define('forum/topic/replies', ['navigator', 'components', 'translator'], function (navigator, components, translator) {
+
+	var Replies = {};
+
+	Replies.init = function (tid) {
+		addPostHandlers(tid);
+	};
+
+	function addPostHandlers(tid) {
+		var postContainer = components.get('topic');
+
+		postContainer.on('click', '[component="post/reply-count"]', function () {
+			onRepliesClicked($(this), tid);
+		});
+	}
+
+	function onRepliesClicked(button, tid) {
+		var post = button.parents('[data-pid]');
+		var pid = post.data('pid');
+		var icon = button.children('.fa');
+
+		if (icon.is('.fa-plus')) {
+			icon.removeClass('fa-plus').addClass('fa-spin fa-spinner');
+			socket.emit('posts.getReplies', pid, function (err, data) {
+				if (err) {
+					icon.removeClass('fa-spin fa-spinner').addClass('fa-plus');
+					return app.alertError(err.message);
+				}
+
+				icon.removeClass('fa-spin fa-spinner').addClass('fa-minus');
+
+				templates.parse('partials/posts_list', data, function (html) {
+					translator.translate(html, function (translated) {
+						$('<div>', {component: 'post/replies'}).html(translated).hide().insertAfter(button).slideDown('fast');
+					});
+				});
+			});
+		} else if (icon.is('.fa-minus')) {
+			icon.removeClass('fa-minus').addClass('fa-plus');
+
+			post.find('[component="post/replies"]').slideUp('fast', function() {
+				$(this).remove();
+			});
+		}
+	}
+
+	return Replies;
+});

src/socket.io/posts.js

@@ -118,6 +118,13 @@ SocketPosts.getPidIndex = function (socket, data, callback) {
 	posts.getPidIndex(data.pid, data.tid, data.topicPostSort, callback);
 };
 
+SocketPosts.getReplies = function (socket, pid, callback) {
+	if (!utils.isNumber(pid)) {
+		return callback(new Error('[[error:invalid-data]'));
+	}
+
+	posts.getPostSummariesFromSet('pid:' + pid + ':replies', socket.uid, 0, -1, callback);
+};
 
 
 module.exports = SocketPosts;