Here is an updated 8th login dialog. Added toggle control for show password option. Tab and enter keys now work as expected. It also now uses encrypted password instead of storing it as a plain text.
I didn't find a way to change edit controls "password-char" property after it's created, so I am removing and adding child controls on the fly... I also wrote alternator word called next-state that gives a different state on every call. It works very nicely with toggle controls click event...
requires gui
{ guest: ` "2aab261fa05fbb817f5a2cba6511789632472561c04c82db1c4f7b0d7068f893" b:>hex ` } constant password
defer: auth
{
kind: "edit",
bounds: "edit1.left, lbl2.top, parent.width-20, top+24",
name: "edit2",
max-text: 32,
password-char: "*",
return-pressed: ' auth ,
text-changed: ( "lbl0" g:child "" g:text drop )
} g:new constant edit2-hide-passwd
{
kind: "edit",
bounds: "edit1.left, lbl2.top, parent.width-20, top+24",
name: "edit2",
max-text: 32,
password-char: "",
return-pressed: ' auth ,
text-changed: ( "lbl0" g:child "" g:text drop )
} g:new constant edit2-show-passwd
: alternator \ a -- a[0]
a:shift dup >r
a:push drop r> ;
[ ` edit2-show-passwd ` , ` edit2-hide-passwd ` ] ' alternator curry: next-state
: authenticate
"edit1" g:child g:text? password swap m:@ nip null? if
drop
"lbl0" g:child
"User not found!" g:text drop
else
swap
"edit2" g:child g:text? s:len 0 n:= if
drop false
else
"salty8thtears" 10000 cr:genkey rot b:=
then if
"Authenticated!" . cr
bye
else
"lbl0" g:child
"User and password don't match!" g:text drop
then
then ;
' authenticate w:is auth
{
kind: "win",
buttons: 5,
native-title-bar: false,
title: "Login",
wide: 520,
high: 220,
resizable: false,
center: true,
children:
[
{
kind: "box",
name: "frame",
bounds: "0, 0, parent.width, parent.height",
bg: "gray",
children:
[
{
kind: "image",
bounds: "parent.left+10, parent.top+10, left+128, top+128",
img: "8thlogo.png",
name: "logo"
},
{
kind: "label",
fg: "red",
font: 20,
label: "",
bounds: "logo.right+20, parent.top+10, parent.width-10, top+24 ",
justify: ["hcenter"],
name: "lbl0"
},
{
kind: "label",
label: "Username:",
bounds: "logo.right+20, lbl0.bottom+20, left+80, top+24 ",
name: "lbl1"
},
{
kind: "edit",
bounds: "lbl1.right+10, lbl1.top, parent.width-20, top+24",
name: "edit1",
max-text: 32,
return-pressed: ( "edit2" g:child g:focus drop ),
text-changed: ( "lbl0" g:child "" g:text drop )
},
{
kind: "label",
label: "Password:",
bounds: "lbl1.left, lbl1.bottom+10, left+80, top+24",
name: "lbl2"
},
{
kind: "edit",
bounds: "edit1.left, lbl2.top, parent.width-20, top+24",
name: "edit2",
max-text: 32,
password-char: "*",
return-pressed: ' authenticate ,
text-changed: ( "lbl0" g:child "" g:text drop )
},
{
kind: "toggle",
label: "Show password",
adjustwidth: true,
bounds: "edit1.left, lbl2.bottom+20, left+100, top+24",
name: "toggle",
click: ( "edit2" g:child g:text? >r "frame" g:child "edit2" g:-child next-state g:+child "edit2" g:child r> g:text drop )
},
{
kind: "btn",
label: "Login",
bg: "darkgray",
bounds: "lbl2.left, lbl2.bottom+60, edit1.right, top+30",
name: "button",
tooltip: "Login to account",
click: ' authenticate
}
]
}
]
} g:new var, gui
: app:main ;