GUI Login

[John Spikowski]

This round of the language challenge series is to create a desktop GUI login dialog. Be as creative as you wish. To get things started here is a Python /wx example.

Python WX

Code: Python

1. import wx
2.  
3. ########################################################################
4. class LoginDialog(wx.Dialog):
5.     """
6.    Class to define login dialog
7.    """
8.  
9.     #----------------------------------------------------------------------
10.     def __init__(self):
11.         """Constructor"""
12.         wx.Dialog.__init__(self, None, title="Login")
13.         self.logged_in = False
14.  
15.         # user info
16.         user_sizer = wx.BoxSizer(wx.HORIZONTAL)
17.  
18.         user_lbl = wx.StaticText(self, label="Username:")
19.         user_sizer.Add(user_lbl, 0, wx.ALL|wx.CENTER, 5)
20.         self.user = wx.TextCtrl(self)
21.         user_sizer.Add(self.user, 0, wx.ALL, 5)
22.  
23.         # pass info
24.         p_sizer = wx.BoxSizer(wx.HORIZONTAL)
25.  
26.         p_lbl = wx.StaticText(self, label="Password:")
27.         p_sizer.Add(p_lbl, 0, wx.ALL|wx.CENTER, 5)
28.         self.password = wx.TextCtrl(self, style=wx.TE_PASSWORD|wx.TE_PROCESS_ENTER)
29.         self.password.Bind(wx.EVT_TEXT_ENTER, self.onLogin)
30.         p_sizer.Add(self.password, 0, wx.ALL, 5)
31.  
32.         main_sizer = wx.BoxSizer(wx.VERTICAL)
33.         main_sizer.Add(user_sizer, 0, wx.ALL, 5)
34.         main_sizer.Add(p_sizer, 0, wx.ALL, 5)
35.  
36.         btn = wx.Button(self, label="Login")
37.         btn.Bind(wx.EVT_BUTTON, self.onLogin)
38.         main_sizer.Add(btn, 0, wx.ALL|wx.CENTER, 5)
39.  
40.         self.SetSizer(main_sizer)
41.  
42.     #----------------------------------------------------------------------
43.     def onLogin(self, event):
44.         """
45.        Check credentials and login
46.        """
47.         stupid_password = "pa$$w0rd!"
48.         user_password = self.password.GetValue()
49.         if user_password == stupid_password:
50.             print ("You are now logged in!")
51.             self.logged_in = True
52.             self.Close()
53.         else:
54.             print ("Username or password is incorrect!")
55.  
56. ########################################################################
57. class MyPanel(wx.Panel):
58.     """"""
59.  
60.     #----------------------------------------------------------------------
61.     def __init__(self, parent):
62.         """Constructor"""
63.         wx.Panel.__init__(self, parent)
64.  
65.  
66. ########################################################################
67. class MainFrame(wx.Frame):
68.     """"""
69.  
70.     #----------------------------------------------------------------------
71.     def __init__(self):
72.         """Constructor"""
73.         wx.Frame.__init__(self, None, title="Main App")
74.         panel = MyPanel(self)
75.  
76.         # Ask user to login
77.         dlg = LoginDialog()
78.         dlg.ShowModal()
79.         authenticated = dlg.logged_in
80.         if not authenticated:
81.             self.Close()
82.  
83.         self.Show()
84.  
85. if __name__ == "__main__":
86.     app = wx.App(False)
87.     frame = MainFrame()
88.     app.MainLoop()
89.  

[AIR]

Code: C

1. /* logon.c
2.  *
3.  * version 1.0
4.  *
5.  * GUI Logon Screen Challenge Submission
6.  * C version, using GTK+-3.0
7.  * Written by Armando I. Rivera (AIR)
8.  *
9.  * Compile:  gcc logon.c $(pkg-config --libs --cflags gtk+-3.0) -o logon
10. */
11.  
12. #include <gtk/gtk.h>
13.  
14.  
15. void onClick( GtkWidget *widget, gpointer   data ) {
16.         gchar *stupid_password = "pa$$w0rd!";
17.         gchar *user_password;
18.         g_object_get(data,"text",&user_password,NULL);
19.  
20.         if (g_strcmp0 (stupid_password,user_password) == 0) {
21.                 g_print("Your are now logged in!\n");
22.                 gtk_main_quit();
23.         }else{
24.                 g_print("Username or Password is Incorrect!\n");
25.         }
26. }
27.  
28. int main (int argc, char **argv) {
29.         GtkWidget *mainWin, *lblUser, *lblPass, *txtUser, *txtPass;
30.         GtkWidget *hbox, *vbox, *btnLogin;
31.  
32.         gtk_init(&argc, &argv);
33.  
34.         hbox = gtk_box_new(GTK_ORIENTATION_HORIZONTAL,6);
35.         vbox = gtk_box_new(GTK_ORIENTATION_VERTICAL,6);
36.         mainWin = gtk_window_new(GTK_WINDOW_TOPLEVEL);
37.  
38.         g_object_set(mainWin,
39.                                 "title","Login",
40.                                 "default-width",400,
41.                                 "resizable",FALSE,
42.                                 "window-position",GTK_WIN_POS_CENTER,
43.                                 "child",vbox,
44.                                 NULL);
45.        
46.         g_object_set(vbox,"child",hbox,"margin",10,NULL);
47.        
48.         lblUser = gtk_label_new("Username:");
49.         lblPass = gtk_label_new("Password: ");
50.        
51.         txtUser = gtk_entry_new();
52.         txtPass = gtk_entry_new();
53.        
54.         g_object_set(txtUser,"expand",TRUE,"text",g_get_user_name(),NULL);
55.         g_object_set(txtPass,"expand",TRUE, "visibility", FALSE,NULL);
56.  
57.         g_object_set(hbox,"child",lblUser,"child",txtUser,"spacing", 6, NULL);
58.        
59.         hbox = gtk_box_new(GTK_ORIENTATION_HORIZONTAL,6);
60.         g_object_set(vbox,"child",hbox, NULL);
61.         g_object_set(hbox,"child",lblPass,"child",txtPass,"spacing", 6, NULL);
62.        
63.  
64.         btnLogin = gtk_button_new_with_label("Login");
65.         g_object_set(vbox,"child",btnLogin,NULL);
66.  
67.         g_signal_connect (mainWin, "destroy", G_CALLBACK (gtk_main_quit), NULL);
68.         g_signal_connect (btnLogin, "clicked", G_CALLBACK (onClick), txtPass);
69.        
70.         gtk_widget_show_all(mainWin);
71.         gtk_main();
72.         return 0;
73. }
74.  
75.  

