From 5bad9bfc73cbade39605c1ae08992cf42e75af7a Mon Sep 17 00:00:00 2001
From: xdrm-brackets <doowap31@gmail.com>
Date: Wed, 28 Mar 2018 19:54:16 +0200
Subject: [PATCH] added popup to change nickname (must create
 lib.content-controller.change_username())

---
 webpack/lib/popup-controller.js |  8 ++++++++
 webpack/scss/pop-up.scss        | 16 ++++++++++++++++
 webpack/vue/auth/dialog.vue     |  8 ++++----
 webpack/vue/auth/wrapper.vue    | 17 +++++++++++++++++
 4 files changed, 45 insertions(+), 4 deletions(-)

diff --git a/webpack/lib/popup-controller.js b/webpack/lib/popup-controller.js
index 8ffd439..9141359 100644
--- a/webpack/lib/popup-controller.js
+++ b/webpack/lib/popup-controller.js
@@ -38,6 +38,14 @@ export default class PopupController{
 			reset(){ this.data.link = '', this.data.name = ''; },
 			submit(){ gs.get.channel.create(this.data.name, this.data.link) && this.parent.hide(); }
 		});
+		/* (3) Change nickname */
+		this.register('nickname.change', {
+			data: {
+				value: ''
+			},
+			reset(){ this.data.value = ''; },
+			submit(){ gs.get.content.change_username(this.data.value) && this.parent.hide(); }
+		});
 
 	}
 
diff --git a/webpack/scss/pop-up.scss b/webpack/scss/pop-up.scss
index 54d0f8d..6db3a61 100644
--- a/webpack/scss/pop-up.scss
+++ b/webpack/scss/pop-up.scss
@@ -90,6 +90,22 @@
 	align-items: stretch;
 	flex-wrap: nowrap;
 
+
+	a{
+		display: inline-block;
+		font-size: .8em;
+		color: #aaa;
+
+		cursor: pointer;
+
+		&:after{ content: none; }
+
+		&:hover{
+			text-decoration: underline;
+			color: #fff;
+		}
+	}
+
 }
 
 
diff --git a/webpack/vue/auth/dialog.vue b/webpack/vue/auth/dialog.vue
index ccf2c52..6e4a6a8 100644
--- a/webpack/vue/auth/dialog.vue
+++ b/webpack/vue/auth/dialog.vue
@@ -94,10 +94,10 @@
 		<div class='body'>
 
 			<div v-show='minipop' class='minipopup'>
-				<span class='special sa'                    @click=''>Invite people</span>
-				<span data-icon='create'                    @click='gs.popup.show(`channel.create`); minipop=false'>Create channel</span>
-				<span data-icon='category'                  @click='gs.popup.show(`room.create`); minipop=false'>Create room</span>
-				<span data-icon='edit'                      @click=''>Change nickname</span>
+				<span class='special sa'                    @click='gs.popup.show(`user.invite`);     minipop=false'>Invite people</span>
+				<span data-icon='create'                    @click='gs.popup.show(`channel.create`);  minipop=false'>Create channel</span>
+				<span data-icon='category'                  @click='gs.popup.show(`room.create`);     minipop=false'>Create room</span>
+				<span data-icon='edit'                      @click='gs.popup.show(`nickname.change`); minipop=false'>Change nickname</span>
 				<span class='sb invalid' data-icon='logout' @click='gs.auth.token=null; gs.refresh()'>Logout</span>
 			</div>
 
diff --git a/webpack/vue/auth/wrapper.vue b/webpack/vue/auth/wrapper.vue
index 91897db..54e5662 100644
--- a/webpack/vue/auth/wrapper.vue
+++ b/webpack/vue/auth/wrapper.vue
@@ -52,6 +52,23 @@
 			</span>
 		</div>
 
+		<!-- Pop-up NICKNAME CHANGE -->
+		<div class='popup' v-show='gs.popup.get(`nickname.change`).active'>
+			<span class='header'>Change nickname</span>
+
+			<span class='body form'>
+				<label for='nickname'>Nickname</label>
+				<input type='text' name='nickname' v-model='gs.popup.get(`nickname.change`).data.value' :placeholder='gs.auth.user.username'>
+
+				<a @click='gs.popup.get(`nickname.change`).reset()'>Reset Nickname</a>
+			</span>
+
+			<span class='footer form'>
+				<button @click='gs.popup.hide()'>Cancel</button>
+				<button class='submit' @click='gs.popup.get(`nickname.change`).submit()'>Save</button>
+			</span>
+		</div>
+
 	</div>