client: display description/email/client tag/share size on hover, display operators in green

client/dcwebui.css

@@ -353,6 +353,11 @@ html,body {
 	overflow-y: auto;
 }
 
+.user-is-operator {
+	color:darkgreen;
+	font-weight:bold;
+}
+
 /* User sprite */
 
 .ul-mini {

client/dcwebui.js

@@ -36,6 +36,17 @@ var hesc = function(s) {
 	return s.toString().replace(/[&<>'"]/g, function(s) { return filter[s]; });
 };
 
+var fmtBytes = function(b) {
+	if (b == 0) {
+		return '(nothing)';
+	}
+	
+	var k = 1024;
+	var sizes = [' B', ' KiB', ' MiB', ' GiB', ' TiB'];
+	var i = Math.floor(Math.log(bytes) / Math.log(k));
+	return parseFloat((bytes / Math.pow(k, i)).toFixed(3)) + sizes[i];
+};
+
 var linkify = function(str) {
 	return str.replace(
 		/(https?:\/\/[^\s<]+)/g, "<a target='_blank' href=\"$1\">$1</a>"
@@ -56,6 +67,13 @@ var textContent = function($el) {
 	return "";
 };
 
+// @ref https://developer.mozilla.org/en/docs/Web/API/WindowBase64/Base64_encoding_and_decoding
+var b64 = function(str) {
+    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
+        return String.fromCharCode('0x' + p1);
+    })).replace(/=/g, '');
+}
+
 // https://gist.github.com/eligrey/1276030
 var appendInnerHTML = function($el, html) {
 	var child = document.createElement("span");
@@ -175,6 +193,7 @@ var userlist = {
 			var userlist = userlists[l];
 			
 			var to_add = document.createElement('li');
+			to_add.className = "user-" + b64(u);
 			to_add.innerHTML = hesc(u);
 			
 			to_add.onclick = function() { switchToPM(u); };
@@ -236,16 +255,37 @@ var userlist = {
 		return ret;
 	},
 	'has': function(u) {
-		var userlist = $(".userlist")[0].children;
-		for (var i = 0, e = userlist.length; i < e; ++i) {
-			if (textContent(userlist[i]) === u) {
-				return true;
-			}
-		}
-		return false;
+		return $(".user-" + b64(u)).length !== 0; /* there are two - large and non-large */
 	},
 	'count': function() {
 		return $(".userlist")[0].children.length;
+	},
+	'setInfo': function(nick, props) {
+		console.log([nick, props]);
+		
+		var baseClass = "user-" + b64(nick);
+		var $el = $("." + baseClass);
+		var prop_str = [];
+		if (props.Description.length > 0) {
+			prop_str.push(props.Description);
+		}
+		if (props.Email.length > 0) {
+			prop_str.push(props.Email);
+		}
+		if (props.ClientTag.length > 0) {
+			prop_str.push(props.ClientTag + " " + props.ClientVersion);
+		}
+		prop_str.push("Sharing " + fmtBytes(props.ShareSize));
+		
+		for (var i = 0; i < $el.length; ++i) {
+			$el[i].title = prop_str.join("\n");
+			
+			if (props.IsOperator) {
+				$el[i].className = baseClass + " user-is-operator";
+			} else {
+				$el[i].className = baseClass; // remove op flag
+			}
+		}
 	}
 };
 
@@ -742,6 +782,12 @@ window.onload = function() {
 		}
 		updateTitle();
 	});
+	sock.on('info', function(u) {
+		try {
+			var props = JSON.parse(u.message);
+			userlist.setInfo(u.user, props);
+		} catch (ex) {}
+	});
 	sock.on('close', function() {
 		hub_state = 0;
 		userlist.clear();