Learning XPages Part 7 : The Banner Login/Logout Button
Tags : Lotus Domino XPages JavaScript
Bookmark :
In the last part of the series we saw how we could just some simple server side javascript with code that looked very much like a mix of LotusScript and formula language to show the name of the currently logged in person above our application in the banner. In this part we will finish off the banner by providing the user and way to login or logout of the application.
Lets start by opening our layout_Banner custom control again. You should see the list that we created in the last part, remove the second bit of placeholder text and drag in a new control form the controls pane on the right side of the screen. the control we are going to use this time is a 'Link' control. Drag it in and position it where the second bit of placeholder text in the list used to be.
Once you have it in place ( which you can confirm by using the source view of the custom control to make sure it appears inside the <li> & </li> tags like in the above image have a look at it's properties. There are quite a few different properties that we can set but we are only interesting in two of them, The label to make it say 'Login' or 'Logout' and the URL that the end user will be directed to when they click the link.
Almost every property in an XPage control can be computed. Just look for the little diamond at the end of each property. If the diamond is a solid blue color then you know that the property is using a computed value.
We are going to compute the value for the link so click the diamond and select the 'compute value' option. You'll see the JavaScript entry dialog box appear on your screen and we are going to use the following code :
Here we set the userName variable in the exact same way as we did for the other part of the banner but we then use a standard IF THEN ELSE style statement to return either login or logout as a string. For the URL we can do pretty much the exact same, click the diamond to set it to a computed value and use the following code :
This time instead of returning a simple string we are going to construct the returned value. The .getRequestContextPath on the externalContext is a way to figure out what URL the user typed in to get to your application. The '?login' and '?logout' that is appended to the end are just standard Lotus Domino URL constructs to log a person in or out of a database. You can use these constructs today on non-XPage applications also. By using the external context path we don;t need to hardcode anything into the application so you can move the database to any server, path or filename.
Lets save the the XPage and preview it in our web browser to see how it looks :
or
We have now completed the first layout section of our XPage application. Included below is a copy of my development database that contains all the design changes that we have made so far in the series. We have covered quite a few topics so far including how to break your application up into custom controls to make it easier to include different parts of the layout in pages, we have looked at how to use an image control and a how to mix html with xpages to produce an unordered list and within that list we used a computed field control and a link control in combination with some server side javascript to control what we wanted displayed.
In the next part of the series we'll start working on the next part of the layout. the 'Title Bar'.
Bookmark :
In the last part of the series we saw how we could just some simple server side javascript with code that looked very much like a mix of LotusScript and formula language to show the name of the currently logged in person above our application in the banner. In this part we will finish off the banner by providing the user and way to login or logout of the application.
Lets start by opening our layout_Banner custom control again. You should see the list that we created in the last part, remove the second bit of placeholder text and drag in a new control form the controls pane on the right side of the screen. the control we are going to use this time is a 'Link' control. Drag it in and position it where the second bit of placeholder text in the list used to be.
Once you have it in place ( which you can confirm by using the source view of the custom control to make sure it appears inside the <li> & </li> tags like in the above image have a look at it's properties. There are quite a few different properties that we can set but we are only interesting in two of them, The label to make it say 'Login' or 'Logout' and the URL that the end user will be directed to when they click the link.
Almost every property in an XPage control can be computed. Just look for the little diamond at the end of each property. If the diamond is a solid blue color then you know that the property is using a computed value.
We are going to compute the value for the link so click the diamond and select the 'compute value' option. You'll see the JavaScript entry dialog box appear on your screen and we are going to use the following code :
var userName:NotesName = session.createName(@UserName());
if (userName.getCommon()=="Anonymous")
{
var rtnvalue = "Log In"
}
else
{
var rtnvalue = "Logout"
}
return(rtnvalue);
Here we set the userName variable in the exact same way as we did for the other part of the banner but we then use a standard IF THEN ELSE style statement to return either login or logout as a string. For the URL we can do pretty much the exact same, click the diamond to set it to a computed value and use the following code :
var userName:NotesName = session.createName(@UserName());
if (userName.getCommon()=="Anonymous")
{
facesContext.getExternalContext().getRequestContextPath() + "?login"
}
else
{
facesContext.getExternalContext().getRequestContextPath() + "?logout"
}
This time instead of returning a simple string we are going to construct the returned value. The .getRequestContextPath on the externalContext is a way to figure out what URL the user typed in to get to your application. The '?login' and '?logout' that is appended to the end are just standard Lotus Domino URL constructs to log a person in or out of a database. You can use these constructs today on non-XPage applications also. By using the external context path we don;t need to hardcode anything into the application so you can move the database to any server, path or filename.
Lets save the the XPage and preview it in our web browser to see how it looks :
or
We have now completed the first layout section of our XPage application. Included below is a copy of my development database that contains all the design changes that we have made so far in the series. We have covered quite a few topics so far including how to break your application up into custom controls to make it easier to include different parts of the layout in pages, we have looked at how to use an image control and a how to mix html with xpages to produce an unordered list and within that list we used a computed field control and a link control in combination with some server side javascript to control what we wanted displayed.
In the next part of the series we'll start working on the next part of the layout. the 'Title Bar'.
Download File xPhoneP7.zip
Comments
I just wanne say that I think these serie of postings are one of the nicest and most contributing learning XPages and everything around it (from a XPage beginner perspective).
So thank you and keep up this good work!
Posted by Patrick Kwinten At 01:07:08 PM On 02/26/2009 | - Website - |
BTW, at this point you really need to be working on the server, since running it locally won't allow you to handle authentication.
Posted by Dave Harris At 05:51:09 AM On 03/05/2009 | - Website - |
One small remark about this lesson:
when you compute the URL for the login/logout link, the ?login and ?logout URL commands will work if the Domino http is set to session authentication; with basic authentication you have to use ?open&login .
Posted by Cristian D'Aloisio At 03:25:17 AM On 03/06/2009 | - Website - |
Posted by Howard Shevitz At 04:35:12 PM On 03/19/2009 | - Website - |
thanks, Steven
Posted by Steven At 05:43:46 PM On 03/19/2009 | - Website - |
One question: My application has regular Lotus Notes forms, webforms and XPages.
Now I've added the login function to my XPage startpage as facesContext.getExternalContext().getRequestContextPath() + "?open&login", but when I login, it will redirect me to the regular webforms startpage instead of the XPages startpage. Any ideas? I don't want to remove the webforms yet since we don't have the XPages version fully working.
Posted by Stefan At 02:23:26 AM On 03/28/2009 | - Website - |