From a7375021ce7d10211fa65100a9eedc5930dcf974 Mon Sep 17 00:00:00 2001
From: Quinella <van.den.brande.robin@gmail.com>
Date: Fri, 10 Jan 2014 10:06:07 +0100
Subject: [PATCH] Make PM windows minimizable

---
 js/client-mainmenu.js | 42 ++++++++++++++++++++++++++++++++++++++++--
 style/client.css      | 12 ++++++++----
 2 files changed, 48 insertions(+), 6 deletions(-)

diff --git a/js/client-mainmenu.js b/js/client-mainmenu.js
index c1dd5a589..df6b6e05b 100644
--- a/js/client-mainmenu.js
+++ b/js/client-mainmenu.js
@@ -8,6 +8,7 @@
 			'keydown textarea': 'keyPress',
 			'click .username': 'clickUsername',
 			'click .closebutton': 'closePM',
+			'click .minimizebutton': 'minimizePM',
 			'click .pm-window': 'clickPMBackground',
 			'focus textarea': 'onFocusPM',
 			'blur textarea': 'onBlurPM',
@@ -138,6 +139,10 @@
 			if (autoscroll) {
 				$chatFrame.scrollTop($chat.height());
 			}
+
+			if ($pmWindow.data('minimized') && name.substr(1) !== app.user.get('name')) {
+				$pmWindow.find('h3').prepend('<i class="icon-exclamation-sign" style="margin-right: 3px;"></i>');
+			}
 		},
 		openPM: function(name, dontFocus) {
 			var userid = toId(name);
@@ -149,7 +154,11 @@
 				} else {
 					group = '<small>'+Tools.escapeHTML(group)+'</small>';
 				}
-				var buf = '<div class="pm-window pm-window-'+userid+'" data-userid="'+userid+'" data-name="'+name+'"><h3><button class="closebutton" href="'+app.root+'teambuilder" tabindex="-1"><i class="icon-remove-sign"></i></button>'+group+Tools.escapeHTML(name.substr(1))+'</h3><div class="pm-log"><div class="inner"></div></div>';
+				var buf = '<div class="pm-window pm-window-'+userid+'" data-userid="'+userid+'" data-name="'+name+'">';
+				buf += '<h3><button class="closebutton" href="'+app.root+'teambuilder" tabindex="-1"><i class="icon-remove-sign"></i></button>';
+				buf += '<button class="minimizebutton" href="'+app.root+'teambuilder" tabindex="-1"><i class="icon-minus-sign"></i></button>';
+				buf += group+Tools.escapeHTML(name.substr(1))+'</h3>';
+				buf += '<div class="pm-log"><div class="inner"></div></div>';
 				buf += '<div class="pm-log-add"><form class="chatbox nolabel"><textarea class="textbox" type="text" size="70" autocomplete="off" name="message"></textarea></form></div></div>';
 				$pmWindow = $(buf).prependTo(this.$pmBox);
 				$pmWindow.find('textarea').autoResize({
@@ -219,6 +228,31 @@
 
 			if (app.curSideRoom) app.curSideRoom.focus();
 		},
+		minimizePM: function(e) {
+			var $pmWindow;
+			if (e.currentTarget) {
+				e.preventDefault();
+				e.stopPropagation();
+				$pmWindow = $(e.currentTarget).closest('.pm-window');
+			}
+			if (!$pmWindow) {
+				return;
+			}
+
+			var $pmHeader = $pmWindow.find('h3');
+			var $pmContent = $pmWindow.find('.pm-log, .pm-log-add');
+			if (!$pmWindow.data('minimized')) {
+				$pmContent.hide();
+				$pmHeader.addClass('pm-minimized');
+				$pmWindow.data('minimized', true);
+			} else {
+				$pmContent.show();
+				$pmHeader.removeClass('pm-minimized');
+				$pmWindow.data('minimized', false);
+			}
+
+			$pmWindow.find('i.icon-exclamation-sign').remove();
+		},
 		focusPM: function(name) {
 			this.openPM(name).prependTo(this.$pmBox).find('textarea[name=message]').focus();
 		},
@@ -262,7 +296,11 @@
 					return;
 				}
 				app.dismissPopups();
-				$(e.currentTarget).find('textarea[name=message]').focus();
+				var $target = $(e.currentTarget);
+				if ($target.data('minimized')) {
+					this.minimizePM(e);
+				}
+				$target.find('textarea[name=message]').focus();
 			}
 		},
 
diff --git a/style/client.css b/style/client.css
index 1db31613b..66401c63c 100644
--- a/style/client.css
+++ b/style/client.css
@@ -293,7 +293,7 @@ a.subtle:hover {
 .tabbar a.cur + .closebutton {
 	top: 4px;
 }
-.closebutton {
+.closebutton, .minimizebutton {
 	text-decoration: none;
 	font-size: 14px;
 	color: #999999;
@@ -304,10 +304,10 @@ a.subtle:hover {
 	background: transparent;
 	cursor: pointer;
 }
-.closebutton:hover {
+.closebutton:hover, .minimizebutton:hover {
 	color: #BB2222;
 }
-.closebutton:active {
+.closebutton:active, .minimizebutton:active {
 	color: #661111;
 }
 
@@ -599,8 +599,12 @@ p.or:after {
 .pm-window h3:hover {
 	color: #333333;
 }
-.pm-window h3 .closebutton {
+.pm-window h3.pm-minimized {
+	border-radius: 5px;
+}
+.pm-window h3 .closebutton, .pm-window h3 .minimizebutton {
 	float: right;
+	padding-right: 1px;
 }
 .pm-window h3 small {
 	color: #888888;