Author: thorsten
Date: Mon Oct 31 04:37:39 2005
New Revision: 329808
URL: http://svn.apache.org/viewcvs?rev=329808&view=rev
Log:
Finished the theme switcher. In the end I used the cookie stuff submited by
Kevin. Thanks a lot Kevin for your contribution that helped a lot. I enhanced
the code by adding an example of a dynamic select box which contains all themes
that one can select.
Modified:
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/html/branding-theme-switcher.ft
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/js/cssStyleSwitcher.js
Modified:
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/html/branding-theme-switcher.ft
URL:
http://svn.apache.org/viewcvs/forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/html/branding-theme-switcher.ft?rev=329808&r1=329807&r2=329808&view=diff
==============================================================================
---
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/html/branding-theme-switcher.ft
(original)
+++
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/html/branding-theme-switcher.ft
Mon Oct 31 04:37:39 2005
@@ -56,6 +56,16 @@
</select>
</form>
</div>
+ <div id="theme-switcher-dyn">Dynamic:
+ <form action="">
+ <select id="themeSwitcherSelect"
onchange="switchThemeSelect(this);">
+ <option value="-1">Select a theme</option>
+ </select>
+ </form>
+ <script type="text/javascript">
+ initSelectSwitcher('themeSwitcherSelect');
+ </script>
+ </div>
</xsl:template>
</xsl:stylesheet>
</forrest:template>
Modified:
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/js/cssStyleSwitcher.js
URL:
http://svn.apache.org/viewcvs/forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/js/cssStyleSwitcher.js?rev=329808&r1=329807&r2=329808&view=diff
==============================================================================
---
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/js/cssStyleSwitcher.js
(original)
+++
forrest/trunk/main/template-sites/v2/src/documentation/resources/themes/default/js/cssStyleSwitcher.js
Mon Oct 31 04:37:39 2005
@@ -21,20 +21,22 @@
* cssStyleSwitcher.js
*/
function switchTheme(title){
- for(var i = 0; i <document.getElementsByTagName("link").length; i++) {
- var a = document.getElementsByTagName("link")[i];
+ var linkElements= document.getElementsByTagName("link");
+ for(var i = 0; i <linkElements.length; i++) {
+ var a = linkElements[i];
//deactivate all screen css
if (a.getAttribute("media") == "screen") {
a.disabled=true;
}
}
//activate the selected theme
- for(var i = 0; i <document.getElementsByTagName("link").length; i++) {
- var a = document.getElementsByTagName("link")[i];
+ for(var i = 0; i <linkElements.length; i++) {
+ var a = linkElements[i];
if (a.getAttribute("media") == "screen" ) {
a.disabled = (a.getAttribute("title") == title)?false:true;
}
}
+ createCookie("style", title, 365);
}
/* change the active (preferred) stylesheet to the selected one and save it */
function switchThemeSelect(selBox){
@@ -42,4 +44,60 @@
var title= selBox.options[selIndex].value; // get the value of this index
if (title == "-1") return false;
switchTheme(title); // do the actual switch
-} // end method switchThemeSelect()
\ No newline at end of file
+} // end method switchThemeSelect()
+function initSelectSwitcher(themeSwitcherSelect){
+ var select = $(themeSwitcherSelect);
+ var themes=aviableThemes();
+ var tempTheme = themes.split(';');
+ for(var xi=0;xi < tempTheme.length;xi++) {
+ if (tempTheme[xi].length>1){
+ select.options[select.options.length] = new Option(tempTheme[xi]);
+ }
+ }
+}
+function aviableThemes(){
+ var currentTheme;
+ var themes="";
+ var linkElements= document.getElementsByTagName("link");
+ for(var i = 0; i <linkElements.length; i++) {
+ var a = linkElements[i];
+ if (a.getAttribute("media") == "screen" && a.getAttribute("title")) {
+ currentTheme=a.getAttribute("title");
+ var tempTheme = themes.split(';');
+ var contained = false;
+ for(var xi=0;xi < tempTheme.length;xi++) {
+ var theme = tempTheme[xi];
+ if (theme==currentTheme){
+ contained=true;
+ }
+ }
+ if (contained==false){
+ themes=themes+currentTheme+";";
+ }
+ }
+ }
+ return themes;
+}
+
+/*CookieStuff*/
+function createCookie(name, value, days) {
+ var date = new Date();
+ date.setTime(date.getTime() + (days*24*60*60*1000));
+ var expires = "; expires="+date.toGMTString();
+ document.cookie = name + "=" + value + expires + "; path=/";
+}
+function readCookie(name) {
+ var nameEQ = name + "=";
+ var ca = document.cookie.split(';');
+ for(var i=0;i < ca.length;i++) {
+ var c = ca[i];
+ while (c.charAt(0)==' ') c = c.substring(1,c.length);
+ if (c.indexOf(nameEQ) == 0) return
c.substring(nameEQ.length,c.length);
+ }
+ return null;
+}
+function initBrandingThemeSwitcher(){
+ var cookie = readCookie("style");
+ switchTheme((cookie)?cookie:'default');
+}
+initBrandingThemeSwitcher();
