Added AnsiLove for rendering messages with ANSI sequences

resources/views/widgets/message.blade.php

@@ -33,8 +33,8 @@ use App\Classes\FTN\Message;
 
 <div class="row pb-2">
 	<div class="col-8">
-		<div class="pad pb-0">
-			<pre class="highlight">{!! Message::tr($msg->msg).($msg->origin ? sprintf("\r * Origin: %s",$msg->origin) : '') !!}</pre>
+		<div class="p-2">
+			<div id="canvas"></div>
 		</div>
 	</div>
 </div>
@@ -82,4 +82,25 @@ use App\Classes\FTN\Message;
 			@endif
 		</div>
 	</div>
-@endif
+@endif
+
+@section('page-scripts')
+	<script type="text/javascript" src="{{ asset('ansilove/ansilove.js') }}"></script>
+
+	<script type="text/javascript">
+		$(document).ready(function() {
+			var msg = new Uint8Array({!! json_encode(array_values(unpack('C*',str_replace("\r","\n",$msg->msg)))) !!});
+			retina = window.devicePixelRatio > 1;
+
+			AnsiLove.renderBytes(
+				msg,
+				function (canvas, sauce) {
+					console.log(canvas);
+					document.getElementById("canvas").appendChild(canvas);
+				},
+				{'font': '80x25', 'bits': 8, 'icecolors': 0, 'columns': 80}
+			);
+		});
+	</script>
+
+@append