From 415ae5a05e2638ca4825850cdf84c862643798ca Mon Sep 17 00:00:00 2001
From: Thierry Carrez <thierry@openstack.org>
Date: Fri, 13 Nov 2020 17:30:56 +0100
Subject: [PATCH] Make URLs in MOTD messages clickable

A long-wanted feature! Since the MOTD can only be controlled by an
admin, the risk of abuse is very limited.

Change-Id: Iff6263059d76c9b75ae26e029e3063992ab7cb76
---
 html/etherpads.html | 2 +-
 html/index.html     | 2 +-
 html/motd.js        | 8 ++++++++
 html/ptg.html       | 2 +-
 4 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/html/etherpads.html b/html/etherpads.html
index 40b9aad..b512c09 100644
--- a/html/etherpads.html
+++ b/html/etherpads.html
@@ -24,7 +24,7 @@
 </nav>
 <script id="MOTDTemplate" type="text/x-handlebars-template">
 {{#each motd}}
-<div class="alert alert-{{this.level}}" role="alert">{{this.message}}</div>
+<div class="alert alert-{{this.level}}" role="alert">{{ linkify this.message }}</div>
 {{/each}}
 </script>
 <div id="MOTD"></div>
diff --git a/html/index.html b/html/index.html
index 8dab677..e308dcb 100644
--- a/html/index.html
+++ b/html/index.html
@@ -24,7 +24,7 @@
 </nav>
 <script id="MOTDTemplate" type="text/x-handlebars-template">
 {{#each motd}}
-<div class="alert alert-{{this.level}}" role="alert">{{this.message}}</div>
+<div class="alert alert-{{this.level}}" role="alert">{{ linkify this.message }}</div>
 {{/each}}
 </script>
 <div id="MOTD"></div>
diff --git a/html/motd.js b/html/motd.js
index c2b45d1..9ceeeeb 100644
--- a/html/motd.js
+++ b/html/motd.js
@@ -4,6 +4,14 @@ var dsource = document.getElementById("MOTDTemplate").innerHTML;
 // Handlebars compiles the above source into a template
 var dtemplate = Handlebars.compile(dsource);
 
+Handlebars.registerHelper('linkify', function(str) {
+    var pattern1 = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
+    var str1 = str.replace(pattern1, '<a target="_blank" href="$1">$1</a>');
+    var pattern2 =/(^|[^\/])(www\.[\S]+(\b|$))/gim;
+    var str2 = str1.replace(pattern2, '$1<a target="_blank" href="http://$2">$2</a>');
+    return new Handlebars.SafeString(str2);
+});
+
 $.getJSON("ptg.json", function(json) {
   document.getElementById("MOTD").innerHTML = dtemplate(json);
 });
diff --git a/html/ptg.html b/html/ptg.html
index dc96e29..5071cb5 100644
--- a/html/ptg.html
+++ b/html/ptg.html
@@ -24,7 +24,7 @@
 </nav>
 <script id="MOTDTemplate" type="text/x-handlebars-template">
 {{#each motd}}
-<div class="alert alert-{{this.level}}" role="alert">{{this.message}}</div>
+<div class="alert alert-{{this.level}}" role="alert">{{ linkify this.message }}</div>
 {{/each}}
 </script>
 <div id="MOTD"></div>