This is an old revision of the document!
Nous allons créer une arborescence de personnalisation des themes et view pour notre institut (Telecom & Management SudParis , simplifié ici en tmsp1)
[root@cas2 cas-toolbox-3.3.5-3]# mkdir -p custom/webpages/themes/ [root@cas2 cas-toolbox-3.3.5-3]# cp -a update.esup/webpages/themes/esup custom/webpages/themes/ [root@cas2 cas-toolbox-3.3.5-3]# ls custom/webpages/themes/ esup [root@cas2 cas-toolbox-3.3.5-3]# ls custom/webpages/themes/esup/ cas.css images
au final on aura ce type d'arborescence
Le theme est essentiellement le fichier css, ici ce sera tmsp1cas.css qui sera chargé par toutes les pages statiques (jsp) car elles inclus toutes top.jsp (et bottom.jsp)
[root@cas2 cas-toolbox-3.3.5-3]# grep css /root/cas-toolbox-3.3.5-3/update.esup/webpages/WEB-INF/view/jsp/default/ui/includes/top.jsp <style type="text/css" media="screen">@import '<spring:theme code="css" />'/**/;</style>
cette directive @import va chercher dans le config.properties le nom du theme parametré , ici tmsp1:
ce qui resultera au final en
<style type="text/css" media="screen">@import 'themes/tmsp1Theme/tmsp1cas.css'/**/;</style>
Il faut indiquer a ant que nous allons utliser l'arborescence custom et les themes/views tmsp1:
[root@cas3 cas-toolbox-3.4.7-1]# grep custom build.properties
custom.path=${basedir}/custom
cas.custom.webpage.path=${custom.path}/webpages
cas.custom.source.path=${custom.path}/source
[root@cas3 cas-toolbox-3.4.7-1]# grep tmsp1 config.properties theme=tmsp1Theme views=tmsp1Vue
Préparer l'arborescence de custom
$ mkdir -p custom/webpages/WEB-INF/classes/
recopier le fichier esup.properties
[root@cas3 cas-toolbox-3.4.7-1]# cp /root/cas-toolbox-3.4.7-1/update.esup/webpages/WEB-INF/classes/esup.properties custom/webpages/WEB-INF/classes/tmsp1Theme.properties
Fichier tmsp1Theme.properties appel les css:
[root@cas3 cas-toolbox-3.4.7-1]# cat custom/webpages/WEB-INF/classes/tmsp1Theme.properties mobile.custom.css.file=themes/tmsp1Theme/default-mobile-custom.css standard.custom.css.file=themes/tmsp1Theme/cas.css
[root@cas3 cas-toolbox-3.4.7-1]# mkdir custom/webpages/themes/tmsp1Theme
Recopie du modele de cas.css et ajout d'images, dont le logo“ qui est chargé dans la css !:
[root@cas3 cas-toolbox-3.4.7-1]# cp /root/cas-toolbox-3.4.7-1/update.esup/webpages/themes/esup/cas.css custom/webpages/themes/tmsp1Theme/ [root@cas3 cas-toolbox-3.4.7-1]# mkdir -p custom/webpages/themes/tmsp1Theme/images [root@cas3 cas-toolbox-3.4.7-1]# cp tmp/images/it.png custom/webpages/themes/tmsp1Theme/images [root@cas3 cas-toolbox-3.4.7-1]# grep it.png custom/webpages/themes/tmsp1Theme/cas.css background:#fff url(images/it.png) no-repeat scroll 99% 32px;
Logo dans la section #header
Les views sont des pages statique (jsp) visibles dans /webpages/WEB-INF/view/jsp/theme/ui
On reprend l'ensemble des jsp du theme par defaut pour les adapter à notre site.
[root@cas3 cas-toolbox-3.4.7-1]# mkdir -p custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui [root@cas3 cas-toolbox-3.4.7-1]# cp -a build/cas/WEB-INF/view/jsp/default/ui/* custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/ [root@cas3 cas-toolbox-3.4.7-1]# ls -LtR custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/ custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/: includes casConfirmView.jsp casLoginView.jsp serviceErrorSsoView.jsp casBlockedView.jsp casGenericSuccess.jsp casLogoutView.jsp serviceErrorView.jsp custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/includes: bottom.jsp top.jsp
Attention a top.jsp qui peut-etre ecrasé par la manip ci-dessus, s'assurer qu'il contient bien l'appel spring au parametage du theme:
$ grep css custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/includes/top.jsp
<style type="text/css" media="screen">@import '<spring:theme code="css" />'/**/;</style>
et non le top.jsp par defaut qui force l'usage de css/cas.css autrement tout notre travail de personnalisation echoue. Initialement
<style type=“text/css” media=“screen”>@import 'css/cas.css'/**/;</style>
Pour chaque jsp il faut definir son appel dans *theme_name*_views.properties
[root@cas3 cas-toolbox-3.4.7-1]# cp build/cas/WEB-INF/classes/default_views.properties custom/webpages/WEB-INF/classes/tmsp1Vues_views.properties
On remplace toute occurence de “default” par “tmsp1Vues” ici, (cf vi ”:1,$s/default/tmsp1Vues/“ 7 substitutions on 7 lines )
[root@cas3 cas-toolbox-3.4.7-1]# cat custom/webpages/WEB-INF/classes/tmsp1Vues_views.properties ### Login view (/login) casLoginView.(class)=org.springframework.web.servlet.view.JstlView casLoginView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/casLoginView.jsp ### Login confirmation view (logged in, warn=true) casLoginConfirmView.(class)=org.springframework.web.servlet.view.JstlView casLoginConfirmView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/casConfirmView.jsp ### Logged-in view (logged in, no service provided) casLoginGenericSuccessView.(class)=org.springframework.web.servlet.view.JstlView casLoginGenericSuccessView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/casGenericSuccess.jsp ### Logout view (/logout) casLogoutView.(class)=org.springframework.web.servlet.view.JstlView casLogoutView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/casLogoutView.jsp ### CAS error view viewServiceErrorView.(class)=org.springframework.web.servlet.view.JstlView viewServiceErrorView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/serviceErrorView.jsp viewServiceSsoErrorView.(class)=org.springframework.web.servlet.view.JstlView viewServiceSsoErrorView.url=/WEB-INF/view/jsp/tmsp1Vues/ui/serviceErrorSsoView.jsp ### Services Management Views addServiceView.(class)=org.springframework.web.servlet.view.JstlView addServiceView.url=/WEB-INF/view/jsp/services/add.jsp editServiceView.(class)=org.springframework.web.servlet.view.JstlView editServiceView.url=/WEB-INF/view/jsp/services/add.jsp manageServiceView.(class)=org.springframework.web.servlet.view.JstlView manageServiceView.url=/WEB-INF/view/jsp/services/manage.jsp serviceLogoutView.(class)=org.springframework.web.servlet.view.JstlView serviceLogoutView.url=/WEB-INF/view/jsp/services/logout.jsp viewStatisticsView.(class)=org.springframework.web.servlet.view.JstlView viewStatisticsView.url=/WEB-INF/view/jsp/services/viewStatistics.jsp 403.(class)=org.springframework.web.servlet.view.JstlView 403.url=/WEB-INF/view/jsp/tmsp1Vues/ui/casBlockedView.jsp
on peux aussi personnaliser les messages (intitulés) via messages_fr.properties
[root@cas3 cas-toolbox-3.4.7-1]# cp update/webpages/WEB-INF/classes/messages_fr.properties custom/webpages/WEB-INF/classes/ [root@cas3 cas-toolbox-3.4.7-1]# vim custom/webpages/WEB-INF/classes/messages_fr.properties
un ant init / deploy est necessaire apres chaque modification dans custom !
Adaptation de la page premiere de Login CAS; casLoginView.jsp
[root@cas2 cas-toolbox-3.3.5-3]# diff -ur custom/webpages/WEB-INF/view/jsp/tmsp1Vues/ui/casLoginView.jsp build/cas/WEB-INF/view/jsp/default/ui/casLoginView.jsp
Notament les images/drapeaux pour les langues et les logos en bas de pages:
<li class="first"><a href="login?${query}${not empty query ? '&' : ''}locale=en"title="English"><img src="themes/tmsp1Theme/images/flags/english.png" alt="English"></a></li>
...
<li class="last"><a href="${loginUrl}tr"title="Turkish"><img src="themes/tmsp1Theme/images/flags/turkey.png" alt="Turkish"></a>
</ul>
</div>
</div>
<div id="IT"><a href="http://www.institut-telecom.fr/fr_accueil.html" title="Go to Institut Télécom home page"><img id="logo" src="themes/tmsp1Theme/images/it.png" alt="Institut Télécom" title="Go to Institut Télécom home page" /></a></div>
<div id="logos">
<ul>
<li id="TSP"><a href="http://www.telecom-sudparis.eu/" title="Go to Télécom SudParis home page"><img src="themes/tmsp1Theme/images/tsp.png" alt="Télécom SudParis"></a></li>
<li id="TEM"><a href="http://www.telecom-em.eu/" title="Go to Télécom École de Management home page"><img src="themes/tmsp1Theme/images/tem.png" alt="Télécom Ecole de Management"></a></li>
</ul>
</div>
</form:form>
<jsp:directive.include file="includes/bottom.jsp" />