Send Desktop Notifications

file/js/TimWolla.WCF.Chat.coffee

@@ -13,7 +13,6 @@ TimWolla.WCF ?= {}
 (($, window) ->
 	TimWolla.WCF.Chat =
 		titleTemplate: null
-		title: document.title
 		messageTemplate: null
 		newMessageCount: null
 		events: 
@@ -34,14 +33,12 @@ TimWolla.WCF ?= {}
 		bindEvents: () ->
 			@isActive = true
 			$(window).focus $.proxy () ->
-				document.title = @title
+				document.title = @titleTemplate.fetch({ title: $('#chatRoomList .activeMenuItem a').text() })
 				@newMessageCount = 0
-				clearTimeout @timeout
 				@isActive = true
 			, @
 			
 			$(window).blur $.proxy () ->
-				@title = document.title
 				@isActive = false
 			, @
 			
@@ -75,6 +72,10 @@ TimWolla.WCF ?= {}
 					element.data 'status', 1
 					icon.attr 'src', icon.attr('src').replace /disabled(\d?).([a-z]{3})$/, 'enabled$1.$2'
 					element.attr 'title', element.data 'disableMessage'
+			if typeof window.webkitNotifications isnt 'undefined'
+				$('#chatNotify').click (event) ->
+					window.webkitNotifications.requestPermission()
+					
 		###
 		# Changes the chat-room.
 		# 
@@ -159,15 +160,6 @@ TimWolla.WCF ?= {}
 				dataType: 'json'
 				type: 'POST'
 				success: $.proxy((data, textStatus, jqXHR) ->
-					if (!@isActive and $('#chatNotify').data('status') is 1)
-						@newMessageCount += data.messages.length
-						if (@newMessageCount > 0)
-							@timeout = setTimeout $.proxy(() ->
-								document.title = @newMessageCount + WCF.Language.get('wcf.chat.newMessages')
-								setTimeout $.proxy(() ->
-									document.title = @title
-								, @), 3000
-							, @), 1000
 					@handleMessages(data.messages)
 					@handleUsers(data.users)
 				, @)
@@ -179,6 +171,7 @@ TimWolla.WCF ?= {}
 		handleMessages: (messages) ->
 			for message in messages
 				@events.newMessage.fire message
+				@notify message
 				
 				output = @messageTemplate.fetch message
 				li = $ '<li></li>'
@@ -248,6 +241,24 @@ TimWolla.WCF ?= {}
 			else
 				$('#chatInput').focus()
 		###
+		# Sends a notification about a message.
+		#
+		# @param	object	message
+		###
+		notify: (message) ->
+			#return if (@isActive or $('#chatNotify').data('status') is 0)
+			@newMessageCount++
+			
+			document.title = @newMessageCount + ' ' + WCF.Language.get('wcf.chat.newMessages') + ' - ' + @titleTemplate.fetch({ title: $('#chatRoomList .activeMenuItem a').text() })
+			
+			if typeof window.webkitNotifications isnt 'undefined'
+				if window.webkitNotifications.checkPermission() is 0
+					notification = window.webkitNotifications.createNotification WCF.Icon.get('timwolla.wcf.chat.chat'), WCF.Language.get('wcf.chat.newMessages'), 'New message by' + message.username
+					notification.show()
+					setTimeout(() ->
+						notification.cancel()
+					, 5000)
+		###
 		# Refreshes the room-list.
 		###
 		refreshRoomList: () ->

template/chat.tpl

@@ -199,13 +199,17 @@
 				maxTextLength: {CHAT_LENGTH}
 			}
 			WCF.Language.addObject({
-				'wcf.chat.query': '{lang}wcf.chat.query{/lang}'),
+				'wcf.chat.query': '{lang}wcf.chat.query{/lang}',
-				'wcf.chat.kick': '{lang}wcf.chat.kick{/lang}'),
+				'wcf.chat.kick': '{lang}wcf.chat.kick{/lang}',
-				'wcf.chat.ban': '{lang}wcf.chat.ban{/lang}'),
+				'wcf.chat.ban': '{lang}wcf.chat.ban{/lang}',
-				'wcf.chat.profile': '{lang}wcf.chat.profile{/lang}'
+				'wcf.chat.profile': '{lang}wcf.chat.profile{/lang}',
+				'wcf.chat.newMessages': '{lang}wcf.chat.newMessages{/lang}'
+			});
+			WCF.Icon.addObject({
+				'timwolla.wcf.chat.chat': '{icon size='L'}chat1{/icon}'
 			});
 			{event name='shouldInit'}
-			// Boot the that
+			// Boot the chat
 			TimWolla.WCF.Chat.init();
 			{event name='didInit'}