From 37616a148afc5d0520cd4b11e816fb1ab238c777 Mon Sep 17 00:00:00 2001
From: Andreas Schneider <aksdb@gmx.de>
Date: Sat, 8 Dec 2018 17:06:11 +0100
Subject: [PATCH] Added password coloring pipe (which also sanitizes HTML)
 (#24)

---
 src/angular/pipes/color-password.pipe.ts | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)
 create mode 100644 src/angular/pipes/color-password.pipe.ts

diff --git a/src/angular/pipes/color-password.pipe.ts b/src/angular/pipes/color-password.pipe.ts
new file mode 100644
index 0000000000..1867032faf
--- /dev/null
+++ b/src/angular/pipes/color-password.pipe.ts
@@ -0,0 +1,20 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { SafeHtml } from '@angular/platform-browser';
+
+/**
+ * A pipe that sanitizes HTML and highlights numbers and special characters (in different colors each).
+ */
+@Pipe({ name: 'colorPassword' })
+export class ColorPasswordPipe implements PipeTransform {
+    transform(password: string): SafeHtml {
+        return password
+            // Sanitize HTML first.
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;')
+            // Replace special chars (since that will exclude numbers anyway).
+            .replace(/((&amp;|&lt;|&gt;|[^\w ])+)/g, `<span class="passwordSpecial">$1</span>`)
+            // Finally replace the numbers.
+            .replace(/(\d+)/g, `<span class="passwordNumber">$1</span>`);
+    }
+}