AIR.

[John Spikowski]

8th (Jalih submission)

Code: Text

1. requires gui
2.  
3. var gui
4.  
5. { guest: "pa$$w0rd!" } constant passwords
6.  
7. : authenticate
8.   "edit1" g:child g:text? passwords swap m:@ nip null? if
9.     "User not found!" . cr
10.     2drop
11.   else
12.     swap
13.     "edit2" g:child g:text? nip s:= if
14.       "Authenticated!" . cr
15.       bye
16.     else
17.       "Username and password don't match!" . cr
18.     then
19.   then ;
20.  
21. {
22.   kind: "win",
23.   buttons: 5,
24.   title: "Login",
25.   wide: 360,
26.   high: 160,
27.   resizable: false,
28.   bg:"lightgray",
29.   center: true,
30.   init: ( gui ! ),
31.   children:
32.   [
33.     {
34.       kind: "box",
35.       name: "frame",
36.       bounds: "10, 10, parent.width-10, parent.height-10",
37.       bg: "gray",
38.       children:
39.       [
40.         {
41.           kind: "label",
42.           label: "Username:",
43.           bounds: "parent.left, parent.top+10, 80, top+24 ",
44.           name: "lbl1"
45.          },
46.         {
47.           kind: "edit",
48.           bounds: "lbl1.right+10, lbl1.top, parent.width-10, top+24",
49.           name: "edit1",
50.           max-text: 32
51.         },
52.         {
53.           kind: "label",
54.           label: "Password:",
55.           bounds: "lbl1.left, lbl1.bottom+10, 80, top+24 ",
56.           name: "lbl2"
57.          },
58.         {
59.           kind: "edit",
60.           bounds: "edit1.left, lbl2.top, parent.width-10, top+24",
61.           name: "edit2",
62.           max-text: 32,
63.           password-char: "*"
64.         },
65.         {
66.           kind: "btn",
67.           label: "Login",
68.           bg: "darkgray",
69.           bounds: "lbl2.left, lbl2.bottom+20, edit2.right, top+30",
70.           name: "button",
71.           tooltip: "Login to account",
72.           click: ' authenticate
73.         }
74.       ]
75.     }
76.   ]
77. } var, gui-desc
78.  
79. : app:main
80.   gui-desc @ g:new ;
81.  

[John Spikowski]

ScriptBasic

Code: Script BASIC

1. ' ScriptBasic / IUP - Login - JRS
2.  
3. IMPORT iup.bas
4.  
5. SUB login_clicked
6.   uid = Iup::GetAttribute(uidtxt,"VALUE")
7.   pwd = Iup::GetAttribute(pwdtxt,"VALUE")
8.   IF uid = "John" AND pwd = "Spikowski" THEN
9.     Iup::Hide(errlbl)
10.     Iup::Message("Login",  "Login Successful")
11.     Iup::ExitLoop = TRUE
12.   ELSE
13.     Iup::Show(errlbl)
14.     Iup::SetFocus(uidtxt)
15.   END IF
16. END SUB
17.  
18. SUB show_password
19.   showcb = Iup::GetAttribute(showpwd, "VALUE")
20.   IF showcb = "ON" THEN
21.     Iup::SetAttribute(pwdtxt, "PASSWORD", "NO")
22.   ELSE
23.     Iup::SetAttribute(pwdtxt, "PASSWORD", "YES")
24.   END IF
25. END SUB
26.  
27. SUB Win_exit
28.   Iup::ExitLoop = TRUE
29. END SUB
30.  
31. Iup::Open()
32. dlg = Iup::Create("dialog")
33. Iup::SetAttributes(dlg, "TITLE=\"Login\", SIZE=200x200")
34.  
35. vb = Iup::Create("vbox")
36. hb1 = Iup::Create("hbox")
37. piclbl = Iup::Create("label")
38. Iup::SetAttribute(piclbl, "IMAGE", "./login.png")
39. Iup::SetAttribute(piclbl, "EXPAND", "HORIZONTAL")
40. Iup::SetAttribute(piclbl, "ALIGNMENT", "ACENTER:ATOP")
41. Iup::Append(hb1, piclbl)
42. Iup::Append(vb, hb1)
43.  
44. hb2 = Iup::Create("hbox")
45. errlbl = Iup::Create("label")
46. Iup::SetAttribute(errlbl, "TITLE", "User ID / Password Incorrect")
47. Iup::SetAttribute(errlbl, "FGCOLOR", "#ff0000")
48. Iup::SetAttribute(errlbl, "EXPAND", "HORIZONTAL")
49. Iup::SetAttribute(errlbl, "ALIGNMENT", "ACENTER")
50. Iup::Hide(errlbl)
51. Iup::Append(hb2, errlbl)
52. Iup::Append(vb, hb2)
53.  
54. hb3 = Iup::Create("hbox")
55. Iup::SetAttribute(hb3, "MARGIN", "20x10")
56. Iup::SetAttribute(hb3, "GAP", "5")
57. vb1 = Iup::Create("vbox")
58. Iup::SetAttribute(vb1, "GAP", "15")
59. uidlbl = Iup::Create("label")
60. Iup::SetAttribute(uidlbl, "TITLE", "User ID")
61. Iup::Append(vb1, uidlbl)
62. pwdlbl = Iup::Create("label")
63. Iup::SetAttribute(pwdlbl, "TITLE", "Password")
64. Iup::Append(vb1, pwdlbl)
65. Iup::Append(hb3, vb1)
66. vb2 = Iup::Create("vbox")
67. uidtxt = Iup::Create("text")
68. Iup::SetAttribute(uidtxt, "SIZE", "85x")
69. Iup::Append(vb2, uidtxt)
70. pwdtxt = Iup::Create("text")
71. Iup::SetAttribute(pwdtxt, "PASSWORD", "YES")
72. Iup::SetAttribute(pwdtxt, "SIZE", "85x")
73. Iup::Append(vb2, pwdtxt)
74. Iup::Append(hb3, vb2)
75. Iup::Append(vb, hb3)
76.  
77. hb4 = Iup::Create("hbox")
78. Iup::SetAttribute(hb4, "MARGIN", "35x")
79. showpwd = Iup::Create("toggle")
80. Iup::SetAttribute(showpwd, "TITLE", "Show Password?")
81. Iup::Append(hb4, showpwd)
82. Iup::Append(vb, hb4)
83.  
84. hb5 = Iup::Create("hbox")
85. Iup::SetAttribute(hb5, "MARGIN", "40x10")
86. loginbut = Iup::Create("button")
87. Iup::SetAttribute(loginbut, "TITLE", "Login")
88. Iup::SetAttribute(loginbut, "EXPAND", "HORIZONTAL")
89. iup::Append(hb5, loginbut)
90. iup::Append(vb, hb5)
91.  
92. iup::Append(dlg, vb)
93.  
94. Iup::SetCallback(dlg,"CLOSE_CB",ADDRESS(Win_exit()))
95. Iup::SetCallback(loginbut, "ACTION", ADDRESS(login_clicked()))
96. Iup::SetCallback(showpwd, "ACTION", ADDRESS(show_password()))
97.  
98. Iup::Show(dlg)
99. Iup::MainLoop()
100. Iup::Close()
101.  

