[popup] added 'password.change' with API

This commit is contained in:
xdrm-brackets 2018-03-28 22:54:49 +02:00
parent 3be8516130
commit a494f2a45e
7 changed files with 73 additions and 5 deletions

View File

@ -22,7 +22,7 @@
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
@ -49,7 +49,7 @@
inkscape:window-maximized="1"
inkscape:current-layer="svg898" />
<path
style="fill:#e65835;stroke-width:1.125;fill-opacity:1"
style="fill:#737f8d;stroke-width:1.125;fill-opacity:1"
d="M 6.1875 2.25 C 4.2932137 2.25 2.25 4.2794175 2.25 6.2382812 C 2.25 8.1971449 4.2932138 10.125 6.1875 10.125 C 8.0817857 10.125 10.125 8.1971449 10.125 6.2382812 C 10.125 4.2794175 8.0817857 2.25 6.1875 2.25 z M 13.595703 7.1757812 L 12.800781 7.9707031 L 14.392578 9.5625 L 12.800781 11.154297 L 13.595703 11.949219 L 15.1875 10.357422 L 16.779297 11.949219 L 17.574219 11.154297 L 15.982422 9.5625 L 17.574219 7.9707031 L 16.779297 7.1757812 L 15.1875 8.7675781 L 13.595703 7.1757812 z M 6.1875 11.25 C 3.8989283 11.25 0 12.743836 0 15.101562 L 0 16.875 L 12.375 16.875 L 12.375 15.101562 C 12.375 12.743836 8.4760714 11.25 6.1875 11.25 z "
transform="scale(0.88888889)"
id="path969" />

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18">
<g fill="none" fill-rule="evenodd">
<path d="M0 0h18v18H0z"/>
<path fill="#737F8D" d="M9 9h5.25c-.3975 3.0825-2.46 5.835-5.25 6.69V9H3.75V4.725L9 2.3925V9zm0 0H3.75c.3975 3.0825 2.46 5.835 5.25 6.69V9h5.25V4.725L9 2.3925V9zM9 .75l-6.75 3v4.5c0 4.1625 2.88 8.0475 6.75 9 3.87-.9525 6.75-4.8375 6.75-9v-4.5L9 .75z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 402 B

View File

@ -26,7 +26,16 @@ export default class Authentication{
*
---------------------------------------------------------*/
// TOKEN
get token(){ return this.lsi.fetch('token'); }
get token(){
let tok = this.lsi.fetch('token');
// redirect if on 'auth' page
if( tok === null && gs.get.authed )
document.location = '';
return tok;
}
set token(_token){ return this.lsi.push('token', _token); }
// USER DATA

View File

@ -77,7 +77,7 @@ export default class ContentController{
change_username(username=null){
/* (1) Error: if invalid user_id */
if( typeof username !== 'string' || username.length < 3 )
if( typeof username !== 'string' || !/^[a-z0-9_-]{3,20}$/i.test(username) )
return false;
/* (2) Error: unknown user */
@ -85,7 +85,7 @@ export default class ContentController{
return false;
/* (3) Call api UPDATE */
api.call(`PUT /user/${this.uid}`, { username: username, password: null }, function(rs){
api.call(`PUT /user/${this.uid}`, { username: username }, function(rs){
// manage error
if( rs.error !== 0 )
@ -109,5 +109,29 @@ export default class ContentController{
}
/* (7) Change password
*
* @password<String> New password
*
---------------------------------------------------------*/
change_password(password=null){
/* (1) Error: if invalid user_id */
if( typeof password !== 'string' || !/^[^<>\/\\]{8,50}$/.test(password) )
return false;
/* (2) Error: unknown user */
if( this.uid == null )
return false;
/* (3) Call api UPDATE */
api.call(`PUT /user/${this.uid}`, { password: password }, () => {}, auth.token);
/* (4) Error */
return true;
}
}

View File

@ -66,6 +66,15 @@ export default class PopupController{
reset(){ },
submit(){ gs.get.channel.remove() && this.parent.hide(); }
});
/* (6) Change password */
this.register('password.change', {
data: {
password: '',
confirm: ''
},
reset(){ this.data.password = ''; this.data.confirm = ''; },
submit(){ this.data.password === this.data.confirm && gs.get.content.change_password(this.data.password) && this.parent.hide(); }
});
}

View File

@ -61,6 +61,7 @@
&[data-icon='remove']{ background-image: url('/asset/svg/minipopup.remove.svg'); }
&[data-icon='logout']{ background-image: url('/asset/svg/minipopup.logout.svg'); }
&[data-icon='leave']{ background-image: url('/asset/svg/minipopup.leave.svg'); }
&[data-icon='password']{ background-image: url('/asset/svg/minipopup.password.svg'); }
&:hover{ background-color: #f9f9f9; color: #737f8d; }
@ -104,6 +105,7 @@
<span class ='invalid-h' data-icon='remove' @click='gs.popup.show(`channel.remove`); minipop=false'>Remove 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 data-icon='password' @click='gs.popup.show(`password.change`); minipop=false'>Change password</span>
<span class='sb invalid-h' data-icon='leave' @click='gs.popup.show(`channel.leave`); minipop=false'>Leave channel</span>
<span class='sb invalid' data-icon='logout' @click='gs.auth.token=null; gs.refresh()'>Logout</span>
</div>

View File

@ -112,6 +112,24 @@
</span>
</div>
<!-- Pop-up PASSWORD CHANGE -->
<div class='popup' v-show='gs.popup.get(`password.change`).active'>
<span class='header'>Change password</span>
<span class='body form'>
<label for='password'>New password</label>
<input type='password' name='password' v-model='gs.popup.get(`password.change`).data.password'>
<label for='password'>Confirmation</label>
<input type='password' name='password' v-model='gs.popup.get(`password.change`).data.confirm'>
</span>
<span class='footer form'>
<button @click='gs.popup.hide()'>Cancel</button>
<button class='submit' @click='gs.popup.get(`password.change`).submit()'>Update</button>
</span>
</div>
</div>