closes #716, also moved chat to its own template

public/src/app.js

@@ -391,14 +391,16 @@ var socket,
 		}
 
 		require(['chat'], function (chat) {
-			var chatModal;
 			if (!chat.modalExists(touid)) {
-				chatModal = chat.createModal(username, touid);
+				chat.createModal(username, touid, loadAndCenter);
 			} else {
-				chatModal = chat.getModal(touid);
+				loadAndCenter(chat.getModal(touid));
 			}
+
+			function loadAndCenter(chatModal) {
 				chat.load(chatModal.attr('UUID'));
 				chat.center(chatModal);
+			}
 		});
 	};
 

public/src/forum/footer.js

@@ -227,9 +227,8 @@
 
 	socket.on('event:chats.receive', function(data) {
 		require(['chat'], function(chat) {
-			var modal = null;
 			if (chat.modalExists(data.fromuid)) {
-				modal = chat.getModal(data.fromuid);
+				var modal = chat.getModal(data.fromuid);
 				chat.appendChatMessage(modal, data.message, data.timestamp);
 
 				if (modal.is(":visible")) {
@@ -242,9 +241,10 @@
 					app.alternatingTitle(data.username + ' has messaged you');
 				}
 			} else {
-				modal = chat.createModal(data.username, data.fromuid);
+				chat.createModal(data.username, data.fromuid, function(modal) {
 					chat.toggleNew(modal.attr('UUID'), true);
 					app.alternatingTitle(data.username + ' has messaged you');
+				});
 			}
 		});
 	});

public/src/modules/chat.js

@@ -46,7 +46,10 @@ define(['taskbar', 'string'], function(taskbar, S) {
 
 	module.createModal = function(username, touid, callback) {
 
-		var chatModal = $('#chat-modal').clone(),
+		templates.preload_template('chat', function() {
+			translator.translate(templates['chat'].parse({}), function (chatTpl) {
+
+				var chatModal = $(chatTpl),
 					uuid = utils.generateUUID();
 
 				chatModal.intervalId = 0;
@@ -87,18 +90,21 @@ define(['taskbar', 'string'], function(taskbar, S) {
 					state: ''
 				});
 
-		return chatModal;
+				callback(chatModal);
+			});
+		});
 	}
 
 	module.center = function(chatModal) {
 		chatModal.css("position", "fixed");
 		chatModal.css("left", Math.max(0, (($(window).width() - $(chatModal).outerWidth()) / 2) + $(window).scrollLeft()) + "px");
+		chatModal.css("top", "0px");
 		return chatModal;
 	}
 
 	module.load = function(uuid) {
 		var chatModal = $('div[UUID="'+uuid+'"]');
-		chatModal.show();
+		chatModal.removeClass('hide');
 		module.bringModalToTop(chatModal);
 		checkOnlineStatus(chatModal);
 		taskbar.updateActive(uuid);
@@ -108,7 +114,7 @@ define(['taskbar', 'string'], function(taskbar, S) {
 
 	module.minimize = function(uuid) {
 		var chatModal = $('div[UUID="'+uuid+'"]');
-		chatModal.hide();
+		chatModal.addClass('hide');
 		taskbar.minimize('chat', uuid);
 		clearInterval(chatModal.intervalId);
 		chatModal.intervalId = 0;

public/templates/chat.tpl

@@ -0,0 +1,18 @@
+
+<div id="chat-modal" class="chat-modal hide" tabindex="-1" role="dialog" aria-labelledby="Chat" aria-hidden="true" data-backdrop="none">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+				<h4>[[footer:chat.chatting_with]]</h4>
+			</div>
+			<div class="modal-body">
+				<textarea class="form-control" id="chat-content" cols="40" rows="10" readonly></textarea><br/>
+				<input id="chat-message-input" type="text" class="form-control" name="chat-message" placeholder="[[footer:chat.placeholder]]"/>
+			</div>
+			<div class="modal-footer">
+				<button type="button" id="chat-message-send-btn" href="#" class="btn btn-primary btn-lg btn-block">[[footer:chat.send]]</button>
+			</div>
+		</div>
+	</div>
+</div>

public/templates/footer.tpl

@@ -2,25 +2,6 @@
 
 	</div><!--END container -->
 
-	<div id="chat-modal" class="modal chat-modal col-lg-12 col-md-12" tabindex="-1" role="dialog" aria-labelledby="Chat" aria-hidden="true" data-backdrop="none">
-		<div class="modal-dialog">
-			<div class="modal-content">
-				<div class="modal-header">
-					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-					<h4 id="myModalLabel">[[footer:chat.chatting_with]]</h4>
-				</div>
-				<div class="modal-body">
-					<textarea class="form-control" id="chat-content" cols="40" rows="10" readonly></textarea><br/>
-					<input id="chat-message-input" type="text" class="form-control" name="chat-message" placeholder="[[footer:chat.placeholder]]"/>
-				</div>
-				<div class="modal-footer">
-					<button type="button" id="chat-message-send-btn" href="#" class="btn btn-primary btn-lg btn-block
-					">[[footer:chat.send]]</button>
-				</div>
-			</div><!-- /.modal-content -->
-		</div><!-- /.modal-dialog -->
-	</div><!-- /.modal -->
-
 	<div id="upload-picture-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="Upload Picture" aria-hidden="true">
 		<div class="modal-dialog">
 			<div class="modal-content">

src/routes/debug.js

@@ -87,6 +87,7 @@ var	DebugRoute = function(app) {
 				site_title: 'derp',
 				confirm_link: 'linkylink'
 			});
+
 			res.send();
 		});
 	});