[John Spikowski]

C Update (AIR submission)

Code: C

1. * logon2.c
2.  *
3.  * version 1.1
4.  *
5.  * GUI Logon Screen Challenge Submission
6.  * C version, using GTK+-3.0
7.  *
8.  * Written by Armando I. Rivera (AIR)
9.  *
10.  * Compile:  gcc logon2.c $(pkg-config --libs --cflags gtk+-3.0) -o logon2
11. */
12.  
13.  
14. #include <gtk/gtk.h>
15.  
16. GtkWidget *err_label;
17.  
18. void onClick( GtkWidget *widget, gpointer   data ) {
19.     gchar *stupid_password = "pa$$w0rd!";
20.     gchar *user_password;
21.     g_object_get(data,"text",&user_password,NULL);
22.  
23.     if (g_strcmp0 (stupid_password,user_password) == 0) {
24.         g_print("Your are now logged in!\n");
25.         gtk_main_quit();
26.     }else{
27.         gtk_label_set_markup(GTK_LABEL(err_label), "<span color=\"red\" font_desc=\"16.0\">** Invalid Password **</span>");
28.         g_print("Username or Password is Incorrect!\n");
29.  
30.     }
31. }
32.  
33. int main( int argc, char *argv[])
34. {
35.     GtkWidget *window, *layout, *image, *btnLogin;
36.     GtkWidget *lblUser, *lblPass, *txtUser, *txtPass;
37.  
38.     gtk_init(&argc, &argv);
39.    
40.     layout = gtk_layout_new(NULL, NULL);
41.  
42.     window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
43.     g_object_set(window,
44.                 "title","Login",
45.                 "default-width",660,
46.                 "default-height",370,
47.                 "resizable",FALSE,
48.                 "window-position",GTK_WIN_POS_CENTER,
49.                 "child",layout,
50.                 "decorated",0,
51.                 NULL);
52.  
53.  
54.     image = gtk_image_new_from_file("logon.png");
55.     g_object_set(layout,"child",image,"margin",10,NULL);
56.    
57.     lblUser = gtk_label_new("");
58.     lblPass = gtk_label_new("");
59.     err_label = gtk_label_new("");
60.     g_object_set(err_label,"width-request",270,NULL);
61.    
62.     gtk_label_set_markup(GTK_LABEL(lblUser), "<span font_desc=\"16.0\">Username:</span>");
63.     gtk_label_set_markup(GTK_LABEL(lblPass), "<span font_desc=\"16.0\">Password:</span>");
64.    
65.     txtUser = gtk_entry_new();
66.     txtPass = gtk_entry_new();
67.    
68.    
69.     g_object_set(txtPass,"visibility", FALSE,NULL);
70.    
71.     btnLogin = gtk_button_new_with_label("Login");
72.     g_object_set(btnLogin,"width-request",170,NULL);
73.  
74.  
75.     gtk_layout_put(GTK_LAYOUT(layout), lblUser, 330, 112);
76.     gtk_layout_put(GTK_LAYOUT(layout), lblPass, 330, 162);
77.     gtk_layout_put(GTK_LAYOUT(layout), txtUser, 460, 110);
78.     gtk_layout_put(GTK_LAYOUT(layout), txtPass, 460, 160);
79.     gtk_layout_put(GTK_LAYOUT(layout), btnLogin, 460, 210);
80.     gtk_layout_put(GTK_LAYOUT(layout), err_label, 300, 16);
81.  
82.     g_signal_connect (window, "destroy", G_CALLBACK (gtk_main_quit), NULL);
83.     g_signal_connect (btnLogin, "clicked", G_CALLBACK (onClick), txtPass);
84.  
85.     gtk_widget_show_all(window);
86.  
87.     gtk_main();
88.  
89.     return 0;
90. }
91.  

[John Spikowski]

8th Update (Jalih submission)

Code: Text

