Commit f9c4d0cc authored by haemmer's avatar haemmer

Using new SWITCH harmos design elements for CI

parent c59cf9f4
......@@ -172,8 +172,11 @@ This will output PHP warning messages which are otherwise supressed.
Customizations:
Since version 1.12 any graphical aspects of this WAYF/DS implementation can be
customized such that these changes survive an upgrade. In particular, the
following customizations can be applied:
customized such that these changes survive an upgrade. Files whose names start
with 'default-' can be copied and renamed to start with 'custom-' in order to
customize the file's behaviour.
In particular, the following customizations can be applied:
HTML header: custom-header.php
Customize page header
......@@ -196,6 +199,9 @@ Customize WAYF/DS body
HTML Error: custom-error.php
Customize error messages
CSS Styles: css/custom-styles.css
Customize CSS styles that are printed inline in header
Languages: custom-languages.php
Can be used to change default or add new language strings. In contrast to the
above template files, this won't replace the default-languages.php but extend or
......@@ -388,6 +394,10 @@ For category entries, only Type, (local) Name and Index are relevant.
Version History:
1.14.4 Release data: August 2011
- Graphical design now is based new SWITCH harmos elements
- Focus on submit button works better with different browsers
1.14.3 Release date: 4. March 2011
- Fixed a race condition. Thanks go to Robert Basch from MIT for
reporting the issue and providing a patch.
......@@ -417,8 +427,9 @@ Version History:
To see the revision history of older versions, please have a look at:
https://forge.switch.ch/redmine/projects/wayf/wiki/Changes
Releases with a version number X.Y.Z usually are bug fix releases whereas
releases with a version number X.Y introduce new functionality.
Releases with a version number X.Y.Z usually contain bug fix releases, typo
corrections and graphical changes whereas releases with a version number X.Y
usually introduce new functionality.
-------------------------------------------------------------------------------
Embedded WAYF code snippet:
......
......@@ -3,7 +3,7 @@
/*
******************************************************************************
SWITCHwayf
Version: 1.14.3
Version: 1.14.4
Contact: aai@switch.ch
Web site: http://www.switch.ch/aai/wayf
******************************************************************************
......
h1 {
font-family:Verdana, Geneva, sans-serif;
font-size: 13px;
padding-bottom: 6px;
text-align: left;
}
p {
font-family:Verdana, Geneva, sans-serif;
font-size: 12px;
text-align: left;
}
a {
color: #00247D;
text-decoration: underline;
}
a:visited {
color: #00247D;
text-decoration: underline;
}
a:focus, a:hover, a:active {
color: #F39800;
text-decoration: underline;
}
select {
max-width: 480px;
}
.outer_container {
position: absolute;
left: 50%;
top: 50%;
margin-left: -300px;
margin-top: -200px;
}
.wayf_box {
width:600px;
text-align: center;
background-color: #FFFFFF;
box-shadow: 1px 1px 15px #999999;
border-radius: 8px;
-webkit-box-shadow: 1px 1px 15px #999999;
-moz-box-shadow: 1px 1px 15px #999999;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
overflow: hidden;
padding: 1.268em;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=0, Strength=5)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=45, Strength=4)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=90, Strength=5)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=135, Strength=4)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=180, Strength=5)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=225, Strength=4)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=260, Strength=5)
progid:DXImageTransform.Microsoft.Shadow(color='#CCCCCC', Direction=305, Strength=4);
}
.header {
width: 100%;
}
.menu {
width: 100%;
padding-left: 2px;
margin-top: 10px;
margin-left: 0;
float: left;
background: url("{$imageURL}/dual_line.gif") repeat-x scroll 0 100% transparent;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
line-height: 45px;
}
.menu li {
float: left;
list-style:none;
line-height:35px;
}
.menu li.last {
background: url("{$imageURL}/separator.gif") no-repeat scroll left center transparent;
padding: 0 0 0 8px;
float: left;
margin-right:10px;
list-style:none;
}
.content {
width: 100%;
float:left;
}
.aai_logo {
float:left;
margin-top: 32px;
border:0;
}
.switch_logo {
float:right;
border:0;
}
.login_field {
width: 100%;
margin-left: auto;
margin-right: auto;
background-color: #F0F0F0;
border-color: #969696;
border-width: 1px;
border-style: solid;
padding: 6px;
}
.selectedIdP
{
font-family:Verdana, Geneva, sans-serif;
font-size: 13px;
width: 380px;
background-color: white;
border-color: black;
border-style: solid;
margin: 2px;
border-width: 1px;
text-align: center;
}
\ No newline at end of file
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!-- Identity Provider Selection: Start-->
<!-- Identity Provider Selection: Start -->
<h1><?php echo getLocalString('header'); ?></h1>
<p class="switchaai">
<?php echo $promptMessage ?>
</p>
<form id="IdPList" name="IdPList" method="post" onSubmit="return checkForm()" action="<?php echo $actionURL ?>">
<p>
<select name="user_idp">
<table class="login_field" width="500">
<tr>
<td>
<p><?php echo $promptMessage ?></p>
<div align="center">
<select name="user_idp" name="user_idp">
<option value="-" <?php echo $defaultSelected ?>><?php echo getLocalString('select_idp') ?> ...</option>
<?php printDropDownList($IDProviders, $selectedIDP) ?>
</select>
<input type="submit" name="Select" accesskey="s" value="<?php echo getLocalString('select_button') ?>" >
</p>
<input type="submit" name="Select" accesskey="s" value="<?php echo getLocalString('select_button') ?>" autofocus>
</div>
<div align="left">
<p>
<input type="checkbox" <?php echo $rememberSelectionChecked ?> name="session" id="rememberForSession" value="true">
<span class="warning"><label for="rememberForSession"><?php echo getLocalString('remember_selection') ?></label></span><br>
<label for="rememberForSession"><?php echo getLocalString('remember_selection') ?></label><br>
<?php if ($showPermanentSetting) : ?>
<!-- Value permanent must be a number which is equivalent to the days the cookie shall be valid -->
<input type="checkbox" name="permanent" id="rememberPermanent" value="100">
<span class="warning"><label for="rememberPermanent" /><?php echo getLocalString('permanently_remember_selection') ?></label></span>
<label for="rememberPermanent" /><?php echo getLocalString('permanently_remember_selection') ?></label>
<?php endif ?>
</p>
</div>
</td>
</tr>
</table>
</form>
<table border="0" cellpadding="1" cellspacing="0">
<tr>
<td valign="top" width="14"><img src="<?php echo $imageURL; ?>/arrow-12.gif" alt="arrow"></td>
<td valign="top"><p class="switchaai"><?php echo getLocalString('switch_description') ?></p></td>
<td valign="top">
<p><?php echo getLocalString('switch_description') ?></p>
</td>
</tr>
</table>
<!-- Identity Provider Selection: End-->
<!-- Identity Provider Selection: End -->
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!-- Error Message: Start-->
<h2><?php echo getLocalString('invalid_query') ?></h2>
<h1><?php echo getLocalString('invalid_query') ?></h1>
<p>
<?php echo $message ?>
</p>
......
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!-- Body: End -->
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Body: End -->
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<html><head>
<title><?php echo getLocalString('title') ?></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style type="text/css">
<!--
body
{
color: #000000;
background-color: #EFF1F1;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
a
{
color: #203781;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
a:hover
{
color: #203781;
text-decoration: underline;
}
h2.switchaai
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 17px;
}
h1
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 18px;
}
p
{
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 1.2;
font-size: 12px;
}
b
{
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 1.2;
font-size: 12px;
font-weight: bold;
}
tt
{
line-height: 1.2;
font-weight: bold;
}
span.switchaai
{
line-height: 30px;
}
input.switchaai
{
border-width: 1px;
border-style: solid;
border-color: #888888;
}
<meta name="keywords" content="Discovery Service, WAYF, Shibboleth">
<meta name="description" content="Choose your home organization to authenticate">
<style type="text/css"><!--
<? printCSS() ?>
-->
</style>
</head>
a.switchaai
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 12px;
}
<body onLoad="preventIframeEmbedding(); setFocus();">
<script language="JavaScript" type="text/javascript">
<!--
.outer-box
{
margin-left:auto; margin-right:auto;
border-style: solid;
border-color: #00247D;
border-width: 1px;
padding: 10px;
text-align: left;
background-color: white;
function preventIframeEmbedding(){
if (top != self) {
top.location = self.location;
}
.selectedIdP
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 12px;
background-color: white;
border-color: #203781;
border-style: solid;
margin: 2px;
border-width: 1px;
width: 400px;
height: 25px;
text-align: center;
line-height: 25px;
}
}
.fullheight
{
height: 100%;
min-height: 100%;
function setFocus(){
// Skip this if we cannot access the form elements
if (!document.IdPList || !document.IdPList.Select){
return;
}
.inner-box
{
border-width: 1px;
border-color: #203781;
background-color: #979CE3;
border-style: solid;
padding: 3px;
// Set focus to submit button unless autofocus is supported
if (!("autofocus" in document.createElement("input"))) {
document.IdPList.Select.focus();
}
}
-->
</style>
</head>
<body bgcolor="#ffffff" onLoad="if (top != self) {top.location = self.location;};if (document.IdPList && document.IdPList.Select) document.IdPList.Select.focus()">
<script language="JavaScript" type="text/javascript">
<!--
function showConfirmation(){
return confirm(unescape('<?php echo getLocalString('confirm_permanent_selection', 'js') ?>'));
}
function showPermanentConfirmation(){
return alert(unescape('<?php echo getLocalString('permanent_cookie_note', 'js') ?>'));
}
function checkForm(){
if(document.IdPList.user_idp && document.IdPList.user_idp.selectedIndex == 0){
alert(unescape('<?php echo getLocalString('make_selection', 'js') ?>'));
......@@ -150,15 +56,20 @@ function checkForm(){
}
}
}
-->
</script>
<table border="0" cellpadding="0" cellspacing="0" style="width:100%; height:100%">
<tr>
<td align="center" valign="middle">
<table border="0" cellpadding="0" cellspacing="0" width="600" class="outer-box">
<tr>
<td class="switchaai">
<a href="http://www.switch.ch/aai/" target="_blank"><img src="<?php echo $logoURL ?>" border="0" class="switchaai" alt="Federation Logo"></a>
<br>
<a href="http://www.switch.ch/<?php echo $language ?>/aai/about/" class="switchaai-link"><?php echo getLocalString('about_aai'); ?></a>&nbsp;:&nbsp;<a href="http://www.switch.ch/<?php echo $language ?>/about/" class="switchaai-link"><?php echo getLocalString('about_switch'); ?></a>&nbsp;:&nbsp;<a href="http://www.switch.ch/<?php echo $language ?>/aai/faq/" class="switchaai-link"><?php echo getLocalString('faq') ?></a>&nbsp;:&nbsp;<a href="http://www.switch.ch/<?php echo $language ?>/aai/help/" class="switchaai-link"><?php echo getLocalString('help') ?></a>&nbsp;:&nbsp;<a href="http://www.switch.ch/<?php echo $language ?>/aai/privacy/" class="switchaai-link"><?php echo getLocalString('privacy') ?></a>
<div class="outer_container">
<div class="wayf_box">
<div class="header">
<a href="http://www.switch.ch/aai"><img src="<?php echo $imageURL ?>/switchaai-logo.gif" alt="SWITCHaai" class="aai_logo"><a href="http://www.switch.ch/"><img src="<?php echo $imageURL ?>/switch-logo.gif" alt="SWITCH" class="switch_logo" align="right"></a>
</div>
<div class="content">
<ul class="menu">
<li class="last"><a href="http://www.switch.ch/<?php echo $language ?>/aai/about/"><?php echo getLocalString('about_aai'); ?></a></li>
<li class="last"><a href="http://www.switch.ch/<?php echo $language ?>/aai/faq/"><?php echo getLocalString('faq') ?></a></li>
<li class="last"><a href="http://www.switch.ch/<?php echo $language ?>/aai/help/"><?php echo getLocalString('help') ?></a></li>
<li class="last"><a href="http://www.switch.ch/<?php echo $language ?>/aai/privacy/"><?php echo getLocalString('privacy') ?></a></li>
</ul>
<!-- Body: Start -->
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!-- Identity Provider Permanent Note: Start-->
<!-- Identity Provider Selection: Start -->
<h1><?php echo getLocalString('settings'); ?></h1>
<script language="JavaScript" type="text/javascript">
<!--
function showConfirmation(){
return alert(unescape('<?php echo getLocalString('permanent_cookie_note', 'js') ?>'));
}
-->
</script>
<div class="inner-box">
<p>
<?php echo getLocalString('permanent_cookie_notice'); ?>
</p>
<form id="IdPList" name="IdPList" method="post" action="<?php echo $actionURL ?>">
<?php echo $hiddenUserIdPInput ?>
<form id="IdPList" name="IdPList" method="post" onSubmit="return checkForm()" action="<?php echo $actionURL ?>">
<table class="login_field" width="500">
<tr>
<td>
<p><?php echo getLocalString('permanent_cookie_notice'); ?></p>
<div align="center">
<div class="selectedIdP">
<div class="selectedIdP" style="float: left">
<?php echo $permanentUserIdPName ?>
</div>
<p>
<input type="submit" accesskey="c" name="clear_user_idp" value="<?php echo getLocalString('delete_permanent_cookie_button') ?>">
<input style="float: left" type="submit" accesskey="c" name="clear_user_idp" value="<?php echo getLocalString('delete_permanent_cookie_button') ?>">
<?php if (isValidShibRequest()) : ?>
<input type="submit" accesskey="s" name="Select" name="permanent" value="<?php echo getLocalString('goto_sp') ?>" onClick="showConfirmation()">
<input style="float: left" type="submit" accesskey="s" name="Select" name="permanent" value="<?php echo getLocalString('goto_sp') ?>" onClick="showPermanentConfirmation()">
<?php endif ?>
</p>
</div>
</td>
</tr>
</table>
</form>
</div>
<!-- Identity Provider Permanent Note: End-->
<table border="0" cellpadding="1" cellspacing="0">
<tr>
<td valign="top">
<p><?php echo getLocalString('switch_description') ?></p>
</td>
</tr>
</table>
<!-- Identity Provider Selection: End -->
<?php // Copyright (c) 2011, SWITCH - Serving Swiss Universities ?>
<!-- Identity Provider Permanent Settings: Start-->
<h1><?php echo getLocalString('permanent_select_header') ?></h1>
<p class="switchaai">
<?php echo getLocalString('permanent_cookie') ?>
</p>
<div class="inner-box">
<!-- Identity Provider Selection: Start -->
<h1><?php echo getLocalString('permanent_select_header'); ?></h1>
<form id="IdPList" name="IdPList" method="post" onSubmit="return checkForm()" action="<?php echo $actionURL ?>">
<table class="login_field" width="500">
<tr>
<td>
<!-- Value permanent must be a number which is equivalent to the days the cookie shall be valid -->
<input name="permanent" type="hidden" value="100">
<p><strong><?php echo getLocalString('permanently_remember_selection') ?></strong></p>
<p><?php echo getLocalString('permanently_remember_selection') ?></p>
<p>
<select name="user_idp">
<option value="-" <?php echo $defaultSelected ?>><?php echo getLocalString('select_idp') ?> ...</option>
......@@ -17,6 +16,17 @@
</select>
<input type="submit" name="Select" accesskey="s" value="<?php echo getLocalString('save_button') ?>" >
</p>
</td>
</tr>
</table>
</form>
</div>
<!-- Identity Provider Permanent Settings: End-->
<table border="0" cellpadding="1" cellspacing="0">
<tr>
<td valign="top">
<p><?php echo getLocalString('switch_description') ?></p>
</td>
</tr>
</table>
<!-- Identity Provider Selection: End -->
images/switch-aai-transparent-small.png

610 Bytes | W: | H:

images/switch-aai-transparent-small.png

1.54 KB | W: | H:

images/switch-aai-transparent-small.png
images/switch-aai-transparent-small.png
images/switch-aai-transparent-small.png
images/switch-aai-transparent-small.png
  • 2-up
  • Swipe
  • Onion skin
images/switch-aai-transparent.png

995 Bytes | W: | H:

images/switch-aai-transparent.png

1.66 KB | W: | H:

images/switch-aai-transparent.png
images/switch-aai-transparent.png
images/switch-aai-transparent.png
images/switch-aai-transparent.png
  • 2-up
  • Swipe
  • Onion skin
This diff is collapsed.
......@@ -43,9 +43,7 @@ function printWAYF(){
$showPermanentSetting = false;
}
$promptMessage = '<strong>'.getLocalString('make_selection').'</strong>';
if (isset($_GET['target']) && preg_match('|:/|', $_GET['target'])){
$promptMessage = sprintf(getLocalString('access_target'), $_GET['target'], $_GET['target']);
} else if (isset($_GET['return'])){
if (isset($_GET['return'])){
$promptMessage = sprintf(getLocalString('access_host'), getHostNameFromURI($_GET['return']));
} else if (isset($_GET['entityID'])){
$promptMessage = sprintf(getLocalString('access_host'), getHostNameFromURI($_GET['entityID']));
......@@ -487,13 +485,13 @@ function isCookie(check_name){
}
// Query Shibboleth Session handler and process response afterwards
// This method has to be used because HttpOnly prevents reading
// the shib session cookies via JavaScript
function queryShibSessionHandler(url){
var xmlhttp;
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
......@@ -1105,4 +1103,24 @@ function printEmbeddedConfigurationScript(){
}
}
/******************************************************************************/
// Print sample configuration script used for Embedded WAYF
function printCSS(){
global $imageURL;
// Read custom CSS
if (file_exists('css/custom-styles.css')){
$cssFile = 'css/custom-styles.css';
} else {
$cssFile = 'css/default-styles.css';
}
// Read CSS and substitute content
$cssContent = file_get_contents($cssFile);
$cssContent = preg_replace('/{?\$imageURL}?/',$imageURL, $cssContent);
echo $cssContent;
}
?>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment