jsherk
Posts: 34
|
| Posted: 01/11/2009, 9:10 AM |
|
Okay, it took me a couple of days to get this figured out, but I think this covers everything including hiding the logout button when you are not logged in and hiding the login when form when you are. It also includes a menu that can be inlcuded at the top of each page with the Logout button on it. And it also explains the { curly bracket } things in the HTML code.
Alot of this has been taken from other posts in the forums, so I am not taking credit for it, I am just piecing it all together in one spot!
I'm using CCS4.1 on Windows XP Pro with apache2.2.11 and php5.2.8 and mysql5.1.3
STEP-BY-STEP
Create new blank project called MyProject (this example uses php4/5 and html 508).
CREATE BASIC PAGES
Right-click on NewPage1 and delete it.
Right-click on Pages and select New Page.
Give it the name: index
Select: Blank page and hit OK
Right-click on Page again and select New Page.
Give it the name: logout
Select: Blank page and hit OK
Right-click on Page again and select New Page.
Give it the name: menu1
Select: Includable page and hit OK
SETUP LOGOUT PAGE
Now select the logout page, and make sure the Properties window says Page:logout
Click the Events tab, and under Server right-click on After Initialize and choose Add Action.
Scroll throught the list and choose Logout.
Set the Parameter Name to Logout
Set the Return Page to index.ccp
SETUP INDEX/LOGIN PAGE
Now select the index page. Make sure the Design tab is selected for this page, and click once anywhere on the page so that the cursor is blinking up in the top left hand corner.
From your Toolbox choose Forms->Include Page.
Under Page To Include choose menu1.ccp and hit OK.
In the Design view again, click once anywhere to the right and below the newly inserted menu1 (do not click on it, but instead click somewhere else on the page).
From your Toolbox choose Builders->Authentication Builder.
Choose Login Form then hit next.
Choose Focus On Login Field (and optionally Remember Me) and hit next.
Choose your style and hit Finish.
NOTE: You will need to setup a USER table in your database with four fields (id, username, password, group), and also setup a connection to the database. This example assumes you have done that already something like this:
database connection= Connection1
database name= mydatabase
user table name= users
unique identifier field for each user = id
username field = username
password field = password
group field = group
Make sure you add at least one user to the table. Let's assume id=1 username=admin password=adminpass and group=99
Now choose Project->Settings->Security then choose the following:
Security Method = Table
Login Page = index.ccp
Connection = Connection1
User Table = users
User ID Field = id
Login field = username
Password Field = password
Level/Group Field = group
Click on ADVANCED button and set the seesion variables (UserID, UserLogin and Group ID) to something unique (recommend you do this for EVERY new project you start!!!)
Click OK when done.
Now choose Project->Settings->Security Groups then ADD
You can set this up as you please (and change them later), but for now add one that has GroupID=99 and GroupName=Administrator
SETUP MENU PAGE
Now select the menu1 page. Make sure the Design tab is selected for this page, and click once anywhere on the page so that the cursor is blinking up in the top left hand corner.
From your Toolbox choose Builders->Authentication Builder
Choose Logout Link to Custom Page and hit next.
For Page choose logout.ccp and hit Finish.
In the Design view again, click once anywhere to the right and below the newly inserted Logout (do not click on it, but instead click somewhere else on the page).
From your Toolbox choose Builders->Menu Builder
Choose Static List and hit next.
Click the big plus[+] button once and then click on Item1
Under Caption change it to MAIN MENU
Under URL choose index.ccp.
Hit next, choose your layout, hit next again, choose your style and hit Finish.
CUSTOMIZE LOGOUT (HIDE/UNHIDE)
NOTE: This also explains how the { curly brackets } work in the HTML 
Now, while still on the menu1 page, click on Logout so that it appears in the Properties area (Properties should read Link:Logout)
Choose the Events tab and under Server right-click on Before Show and click Add Code.
The menu1 page should have changed from the Design view tab to the Code view tab. Look for the line that says: // Write your own code here.
Go to the end of that line and hit enter once in order to put a blank line under it.
Insert the following code:
global $Tpl;
$custom_user = CCGetUserLogin();
if ($custom_user) {
$Tpl->setvar("CustomLogoutLinkText", "LOGOUT");
$Tpl->setvar("CustomLogoutText", " - You are logged in as <strong>".$custom_user."</strong>");
} else {
$Tpl->setvar("CustomLogoutLinkText", "");
$Tpl->setvar("CustomLogoutText", "You are NOT logged in.");
}
Now click on the HTML view tab for menu1 page and look for this line:
<a href="{Logout_Src}" id="menumainLogout">Logout</a>
and change it to this line:
<a href="{Logout_Src}" id="menumainLogout">{CustomLogoutLinkText}</a>{CustomLogoutText}
CUSTOMIZE LOGIN (HIDE/UNHIDE)
Select the index page. Make sure the Design tab is selected for this page, and click anywhere on the Login form that appears in the screen. It should say Record:Login in the Properties box.
Choose the Events tab, and under Server right-click on Before Show and choose Add Code.
The index page Code view tab should now be selected.
Look for this code:
// Write your own code here.
and immediately after it, enter this code:
if (!CCGetUserID()){ //Don't forget the ! in front of the CCGet
$Component->Visible = True;
}else{
$Component->Visible = False;
}
PUBLISH
Now publish your project, and when initially go to the main page, it will say "You are NOT logged in." and the Login form will be displayed. Sign in with a valid username and password (like we setup username=admin and password=adminpass in our example) and the Login form disappears and it displays "LOGOUT You are logged in." Click the LOGOUT link and you are back where you started.
FURTHER EXAMPLES - ADD NEW PAGES WITH MENU and SECURITY
Now let's add an additional page with security.
Right-click on Pages and choose New Page.
Let's keep the name NewPage1 and click Blank Page and OK.
Now select NewPage1. Make sure the Design tab is selected for this page, and click once anywhere on the page so that the cursor is blinking up in the top left hand corner.
Click Form->Include Page and for Page To Include choose menu1.ccp
In the Design view again, click once anywhere to the right and below the newly inserted menu1 (do not click on it, but instead click somewhere else on the page).
Type something on the page like "Hello world!"
Now select the menu1 page. Make sure the Design tab is selected and right-click on the white rectangle which contains the menu we built earlier. Choose Edit Menu 'menu1' Static Items.
Click the big plu[+] button and the choose Item2.
Change the caption to read New Page One.
Change URL to NewPage1.ccp and hit OK.
Now select NewPage1 again. In the Design view area, click in a blank spot so that the Properties box should read: Page:NewPage1
Choose the Data tab and change Restricted to YES.
Note the three little dots (...) beside the drop down arrow. By clicking this you can later set which Groups have access to the page. If you do not select anything on this page (all groups unchecked), then as long as any user is logged in, they can view this page. If nobody is logged in, then they cannot view this page (assuming restricted=yes).
Publish everything again, and you should now have two menu options (MAIN MENU and New Page One). If you are logged out, then you will not be able to access New Page One. If you are logged in then you should be able to acces both Main Menu and New Page One and the LOGOUT link should appear on both.
Hope this is helpful!!!
|