1. requires gui
2.  
3. var gui
4.  
5. { guest: "pa$$w0rd!" } constant passwords
6.  
7. : authenticate
8.   "edit1" g:child g:text? passwords swap m:@ nip null? if
9.     drop
10.     "lbl0" g:child
11.     "User not found!" g:text drop
12.   else
13.     swap
14.     "edit2" g:child g:text? rot s:= if
15.      "Authenticated!" . cr
16.      bye
17.     else
18.       "lbl0" g:child
19.       "Username and password don't match!" g:text drop
20.     then
21.   then ;
22.  
23. {
24.   kind: "win",
25.   buttons: 0,
26.   native-title-bar: false,
27.   title: "Login",
28.   wide: 520,
29.   high: 200,
30.   resizable: false,
31.   center: true,
32.   init: ( gui ! ),
33.   children:
34.   [
35.     {
36.       kind: "box",
37.       name: "frame",
38.       bounds: "0, 0, parent.width, parent.height",
39.       bg: "gray",
40.       children:
41.       [
42.         {
43.           kind: "image",
44.           bounds: "parent.left+10, parent.top+10, left+128, top+128",
45.           img: "8thlogo.png",
46.           name: "logo"    
47.         },
48.         {
49.           kind: "label",
50.           fg: "blue",
51.           font: 20,
52.           label: "",
53.           bounds: "logo.right+20, parent.top+10, parent.width-10, top+24 ",
54.           justify: ["hcenter"],
55.           name: "lbl0"
56.         },
57.         {
58.           kind: "label",
59.           label: "Username:",
60.           bounds: "logo.right+20, lbl0.bottom+20, left+80, top+24 ",
61.           name: "lbl1"
62.         },
63.         {
64.           kind: "edit",
65.           bounds: "lbl1.right+10, lbl1.top, parent.width-20, top+24",
66.           name: "edit1",
67.           max-text: 32
68.         },
69.         {
70.           kind: "label",
71.           label: "Password:",
72.           bounds: "lbl1.left, lbl1.bottom+10, left+80, top+24",
73.           name: "lbl2"
74.         },
75.         {
76.           kind: "edit",
77.           bounds: "edit1.left, lbl2.top, parent.width-20, top+24",
78.           name: "edit2",
79.           max-text: 32,
80.           password-char: "*"
81.         },
82.         {
83.           kind: "btn",
84.           label: "Login",
85.           bg: "darkgray",
86.           bounds: "lbl2.left, lbl2.bottom+20, edit2.right, top+30",
87.           name: "button",
88.           tooltip: "Login to account",
89.           click: ' authenticate
90.         }
91.       ]
92.     }
93.   ]
94. } var, gui-desc
95.  
96. : app:main
97.   gui-desc @ g:new ;
98.  

[John Spikowski]

ScriptBasic Update

Change Log

• Fixed hide/show password
• Skip Show Password? checkbox in ZORDER
• Removed dialog max / min titlebar buttons
• ENTER key clicks the Login button
  
• Optimize and tidy code.

Code: Script BASIC

1. ' ScriptBasic / IUP - Login - JRS
2.  
3. IMPORT iup.bas
4.  
5. SUB login_clicked
6.   uid = Iup::GetAttribute(uidtxt,"VALUE")
7.   IF Iup::GetAttribute(showpwd, "VALUE") = "OFF" THEN
8.     pwd = Iup::GetAttribute(pwdtxt1,"VALUE")
9.   ELSE
10.     pwd = Iup::GetAttribute(pwdtxt2,"VALUE")
11.   END IF
12.   IF uid = "John" AND pwd = "Spikowski" THEN
13.     Iup::Hide errlbl
14.     Iup::Message "Login",  "Login Successful"
15.     Iup::ExitLoop = TRUE
16.   ELSE
17.     Iup::Show errlbl
18.     Iup::SetFocus uidtxt
19.   END IF
20. END SUB
21.  
22. SUB show_password
23.   IF Iup::GetAttribute(showpwd, "VALUE") = "OFF" THEN
24.     pwd2 = Iup::GetAttribute(pwdtxt2,"VALUE")
25.     Iup::SetAttribute pwdtxt1, "VALUE", pwd2
26.     Iup::SetAttribute zbtxt, "VALUE", "pwdtxt1"
27.   ELSE
28.     pwd1 = Iup::GetAttribute(pwdtxt1,"VALUE")
29.     Iup::SetAttribute pwdtxt2, "VALUE", pwd1
30.     Iup::SetAttribute zbtxt, "VALUE", "pwdtxt2"
31.   END IF
32. END SUB
33.  
34. SUB Win_exit
35.   Iup::ExitLoop = TRUE
36. END SUB
37.  
38. ' *** DIALOG ***
39. Iup::Open
40. dlg = Iup::Create("dialog")
41. Iup::SetAttributes dlg, _
42.   "TITLE=\"Login\", " & _
43.   "SIZE=200x200, " & _
44.   "MAXBOX=NO, " & _
45.   "MINBOX=NO, " & _
46.   "RESIZE=NO, " & _
47.   "DEFAULTENTER=\"loginbut\""
48.  
49. ' *** CONTAINER ***
50. vb = Iup::Create("vbox")
51.  
52. ' *** IMAGE ***
53. hb1 = Iup::Create("hbox")
54. piclbl = Iup::Create("label")
55. Iup::SetAttributes piclbl, _
56.   "IMAGE=\"./login.png\", " & _
57.   "EXPAND=HORIZONTAL, " & _
58.   "ALIGNMENT=ACENTER:ATOP"
59. Iup::Append hb1, piclbl
60. Iup::Append vb, hb1
61.  
62. ' *** ERROR ***
63. hb2 = Iup::Create("hbox")
64. errlbl = Iup::Create("label")
65. Iup::SetAttributes errlbl, _
66.   "TITLE=\"User ID / Password Incorrect\", " & _
67.   "FGCOLOR=\"#ff0000\", " & _
68.   "EXPAND=HORIZONTAL, " & _
69.   "ALIGNMENT=ACENTER"
70. Iup::Hide errlbl
71. Iup::Append hb2, errlbl
72. Iup::Append vb, hb2
73.  
74. ' *** ENTRY ***
75. hb3 = Iup::Create("hbox")
76. Iup::SetAttributes hb3, _
77.   "MARGIN=20x10, " & _
78.   "GAP=5"
79. vb1 = Iup::Create("vbox")
80. Iup::SetAttribute vb1, "GAP", "15"
81. uidlbl = Iup::Create("label")
82. Iup::SetAttribute uidlbl, "TITLE", "User ID"
83. Iup::Append vb1, uidlbl
84. pwdlbl = Iup::Create("label")
85. Iup::SetAttribute pwdlbl, "TITLE", "Password"
86. Iup::Append vb1, pwdlbl
87. Iup::Append hb3, vb1
88. vb2 = Iup::Create("vbox")
89. uidtxt = Iup::Create("text")
90. Iup::SetAttribute uidtxt, "SIZE", "85x"
91. Iup::Append vb2, uidtxt
92. pwdtxt1 = Iup::Create("text")
93. Iup::SetAttributes pwdtxt1, _
94.   "PASSWORD=YES, " & _
95.   "SIZE=85x"
96. pwdtxt2 = Iup::Create("text")
97. Iup::SetAttribute pwdtxt2, "SIZE", "85x"
98. Iup::SetHandle "pwdtxt1", pwdtxt1
99. Iup::SetHandle "pwdtxt2", pwdtxt2
100. zbtxt = Iup::Zbox(pwdtxt1, pwdtxt2)
101. Iup::SetHandle "zbtxt", zbtxt
102. Iup::Append vb2, zbtxt
103. Iup::Append hb3, vb2
104. Iup::Append vb, hb3
105.  
106. ' *** SHOW/HIDE ***
107. hb4 = Iup::Create("hbox")
108. Iup::SetAttribute hb4, "MARGIN", "35x"
109. showpwd = Iup::Create("toggle")
110. Iup::SetAttributes showpwd, _
111.   "TITLE=\"Show Password?\", " & _
112.   "CANFOCUS=NO"
113. Iup::Append hb4, showpwd
114. Iup::Append vb, hb4
115.  
116. ' *** LOGIN ***
117. hb5 = Iup::Create("hbox")
118. Iup::SetAttribute hb5, "MARGIN", "40x10"
119. loginbut = Iup::Create("button")
120. Iup::SetAttributes loginbut, _
121.   "TITLE=\"Login\", " & _
122.   "EXPAND=HORIZONTAL"
123. Iup::SetHandle "loginbut", loginbut
124. iup::Append hb5, loginbut
125. iup::Append vb, hb5
126.  
127. ' *** ATTACH CONTAINER ***
128. iup::Append  dlg, vb
129.  
130. ' *** CALLBACKS ***
131. Iup::SetCallback dlg,"CLOSE_CB",ADDRESS(Win_exit())
132. Iup::SetCallback loginbut, "ACTION", ADDRESS(login_clicked())
133. Iup::SetCallback showpwd, "ACTION", ADDRESS(show_password())
134.  
135. ' *** PROCESS ***
136. Iup::Show dlg
137. Iup::MainLoop
138. Iup::Close
139.  

