added popup to change nickname (must create lib.content-controller.change_username())

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(); }
+		});
 
 	}
 

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;
+		}
+	}
+
 }
 
 

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 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=''>Change nickname</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>
 

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>