From 20079a7b9e818e16fab74f025cbb8c145ab73aab Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Oct 2018 02:16:54 +0100
Subject: [PATCH 01/19] Added asl icon support, icons and colors can be enabled
 or disabled in config

---
 components/CustomNicklistUser.vue | 128 ++++++++++++++++++++++++++++++
 custom-welcome.js                 |  26 +++++-
 2 files changed, 151 insertions(+), 3 deletions(-)
 create mode 100644 components/CustomNicklistUser.vue

diff --git a/components/CustomNicklistUser.vue b/components/CustomNicklistUser.vue
new file mode 100644
index 0000000..5af63b3
--- /dev/null
+++ b/components/CustomNicklistUser.vue
@@ -0,0 +1,128 @@
+<template>
+    <li
+        :class="[
+            nicklist.userMode(user) ? 'kiwi-nicklist-user--mode-' + nicklist.userMode(user) : '',
+            user.away ? 'kiwi-nicklist-user--away' : '',
+            user.ignore ? 'kiwi-nicklist-user--ignore' : '',
+            user.gender ? 'kiwi-nicklist-user--gender-' + user.gender : '',
+        ]"
+        class="kiwi-nicklist-user"
+        @click="nicklist.openUserbox(user)"
+    >
+        <span class="kiwi-nicklist-user-prefix">{{ nicklist.userModePrefix(user) }}</span>
+        <span :style="{ 'color': userColour }"
+              class="kiwi-nicklist-user-nick"
+        >{{ user.nick }}
+        </span>
+        <span class="kiwi-nicklist-messageuser" @click.stop="nicklist.openQuery(user)">
+            <i class="fa fa-comment" aria-hidden="true"/>
+        </span>
+    </li>
+</template>
+
+<script>
+
+'kiwi public';
+
+export default {
+    props: ['user', 'nicklist'],
+    computed: {
+        userColour() {
+            if (this.nicklist.useColouredNicks) {
+                return this.user.getColour();
+            }
+            return '';
+        },
+
+    },
+};
+</script>
+
+<style>
+
+.kiwi-nicklist-user {
+    line-height: 40px;
+    padding: 0 1em;
+    margin: 0;
+    position: relative;
+    box-sizing: border-box;
+}
+
+.kiwi-nicklist-user--away .kiwi-nicklist-user-nick {
+    opacity: 0.5;
+    color:grey !important;
+}
+
+.kiwi-nicklist-user--away .kiwi-nicklist-user-nick::after {
+    content:"Away";
+    font-size: 0.25em;
+    vertical-align: super;
+}
+
+.kiwi-nicklist-user--gender-Male .kiwi-nicklist-user-nick::after {
+    content:"\f222";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+.kiwi-nicklist-user--gender-Female .kiwi-nicklist-user-nick::after {
+    content:"\f221";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+.kiwi-nicklist-user--gender-Other .kiwi-nicklist-user-nick::after {
+    content:"\f224";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+.kiwi-nicklist-user--away.kiwi-nicklist-user--gender-Male .kiwi-nicklist-user-nick::after {
+    content:"\f222 Away";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+.kiwi-nicklist-user--away.kiwi-nicklist-user--gender-Female .kiwi-nicklist-user-nick::after {
+    content:"\f221 Away";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+.kiwi-nicklist-user--away.kiwi-nicklist-user--gender-Other .kiwi-nicklist-user-nick::after {
+    content:"\f224 Away";
+    font-size: 0.25em;
+    vertical-align: super;
+    font-family: fontawesome;
+}
+
+
+.kiwi-nicklist-user-nick {
+    font-weight: bold;
+    cursor: pointer;
+}
+
+.kiwi-nicklist-messageuser {
+    position: absolute;
+    content: '\f075';
+    right: 1em;
+    font-family: fontAwesome, sans-serif;
+    top: 50%;
+    margin-top: -1.5em;
+    opacity: 0;
+}
+
+.kiwi-nicklist-messageuser:hover {
+    cursor: pointer;
+}
+
+.kiwi-nicklist-user:hover .kiwi-nicklist-messageuser {
+    opacity: 1;
+}
+
+</style>
diff --git a/custom-welcome.js b/custom-welcome.js
index 4278cd6..89d4d21 100644
--- a/custom-welcome.js
+++ b/custom-welcome.js
@@ -1,12 +1,25 @@
 import CustomWelcome from './components/CustomWelcome.vue';
 import CustomUserBox from './components/CustomUserBox.vue';
+import CustomNicklistUser from './components/CustomNicklistUser.vue';
 import * as utils from './libs/utils.js';
 
 // eslint-disable-next-line no-undef
 kiwi.plugin('custom-welcome', (kiwi) => {
     kiwi.addStartup('custom-welcome', CustomWelcome);
     kiwi.replaceModule('components/UserBox', CustomUserBox);
+    kiwi.replaceModule('components/NicklistUser', CustomNicklistUser);
+    
+    let icons = true;
+    let colours = true;
+    
+    if(kiwi.state.setting('asl.icons')) {
+        icons = kiwi.state.setting('asl.icons');
+    }
 
+    if(kiwi.state.setting('asl.colours')) {
+        colours = kiwi.state.setting('asl.colours');
+    }
+    
     kiwi.on('irc.join', function(event, net) {
         if (event.gecos) {
             kiwi.state.addUser(net, {
@@ -14,7 +27,8 @@ kiwi.plugin('custom-welcome', (kiwi) => {
                 username: event.ident,
                 host: event.hostname,
                 realname: event.gecos,
-                colour: getColour(event.gecos),
+                colour: (colours == true ) ? getColour(event.gecos) : '',
+                gender : (icons == true ) ? getGender(user.real_name) : null ,
             });
         }
     });
@@ -23,7 +37,8 @@ kiwi.plugin('custom-welcome', (kiwi) => {
         event.users.forEach((user) => {
             kiwi.state.addUser(net, {
                 nick: user.nick,
-                colour: getColour(user.real_name),
+                colour: (colours == true ) ? getColour(event.gecos) : '',
+                gender : (icons == true ) ? getGender(user.real_name) : null ,
             });
         });
     });
@@ -42,5 +57,10 @@ kiwi.plugin('custom-welcome', (kiwi) => {
             return '#000';
         }
     }
-});
 
+    function getGender(gecos) {
+        let asl = utils.getASL(gecos);
+        return asl.s;
+    }
+
+});
\ No newline at end of file

From d8972963953637025c23855b5c1687b052b89284 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Oct 2018 02:31:50 +0100
Subject: [PATCH 02/19] Fixed event.gecos

---
 custom-welcome.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/custom-welcome.js b/custom-welcome.js
index 89d4d21..ac2c771 100644
--- a/custom-welcome.js
+++ b/custom-welcome.js
@@ -28,7 +28,7 @@ kiwi.plugin('custom-welcome', (kiwi) => {
                 host: event.hostname,
                 realname: event.gecos,
                 colour: (colours == true ) ? getColour(event.gecos) : '',
-                gender : (icons == true ) ? getGender(user.real_name) : null ,
+                gender : (icons == true ) ? getGender(event.gecos) : null ,
             });
         }
     });
@@ -38,7 +38,7 @@ kiwi.plugin('custom-welcome', (kiwi) => {
             kiwi.state.addUser(net, {
                 nick: user.nick,
                 colour: (colours == true ) ? getColour(event.gecos) : '',
-                gender : (icons == true ) ? getGender(user.real_name) : null ,
+                gender : (icons == true ) ? getGender(event.gecos) : null ,
             });
         });
     });

From 87d46ebefa390da8dfbed168c2fadc3455a4fffa Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Oct 2018 02:39:05 +0100
Subject: [PATCH 03/19] Fixed user.real_name

---
 custom-welcome.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/custom-welcome.js b/custom-welcome.js
index ac2c771..2108218 100644
--- a/custom-welcome.js
+++ b/custom-welcome.js
@@ -37,8 +37,8 @@ kiwi.plugin('custom-welcome', (kiwi) => {
         event.users.forEach((user) => {
             kiwi.state.addUser(net, {
                 nick: user.nick,
-                colour: (colours == true ) ? getColour(event.gecos) : '',
-                gender : (icons == true ) ? getGender(event.gecos) : null ,
+                colour: (colours == true ) ? getColour(user.real_name) : '',
+                gender : (icons == true ) ? getGender(user.real_name) : null ,
             });
         });
     });

From 5fae5011aee16ecfd48f65006358e18d7f954503 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Oct 2018 03:04:48 +0100
Subject: [PATCH 04/19] Fixed get config value

---
 custom-welcome.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/custom-welcome.js b/custom-welcome.js