[John Spikowski]

Nim / IUP Update

Change Log

• Used state of toggle from callback rather than using GetAttriute to obtain it.
  
• Defaulted the ENTER key to click the  Login button.
  

Note: I've attached the login.png  used in the login program if someone would like to try the script on  their system.

Code: Text

1. # Nim 1.0.4 / IUP 3.28 - Login - JRS
2.  
3. import niup
4. import niupext
5.  
6. var uidtxt,showpwd,pwdtxt1,pwdtxt2,errlbl,zbtxt:PIhandle
7.  
8. proc login_clicked(ih:PIhandle):cint {.cdecl.}=
9.   var uid,pswd:cstring
10.   uid = GetAttribute(uidtxt,"VALUE")
11.   if GetAttribute(showpwd, "VALUE") == "OFF":
12.     pswd = GetAttribute(pwdtxt1,"VALUE")
13.   else:
14.     pswd = GetAttribute(pwdtxt2,"VALUE")
15.  
16.   if uid == "John" and pswd == "Spikowski":
17.     Hide(errlbl)
18.     Message("Login",  "Login Successful")
19.     return IUP_CLOSE
20.   else:
21.     Show(errlbl)
22.     SetFocus(uidtxt)
23.     return IUP_DEFAULT
24.  
25. proc show_password(ih:PIhandle; state: bool):cint {.cdecl.}=
26.   var pwd1,pwd2:cstring
27.   if state:  
28.     pwd1 = GetAttribute(pwdtxt1,"VALUE")
29.     SetAttribute(pwdtxt2, "VALUE", pwd1)
30.     SetAttribute(zbtxt, "VALUE", "pwdtxt2")
31.   else:
32.     pwd2 = GetAttribute(pwdtxt2,"VALUE")
33.     SetAttribute(pwdtxt1, "VALUE", pwd2)
34.     SetAttribute(zbtxt, "VALUE", "pwdtxt1")
35.     return IUP_DEFAULT
36.  
37. # *** MAIN ***
38.  
39. Open()
40.  
41. # *** DIALOG ***
42. var dlg = Create("dialog")
43. SetAttributes(dlg,
44.   "TITLE=\"Login\", " &
45.   "SIZE=200x200, " &
46.   "MAXBOX=NO, " &
47.   "MINBOX=NO, " &
48.   "RESIZE=NO, " &
49.   "DEFAULTENTER=\"loginbut\"")
50.  
51. # *** CONTAINER ***
52. var vb = Create("vbox")
53.  
54. # *** IMAGE ***
55. var hb1 = Create("hbox")
56. var piclbl = Create("label")
57. SetAttributes(piclbl,  
58.   "IMAGE=\"login.png\", " &
59.   "EXPAND=HORIZONTAL, " &
60.   "ALIGNMENT=ACENTER:ATOP")
61. discard Append(hb1, piclbl)
62. discard Append(vb, hb1)
63.  
64. # *** ERROR ***
65. var hb2 = Create("hbox")
66. errlbl = Create("label")
67. SetAttributes(errlbl,
68.   "TITLE=\"User ID / Password Incorrect\", " &
69.   "FGCOLOR=\"#ff0000\", " &
70.   "EXPAND=HORIZONTAL, " &
71.   "ALIGNMENT=ACENTER")
72. Hide(errlbl)
73. discard Append(hb2, errlbl)
74. discard Append(vb, hb2)
75.  
76. # *** ENTRY ***
77. var hb3 = Create("hbox")
78. SetAttributes(hb3,
79.   "MARGIN=20x10, " &
80.   "GAP=5")
81. var vb1 = Create("vbox")
82. SetAttribute(vb1, "GAP", "15")
83. var uidlbl = Create("label")
84. SetAttribute(uidlbl, "TITLE", "User ID")
85. discard Append(vb1, uidlbl)
86. var pwdlbl = Create("label")
87. SetAttribute(pwdlbl, "TITLE", "Password")
88. discard Append(vb1, pwdlbl)
89. discard Append(hb3, vb1)
90. var vb2 = Create("vbox")
91. uidtxt = Create("text")
92. SetAttribute(uidtxt, "SIZE", "85x")
93. discard Append(vb2, uidtxt)
94. pwdtxt1 = Create("text")
95. SetAttributes(pwdtxt1,
96.   "PASSWORD=YES, " &
97.   "SIZE=85x")
98. pwdtxt2 = Create("text")
99. SetAttribute(pwdtxt2, "SIZE", "85x")
100. SetHandle("pwdtxt1", pwdtxt1)
101. SetHandle("pwdtxt2", pwdtxt2)
102. zbtxt = Zbox(pwdtxt1, pwdtxt2, nil)
103. SetHandle("zbtxt", zbtxt)
104. discard Append(vb2, zbtxt)
105. discard Append(hb3, vb2)
106. discard Append(vb, hb3)
107.  
108. # *** SHOW/HIDE ***
109. var hb4 = Create("hbox")
110. SetAttribute(hb4, "MARGIN", "35x")
111. showpwd = Create("toggle")
112. SetAttributes(showpwd,
113.   "TITLE=\"Show Password?\", " &
114.   "CANFOCUS=NO")
115. discard Append(hb4, showpwd)
116. discard Append(vb, hb4)
117.  
118. # *** LOGIN ***
119. var hb5 = Create("hbox")
120. SetAttribute(hb5, "MARGIN", "40x10")
121. var loginbut = Create("button")
122. SetAttributes(loginbut,
123.   "TITLE=\"Login\", " &
124.   "EXPAND=HORIZONTAL")
125. SetHandle("loginbut", loginbut)
126. discard Append(hb5, loginbut)
127. discard Append(vb, hb5)
128.  
129. # *** ATTACH CONTAINER ***
130. discard Append(dlg, vb)
131.  
132. # *** CALLBACKS ***
133. SetCallback(loginbut, "ACTION", login_clicked)
134. SetCallback(showpwd, "ACTION", show_password)
135.  
136. # *** PROCESS ***
137. Show(dlg)
138. MainLoop()
139. Close()
140.  

