From f5bd373839c2dd3446ee10fd99874c54fa9e5884 Mon Sep 17 00:00:00 2001
From: Maximilian Mader <maximilian.mader@gmx.de>
Date: Thu, 27 Feb 2014 22:16:08 +0100
Subject: [PATCH] Add smiley overlay for mobile devices

---
 file/js/be.bastelstu.Chat.litcoffee | 24 +++++++++++++++++++++++-
 file/style/be.bastelstu.chat.less   | 18 +++++++++++++++++-
 2 files changed, 40 insertions(+), 2 deletions(-)

diff --git a/file/js/be.bastelstu.Chat.litcoffee b/file/js/be.bastelstu.Chat.litcoffee
index 75a7606..c420e86 100644
--- a/file/js/be.bastelstu.Chat.litcoffee
+++ b/file/js/be.bastelstu.Chat.litcoffee
@@ -49,7 +49,9 @@ exposed by a function if necessary.
 		userListSize = 0
 		
 		remainingFailures = 3
-
+		
+		overlaySmileyList = null
+		
 		events =
 			newMessage: $.Callbacks()
 			userMenu: $.Callbacks()
@@ -147,6 +149,26 @@ Insert the appropriate smiley code into the input when a smiley is clicked.
 
 			$('#smilies').on 'click', 'img', -> insertText " #{$(@).attr('alt')} "
 
+Copy the first loaded category of smilies so it won't get detached by wcfDialog
+
+			overlaySmileyList = $('<ul class="smileyList">').append $('#smilies .smileyList').clone().children()
+
+Add click event to smilies in the overlay
+
+			overlaySmileyList.on 'click', 'img', ->
+				insertText " #{$(@).attr('alt')} "
+				overlaySmileyList.wcfDialog 'close'
+
+Open the smiley wcfDialog
+
+			$('#timsChatSmileyPopupButton').on 'click', ->
+				overlaySmileyList.wcfDialog
+					title: WCF.Language.get 'chat.general.smilies'
+					
+				overlaySmileyList.css
+					'max-height': $(window).height() - overlaySmileyList.parent().siblings('.dialogTitlebar').outerHeight()
+					'overflow': 'auto'
+			
 Handle private channel menu
 
 			$('#timsChatMessageTabMenu > .tabMenu').on 'click', '.timsChatMessageTabMenuAnchor', ->
diff --git a/file/style/be.bastelstu.chat.less b/file/style/be.bastelstu.chat.less
index ab7ffff..fe31fd2 100644
--- a/file/style/be.bastelstu.chat.less
+++ b/file/style/be.bastelstu.chat.less
@@ -425,7 +425,7 @@
 		
 		#timsChatUserList {
 			> ul {
-				> li {
+				> .timsChatUser {
 					&.you {
 						a {
 							&:hover {
@@ -435,6 +435,10 @@
 						}
 					}
 					
+					&.away {
+						opacity: 0.5;
+					}
+					
 					a {
 						img {
 							margin-right: @wcfGapTiny;
@@ -469,6 +473,18 @@
 	#fish {
 		font-size: 2rem;
 	}
+	
+	.dialogContent {
+		.smileyList {
+			> li {
+				> a {
+					img {
+						margin: @wcfGapTiny;
+					}
+				}
+			}
+		}
+	}
 }
 
 // TODO