Merge pull request #293 from sharelatex/pr-wrap-long-words-chat

Wrap long words chat

services/web/app/views/project/editor/chat.jade

@@ -45,7 +45,7 @@ aside.chat(
 								mathjax,
 								ng-repeat="content in message.contents track by $index"
 							)
-								span(ng-bind-html="content | linky:'_blank'")
+								span(ng-bind-html="content | linky:'_blank' | wrapLongWords")
 
 	.new-message
 		textarea(

services/web/public/coffee/filters/wrapLongWords.coffee

@@ -0,0 +1,25 @@
+define [
+	"base"
+], (App) ->
+	DEF_MIN_LENGTH = 20
+
+	_decodeHTMLEntities = (str) ->
+		str.replace /&#(\d+);/g, (match, dec) ->
+    		String.fromCharCode dec;
+
+	_getWrappedWordsString = (baseStr, wrapperElName, minLength) ->
+		minLength = minLength || DEF_MIN_LENGTH
+		words = baseStr.split ' '
+
+		wordsWrapped = for word in words
+			if _decodeHTMLEntities(word).length >= minLength
+				"<#{wrapperElName} class=\"break-word\">#{word}</#{wrapperElName}>"
+			else
+				word
+
+		outputStr = wordsWrapped.join ' '
+
+
+	App.filter "wrapLongWords", () ->
+		(input, minLength) ->
+			_getWrappedWordsString input, "span", minLength

services/web/public/coffee/ide/chat/index.coffee

@@ -3,4 +3,5 @@ define [
 	"ide/chat/controllers/ChatController"
 	"ide/chat/controllers/ChatMessageController"
 	"ide/chat/directives/mathjax"
+	"filters/wrapLongWords"
 ], () ->

services/web/public/stylesheets/app/editor/chat.less

@@ -129,6 +129,10 @@
 	}
 }
 
+.break-word {
+	word-break: break-all;
+}
+
 .editor-dark {
 	.chat {
 		.new-message {