Added AnsiLove for rendering messages with ANSI sequences

app/Casts/CompressedString.php

@@ -4,6 +4,7 @@ namespace App\Casts;
 
 use Illuminate\Contracts\Database\Eloquent\CastsAttributes;
 use Illuminate\Database\Eloquent\Model;
+use Illuminate\Support\Arr;
 
 class CompressedString implements CastsAttributes
 {
@@ -20,6 +21,11 @@ class CompressedString implements CastsAttributes
 	 */
 	public function get($model,string $key,mixed $value,array $attributes): string
 	{
+		static $converted = [];
+
+		if (Arr::get($converted,$key))
+			return $value;
+
 		// For stream resources, we to fseek in case we've already read it.
 		if (is_resource($value))
 			fseek($value,0);
@@ -28,6 +34,8 @@ class CompressedString implements CastsAttributes
 			? stream_get_contents($value)
 			: $value;
 
+		$converted[$key] = TRUE;
+
 		return $value ? zstd_uncompress(base64_decode($value)) : '';
 	}
 

resources/views/about.blade.php

@@ -112,6 +112,7 @@
 		<li>PHP/Laravel - the coding framework used to create this UI, and to enable the transfer of mail between systems</li>
 		<li>jQuery - to help with the web UI</li>
 		<li>Highcharts - to render the graphs</li>
+		<li>AnsiLove - to render the messages, for when they have ANSI code sequences</li>
 	</ul>
 
 	<p>If you'd like to support enhancing Clearing Houz, <a href="https://buymeacoffee.com/dege">Buy me a coffee!</a></p>

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