Overview
EtsWhoAmI is a simple framework for including dynamic css and javascript depending on the status
of the user logged in.
User Types
Users are broken into one of the three following states.
Dynamic CSS Overview
The purpose of using EtsWhoAmI for dynamic CSS is to vary the display of a web page depending on the current user state.
This allows you to show a section to only public users or only to ETS users.
Dynamic CSS Usage
To use this, include a link to this application from your html page a stylesheet link.
<link rel="stylesheet" type="text/css" href="http://dev2etswhoami.appspot.com/etswhoami/test.css"></link>
It doesn't matter what the name of the file is as long as it ends in .css. You could replace test.css with MYFILE.css and it will operate the same.
By default the templates included operate both on DOM element id's and class attributes. The <link> tag can be included in either the <head>
or <body> sections. If the <link> is include after the elements it will affect based on their id's or classes, then everything will show (including the sections supposed to be hidden)
until the link is processed. This will appear to the user as all sections showing and then the appropriate ones disappearing after a second or two delay.
User Type | Element IDs hidden | Element IDs shown | Element classes hidden | Element classes shown |
---|---|---|---|---|
Public | wyo-section, ets-section | public-section | wyo-class, ets-class | public-class |
State Employee | public-section, ets-section | wyo-section | public-class, ets-class | wyo-class |
ETS Employee | public-section, wyo-section | ets-section | public-class, wyo-class | ets-class |
Show/Hide sections using dynamic CSS
If you would like an element (like a div) to be shown only to public users you have
two options. Give your element and id attribute of "public-section" or a class of "public-class"
If you would like an element to be shown only to state employees who don't belong to ETS then
give your element and id of "wyo-section" or a class of "wyo-class"
Changing the CSS source files
If you would like to have additional css styles added for any of the user types, you can modify the following
files in the GAE application and redeploy it to have your new styles used.
templates/ets.css
- This file is what will be sent in response to the stylesheet link if the user is an ETS Usertemplates/nonets.css
- This file is what will be sent in response to the stylesheet link if the user is a state employee but not an ETS usertemplates/public.css
- This file is what will be sent in response to the stylesheet link if the user is not a state employee
ETS Users list
The ETS Users list is included as a config file (config/etsusers.txt) in the application. As users are added or changed the list will need to be updated
and the application redeployed. It is technically possible to have the application auto detect who is an ETS user, but there are security
considerations since that would require the application to have administrative access to the entirety of the wyo.gov domain. It is possible for
(xxx) to download a list of ETS users from the google wyo.gov domain and someone can then include that in the GAE application and redeploy it.
Login and Logout links
To include links on your page to allow the user to login or logout you can use the following url's. Replace http://YOUR_URL_HERE with the page you would like the user to be taken to after they have logged in or out. This will usually be the current page your including the login/out link on.
Login link - <a href="https://www.google.com/accounts/ServiceLogin?service=ah&passive=true&continue=https://appengine.google.com/_ah/conflogin%3Fcontinue%3Dhttp://YOUR_URL_HERE">login</a>
Logout link -
<a href="http://dev2etswhoami.appspot.com/_ah/logout?continue=https://www.google.com/accounts/Logout%3Fcontinue%3Dhttps://appengine.google.com/_ah/logout%253Fcontinue%253Dhttp://YOUR_URL_HERE">Logout</a>