From 8769ca1dd9d1cd133c81b9d273d53caa4ccb6667 Mon Sep 17 00:00:00 2001
From: Xaekai <ribbon13@gmail.com>
Date: Sun, 4 Jun 2017 18:59:36 -0700
Subject: [PATCH] Basic validation of channel IDs on the registration page

---
 templates/account-channels.pug | 46 +++++++++++++++++++++++++++++++---
 1 file changed, 43 insertions(+), 3 deletions(-)

diff --git a/templates/account-channels.pug b/templates/account-channels.pug
index b21a233a..ab0de34f 100644
--- a/templates/account-channels.pug
+++ b/templates/account-channels.pug
@@ -55,9 +55,49 @@ html(lang="en")
                 input(type="hidden", name="_csrf", value=csrfToken)
                 input(type="hidden", name="action", value="new_channel")
                 .form-group
-                  label.control-label(for="channelname") Channel Name
-                  input#channelname.form-control(type="text", name="name")
-                button.btn.btn-primary.btn-block(type="submit") Register
+                  label.control-label(for="channelname") Channel URL
+                  span#validation.pull-right
+                  .input-group
+                    span.input-group-addon #{baseUrl}/r/
+                    input#channelname.form-control(type="text", name="name")
+                button#register.btn.btn-primary.btn-block(type="submit") Register
 
     include footer
     +footer()
+    script( type='text/javascript').
+        function nameIsInvalid(id){
+            if(/\s/.test(id)){
+                return 'Channel URLs may not contain spaces';
+            }
+            if(id.length > 30){
+                return 'Channel URLs may not be longer than 30 characters';
+            }
+            if(id.length < 1){
+                return 'Channel URLs must be at least one character';
+            }
+            if(!/^[\w-]{1,30}$/.test(id)){
+                return 'Channel URLs may only consist of a-z, A-Z, 0-9, - and _';
+            }
+            return false;
+        }
+
+        $("#channelname").keyup(function () {
+            var box = $(this);
+            var value = box.val();
+            var lastkey = Date.now();
+            box.data("lastkey", lastkey);
+
+            setTimeout(function () {
+                if (box.data("lastkey") !== lastkey || box.val() !== value) {
+                    return;
+                }
+                if(nameIsInvalid(value)){
+                    $('#validation').text(nameIsInvalid(value));
+                    $('#register').addClass('disabled');
+                } else {
+                    $('#validation').text('');
+                    $('#register').removeClass('disabled');
+                }
+            }, 200);
+        });
+