Improve explanations of usernames (#864)

* Reintroduce instructions

* Writing into URIs work

* Communicate multiuser

* Downcase the username

* Fix bugs in downcasing

* Fix YA bug in downcasing

* Write the hostname into the page too

Author: kjetilk

default-views/account/register-form.hbs

@@ -9,7 +9,30 @@
             <label class="control-label" for="username">Username*</label>
             <input type="text" class="form-control" name="username" id="username" placeholder="alice"
                    required/>
-          </div>
+
+	    {{#if multiuser}}
+	    <p>Your username should be a lower-case word with only
+	    letters a-z and numbers 0-9 and without periods.</p>
+	    <p>Your public Solid POD URL will be:
+	    <tt>https://<span class="editable-username">alice</span>.<script type="text/javascript">
+              document.write(window.location.host)
+	    </script></tt></p>
+	    <p>Your public Solid WebID will be:
+	    <tt>https://<span class="editable-username">alice</span>.<script type="text/javascript">
+              document.write(window.location.host)
+	    </script>/profile/card#me</tt></p>
+
+	    <p>Your <em>POD URL</em> is like the homepage for your Solid
+	    pod. By default, it is readable by the public, but you can
+	    always change that if you like by changing the access
+	    control.</p>
+
+	    <p>Your <em>Solid WebID</em> is your globally unique name
+	    that you can use to identify and authenticate yourself with
+	    other PODs across the world.</p>
+	    {{/if}}
+
+	  </div>
 
           <div class="form-group has-feedback">
             <label class="control-label" for="password">Password*</label>
@@ -76,3 +99,14 @@
 <script src="/common/js/owasp-password-strength-test.js" defer></script>
 <script src="/common/js/text-encoder-lite.min.js" defer></script>
 <script src="/common/js/solid.js" defer></script>
+
+<script>
+  var username = document.getElementById('username');
+  username.onkeyup = function() {
+  var list = document.getElementsByClassName('editable-username');
+  for (let item of list) {
+    item.innerHTML = username.value.toLowerCase()
+  }
+}
+</script>
+

lib/models/account-manager.js

@@ -350,6 +350,10 @@ class AccountManager {
       webId: userData.webid || userData.webId || userData.externalWebId
     }
 
+    if (userConfig.username) {
+      userConfig.username = userConfig.username.toLowerCase()
+    }
+
     try {
       userConfig.webId = userConfig.webId || this.accountWebIdFor(userConfig.username)
     } catch (err) {

lib/requests/create-account-request.js

@@ -56,9 +56,8 @@ class CreateAccountRequest extends AuthRequest {
 
     let body = req.body || {}
 
-    options.username = body.username
-
-    if (options.username) {
+    if (body.username) {
+      options.username = body.username.toLowerCase()
       options.userAccount = accountManager.userAccountFrom(body)
     }
 
@@ -101,7 +100,8 @@ class CreateAccountRequest extends AuthRequest {
       {
         returnToUrl: this.returnToUrl,
         loginUrl: this.loginUrl(),
-        registerDisabled: authMethod === 'tls'
+        registerDisabled: authMethod === 'tls',
+        multiuser: this.accountManager.multiuser
       })
 
     if (error) {
@@ -200,6 +200,7 @@ class CreateAccountRequest extends AuthRequest {
    */
   cancelIfUsernameInvalid (userAccount) {
     if (!userAccount.username || !/^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(userAccount.username)) {
+      debug('Invalid username ' + userAccount.username)
       const error = new Error('Invalid username')
       error.status = 400
       throw error