The screen shots for Nim are identical to  the ones  posted for ScriptBasic.

[John Spikowski]

This is how IUP sees its layout via the IupLayoutDialog() function.

[John Spikowski]

You can create your dialog layout using the IupLayoutDialog() function in realtime. I use it to experiment with attributes (properties) without having to change/create any code. The function also will generate the code for your layout in C, Lua or LED.

[John Spikowski]

I wanted to try Nim / IUP on Windows 10 and I was able to get the login.nim to compile. I seem to be having a problem getting the image to load.

[John Spikowski]

I had a little better luck with ScriptBasic and IUP. I still can't get the image to  show even by making a .bmp file of it. The IUP I'm running is pretty old so I'm  going to update to 3.28 and see if that helps.

[John Spikowski]

It turns out my .bmp image needed to be 24 bit color depth. The conversion from .png to .bmp didn't maintain the transparency of the background.

I also learned how to create Windows executables rather than default console apps.

nim --app:gui c login.nim

I'm going to start a thread on AllBASIC for the Windows / Nim / IUP direction. Maybe Mike will show some interest.

[John Spikowski]

ScriptBasic Update

This version adds Jalih's suggestion of maintaining a database of UserID and Password (encrypted) as an extension to the base challenge.

Change Log

• Added check for duplicate UserID's. 12/31
• Fixed MD5 hex string to be a constant 32 bytes. 12/31
• Reset error message to login error after a duplicate user add. 1/1

Code: Script BASIC

