Sync sidebar order

client/js/shout.js

@@ -684,7 +684,17 @@ $(function() {
 			placeholder: "network-placeholder",
 			forcePlaceholderSize: true,
 			update: function() {
-				// ..
+				var order = [];
+				sidebar.find(".network").each(function() {
+					var id = $(this).data("id");
+					order.push(id);
+				});
+				socket.emit(
+					"sort", {
+						type: "networks",
+						order: order
+					}
+				);
 			}
 		});
 		sidebar.find(".network").sortable({
@@ -694,8 +704,20 @@ $(function() {
 			items: ".chan:not(.lobby)",
 			placeholder: "chan-placeholder",
 			forcePlaceholderSize: true,
-			update: function() {
-				// ..
+			update: function(e, ui) {
+				var order = [];
+				var network = ui.item.parent();
+				network.find(".chan").each(function() {
+					var id = $(this).data("id");
+					order.push(id);
+				});
+				socket.emit(
+					"sort", {
+						type: "channels",
+						target: network.data("id"),
+						order: order
+					}
+				);
 			}
 		});
 	}

client/js/shout.templates.js

@@ -114,7 +114,9 @@ templates['network'] = template({"1":function(depth0,helpers,partials,data) {
   var helper, functionType="function", helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression;
   return "<section id=\"network-"
     + escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
-    + "\" class=\"network\">\n	"
+    + "\" class=\"network\" data-id=\""
+    + escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
+    + "\">\n	"
     + escapeExpression(((helpers.partial || (depth0 && depth0.partial) || helperMissing).call(depth0, "chan", {"name":"partial","hash":{},"data":data})))
     + "\n</section>\n";
 },"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {

client/templates/network.tpl

@@ -1,5 +1,5 @@
 {{#each networks}}
-<section id="network-{{id}}" class="network">
+<section id="network-{{id}}" class="network" data-id="{{id}}">
 	{{partial "chan"}}
 </section>
 {{/each}}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "shout",
   "description": "The self-hosted web IRC client",
-  "version": "0.33.1",
+  "version": "0.33.2",
   "author": "Mattias Erming",
   "preferGlobal": true,
   "bin": {

src/client.js

@@ -246,6 +246,42 @@ Client.prototype.open = function(data) {
 	}
 };
 
+Client.prototype.sort = function(data) {
+	var self = this;
+
+	var type = data.type;
+	var order = data.order || [];
+
+	switch (type) {
+	case "networks":
+		var sorted = [];
+		_.each(order, function(i) {
+			var find = _.find(self.networks, {id: i});
+			if (find) {
+				sorted.push(find);
+			}
+		});
+		self.networks = sorted;
+		break;
+
+	case "channels":
+		var target = data.target;
+		var network = _.find(self.networks, {id: target});
+		if (!network) {
+			return;
+		}
+		var sorted = [];
+		_.each(order, function(i) {
+			var find = _.find(network.channels, {id: i});
+			if (find) {
+				sorted.push(find);
+			}
+		});
+		network.channels = sorted;
+		break;
+	}
+};
+
 Client.prototype.quit = function() {
 	this.networks.forEach(function(network) {
 		var irc = network.irc;

src/server.js

@@ -85,7 +85,13 @@ function init(socket, client, token) {
 			function(data) {
 				client.open(data);
 			}
-		)
+		);
+		socket.on(
+			"sort",
+			function(data) {
+				client.sort(data);
+			}
+		);
 		socket.join(client.id);
 		socket.emit("init", {
 			active: client.activeChannel,