index 2108218..feb70ff 100644
--- a/custom-welcome.js
+++ b/custom-welcome.js
@@ -12,11 +12,11 @@ kiwi.plugin('custom-welcome', (kiwi) => {
     let icons = true;
     let colours = true;
     
-    if(kiwi.state.setting('asl.icons')) {
+    if(kiwi.state.setting('asl.icons') === false) {
         icons = kiwi.state.setting('asl.icons');
     }
 
-    if(kiwi.state.setting('asl.colours')) {
+    if(kiwi.state.setting('asl.colours') === false) {
         colours = kiwi.state.setting('asl.colours');
     }
     

From 8c1a590286faf21d41c89a78fe48847ffa887766 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Oct 2018 17:03:36 +0100
Subject: [PATCH 05/19] Age, sex, location values can now be get from url

---
 components/CustomWelcome.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/components/CustomWelcome.vue b/components/CustomWelcome.vue
index 2fadc4c..5177ddf 100644
--- a/components/CustomWelcome.vue
+++ b/components/CustomWelcome.vue
@@ -141,6 +141,9 @@ export default {
         let options = state.settings.startupOptions;
 
         this.nick = this.processNickRandomNumber(Misc.queryStringVal('nick') || options.nick || '');
+	this.age = Misc.queryStringVal('age') || '';
+	this.sex = Misc.queryStringVal('sex') || '';
+	this.location = Misc.queryStringVal('location') || '';
         this.password = options.password || '';
         this.channel = decodeURI(window.location.hash) || options.channel || '';
         this.showChannel = typeof options.showChannel === 'boolean' ?

From 3a4c0862897bd44abcffc1bc591446a85b6f32aa Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Sat, 3 Nov 2018 13:39:41 +0100
Subject: [PATCH 06/19] Fixed gecos not from storage if net exist

---
 components/CustomWelcome.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/components/CustomWelcome.vue b/components/CustomWelcome.vue
index 5177ddf..16c33b9 100644
--- a/components/CustomWelcome.vue
+++ b/components/CustomWelcome.vue
@@ -141,9 +141,9 @@ export default {
         let options = state.settings.startupOptions;
 
         this.nick = this.processNickRandomNumber(Misc.queryStringVal('nick') || options.nick || '');
-	this.age = Misc.queryStringVal('age') || '';
-	this.sex = Misc.queryStringVal('sex') || '';
-	this.location = Misc.queryStringVal('location') || '';
+    	this.age = Misc.queryStringVal('age') || '';
+    	this.sex = Misc.queryStringVal('sex') || '';
+    	this.location = Misc.queryStringVal('location') || '';
         this.password = options.password || '';
         this.channel = decodeURI(window.location.hash) || options.channel || '';
         this.showChannel = typeof options.showChannel === 'boolean' ?
@@ -217,6 +217,7 @@ export default {
             // the user has just put in place
             if (net) {
                 net.nick = this.nick;
+                net.gecos = this.buildGecos();
                 net.connection.password = this.password;
             }
 

From 1f24315b8381d318814658d1b08544945cc300c3 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Fri, 23 Nov 2018 22:44:57 +0100
Subject: [PATCH 07/19] Updated to current plugins and added get asl value from
 startup options

---
 package.json                                  |  5 +-
 .../components}/CustomNicklistUser.vue        |  0
 .../components}/CustomUserBox.vue             |  0
 .../components}/CustomWelcome.vue             | 20 ++--
 {libs => src/libs}/utils.js                   |  2 +-
 custom-welcome.js => src/plugin.js            |  0
 webpack.config.js                             | 13 ++-
 yarn.lock                                     | 98 +++++++++++++++----
 8 files changed, 100 insertions(+), 38 deletions(-)
 rename {components => src/components}/CustomNicklistUser.vue (100%)
 rename {components => src/components}/CustomUserBox.vue (100%)
 rename {components => src/components}/CustomWelcome.vue (96%)
 rename {libs => src/libs}/utils.js (85%)
 rename custom-welcome.js => src/plugin.js (100%)

diff --git a/package.json b/package.json
index e7961c7..91c98fd 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
     "name": "plugin-custom-welcome-asl",
     "version": "0.0.1",
-    "main": "custom-welcome.js",
+    "main": "./src/plugin.js",
     "license": "Apache-2.0",
     "private": true,
     "scripts": {
@@ -16,6 +16,8 @@
         "babel-core": "^6.26.0",
         "babel-eslint": "^8.1.2",
         "babel-loader": "7.1.1",
+        "babel-plugin-transform-runtime": "^6.23.0",
+        "babel-preset-env": "^1.7.0",
         "css-loader": "^0.28.8",
         "eslint": "^4.15.0",
         "eslint-config-airbnb-base": "^12.1.0",
@@ -25,6 +27,7 @@
         "eslint-plugin-promise": "^3.4.0",
         "eslint-plugin-standard": "^3.0.1",
         "eslint-plugin-vue": "^4.5.0",
+        "exports-loader": "^0.7.0",
         "less": "^3.8.1",
         "less-loader": "^4.1.0",
         "style-loader": "^0.21.0",
diff --git a/components/CustomNicklistUser.vue b/src/components/CustomNicklistUser.vue
similarity index 100%
rename from components/CustomNicklistUser.vue
rename to src/components/CustomNicklistUser.vue
diff --git a/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
similarity index 100%
rename from components/CustomUserBox.vue
rename to src/components/CustomUserBox.vue
diff --git a/components/CustomWelcome.vue b/src/components/CustomWelcome.vue
similarity index 96%
rename from components/CustomWelcome.vue
rename to src/components/CustomWelcome.vue
index 16c33b9..8bc2ea4 100644
--- a/components/CustomWelcome.vue
+++ b/src/components/CustomWelcome.vue
@@ -33,22 +33,22 @@
                         type="password"
                     />
                     <input-text
-                        label="Age"
+                        label="Età"
                         v-model="age"
                         class="kiwi-welcome-simple-age"
                         type="number"
                     />
                     <div class="kiwi-welcome-simple-sex">
-                        <span >Sex: </span>
+                        <span >Sesso: </span>
                         <select v-model="sex">
-                            <option :value="null" selected disabled>Choose</option>
-                            <option value="M">Male</option>
-                            <option value="F">Female</option>
-                            <option value="O">Other</option>
+                            <option :value="null" selected disabled>Scegli ...</option>
+                            <option value="M">Uomo</option>
+                            <option value="F">Donna</option>
+                            <option value="O">Altro</option>
                         </select>
                     </div>
                     <input-text
-                        label="Location"
+                        label="Località"
                         v-model="location"
                     />
                     <input-text
@@ -141,9 +141,9 @@ export default {
         let options = state.settings.startupOptions;
 
         this.nick = this.processNickRandomNumber(Misc.queryStringVal('nick') || options.nick || '');
-    	this.age = Misc.queryStringVal('age') || '';
-    	this.sex = Misc.queryStringVal('sex') || '';
-    	this.location = Misc.queryStringVal('location') || '';
+    	this.age = Misc.queryStringVal('age') || options.age || '';
+    	this.sex = Misc.queryStringVal('sex') || options.sex || '';
+    	this.location = Misc.queryStringVal('location') || options.location || '';
         this.password = options.password || '';
         this.channel = decodeURI(window.location.hash) || options.channel || '';
         this.showChannel = typeof options.showChannel === 'boolean' ?
diff --git a/libs/utils.js b/src/libs/utils.js
similarity index 85%
rename from libs/utils.js
rename to src/libs/utils.js
index e697871..61ca0b8 100644
--- a/libs/utils.js
+++ b/src/libs/utils.js
@@ -1,6 +1,6 @@
 export function getASL(str) {
 	let result = str.match(/\[(\d+|U)\/([MFOU])\/(.*)\]/);
-	let sex = {'M': 'Male', 'F': 'Female', 'O': 'Other'};
+	let sex = {'M': 'Uomo', 'F': 'Donna', 'O': 'Altro'};
 	if (result && result.length === 4) {
         let a = result[1] === 'U' ? null : result[1];
         let s = result[2] === 'U' ? null : sex[result[2]];
diff --git a/custom-welcome.js b/src/plugin.js
similarity index 100%
rename from custom-welcome.js
rename to src/plugin.js
diff --git a/webpack.config.js b/webpack.config.js
index a4b6d4e..e955b4a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,9 +3,9 @@ const VueLoaderPlugin = require('vue-loader/lib/plugin');
 
 module.exports = {
     mode: 'production',
-    entry: './custom-welcome.js',
+    entry: './src/plugin.js',
     output: {
-        filename: 'plugin-custom-welcome-asl.js',
+        filename: 'asl.js',
     },
     module: {
         rules: [
@@ -15,7 +15,10 @@ module.exports = {
             },
             {
                 test: /\.js$/,
-                loader: 'babel-loader',
+                use: [{loader: 'exports-loader'}, {loader: 'babel-loader'}],
+                include: [
+                    path.join(__dirname, 'src')
+                ]
             },
             {
                 test: /\.css$/,
@@ -32,9 +35,9 @@ module.exports = {
     ],
     devtool: 'source-map',
     devServer: {
-        filename: 'plugin-custom-welcome-asl.js',
+        filename: 'asl.js',
         contentBase: path.join(__dirname, "dist"),
         compress: true,
         port: 9000
     }
-};
\ No newline at end of file
+};
diff --git a/yarn.lock b/yarn.lock
index d57a02c..5d8dcd3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -898,7 +898,7 @@ babel-plugin-transform-async-generator-functions@^6.24.1:
     babel-plugin-syntax-async-generators "^6.5.0"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-async-to-generator@^6.24.1:
+babel-plugin-transform-async-to-generator@^6.22.0, babel-plugin-transform-async-to-generator@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz#6536e378aff6cb1d5517ac0e40eb3e9fc8d08761"
   integrity sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E=
@@ -951,7 +951,7 @@ babel-plugin-transform-es2015-block-scoped-functions@^6.22.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-block-scoping@^6.24.1:
+babel-plugin-transform-es2015-block-scoping@^6.23.0, babel-plugin-transform-es2015-block-scoping@^6.24.1:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz#d70f5299c1308d05c12f463813b0a09e73b1895f"
   integrity sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8=
@@ -962,7 +962,7 @@ babel-plugin-transform-es2015-block-scoping@^6.24.1:
     babel-types "^6.26.0"
     lodash "^4.17.4"
 
-babel-plugin-transform-es2015-classes@^6.24.1:
+babel-plugin-transform-es2015-classes@^6.23.0, babel-plugin-transform-es2015-classes@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz#5a4c58a50c9c9461e564b4b2a3bfabc97a2584db"
   integrity sha1-WkxYpQyclGHlZLSyo7+ryXolhNs=
@@ -977,7 +977,7 @@ babel-plugin-transform-es2015-classes@^6.24.1:
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-computed-properties@^6.24.1:
+babel-plugin-transform-es2015-computed-properties@^6.22.0, babel-plugin-transform-es2015-computed-properties@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz#6fe2a8d16895d5634f4cd999b6d3480a308159b3"
   integrity sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM=
@@ -985,14 +985,14 @@ babel-plugin-transform-es2015-computed-properties@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-destructuring@^6.22.0:
+babel-plugin-transform-es2015-destructuring@^6.22.0, babel-plugin-transform-es2015-destructuring@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz#997bb1f1ab967f682d2b0876fe358d60e765c56d"
   integrity sha1-mXux8auWf2gtKwh2/jWNYOdlxW0=
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-duplicate-keys@^6.24.1:
+babel-plugin-transform-es2015-duplicate-keys@^6.22.0, babel-plugin-transform-es2015-duplicate-keys@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz#73eb3d310ca969e3ef9ec91c53741a6f1576423e"
   integrity sha1-c+s9MQypaePvnskcU3QabxV2Qj4=
@@ -1000,14 +1000,14 @@ babel-plugin-transform-es2015-duplicate-keys@^6.24.1:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-for-of@^6.22.0:
+babel-plugin-transform-es2015-for-of@^6.22.0, babel-plugin-transform-es2015-for-of@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz#f47c95b2b613df1d3ecc2fdb7573623c75248691"
   integrity sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE=
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-function-name@^6.24.1:
+babel-plugin-transform-es2015-function-name@^6.22.0, babel-plugin-transform-es2015-function-name@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz#834c89853bc36b1af0f3a4c5dbaa94fd8eacaa8b"
   integrity sha1-g0yJhTvDaxrw86TF26qU/Y6sqos=
@@ -1023,7 +1023,7 @@ babel-plugin-transform-es2015-literals@^6.22.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-modules-amd@^6.24.1:
+babel-plugin-transform-es2015-modules-amd@^6.22.0, babel-plugin-transform-es2015-modules-amd@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz#3b3e54017239842d6d19c3011c4bd2f00a00d154"
   integrity sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ=
@@ -1032,7 +1032,7 @@ babel-plugin-transform-es2015-modules-amd@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
+babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
   version "6.26.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.2.tgz#58a793863a9e7ca870bdc5a881117ffac27db6f3"
   integrity sha512-CV9ROOHEdrjcwhIaJNBGMBCodN+1cfkwtM1SbUHmvyy35KGT7fohbpOxkE2uLz1o6odKK2Ck/tz47z+VqQfi9Q==
@@ -1042,7 +1042,7 @@ babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
     babel-template "^6.26.0"
     babel-types "^6.26.0"
 
-babel-plugin-transform-es2015-modules-systemjs@^6.24.1:
+babel-plugin-transform-es2015-modules-systemjs@^6.23.0, babel-plugin-transform-es2015-modules-systemjs@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz#ff89a142b9119a906195f5f106ecf305d9407d23"
   integrity sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM=
@@ -1051,7 +1051,7 @@ babel-plugin-transform-es2015-modules-systemjs@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-modules-umd@^6.24.1:
+babel-plugin-transform-es2015-modules-umd@^6.23.0, babel-plugin-transform-es2015-modules-umd@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz#ac997e6285cd18ed6176adb607d602344ad38468"
   integrity sha1-rJl+YoXNGO1hdq22B9YCNErThGg=
@@ -1060,7 +1060,7 @@ babel-plugin-transform-es2015-modules-umd@^6.24.1:
     babel-runtime "^6.22.0"
     babel-template "^6.24.1"
 
-babel-plugin-transform-es2015-object-super@^6.24.1:
+babel-plugin-transform-es2015-object-super@^6.22.0, babel-plugin-transform-es2015-object-super@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz#24cef69ae21cb83a7f8603dad021f572eb278f8d"
   integrity sha1-JM72muIcuDp/hgPa0CH1cusnj40=
@@ -1068,7 +1068,7 @@ babel-plugin-transform-es2015-object-super@^6.24.1:
     babel-helper-replace-supers "^6.24.1"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-parameters@^6.24.1:
+babel-plugin-transform-es2015-parameters@^6.23.0, babel-plugin-transform-es2015-parameters@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz#57ac351ab49caf14a97cd13b09f66fdf0a625f2b"
   integrity sha1-V6w1GrScrxSpfNE7CfZv3wpiXys=
@@ -1080,7 +1080,7 @@ babel-plugin-transform-es2015-parameters@^6.24.1:
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
-babel-plugin-transform-es2015-shorthand-properties@^6.24.1:
+babel-plugin-transform-es2015-shorthand-properties@^6.22.0, babel-plugin-transform-es2015-shorthand-properties@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz#24f875d6721c87661bbd99a4622e51f14de38aa0"
   integrity sha1-JPh11nIch2YbvZmkYi5R8U3jiqA=
@@ -1095,7 +1095,7 @@ babel-plugin-transform-es2015-spread@^6.22.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-sticky-regex@^6.24.1:
+babel-plugin-transform-es2015-sticky-regex@^6.22.0, babel-plugin-transform-es2015-sticky-regex@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz#00c1cdb1aca71112cdf0cf6126c2ed6b457ccdbc"
   integrity sha1-AMHNsaynERLN8M9hJsLta0V8zbw=
@@ -1111,14 +1111,14 @@ babel-plugin-transform-es2015-template-literals@^6.22.0:
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-typeof-symbol@^6.22.0:
+babel-plugin-transform-es2015-typeof-symbol@^6.22.0, babel-plugin-transform-es2015-typeof-symbol@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz#dec09f1cddff94b52ac73d505c84df59dcceb372"
   integrity sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I=
   dependencies:
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-unicode-regex@^6.24.1:
+babel-plugin-transform-es2015-unicode-regex@^6.22.0, babel-plugin-transform-es2015-unicode-regex@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz#d38b12f42ea7323f729387f18a7c5ae1faeb35e9"
   integrity sha1-04sS9C6nMj9yk4fxinxa4frrNek=
@@ -1127,7 +1127,7 @@ babel-plugin-transform-es2015-unicode-regex@^6.24.1:
     babel-runtime "^6.22.0"
     regexpu-core "^2.0.0"
 
-babel-plugin-transform-exponentiation-operator@^6.24.1:
+babel-plugin-transform-exponentiation-operator@^6.22.0, babel-plugin-transform-exponentiation-operator@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz#2ab0c9c7f3098fa48907772bb813fe41e8de3a0e"
   integrity sha1-KrDJx/MJj6SJB3cruBP+QejeOg4=
@@ -1160,13 +1160,20 @@ babel-plugin-transform-object-rest-spread@^6.22.0:
     babel-plugin-syntax-object-rest-spread "^6.8.0"
     babel-runtime "^6.26.0"
 
-babel-plugin-transform-regenerator@^6.24.1:
+babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.24.1:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz#e0703696fbde27f0a3efcacf8b4dca2f7b3a8f2f"
   integrity sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8=
   dependencies:
     regenerator-transform "^0.10.0"
 
+babel-plugin-transform-runtime@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz#88490d446502ea9b8e7efb0fe09ec4d99479b1ee"
+  integrity sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4=
+  dependencies:
+    babel-runtime "^6.22.0"
+
 babel-plugin-transform-strict-mode@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz#d5faf7aa578a65bbe591cf5edae04a0c67020758"
@@ -1175,6 +1182,42 @@ babel-plugin-transform-strict-mode@^6.24.1:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
+babel-preset-env@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/babel-preset-env/-/babel-preset-env-1.7.0.tgz#dea79fa4ebeb883cd35dab07e260c1c9c04df77a"
+  integrity sha512-9OR2afuKDneX2/q2EurSftUYM0xGu4O2D9adAhVfADDhrYDaxXV0rBbevVYoY9n6nyX1PmQW/0jtpJvUNr9CHg==
+  dependencies:
+    babel-plugin-check-es2015-constants "^6.22.0"
+    babel-plugin-syntax-trailing-function-commas "^6.22.0"
+    babel-plugin-transform-async-to-generator "^6.22.0"
+    babel-plugin-transform-es2015-arrow-functions "^6.22.0"
+    babel-plugin-transform-es2015-block-scoped-functions "^6.22.0"
+    babel-plugin-transform-es2015-block-scoping "^6.23.0"
+    babel-plugin-transform-es2015-classes "^6.23.0"
+    babel-plugin-transform-es2015-computed-properties "^6.22.0"
+    babel-plugin-transform-es2015-destructuring "^6.23.0"
+    babel-plugin-transform-es2015-duplicate-keys "^6.22.0"
+    babel-plugin-transform-es2015-for-of "^6.23.0"
+    babel-plugin-transform-es2015-function-name "^6.22.0"
+    babel-plugin-transform-es2015-literals "^6.22.0"
+    babel-plugin-transform-es2015-modules-amd "^6.22.0"
+    babel-plugin-transform-es2015-modules-commonjs "^6.23.0"
+    babel-plugin-transform-es2015-modules-systemjs "^6.23.0"
+    babel-plugin-transform-es2015-modules-umd "^6.23.0"
+    babel-plugin-transform-es2015-object-super "^6.22.0"
+    babel-plugin-transform-es2015-parameters "^6.23.0"
+    babel-plugin-transform-es2015-shorthand-properties "^6.22.0"
+    babel-plugin-transform-es2015-spread "^6.22.0"
+    babel-plugin-transform-es2015-sticky-regex "^6.22.0"
+    babel-plugin-transform-es2015-template-literals "^6.22.0"
+    babel-plugin-transform-es2015-typeof-symbol "^6.23.0"
+    babel-plugin-transform-es2015-unicode-regex "^6.22.0"
+    babel-plugin-transform-exponentiation-operator "^6.22.0"
+    babel-plugin-transform-regenerator "^6.22.0"
+    browserslist "^3.2.6"
+    invariant "^2.2.2"
+    semver "^5.3.0"
+
 babel-preset-es2015@^6.9.0:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-preset-es2015/-/babel-preset-es2015-6.24.1.tgz#d44050d6bc2c9feea702aaf38d727a0210538939"
@@ -1509,7 +1552,7 @@ browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
     caniuse-db "^1.0.30000639"
     electron-to-chromium "^1.2.7"
 
-browserslist@^3.2.8:
+browserslist@^3.2.6, browserslist@^3.2.8:
   version "3.2.8"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-3.2.8.tgz#b0005361d6471f0f5952797a76fc985f1f978fc6"
   integrity sha512-WHVocJYavUwVgVViC0ORikPHQquXwVh939TaelZ4WDqpWgTX/FsGhl/+P4qBUAGcRvtOgDgC+xftNWWp2RUTAQ==
@@ -3048,6 +3091,14 @@ expand-tilde@^2.0.0, expand-tilde@^2.0.2:
   dependencies:
     homedir-polyfill "^1.0.1"
 
+exports-loader@^0.7.0:
+  version "0.7.0"
+  resolved "https://registry.yarnpkg.com/exports-loader/-/exports-loader-0.7.0.tgz#84881c784dea6036b8e1cd1dac3da9b6409e21a5"
+  integrity sha512-RKwCrO4A6IiKm0pG3c9V46JxIHcDplwwGJn6+JJ1RcVnh/WSGJa0xkmk5cRVtgOPzCAtTMGj2F7nluh9L0vpSA==
+  dependencies:
+    loader-utils "^1.1.0"
+    source-map "0.5.0"
+
 express@^4.16.2:
   version "4.16.3"
   resolved "https://registry.yarnpkg.com/express/-/express-4.16.3.tgz#6af8a502350db3246ecc4becf6b5a34d22f7ed53"
@@ -7418,6 +7469,11 @@ source-map-url@^0.4.0:
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
   integrity sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=
 
+source-map@0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.0.tgz#0fe96503ac86a5adb5de63f4e412ae4872cdbe86"
+  integrity sha1-D+llA6yGpa213mP05BKuSHLNvoY=
+
 source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"

From 4b4f2979656e843f0c5bb1ede806c7194fa72d95 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Fri, 23 Nov 2018 22:46:32 +0100
Subject: [PATCH 08/19] Forget ablout .babelrc

---
 .babelrc | 15 +++++++++++++++
 1 file changed, 15 insertions(+)
 create mode 100644 .babelrc

diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..a38cd0e
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,15 @@
+{
+  "presets": [
+    ["env", {
+      "useBuiltIns": "usage"
+    }],
+    "stage-2"
+  ],
+  "plugins": ["transform-runtime"],
+  "comments": false,
+  "env": {
+    "test": {
+      "plugins": [ "istanbul" ]
+    }
+  }
+}

From e416dd513f8f0fb5d83f6fe6e4c37624e4640d01 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Mon, 28 Jan 2019 22:28:24 +0100
Subject: [PATCH 09/19] Updated custom nicklistuser vue to match new default
 nicklistuser vue

---
 src/components/CustomNicklistUser.vue | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/CustomNicklistUser.vue b/src/components/CustomNicklistUser.vue
index 5af63b3..6f69eaf 100644
--- a/src/components/CustomNicklistUser.vue
+++ b/src/components/CustomNicklistUser.vue
@@ -41,11 +41,13 @@ export default {
 <style>
 
 .kiwi-nicklist-user {
-    line-height: 40px;
-    padding: 0 1em;
+    line-height: 26px;
+    padding: 0 16px 0 12px;
     margin: 0;
     position: relative;
     box-sizing: border-box;
+    transition: all 0.1s;
+    cursor: pointer;
 }
 
 .kiwi-nicklist-user--away .kiwi-nicklist-user-nick {
@@ -110,19 +112,18 @@ export default {
 .kiwi-nicklist-messageuser {
     position: absolute;
     content: '\f075';
-    right: 1em;
+    right: -1em;
     font-family: fontAwesome, sans-serif;
-    top: 50%;
-    margin-top: -1.5em;
+    line-height: 30px;
     opacity: 0;
-}
-
-.kiwi-nicklist-messageuser:hover {
-    cursor: pointer;
+    transition: all 0.1s;
 }
 
 .kiwi-nicklist-user:hover .kiwi-nicklist-messageuser {
     opacity: 1;
+    right: 1em;
+    transition: all 0.2s;
+    transition-delay: 0.1s;
 }
 
 </style>

From de6b4075ecebd7c4c84c0d230d11ef4481b10778 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Mon, 28 Jan 2019 22:30:38 +0100
Subject: [PATCH 10/19] Removed map.js generation

---
 webpack.config.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/webpack.config.js b/webpack.config.js
index e955b4a..2601b2a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -33,7 +33,6 @@ module.exports = {
     plugins: [
         new VueLoaderPlugin()
     ],
-    devtool: 'source-map',
     devServer: {
         filename: 'asl.js',
         contentBase: path.join(__dirname, "dist"),

From d2cb1dc790130fe03cb6c06f72c92050f20cdaa1 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 30 Apr 2019 00:09:47 +0200
Subject: [PATCH 11/19] Updated vues to match current client features

---
 package.json                          |   2 +-
 src/components/CustomNicklistUser.vue |  48 +++++-----
 src/components/CustomUserBox.vue      | 131 +++++++++++++++++---------
 src/components/CustomWelcome.vue      | 103 ++++++++++++++------
 yarn.lock                             |   8 +-
 5 files changed, 191 insertions(+), 101 deletions(-)

diff --git a/package.json b/package.json
index 91c98fd..7265ab8 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
         "stylelint": "^9.3.0",
         "stylelint-config-standard": "^18.2.0",
         "vue-loader": "^15.2.4",
-        "vue-template-compiler": "^2.0.0",
+        "vue-template-compiler": "^2.6.10",
         "webpack": "^4.6.0",
         "webpack-cli": "^2.1.2",
         "webpack-dev-server": "^3.1.3"
diff --git a/src/components/CustomNicklistUser.vue b/src/components/CustomNicklistUser.vue
index 6f69eaf..9f5cb5d 100644
--- a/src/components/CustomNicklistUser.vue
+++ b/src/components/CustomNicklistUser.vue
@@ -6,26 +6,40 @@
             user.ignore ? 'kiwi-nicklist-user--ignore' : '',
             user.gender ? 'kiwi-nicklist-user--gender-' + user.gender : '',
         ]"
+        :data-nick="(user.nick||'').toLowerCase()"
         class="kiwi-nicklist-user"
         @click="nicklist.openUserbox(user)"
     >
+        <away-status-indicator
+            :network="network"
+            :user="user"
+            :toggle="false"
+        />
         <span class="kiwi-nicklist-user-prefix">{{ nicklist.userModePrefix(user) }}</span>
-        <span :style="{ 'color': userColour }"
-              class="kiwi-nicklist-user-nick"
+        <span
+            :style="{ 'color': userColour }"
+            class="kiwi-nicklist-user-nick"
         >{{ user.nick }}
         </span>
         <span class="kiwi-nicklist-messageuser" @click.stop="nicklist.openQuery(user)">
             <i class="fa fa-comment" aria-hidden="true"/>
         </span>
+        <typing-status-indicator :user="user" :buffer="nicklist.buffer" />
     </li>
 </template>
 
 <script>
-
 'kiwi public';
 
+let AwayStatusIndicator = kiwi.require('components/startups/AwayStatusIndicator');
+let TypingStatusIndicator = kiwi.require('components/startups/TypingStatusIndicator');
+
 export default {
-    props: ['user', 'nicklist'],
+    components: {
+        AwayStatusIndicator,
+        TypingStatusIndicator,
+    },
+    props: ['network', 'user', 'nicklist'],
     computed: {
         userColour() {
             if (this.nicklist.useColouredNicks) {
@@ -33,7 +47,6 @@ export default {
             }
             return '';
         },
-
     },
 };
 </script>
@@ -42,7 +55,8 @@ export default {
 
 .kiwi-nicklist-user {
     line-height: 26px;
-    padding: 0 16px 0 12px;
+    padding: 0 12px 0 12px;
+    border-left: 4px solid;
     margin: 0;
     position: relative;
     box-sizing: border-box;
@@ -50,17 +64,6 @@ export default {
     cursor: pointer;
 }
 
-.kiwi-nicklist-user--away .kiwi-nicklist-user-nick {
-    opacity: 0.5;
-    color:grey !important;
-}
-
-.kiwi-nicklist-user--away .kiwi-nicklist-user-nick::after {
-    content:"Away";
-    font-size: 0.25em;
-    vertical-align: super;
-}
-
 .kiwi-nicklist-user--gender-Male .kiwi-nicklist-user-nick::after {
     content:"\f222";
     font-size: 0.25em;
@@ -103,7 +106,6 @@ export default {
     font-family: fontawesome;
 }
 
-
 .kiwi-nicklist-user-nick {
     font-weight: bold;
     cursor: pointer;
@@ -114,9 +116,13 @@ export default {
     content: '\f075';
     right: -1em;
     font-family: fontAwesome, sans-serif;
-    line-height: 30px;
+    line-height: 26px;
     opacity: 0;
-    transition: all 0.1s;
+}
+
+.kiwi-nicklist-messageuser:hover {
+    cursor: pointer;
+    transition: all 0.2s;
 }
 
 .kiwi-nicklist-user:hover .kiwi-nicklist-messageuser {
@@ -126,4 +132,4 @@ export default {
     transition-delay: 0.1s;
 }
 
-</style>
+</style>
\ No newline at end of file
diff --git a/src/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
index 33f2943..d5e6f1d 100644
--- a/src/components/CustomUserBox.vue
+++ b/src/components/CustomUserBox.vue
@@ -1,35 +1,34 @@
 <template>
     <div class="kiwi-userbox">
-
+        <span v-if="isSelf" class="kiwi-userbox-selfprofile">
+            This is you!
+        </span>
         <div class="kiwi-userbox-header">
-            <i class="fa fa-user kiwi-userbox-icon" aria-hidden="true"/>
-            <h3>{{ user.nick }}</h3>
-            <div class="kiwi-userbox-usermask">{{ user.username }}@{{ user.host }}</div>
+            <h3>
+                <away-status-indicator :network="network" :user="user"/> {{ user.nick }}
+                <span v-if="userMode" class="kiwi-userbox-modestring">+ {{ userMode }}</span>
+	        </h3>
         </div>
 
         <div class="kiwi-userbox-basicinfo">
 
-            <span class="kiwi-userbox-basicinfo-title">{{ $t('whois_status') }}:</span>
-            <span class="kiwi-userbox-basicinfo-data">
-                {{ user.away ? user.away : $t('whois_status_available') }}
-            </span>
             <div v-if="asl.a">
-                <span class="kiwi-userbox-basicinfo-title">Age</span>
+                <span class="kiwi-userbox-basicinfo-title">Età</span>
                 <span class="kiwi-userbox-basicinfo-data">{{asl.a}}</span>
             </div>
             <div v-if="asl.s">
-                <span class="kiwi-userbox-basicinfo-title">Sex</span>
+                <span class="kiwi-userbox-basicinfo-title">Sesso</span>
                 <span class="kiwi-userbox-basicinfo-data">{{asl.s}}</span>
             </div>
             <div v-if="asl.l">
-                <span class="kiwi-userbox-basicinfo-title">Location</span>
+                <span class="kiwi-userbox-basicinfo-title">Località</span>
                 <span class="kiwi-userbox-basicinfo-data">{{asl.l}}</span>
             </div>
         </div>
 
 
         <p class="kiwi-userbox-actions">
-            <a class="kiwi-userbox-action" @click="openQuery">
+            <a v-if="!isSelf" class="kiwi-userbox-action" @click="openQuery">
                 <i class="fa fa-comment-o" aria-hidden="true"/>
                 {{ $t('send_a_message') }}
             </a>
@@ -40,7 +39,7 @@
 
         </p>
 
-        <form class="u-form kiwi-userbox-ignoreuser">
+        <form v-if="!isSelf" class="u-form kiwi-userbox-ignoreuser">
             <label>
                 <input v-model="user.ignore" type="checkbox" >
                 <span> {{ $t('ignore_user') }} </span>
@@ -84,13 +83,16 @@
                 <span v-if="user.secure" class="kiwi-userbox-whois-line">
                     {{ $t('user_secure') }}
                 </span>
-                <span v-if="user.channels" class="kiwi-userbox-whois-line">
-                    {{ $t('user_channels', {channels: user.channels}) }}
-                </span>
+                <span
+                    v-if="user.channels"
+                    class="kiwi-userbox-whois-line"
+                    @click="onChannelsClick($event)"
+                    v-html="$t('user_channels', {channels: userChannels})"
+	            />
             </template>
         </div>
 
-        <div v-if="buffer.isChannel() && areWeAnOp" class="kiwi-userbox-opactions">
+        <div v-if="buffer.isChannel() && areWeAnOp && !isSelf" class="kiwi-userbox-opactions">
             <form class="u-form" @submit.prevent="">
                 <label v-if="isUserOnBuffer">
                     {{ $t('user_access') }} <select v-model="userMode">
@@ -144,9 +146,13 @@
 'kiwi public';
 
 import * as utils from '../libs/utils.js';
-let state = kiwi.state;
+let TextFormatting = kiwi.require('helpers/TextFormatting');
+let AwayStatusIndicator = kiwi.require('components/AwayStatusIndicator');
 
 export default {
+    components: {
+        AwayStatusIndicator,
+    },
     props: ['buffer', 'network', 'user'],
     data: function data() {
         return {
@@ -240,6 +246,16 @@ export default {
                 client.raw(params);
             },
         },
+        userChannels() {
+	            let channels = this.user.channels.trim().split(' ');
+	            for (let i = 0; i < channels.length; i++) {
+	                channels[i] = TextFormatting.linkifyChannels(channels[i]);
+	            }
+	            return channels.join(' ');
+    },
+        isSelf() {
+            return this.user === this.network.currentUser();
+        },
     },
     watch: {
         user: function watchUser() {
@@ -261,9 +277,19 @@ export default {
                 '';
         },
         openQuery: function openQuery() {
-            let buffer = state.addBuffer(this.network.id, this.user.nick);
-            state.setActiveBuffer(this.network.id, buffer.name);
-            state.$emit('userbox.hide');
+            let buffer = this.$state.addBuffer(this.network.id, this.user.nick);
+            this.$state.setActiveBuffer(this.network.id, buffer.name);
+            if (this.$state.ui.is_narrow) {
+                this.$state.$emit('userbox.hide');
+            }
+        },
+        onChannelsClick(event) {
+            let channelName = event.target.getAttribute('data-channel-name');
+            if (channelName) {
+                let network = this.buffer.getNetwork();
+                this.$state.addBuffer(this.buffer.networkid, channelName);
+                network.ircClient.join(channelName);
+            }
         },
         updateWhoisData: function updateWhoisData() {
             this.whoisRequested = true;
@@ -273,11 +299,11 @@ export default {
             });
         },
         kickUser: function kickUser() {
-            let reason = state.setting('buffers.default_kick_reason');
+            let reason = this.$state.setting('buffers.default_kick_reason');
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },
         createBanMask: function banMask() {
-            let mask = state.setting('buffers.default_ban_mask');
+            let reason = this.$state.setting('buffers.default_kick_reason');
             mask = mask.replace('%n', this.user.nick);
             mask = mask.replace('%i', this.user.username);
             mask = mask.replace('%h', this.user.host);
@@ -318,27 +344,42 @@ export default {
     height: 100%;
 }
 
+.kiwi-userbox-selfprofile {
+    display: block;
+    margin: 0 auto;
+    width: 100%;
+    padding: 1em;
+    text-align: center;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+    box-sizing: border-box;
+}
+	
 .kiwi-userbox-header {
     position: relative;
-    padding: 0.5em 1em 0.5em 5em;
+    padding: 0.5em 1em;
     overflow: hidden;
+}
 
-    h3 {
-        width: 100%;
-        padding: 0;
-        cursor: default;
-    }
+.kiwi-userbox-header h3 {
+    width: 100%;
+    padding: 0;
+    cursor: default;
+    display: inline-block;
+}
+
+.kiwi-userbox-modestring {
+    font-weight: normal;
+    font-size: 0.8em;
 }
 
 .fa-user.kiwi-userbox-icon {
-    position: absolute;
-    left: 0.5em;
-    top: 0.25em;
-    font-size: 3em;
+    display: inline-block;
+    font-size: 2em;
 }
 
 .kiwi-userbox-usermask {
     width: 100%;
+    opacity: 0.6;
     cursor: default;
 }
 
@@ -346,7 +387,7 @@ export default {
     width: 100%;
     margin: 0;
     display: block;
-    padding: 1em 1em 1em 1.4em;
+    padding: 0.5em 1em;
     box-sizing: border-box;
 }
 
@@ -363,7 +404,6 @@ export default {
     line-height: 1em;
     padding: 0;
     text-align: left;
-    opacity: 0.5;
     font-weight: 900;
 }
 
@@ -383,18 +423,12 @@ export default {
 
     .kiwi-userbox-action {
         display: inline-block;
-        border: 1px solid #000;
+        border: 1px solid;
         padding: 0.5em 1em;
-        color: #000;
         cursor: pointer;
-        margin: 0 auto 20px auto;
+        margin: 0 2px;
         transition: all 0.3s;
         border-radius: 3px;
-
-        &:hover {
-            background-color: #000;
-            color: #fff;
-        }
     }
 
     label {
@@ -442,12 +476,13 @@ export default {
     padding: 0 1em;
     text-align: left;
     border: none;
-    line-height: 2.8em;
-    font-size: 1em;
+    line-height: 2.2em;
+    font-size: 0.8em;
 }
 
 .kiwi-userbox-opaction i {
-    margin-right: 0.3em;
+    margin-right: 0.2em;
+    font-size: 1.2em;
 }
 
 .kiwi-userbox-actions a {
@@ -461,6 +496,7 @@ export default {
     margin: 0 5% 20px 5%;
     background: none;
     box-sizing: border-box;
+    border-radius: 2px;
 }
 
 .kiwi-userbox-whois-line {
@@ -479,7 +515,7 @@ export default {
 }
 
 @media screen and (max-width: 769px) {
-    .kiwi-container--sidebar-open .kiwi-sidebar-userbox {
+    .kiwi-container--sidebar-drawn .kiwi-sidebar-userbox {
         width: 100%;
     }
 
@@ -515,6 +551,7 @@ export default {
         width: 200px;
         clear: both;
         display: block;
+        margin: 0 auto 20px auto;
     }
 }
 </style>
diff --git a/src/components/CustomWelcome.vue b/src/components/CustomWelcome.vue
index 8bc2ea4..11af3af 100644
--- a/src/components/CustomWelcome.vue
+++ b/src/components/CustomWelcome.vue
@@ -1,7 +1,9 @@
 <template>
-    <startup-layout ref="layout" class="kiwi-welcome-simple">
-        <div slot="connection">
-            <template v-if="!network || network.state === 'disconnected'">
+    <startup-layout ref="layout"
+                    :class="{ 'kiwi-welcome-simple--recaptcha': recaptchaSiteId }"
+                    class="kiwi-welcome-simple"
+    >
+        <template v-slot:connection v-if="!network || network.state === 'disconnected'">
                 <form class="u-form kiwi-welcome-simple-form" @submit.prevent="formSubmit">
                     <h2 v-html="greetingText"/>
                     <div
@@ -20,13 +22,16 @@
                         v-model="nick"
                         class="kiwi-welcome-simple-nick"
                     />
-                    <label v-if="showPass" class="kiwi-welcome-simple-have-password">
+                <label
+                    v-if="showPass && toggablePass"
+                    class="kiwi-welcome-simple-have-password"
+                >
                         <input v-model="show_password_box" type="checkbox" >
                         <span> {{ $t('password_have') }} </span>
                     </label>
                     <input-text
                         v-focus
-                        v-if="show_password_box"
+                        v-if="showPass && (show_password_box || !toggablePass)"
                         :label="$t('password')"
                         v-model="password"
                         class="kiwi-welcome-simple-password input-text--reveal-value"
@@ -72,19 +77,20 @@
                     />
                 </form>
             </template>
-            <template v-else-if="network.state !== 'connected'">
+            <template v-slot:connection v-else-if="network.state !== 'connected'">
                 <i class="fa fa-spin fa-spinner" aria-hidden="true"/>
             </template>
-        </div>
     </startup-layout>
 </template>
 
 <script>
 
-var state = kiwi.state;
-var Misc = kiwi.require('helpers/Misc');
-var StartupLayout = kiwi.require('components/startups/CommonLayout');
-
+let state = kiwi.state;
+let Misc = kiwi.require('helpers/Misc');
+let StartupLayout = kiwi.require('components/startups/CommonLayout');
+let Logger = kiwi.require('libs/Logger');
+let log = Logger.namespace('Welcome.vue');
+	
 export default {
     components: {
         StartupLayout,
@@ -97,6 +103,7 @@ export default {
             password: '',
             showChannel: true,
             showPass: true,
+            toggablePass: true,
             showNick: true,
             show_password_box: false,
             recaptchaSiteId: '',
@@ -127,10 +134,38 @@ export default {
                 ready = false;
             }
 
+            let nickPatternStr = this.$state.setting('startupOptions.nick_format');
+            let nickPattern = '';
+            if (!nickPatternStr) {
             // Nicks cannot start with [0-9- ]
             // ? is not a valid nick character but we allow it as it gets replaced
             // with a number.
-            if (!this.nick.match(/^[a-z_\\[\]{}^`|][a-z0-9_\-\\[\]{}^`|]*$/i)) {
+                nickPattern = /^[a-z_\\[\]{}^`|][a-z0-9_\-\\[\]{}^`|]*$/i;
+            } else {
+                // Support custom pattern matches. Eg. only '@example.com' may be allowed
+                // on some IRCDs
+                let pattern = '';
+                let flags = '';
+                if (nickPatternStr[0] === '/') {
+                    // Custom regex
+                    let pos = nickPatternStr.lastIndexOf('/');
+                    pattern = nickPatternStr.substring(1, pos);
+                    flags = nickPatternStr.substr(pos + 1);
+                } else {
+                    // Basic contains rule
+                    pattern = _.escapeRegExp(nickPatternStr);
+                    flags = 'i';
+                }
+
+                try {
+                    nickPattern = new RegExp(pattern, flags);
+                } catch (error) {
+                    log.error('Nick format error: ' + error.message);
+                    return false;
+                }
+            }
+
+            if (!this.nick.match(nickPattern)) {        
                 ready = false;
             }
 
@@ -145,7 +180,7 @@ export default {
     	this.sex = Misc.queryStringVal('sex') || options.sex || '';
     	this.location = Misc.queryStringVal('location') || options.location || '';
         this.password = options.password || '';
-        this.channel = decodeURI(window.location.hash) || options.channel || '';
+        this.channel = decodeURIComponent(window.location.hash) || options.channel || '';
         this.showChannel = typeof options.showChannel === 'boolean' ?
             options.showChannel :
             true;
@@ -155,13 +190,16 @@ export default {
         this.showPass = typeof options.showPassword === 'boolean' ?
             options.showPassword :
             true;
+        this.toggablePass = typeof options.toggablePassword === 'boolean' ?
+            options.toggablePassword :
+            true;
 
-        if (options.autoConnect && this.nick && this.channel) {
+        this.connectWithoutChannel = !!options.allowNoChannel;
+	
+        if (options.autoConnect && this.nick && (this.channel || this.connectWithoutChannel)) {
             this.startUp();
         }
 
-        this.connectWithoutChannel = !!options.allowNoChannel;
-
         this.recaptchaSiteId = options.recaptchaSiteId || '';
     },
     mounted() {
@@ -213,14 +251,6 @@ export default {
             // Check if we have this network already
             let net = this.network || state.getNetworkFromAddress(netAddress);
 
-            // If we retreived an existing network, update the nick+password with what
-            // the user has just put in place
-            if (net) {
-                net.nick = this.nick;
-                net.gecos = this.buildGecos();
-                net.connection.password = this.password;
-            }
-
             // If the network doesn't already exist, add a new one
             net = net || state.addNetwork('Network', this.nick, {
                 server: netAddress,
@@ -233,6 +263,12 @@ export default {
                 gecos: this.buildGecos(),
             });
 
+            // If we retreived an existing network, update the nick+password with what
+            // the user has just put in place
+            net.connection.nick = this.nick;
+            net.password = this.password;
+            net.gecos = this.buildGecos();
+
             if (!this.network && options.recaptchaSiteId) {
                 net.captchaResponse = this.captchaResponse();
             }
@@ -296,10 +332,21 @@ export default {
 
 .kiwi-welcome-simple-form {
     width: 90%;
+    max-width: 250px;
     border-radius: 0.5em;
     padding: 1em;
 }
 
+.kiwi-welcome-simple--recaptcha .kiwi-welcome-simple-form {
+    width: 333px;
+    max-width: 333px;
+    box-sizing: border-box;
+}
+
+.g-recaptcha {
+    margin-bottom: 10px;
+}
+
 .kiwi-welcome-simple-error {
     text-align: center;
     margin: 1em 0;
@@ -339,7 +386,7 @@ export default {
     padding: 0 0.5em;
 }
 
-.kiwi-welcome-simple-section-connection .input-text input[type="text"] {
+.kiwi-welcome-simple-section-connection .u-input-text input[type="text"] {
     margin-top: 5px;
     padding: 0.3em 1em;
     width: 100%;
@@ -347,7 +394,7 @@ export default {
     box-sizing: border-box;
 }
 
-.kiwi-welcome-simple .input-text {
+.kiwi-welcome-simple .u-input-text {
     font-weight: 600;
     opacity: 0.6;
     font-size: 1.2em;
@@ -364,7 +411,7 @@ export default {
     margin-top: 2px;
 }
 
-.kiwi-welcome-simple .g-recaptcha {
+.kiwi-welcome-simple .kiwi-g-recaptcha {
     margin-bottom: 10px;
 }
 
@@ -421,6 +468,7 @@ export default {
     margin-top: -0.5em;
     left: 50%;
     margin-left: -40px;
+    color: black;
 }
 
 /** Smaller screen... **/
@@ -451,7 +499,6 @@ export default {
         left: 48%;
         top: 50%;
         margin-top: -50px;
-        color: #fff;
     }
 }
 
diff --git a/yarn.lock b/yarn.lock
index 5d8dcd3..0e5d474 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8439,10 +8439,10 @@ vue-style-loader@^4.1.0:
     hash-sum "^1.0.2"
     loader-utils "^1.0.2"
 
-vue-template-compiler@^2.0.0:
-  version "2.5.16"
-  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.5.16.tgz#93b48570e56c720cdf3f051cc15287c26fbd04cb"
-  integrity sha512-ZbuhCcF/hTYmldoUOVcu2fcbeSAZnfzwDskGduOrnjBiIWHgELAd+R8nAtX80aZkceWDKGQ6N9/0/EUpt+l22A==
+vue-template-compiler@^2.6.10:
+  version "2.6.10"
+  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz#323b4f3495f04faa3503337a82f5d6507799c9cc"
+  integrity sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg==
   dependencies:
     de-indent "^1.0.2"
     he "^1.1.0"

From 04fcc36385c3ed8c402dc539c4aba150ca095203 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Mon, 20 May 2019 14:59:58 +0200
Subject: [PATCH 12/19] Fixed component path

---
 src/components/CustomNicklistUser.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/CustomNicklistUser.vue b/src/components/CustomNicklistUser.vue
index 9f5cb5d..750f868 100644
--- a/src/components/CustomNicklistUser.vue
+++ b/src/components/CustomNicklistUser.vue
@@ -31,8 +31,8 @@
 <script>
 'kiwi public';
 
-let AwayStatusIndicator = kiwi.require('components/startups/AwayStatusIndicator');
-let TypingStatusIndicator = kiwi.require('components/startups/TypingStatusIndicator');
+let AwayStatusIndicator = kiwi.require('components/AwayStatusIndicator');
+let TypingStatusIndicator = kiwi.require('components/TypingStatusIndicator');
 
 export default {
     components: {
@@ -132,4 +132,4 @@ export default {
     transition-delay: 0.1s;
 }
 
-</style>
\ No newline at end of file
+</style>

From 967479d4163f84b510f905d4538c2692814bc44a Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Thu, 11 Jul 2019 02:04:47 +0200
Subject: [PATCH 13/19] Set server buffer as active when no channels are joined
 at startup

---
 src/components/CustomWelcome.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/CustomWelcome.vue b/src/components/CustomWelcome.vue
index 11af3af..0f77ffe 100644
--- a/src/components/CustomWelcome.vue
+++ b/src/components/CustomWelcome.vue
@@ -291,6 +291,11 @@ export default {
                 }
             });
 
+            // switch to server buffer if no channels are joined
+            if (!hasSwitchedActiveBuffer) {
+                state.setActiveBuffer(net.id, net.serverBuffer().name);
+            }
+
             net.ircClient.connect();
             let onRegistered = () => {
                 if (this.$refs.layout) {

From 74ce2181779107938a94411df6be96c18615e9ea Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Fri, 19 Jul 2019 00:08:15 +0200
Subject: [PATCH 14/19] Now it fit latest welcome screen style

---
 src/components/CustomWelcome.vue | 253 ++++++++++++-------------------
 1 file changed, 99 insertions(+), 154 deletions(-)

diff --git a/src/components/CustomWelcome.vue b/src/components/CustomWelcome.vue
index 0f77ffe..352d110 100644
--- a/src/components/CustomWelcome.vue
+++ b/src/components/CustomWelcome.vue
@@ -4,7 +4,7 @@
                     class="kiwi-welcome-simple"
     >
         <template v-slot:connection v-if="!network || network.state === 'disconnected'">
-                <form class="u-form kiwi-welcome-simple-form" @submit.prevent="formSubmit">
+                <form class="u-form u-form--big kiwi-welcome-simple-form" @submit.prevent="formSubmit">
                     <h2 v-html="greetingText"/>
                     <div
                         v-if="network && (network.last_error || network.state_error)"
@@ -16,27 +16,30 @@
                         </span>
                     </div>
 
-                    <input-text
-                        v-if="showNick"
-                        :label="$t('nick')"
-                        v-model="nick"
-                        class="kiwi-welcome-simple-nick"
-                    />
-                <label
-                    v-if="showPass && toggablePass"
-                    class="kiwi-welcome-simple-have-password"
-                >
+                <input-text v-model="nick" :label="$t('nick')" type="text" />
+	
+                <div v-if="showPass && toggablePass" class="kiwi-welcome-simple-input-container">
+                    <label
+                        class="kiwi-welcome-simple-have-password"
+                    >
                         <input v-model="show_password_box" type="checkbox" >
                         <span> {{ $t('password_have') }} </span>
                     </label>
+                </div>
+	
+                <div v-if="showPass && (show_password_box || !toggablePass)"
+                     class="kiwi-welcome-simple-input-container"
+                >
                     <input-text
-                        v-focus
-                        v-if="showPass && (show_password_box || !toggablePass)"
-                        :label="$t('password')"
-                        v-model="password"
-                        class="kiwi-welcome-simple-password input-text--reveal-value"
-                        type="password"
-                    />
+	                        v-focus
+	                        v-model="password"
+	                        :show-plain-text="true"
+	                        :label="$t('password')"
+	                        type="password"
+	                    />
+                </div>
+                <div class="kiwi-welcome-simple-asl-container">
+
                     <input-text
                         label="Età"
                         v-model="age"
@@ -44,25 +47,28 @@
                         type="number"
                     />
                     <div class="kiwi-welcome-simple-sex">
-                        <span >Sesso: </span>
-                        <select v-model="sex">
+                        <label class="kiwi-welcome-simple-sex">Sesso</label>
+                        <select v-model="sex" label="Sesso">
                             <option :value="null" selected disabled>Scegli ...</option>
                             <option value="M">Uomo</option>
                             <option value="F">Donna</option>
                             <option value="O">Altro</option>
                         </select>
                     </div>
+
+                </div>
+
                     <input-text
                         label="Località"
                         v-model="location"
                     />
-                    <input-text
-                        v-if="showChannel"
-                        :label="$t('channel')"
-                        v-model="channel"
-                        class="kiwi-welcome-simple-channel"
-                    />
 
+                    <div v-if="showChannel" class="kiwi-welcome-simple-input-container">
+	                    <input-text
+	                        v-model="channel"
+	                        :label="$t('channel')"
+	                    />
+                    </div>
                     <div
                         v-if="recaptchaSiteId"
                         :data-sitekey="recaptchaSiteId"
@@ -77,7 +83,7 @@
                     />
                 </form>
             </template>
-            <template v-slot:connection v-else-if="network.state !== 'connected'">
+            <template v-slot:connection v-else>
                 <i class="fa fa-spin fa-spinner" aria-hidden="true"/>
             </template>
     </startup-layout>
@@ -109,6 +115,7 @@ export default {
             recaptchaSiteId: '',
             recaptchaResponseCache: '',
             connectWithoutChannel: false,
+            showPlainText: false,
             age: null,
             sex: null,
             location: null,
@@ -328,30 +335,56 @@ export default {
 
 <style>
 
-.kiwi-welcome-simple h2 {
-    font-size: 1.7em;
-    text-align: center;
-    padding: 0;
-    margin: 0.5em 0 1em 0;
+/* Containers */
+
+
+.kiwi-startup-common-section-connection {
+-webkit-box-align: center;
+align-items: center;
+-webkit-box-pack: center;
+justify-content: center;
 }
 
-.kiwi-welcome-simple-form {
-    width: 90%;
-    max-width: 250px;
-    border-radius: 0.5em;
-    padding: 1em;
+.kiwi-startup-common-section-connection {
+	overflow-y:auto;
 }
 
-.kiwi-welcome-simple--recaptcha .kiwi-welcome-simple-form {
-    width: 333px;
-    max-width: 333px;
-    box-sizing: border-box;
+.kiwi-startup-common-section-info {
+-webkit-box-align: center;
+align-items: center;
+-webkit-box-pack: center;
+padding:0px !important;
 }
 
-.g-recaptcha {
-    margin-bottom: 10px;
+.kiwi-startup-common-section-info-content {
+	margin:0px !important;
+	padding:0px !important;
+}
+
+form.kiwi-welcome-simple-form {
+    width: 70%;
+    padding: 0 20px;
+}
+
+
+@media (max-width: 1025px) {
+    form.kiwi-welcome-simple-form {
+        width: 100%;
+    }
 }
 
+form.kiwi-welcome-simple-form h2 {
+    margin: 0 0 20px 0;
+    padding: 0;
+    cursor: default;
+    font-weight: 600;
+    font-size: 1.7em;
+    text-align: center;
+}
+
+form.kiwi-welcome-simple-form label {
+    margin-bottom:5px !important;
+}
 .kiwi-welcome-simple-error {
     text-align: center;
     margin: 1em 0;
@@ -374,7 +407,6 @@ export default {
 }
 
 .kiwi-welcome-simple-sex {
-    font-weight: 600;
     color: #b3b3bc;
     display: inline-block;
     margin-bottom: 0.8em;
@@ -384,133 +416,46 @@ export default {
     border: 0;
 }
 
-.kiwi-welcome-simple-section-connection label {
-    text-align: left;
-    display: inline-block;
-    margin-bottom: 0.8em;
-    padding: 0 0.5em;
-}
-
-.kiwi-welcome-simple-section-connection .u-input-text input[type="text"] {
-    margin-top: 5px;
-    padding: 0.3em 1em;
+.kiwi-welcome-simple-input-container {
     width: 100%;
-    font-size: 1.1em;
-    box-sizing: border-box;
+    height: auto;
+    position: relative;
+    margin: 0 0 10x 0;
 }
 
-.kiwi-welcome-simple .u-input-text {
-    font-weight: 600;
-    opacity: 0.6;
-    font-size: 1.2em;
-    margin-bottom: 0.8em;
-}
-
-.kiwi-welcome-simple-form input {
-    padding: 0.5em;
-}
-
-.kiwi-welcome-simple-have-password input {
-    font-size: 0.8em;
-    margin: 0.8em 0;
-    margin-top: 2px;
-}
-
-.kiwi-welcome-simple .kiwi-g-recaptcha {
-    margin-bottom: 10px;
-}
-
-.kiwi-welcome-simple .u-form label span {
-    font-size: 1.1em;
-    margin-left: 5px;
-}
-
-.kiwi-welcome-simple-start {
-    font-size: 1.1em;
-    cursor: pointer;
-}
+.kiwi-welcome-simple-input-container .u-input-text {
 
-.kiwi-welcome-simple-start[disabled] {
-    cursor: not-allowed;
-    opacity: 0.65;
+    margin-top: 0px !important;
+    
 }
 
-.kiwi-welcome-simple-channel {
-    margin-bottom: 0.8em;
-}
-
-.kiwi-welcome-simple-form .u-submit {
+.kiwi-welcome-simple-asl-container {
     width: 100%;
-    line-height: 50px;
-    padding: 0;
-    text-transform: uppercase;
-    letter-spacing: 1px;
-    font-weight: 400;
-    text-shadow: none;
-    margin: 0;
-    transition: all 0.2s;
-    border: none;
-}
-
-.kiwi-welcome-simple .help {
-    position: absolute;
-    bottom: 0.2em;
-    font-size: 0.8em;
-    width: 50%;
-    text-align: center;
+    height: auto;
+    position: relative;
+    margin: 0 0 10px 0;
+    display:flex;
 }
 
-.kiwi-welcome-simple .help a {
-    text-decoration: underline;
+.kiwi-welcome-simple-input-container:last-of-type {
+    margin-top:0px !important;
+    margin-bottom:0px !important;
 }
 
-/* Styling the preloader */
+/* Make the preloader icon larger */
 .kiwi-welcome-simple .fa-spinner {
-    position: absolute;
-    top: 50%;
-    z-index: 999;
-    font-size: 100px;
-    margin-top: -0.5em;
-    left: 50%;
-    margin-left: -40px;
-    color: black;
+    font-size:6em;
 }
 
-/** Smaller screen... **/
-@media screen and (max-width: 850px) {
-    .kiwi-welcome-simple-form {
-        left: auto;
-        margin: 20px auto 20px auto;
-        z-index: 100;
-        position: relative;
-        top: auto;
-        align-self: flex-start;
-    }
-
-    .kiwi-welcome-simple p.help {
-        position: absolute;
-        bottom: 20px;
-        width: 100%;
-        color: #fff;
-        z-index: 100;
-    }
+@media (max-height: 720px) {
 
-    .kiwi-welcome-simple p.help a {
-        color: #fff;
+    .kiwi-startup-common-section-connection {
+    -webkit-box-align: start;
+    align-items: start;
+    -webkit-box-pack: start;
+    justify-content: center;
     }
 
-    .fa-spinner {
-        position: absolute;
-        left: 48%;
-        top: 50%;
-        margin-top: -50px;
-    }
-}
-
-@media (max-width: 400px) {
-    .kiwi-welcome-simple-form {
-        width: 90%;
-    }
 }
 
 </style>

From 67f0be720d25af626675c213b4a4c5d2a7e05067 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Fri, 19 Jul 2019 13:43:30 +0200
Subject: [PATCH 15/19] Fixed login layout and better select

---
 src/components/CustomWelcome.vue | 63 +++++++++++++++++++++++---------
 1 file changed, 45 insertions(+), 18 deletions(-)

diff --git a/src/components/CustomWelcome.vue b/src/components/CustomWelcome.vue
index 352d110..ee14268 100644
--- a/src/components/CustomWelcome.vue
+++ b/src/components/CustomWelcome.vue
@@ -48,7 +48,7 @@
                     />
                     <div class="kiwi-welcome-simple-sex">
                         <label class="kiwi-welcome-simple-sex">Sesso</label>
-                        <select v-model="sex" label="Sesso">
+                        <select v-model="sex" class="kiwi-welcome-simple-sex-select" label="Sesso">
                             <option :value="null" selected disabled>Scegli ...</option>
                             <option value="M">Uomo</option>
                             <option value="F">Donna</option>
@@ -353,6 +353,7 @@ justify-content: center;
 -webkit-box-align: center;
 align-items: center;
 -webkit-box-pack: center;
+justify-content: center;
 padding:0px !important;
 }
 
@@ -406,17 +407,53 @@ form.kiwi-welcome-simple-form label {
     margin: 0;
 }
 
+
+.kiwi-welcome-simple-asl-container {
+    width: 100%;
+    height: auto;
+    position: relative;
+    margin: 0 0 0px 0;
+    display:flex;
+}
+
+.kiwi-welcome-simple-age {
+
+}
+
 .kiwi-welcome-simple-sex {
-    color: #b3b3bc;
-    display: inline-block;
-    margin-bottom: 0.8em;
+    flex:1;
+    margin-left:5px;   
+}
+
+.kiwi-welcome-simple-sex-select {
+   -webkit-appearance: button;
+   -webkit-border-radius: 2px;
+   -webkit-box-shadow: 0px;
+   -webkit-padding-end: 20px;
+   -webkit-padding-start: 2px;
+   -webkit-user-select: none;
+   background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='32px' width='24px'><text x='0' y='24' fill='grey' style='font: 24px Verdana;'>\00BB</text></svg>"), -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
+   background-position:95% center;
+   background-repeat: no-repeat;
+   border: 1px solid  !important;
+   border-color: #e2e2e2 !important;
+   border-radius: 5px;
+   color: #555;
+   font-size: inherit;
+   overflow: hidden;
+   padding: 15px 15px;
+   text-overflow: ellipsis;
+   white-space: nowrap;
+   box-sizing: border-box;
+   width:100%;
 }
 
-.kiwi-welcome-simple-sex select {
-    border: 0;
+.kiwi-welcome-simple-sex-select:focus {
+    outline: 0;
+    border-color:#42b992 !important;
 }
 
-.kiwi-welcome-simple-input-container {
+.kiwi-welcome-simple-form .kiwi-welcome-simple-input-container {
     width: 100%;
     height: auto;
     position: relative;
@@ -424,17 +461,7 @@ form.kiwi-welcome-simple-form label {
 }
 
 .kiwi-welcome-simple-input-container .u-input-text {
-
     margin-top: 0px !important;
-    
-}
-
-.kiwi-welcome-simple-asl-container {
-    width: 100%;
-    height: auto;
-    position: relative;
-    margin: 0 0 10px 0;
-    display:flex;
 }
 
 .kiwi-welcome-simple-input-container:last-of-type {
@@ -452,7 +479,7 @@ form.kiwi-welcome-simple-form label {
     .kiwi-startup-common-section-connection {
     -webkit-box-align: start;
     align-items: start;
-    -webkit-box-pack: start;
+    -webkit-box-pack: center;
     justify-content: center;
     }
 

From c376a0f7176a7e85da47f7fdb5fcf1a50b864e5e Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 19 Nov 2019 20:14:39 +0100
Subject: [PATCH 16/19] fixed wrong default_ban_mask var name

---
 src/components/CustomUserBox.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
index d5e6f1d..32152bc 100644
--- a/src/components/CustomUserBox.vue
+++ b/src/components/CustomUserBox.vue
@@ -303,7 +303,7 @@ export default {
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },
         createBanMask: function banMask() {
-            let reason = this.$state.setting('buffers.default_kick_reason');
+            let reason = this.$state.setting('buffers.default_ban_mask');
             mask = mask.replace('%n', this.user.nick);
             mask = mask.replace('%i', this.user.username);
             mask = mask.replace('%h', this.user.host);
@@ -324,7 +324,7 @@ export default {
             }
 
             let banMask = this.createBanMask();
-            let reason = state.setting('buffers.default_kick_reason');
+            let reason = state.setting('buffers.default_ban_mask');
             this.network.ircClient.raw('MODE', this.buffer.name, '+b', banMask);
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },

From e12febe96b68f3555fec2e0fdf13393740186953 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Tue, 19 Nov 2019 21:47:18 +0100
Subject: [PATCH 17/19] Fixed some mistake

---
 src/components/CustomUserBox.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
index 32152bc..8ed2dfa 100644
--- a/src/components/CustomUserBox.vue
+++ b/src/components/CustomUserBox.vue
@@ -303,7 +303,7 @@ export default {
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },
         createBanMask: function banMask() {
-            let reason = this.$state.setting('buffers.default_ban_mask');
+            let mask = this.$state.setting('buffers.default_ban_mask');
             mask = mask.replace('%n', this.user.nick);
             mask = mask.replace('%i', this.user.username);
             mask = mask.replace('%h', this.user.host);
@@ -324,7 +324,7 @@ export default {
             }
 
             let banMask = this.createBanMask();
-            let reason = state.setting('buffers.default_ban_mask');
+            let reason = this.$state.setting('buffers.default_kick_reason');
             this.network.ircClient.raw('MODE', this.buffer.name, '+b', banMask);
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },

From b7fa2d43c2a9c44ca3ea442f857b0c3fadc112f1 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Sun, 29 Dec 2019 20:03:44 +0100
Subject: [PATCH 18/19] Just some fix

---
 src/components/CustomUserBox.vue | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
index 8ed2dfa..5a105f6 100644
--- a/src/components/CustomUserBox.vue
+++ b/src/components/CustomUserBox.vue
@@ -147,6 +147,7 @@
 
 import * as utils from '../libs/utils.js';
 let TextFormatting = kiwi.require('helpers/TextFormatting');
+let IrcdDiffs = kiwi.require('helpers/IrcdDiffs');
 let AwayStatusIndicator = kiwi.require('components/AwayStatusIndicator');
 
 export default {
@@ -177,6 +178,17 @@ export default {
                 h: 'Half-Operator',
                 v: 'Voice',
             };
+            
+            if (!IrcdDiffs.isAChannelModeAdmin(this.network)) {
+                delete knownPrefix.a;
+            }
+            if (!IrcdDiffs.isQChannelModeOwner(this.network)) {
+                delete knownPrefix.q;
+            }
+            if (!IrcdDiffs.supportsHalfOp(this.network)) {
+                delete knownPrefix.h;
+            }
+            
             prefixes.forEach((prefix) => {
                 let mode = prefix.mode;
                 if (knownPrefix[mode]) {
@@ -252,7 +264,7 @@ export default {
 	                channels[i] = TextFormatting.linkifyChannels(channels[i]);
 	            }
 	            return channels.join(' ');
-    },
+        },
         isSelf() {
             return this.user === this.network.currentUser();
         },

From fce05c197a06d5b0c7117519010962a390fad256 Mon Sep 17 00:00:00 2001
From: KiwiIRC <kiwi@webirc.simosnap.com>
Date: Mon, 2 Mar 2020 12:04:50 +0100
Subject: [PATCH 19/19] Updated views to current master

---
 src/components/CustomNicklistUser.vue | 69 +++++++++++++++++++++++----
 src/components/CustomUserBox.vue      | 69 +++++++++++++++++++++------
 2 files changed, 114 insertions(+), 24 deletions(-)

diff --git a/src/components/CustomNicklistUser.vue b/src/components/CustomNicklistUser.vue
index 750f868..20f4367 100644
--- a/src/components/CustomNicklistUser.vue
+++ b/src/components/CustomNicklistUser.vue
@@ -1,5 +1,5 @@
 <template>
-    <li
+    <div
         :class="[
             nicklist.userMode(user) ? 'kiwi-nicklist-user--mode-' + nicklist.userMode(user) : '',
             user.away ? 'kiwi-nicklist-user--away' : '',
@@ -10,13 +10,26 @@
         class="kiwi-nicklist-user"
         @click="nicklist.openUserbox(user)"
     >
-        <away-status-indicator
-            :network="network"
-            :user="user"
-            :toggle="false"
-        />
-        <span class="kiwi-nicklist-user-prefix">{{ nicklist.userModePrefix(user) }}</span>
-        <span
+        <div v-if="shouldShowAvatars" class="kiwi-avatar-container">
+            <Avatar
+                v-if="user"
+                :user="user"
+                size="small"
+            />
+            <away-status-indicator
+                :network="network"
+                :user="user"
+                :toggle="false"
+            />
+        </div>
+        <div v-else>
+            <away-status-indicator
+                :network="network"
+                :user="user"
+                :toggle="false"
+            />
+        </div>
+        <span class="kiwi-nicklist-user-prefix">{{ nicklist.userModePrefix(user) }}</span><span
             :style="{ 'color': userColour }"
             class="kiwi-nicklist-user-nick"
         >{{ user.nick }}
@@ -25,7 +38,7 @@
             <i class="fa fa-comment" aria-hidden="true"/>
         </span>
         <typing-status-indicator :user="user" :buffer="nicklist.buffer" />
-    </li>
+    </div>
 </template>
 
 <script>
@@ -33,11 +46,13 @@
 
 let AwayStatusIndicator = kiwi.require('components/AwayStatusIndicator');
 let TypingStatusIndicator = kiwi.require('components/TypingStatusIndicator');
+let Avatar = kiwi.require('components/Avatar');
 
 export default {
     components: {
         AwayStatusIndicator,
         TypingStatusIndicator,
+	Avatar,
     },
     props: ['network', 'user', 'nicklist'],
     computed: {
@@ -47,6 +62,9 @@ export default {
             }
             return '';
         },
+        shouldShowAvatars() {
+            return this.nicklist.buffer.setting('nicklist_avatars');
+        },
     },
 };
 </script>
@@ -57,11 +75,19 @@ export default {
     line-height: 26px;
     padding: 0 12px 0 12px;
     border-left: 4px solid;
-    margin: 0;
+    margin: 0 0 0 0;
     position: relative;
     box-sizing: border-box;
     transition: all 0.1s;
     cursor: pointer;
+    white-space: nowrap;
+    display: flex;
+    align-items: center;
+}
+
+.kiwi-nicklist--avatars .kiwi-nicklist-user {
+    line-height: 32px;
+    padding-bottom: 6px;
 }
 
 .kiwi-nicklist-user--gender-Male .kiwi-nicklist-user-nick::after {
@@ -109,6 +135,7 @@ export default {
 .kiwi-nicklist-user-nick {
     font-weight: bold;
     cursor: pointer;
+    flex: 1;
 }
 
 .kiwi-nicklist-messageuser {
@@ -132,4 +159,26 @@ export default {
     transition-delay: 0.1s;
 }
 
+.kiwi-avatar-container {
+    position: relative;
+    margin-right: 10px;
+    flex: 0;
+}
+
+.kiwi-avatar-container .kiwi-avatar {
+    width: 30px;
+    height: 30px;
+}
+
+.kiwi-avatar-container .kiwi-awaystatusindicator {
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin: 0;
+}
+
+.kiwi-avatar-container-user-prefix {
+    flex: 0;
+}
+
 </style>
diff --git a/src/components/CustomUserBox.vue b/src/components/CustomUserBox.vue
index 5a105f6..fceddfe 100644
--- a/src/components/CustomUserBox.vue
+++ b/src/components/CustomUserBox.vue
@@ -1,13 +1,14 @@
 <template>
     <div class="kiwi-userbox">
         <span v-if="isSelf" class="kiwi-userbox-selfprofile">
-            This is you!
+            {{ $t('user_you') }}
         </span>
         <div class="kiwi-userbox-header">
             <h3>
                 <away-status-indicator :network="network" :user="user"/> {{ user.nick }}
-                <span v-if="userMode" class="kiwi-userbox-modestring">+ {{ userMode }}</span>
-	        </h3>
+                <span v-if="userMode" class="kiwi-userbox-modestring">+{{ userMode }}</span>
+            </h3>
+            <div class="kiwi-userbox-usermask">{{ user.username }}@{{ user.host }}</div>
         </div>
 
         <div class="kiwi-userbox-basicinfo">
@@ -36,7 +37,6 @@
                 <i class="fa fa-question-circle" aria-hidden="true"/>
                 {{ $t('more_information') }}
             </a>
-
         </p>
 
         <form v-if="!isSelf" class="u-form kiwi-userbox-ignoreuser">
@@ -88,7 +88,7 @@
                     class="kiwi-userbox-whois-line"
                     @click="onChannelsClick($event)"
                     v-html="$t('user_channels', {channels: userChannels})"
-	            />
+	        />
             </template>
         </div>
 
@@ -146,8 +146,11 @@
 'kiwi public';
 
 import * as utils from '../libs/utils.js';
+let ipRegex = kiwi.require('ip-regex');
 let TextFormatting = kiwi.require('helpers/TextFormatting');
 let IrcdDiffs = kiwi.require('helpers/IrcdDiffs');
+let toHtml = kiwi.require('libs/renderers/Html');
+let parseMessage = kiwi.require('libs/MessageParser');
 let AwayStatusIndicator = kiwi.require('components/AwayStatusIndicator');
 
 export default {
@@ -170,7 +173,6 @@ export default {
         availableChannelModes: function availableChannelModes() {
             let availableModes = [];
             let prefixes = this.network.ircClient.network.options.PREFIX;
-            // TODO: Double check these modes mean the correct things
             let knownPrefix = {
                 q: 'Owner',
                 a: 'Admin',
@@ -178,7 +180,7 @@ export default {
                 h: 'Half-Operator',
                 v: 'Voice',
             };
-            
+
             if (!IrcdDiffs.isAChannelModeAdmin(this.network)) {
                 delete knownPrefix.a;
             }
@@ -188,7 +190,7 @@ export default {
             if (!IrcdDiffs.supportsHalfOp(this.network)) {
                 delete knownPrefix.h;
             }
-            
+
             prefixes.forEach((prefix) => {
                 let mode = prefix.mode;
                 if (knownPrefix[mode]) {
@@ -208,6 +210,11 @@ export default {
 
             return this.buffer.isUserAnOp(this.buffer.getNetwork().nick);
         },
+        formattedRealname() {
+            let blocks = parseMessage(this.user.realname || '', { extras: false });
+            let content = toHtml(blocks, false);
+            return content;
+        },
         isUserOnBuffer: function isUserOnBuffer() {
             if (!this.buffer) {
                 return false;
@@ -259,11 +266,11 @@ export default {
             },
         },
         userChannels() {
-	            let channels = this.user.channels.trim().split(' ');
-	            for (let i = 0; i < channels.length; i++) {
-	                channels[i] = TextFormatting.linkifyChannels(channels[i]);
-	            }
-	            return channels.join(' ');
+	    let channels = this.user.channels.trim().split(' ');
+	    for (let i = 0; i < channels.length; i++) {
+		channels[i] = TextFormatting.linkifyChannels(channels[i]);
+	    }
+	    return channels.join(' ');
         },
         isSelf() {
             return this.user === this.network.currentUser();
@@ -314,7 +321,41 @@ export default {
             let reason = this.$state.setting('buffers.default_kick_reason');
             this.network.ircClient.raw('KICK', this.buffer.name, this.user.nick, reason);
         },
-        createBanMask: function banMask() {
+        createBanMask: function createBanMask() {
+            // try to ban via user account first
+            if (this.user.account) {
+                // if EXTBAN is supported use that
+                let extban = IrcdDiffs.extbanAccount(this.network);
+                if (extban) {
+                    return extban + ':' + this.user.account;
+                }
+
+                // if the account name is in the host ban the host
+                // Eg. user@network/user/accountname
+                if (this.user.host.toLowerCase().indexOf(this.user.account.toLowerCase()) > -1) {
+                    return '*!*@' + this.user.host;
+                }
+            }
+
+            // if an ip address is in the host and not the whole host ban the ip
+            // Eg. user@gateway/1.2.3.4
+            let ipTest = new RegExp('(' + ipRegex.v4().source + '|' + ipRegex.v6().source + ')');
+            if (ipTest.test(this.user.host)) {
+                let match = this.user.host.match(ipTest)[0];
+                if (match !== this.user.host) {
+                    return '*!*@*' + match + '*';
+                }
+            }
+
+            // if an 8 char hex is the username ban by username. Commonly used in gateways
+            // Eg. 59d4c432@a.clients.kiwiirc.com
+            let hexTest = /^([a-f0-9]{8})$/i;
+            if (hexTest.test(this.user.username)) {
+                let match = this.user.username.match(hexTest)[0];
+                return '*!' + match + '@*';
+            }
+
+            // fallback to default_ban_mask from config
             let mask = this.$state.setting('buffers.default_ban_mask');
             mask = mask.replace('%n', this.user.nick);
             mask = mask.replace('%i', this.user.username);