1. ' ScriptBasic / IUP - Login - JRS
2.  
3. IMPORT iup.bas
4. IMPORT sqlite.bas
5. DECLARE SUB MD5 ALIAS "md5fun" LIB "t"
6.  
7. initdb = FILELEN("user.db")
8. usrdb = sqlite::open("user.db")
9. IF initdb = 0 THEN
10.   sqlite::execute(usrdb,"CREATE TABLE user (" & _
11.     "UserID VARCHAR NOT NULL, " & _
12.     "Password VARCHAR NOT NULL, " & _
13.     "CONSTRAINT user_pk PRIMARY KEY (UserID));")
14. END IF
15.  
16. SUB login_clicked
17.   uid = Iup::GetAttribute(uidtxt,"VALUE")
18.   IF Iup::GetAttribute(showpwd, "VALUE") = "OFF" THEN
19.     pwd = Iup::GetAttribute(pwdtxt1,"VALUE")
20.   ELSE
21.     pwd = Iup::GetAttribute(pwdtxt2,"VALUE")
22.   END IF
23.   ' *** NEW USER ***
24.  IF newusr_cb = "ON" THEN
25.     IF uid <> "" AND pwd <> "" THEN
26.       rtnmsg = sqlite::execute(usrdb,"INSERT INTO user VALUES ('" & uid & "', '" & MD5STR(pwd) & "');")
27.       IF rtnmsg = 19 THEN
28.         Iup::SetAttribute errlbl, "TITLE", "Duplicate User ID"
29.         Iup::Show errlbl
30.         Iup::SetFocus uidtxt
31.         EXIT SUB
32.       END IF
33.       Iup::Message "Login",  "User Added"
34.       GOSUB Init_Form
35.       EXIT SUB
36.     ELSE
37.       Iup::Show errlbl
38.       Iup::SetFocus uidtxt
39.       EXIT SUB
40.     END IF
41.   END IF
42.   ' *** LOGIN VERIFY ***
43.  Iup::SetAttribute errlbl, "TITLE", "User ID / Password Incorrect"
44.   stmt = sqlite::query(usrdb,"SELECT Password FROM user WHERE UserID = '" & uid & "';")
45.   IF sqlite::row(stmt) = sqlite::SQLITE3_ROW THEN
46.     sqlite::fetchhash(stmt, col)
47.     IF col{"Password"} = MD5STR(pwd) THEN
48.       Iup::Hide errlbl
49.       Iup::Message "Login",  "Login Successful"
50.       GOSUB Init_Form
51.       EXIT SUB
52.     END IF
53.   END IF
54.   Iup::Show errlbl
55.   Iup::SetFocus uidtxt
56.   EXIT SUB
57.   Init_Form:
58.     Iup::Hide errlbl
59.     Iup::SetAttribute uidtxt, "VALUE", ""
60.     Iup::SetAttribute pwdtxt1, "VALUE", ""
61.     Iup::SetAttribute pwdtxt2, "VALUE", ""
62.     Iup::SetAttribute showpwd, "VALUE", "OFF"
63.     Iup::SetAttribute newusr, "VALUE", "OFF"
64.     Iup::SetAttribute zbtxt, "VALUE", "pwdtxt1"
65.     Iup::SetAttribute loginbut, "TITLE", "Login"
66.     newusr_cb = "OFF"
67.     Iup::SetFocus uidtxt
68.   RETURN
69. END SUB
70.  
71. FUNCTION MD5STR(txtstr)
72.   LOCAL tmpstr, hexstr, x
73.   tmpstr = MD5(txtstr)
74.   FOR x = 1 TO 16
75.     hexstr &= RIGHT("0" & HEX(ASC(MID(tmpstr, x, 1))), 2)
76.   NEXT
77.   MD5STR = hexstr
78. END FUNCTION
79.  
80. SUB show_password
81.   IF Iup::GetAttribute(showpwd, "VALUE") = "OFF" THEN
82.     pwd2 = Iup::GetAttribute(pwdtxt2,"VALUE")
83.     Iup::SetAttribute pwdtxt1, "VALUE", pwd2
84.     Iup::SetAttribute zbtxt, "VALUE", "pwdtxt1"
85.   ELSE
86.     pwd1 = Iup::GetAttribute(pwdtxt1,"VALUE")
87.     Iup::SetAttribute pwdtxt2, "VALUE", pwd1
88.     Iup::SetAttribute zbtxt, "VALUE", "pwdtxt2"
89.   END IF
90. END SUB
91.  
92. SUB new_user
93.   newusr_cb =Iup::GetAttribute(newusr, "VALUE")
94.   IF newusr_cb = "ON" THEN
95.     Iup::SetAttribute loginbut, "TITLE", "Add User"
96.   ELSE
97.     Iup::SetAttribute loginbut, "TITLE", "Login"
98.   END IF
99. END SUB  
100.  
101. SUB Win_exit
102.   Iup::ExitLoop = TRUE
103. END SUB
104.  
105. ' *** DIALOG ***
106. Iup::Open
107. dlg = Iup::Create("dialog")
108. Iup::SetAttributes dlg, _
109.   "TITLE=\"Login\", " & _
110.   "SIZE=200x200, " & _
111.   "MAXBOX=NO, " & _
112.   "MINBOX=NO, " & _
113.   "RESIZE=NO, " & _
114.   "DEFAULTENTER=\"loginbut\""
115.  
116. ' *** CONTAINER ***
117. vb = Iup::Create("vbox")
118.  
119. ' *** IMAGE ***
120. hb1 = Iup::Create("hbox")
121. piclbl = Iup::Create("label")
122. Iup::SetAttributes piclbl, _
123.   "IMAGE=\"./login.png\", " & _
124.   "EXPAND=HORIZONTAL, " & _
125.   "ALIGNMENT=ACENTER:ATOP"
126. Iup::Append hb1, piclbl
127. Iup::Append vb, hb1
128.  
129. ' *** ERROR ***
130. hb2 = Iup::Create("hbox")
131. errlbl = Iup::Create("label")
132. Iup::SetAttributes errlbl, _
133.   "TITLE=\"User ID / Password Incorrect\", " & _
134.   "FGCOLOR=\"#ff0000\", " & _
135.   "EXPAND=HORIZONTAL, " & _
136.   "ALIGNMENT=ACENTER"
137. Iup::Hide errlbl
138. Iup::Append hb2, errlbl
139. Iup::Append vb, hb2
140.  
141. ' *** ENTRY ***
142. hb3 = Iup::Create("hbox")
143. Iup::SetAttributes hb3, _
144.   "MARGIN=20x10, " & _
145.   "GAP=5"
146. vb1 = Iup::Create("vbox")
147. Iup::SetAttribute vb1, "GAP", "15"
148. uidlbl = Iup::Create("label")
149. Iup::SetAttribute uidlbl, "TITLE", "User ID"
150. Iup::Append vb1, uidlbl
151. pwdlbl = Iup::Create("label")
152. Iup::SetAttribute pwdlbl, "TITLE", "Password"
153. Iup::Append vb1, pwdlbl
154. Iup::Append hb3, vb1
155. vb2 = Iup::Create("vbox")
156. uidtxt = Iup::Create("text")
157. Iup::SetAttribute uidtxt, "SIZE", "85x"
158. Iup::Append vb2, uidtxt
159. pwdtxt1 = Iup::Create("text")
160. Iup::SetAttributes pwdtxt1, _
161.   "PASSWORD=YES, " & _
162.   "SIZE=85x"
163. pwdtxt2 = Iup::Create("text")
164. Iup::SetAttribute pwdtxt2, "SIZE", "85x"
165. Iup::SetHandle "pwdtxt1", pwdtxt1
166. Iup::SetHandle "pwdtxt2", pwdtxt2
167. zbtxt = Iup::Zbox(pwdtxt1, pwdtxt2)
168. Iup::SetHandle "zbtxt", zbtxt
169. Iup::Append vb2, zbtxt
170. Iup::Append hb3, vb2
171. Iup::Append vb, hb3
172.  
173. ' *** SHOW/HIDE ***
174. hb4 = Iup::Create("hbox")
175. Iup::SetAttributes hb4, _
176.  "MARGIN=35x, " & _
177.  "GAP=40"
178. showpwd = Iup::Create("toggle")
179. Iup::SetAttributes showpwd, _
180.   "TITLE=\"Show Password\", " & _
181.   "CANFOCUS=NO"
182. newusr = Iup::Create("toggle")
183. Iup::SetAttributes newusr, _
184.   "TITLE=\"New User\", " & _
185.   "CANFOCUS=NO"
186. Iup::Append hb4, showpwd
187. Iup::Append hb4, newusr
188. Iup::Append vb, hb4
189.  
190. ' *** LOGIN ***
191. hb5 = Iup::Create("hbox")
192. Iup::SetAttribute hb5, "MARGIN", "40x10"
193. loginbut = Iup::Create("button")
194. Iup::SetAttributes loginbut, _
195.   "TITLE=\"Login\", " & _
196.   "EXPAND=HORIZONTAL"
197. Iup::SetHandle "loginbut", loginbut
198. iup::Append hb5, loginbut
199. iup::Append vb, hb5
200.  
201. ' *** ATTACH CONTAINER ***
202. iup::Append  dlg, vb
203.  
204. ' *** CALLBACKS ***
205. Iup::SetCallback dlg,"CLOSE_CB",ADDRESS(Win_exit())
206. Iup::SetCallback loginbut, "ACTION", ADDRESS(login_clicked())
207. Iup::SetCallback showpwd, "ACTION", ADDRESS(show_password())
208. Iup::SetCallback newusr, "ACTION", ADDRESS(new_user())
209.  
210. ' *** PROCESS ***
211. ' Iup::Show(Iup::LayoutDialog(dlg))
212. Iup::Show(dlg)
213. Iup::MainLoop
214. Iup::Close
215. sqlite::Close(usrdb)
216.  

ubuntu@rpi4b:~/guilc/sb-dev$ scriba showdb.sb
John  -  FAF43E604E6A820CAAAB88BF7E2328C7
AIR   -  99B69173F38EB9F24FA4C05B4BE47CD7
Jalih -  78020D21C627349463D88142DC51F9B9
Peter -  0C5213856A47300D1E6D30CA00FAFFC1
ubuntu@rpi4b:~/guilc/sb-dev$

[jalih]

Here is a updated 8th login dialog with database support for retrieving stored user data.

I currently generate 32 byte random buffer from the cryptographically strong random source and convert it to hex string for the salt. Key for user chosen password is generated with PBKDF2 algorithm using previously randomly generated salt and 10000 iterations as parameters. Username, key and salt is then stored into database.

Code: [Select]

requires gui

var userdb

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

\ auth states
0 constant NOT-FOUND
1 constant USER-PASSWD-MATCH
2 constant USER-PASSWD-FAIL

: auth-from-db \ id passwd -- state
  s:len 0 n:= if
    2drop
    USER-PASSWD-FAIL
    ;;
  then
  >r >r
  userdb @ "by-id" r> 1 a:close db:bind-exec[]
  a:len 0 n:> if
    a:open
    "salt" m:@ r> swap 10000 cr:genkey
    swap "key" m:@ nip b:= if
      USER-PASSWD-MATCH
    else
      USER-PASSWD-FAIL
    then
  else
    drop
    rdrop
    NOT-FOUND
  then
  nip ;

: authenticate
  "edit2" g:child g:text? >r
  "edit1" g:child g:text? r> auth-from-db

   [ ( "lbl0" g:child "User not found!" g:text ) ,
     ( "Authenticated!" . cr bye ) ,
     ( "lbl0" g:child "User and password don't match!" g:text )  ] swap
   caseof drop ;

' authenticate w:is auth

: init
  "mytest.db" f:slurp "No database" thrownull
  db:open
  \ make a prepared statement
  "SELECT * FROM user WHERE id=? LIMIT 1" "by-id" db:prep-name
  userdb ! "edit1" g:child g:focus  ;

{
  kind: "win",
  buttons: 5,
  native-title-bar: false,
  title: "Login",
  wide: 520,
  high: 220,
  resizable: false,
  center: true,
  init: ' init ,
  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
  ( userdb @ db:close ) onexit ;

I currently manually generate user database with the following piece of 8th code:

Code: [Select]

"Creating a database and adding data:\n" .

\ remove previous db:
"mytest.db" f:rm

\ open a database:
"mytest.db" db:open "Could not create database" thrownull nip

\ create a table
"CREATE TABLE user (id PRIMARY KEY, key, salt)" db:exec

\ make a prepared statement
"INSERT INTO user VALUES (?, ?, ?);" "insert" db:prep-name

: build-params  \ id passwd -- a
  cr:uuid >r
  r@ 10000 cr:genkey
  r>
  3 a:close ;

\ insert into table using a parameterized statement
\ You could use t:err? to get map of error information
"insert" "jalih" "pa$$w0rd!" build-params null db:bind-exec
"insert" "guest" "guest" build-params null db:bind-exec
"insert" "john" "hard-passwd" build-params null db:bind-exec
"insert" "air" "crack-this" build-params null db:bind-exec

\ and close the database
"All done!\n" .
db:close
bye