| Mazinger |
05-02-2009 11:56 AM |
How to save custom options with cookies
Say, I have implemented a JS code into my forum that allows the user to expand/reduce the forum divider width; it works in the currently page, but when moving to any other page, the browser forgets about the selected options.
I want the browser to remember it and deliver it every time with cookies.
Does any one know how to do that?
Thanks in advance.
--------------- Added [DATE]1241339504[/DATE] at [TIME]1241339504[/TIME] ---------------
For example, this JS code. It doesn't save choices with cookies with my 3.7.4 forum:
Code:
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
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 eraseCookie(name) {
createCookie(name,"",-1);
}
function getElementsByClassName(className, tag, elm){
var testClass = new RegExp("(^|\\\\s)" + className + "(\\\\s|$)");
var tag = tag || "*";
var elm = elm || document;
var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
var returnElements = [];
var current;
var length = elements.length;
for(var i=0; i<length; i++){
current = elements[i];
if(testClass.test(current.className)){
returnElements.push(current);
}
}
return returnElements;
}
//*** This code is copyright 2003 by Gavin Kistner, gavin@refinery.com
//*** It is covered under the license viewable at http://phrogz.net/JS/_ReuseLicense.txt
//*** Reuse or modification is free provided you abide by the terms of that license.
//*** (Including the first two lines above in your source code satisfies the conditions.)
//***Cross browser attach event function. For 'evt' pass a string value with the leading "on" omitted
//***e.g. AttachEvent(window,'load',MyFunctionNameWithoutParenthesis,false);
function AttachEvent(obj,evt,fnc,useCapture){
if (!useCapture) useCapture=false;
if (obj.addEventListener){
obj.addEventListener(evt,fnc,useCapture);
return true;
} else if (obj.attachEvent) return obj.attachEvent("on"+evt,fnc);
else{
MyAttachEvent(obj,evt,fnc);
obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
}
}
//The following are for browsers like NS4 or IE5Mac which don't support either
//attachEvent or addEventListener
function MyAttachEvent(obj,evt,fnc){
if (!obj.myEvents) obj.myEvents={};
if (!obj.myEvents[evt]) obj.myEvents[evt]=[];
var evts = obj.myEvents[evt];
evts[evts.length]=fnc;
}
function MyFireEvent(obj,evt){
if (!obj || !obj.myEvents || !obj.myEvents[evt]) return;
var evts = obj.myEvents[evt];
for (var i=0,len=evts.length;i<len;i++) evts[i]();
}
AttachEvent(window,'load',loadPageState,false);
function loadPageState()
{
// inject search here text + assign listener to remove it
var searchInput = document.getElementById('searchquery');
if(searchInput != null)
{
searchInput.value = "Search here";
AttachEvent(searchInput,'click',removeSearchText,false);
}
if(readCookie('fluid') == null)
{
createCookie('fluid',0,9999);
}
if(readCookie('podmenu') == null)
{
createCookie('podmenu',0,9999);
}
var fluid = readCookie('fluid');
var podmenu = readCookie('podmenu');
/*if(fluid != null && podmenu != null)
{
var ourBody = document.body;
if(fluid == 0 && podmenu == 1)
{
ourBody.setAttribute('class', 'max-fixed');
}
else if(fluid == 1 && podmenu == 0)
{
ourBody.setAttribute('class', 'fluid-hidden');
}
else if(fluid == 1 && podmenu == 1)
{
ourBody.setAttribute('class', 'fluid-visible');
}
else
{
ourBody.setAttribute('class', 'min-fixed');
}
}*/
// assign our listeners to the controls
var ffControl = document.getElementById('layout-toggle');
if(ffControl != null)
{
AttachEvent(ffControl,'click',toggleFF,false);
}
var pmControl = document.getElementById('content-toggle');
if(ffControl != null)
{
AttachEvent(pmControl,'click',togglePM,false);
}
// assign hover event handlers
var hovers = getElementsByClassName("hover", "table", document);
for(var i = 0; i < hovers.length; i++)
{
hovers[i].onmouseover = doHover1;
hovers[i].onmouseout = doHover2;
}
}
function doHover1()
{
//this.className = 'hover2';
}
function doHover2()
{
//this.className = 'hover';
}
function removeSearchText()
{
var searchInput = document.getElementById('searchquery');
if(searchInput != null)
{
if(searchInput.value == 'Search here')
{
searchInput.value = "";
}
}
//searchInput.class =
}
function toggleFF()
{
var fluid = readCookie('fluid');
var podmenu = readCookie('podmenu');
var ourBody = document.getElementById("resizer");
if(fluid != null && podmenu != null && ourBody != null)
{
if(fluid == 1)
{
createCookie('fluid', 0, 9999);
if(podmenu == 1)
{
ourBody.setAttribute('class', 'max-fixed');
ourBody.className = 'max-fixed';
}
else
{
ourBody.setAttribute('class', 'min-fixed');
ourBody.className = 'min-fixed';
}
}
else
{
createCookie('fluid', 1, 9999);
if(podmenu == 1)
{
ourBody.setAttribute('class', 'fluid-visible');
ourBody.className = 'fluid-visible';
}
else
{
ourBody.setAttribute('class', 'fluid-hiden');
ourBody.className = 'fluid-hidden';
}
}
}
return false;
}
function togglePM()
{
var fluid = readCookie('fluid');
var podmenu = readCookie('podmenu');
var ourBody = document.getElementById("resizer");
if(fluid != null && podmenu != null && ourBody != null)
{
if(podmenu == 1)
{
createCookie('podmenu', 0, 9999);
if(fluid == 1)
{
ourBody.setAttribute('class', 'fluid-hidden');
ourBody.className = 'fluid-hidden';
}
else
{
ourBody.setAttribute('class', 'min-fixed');
ourBody.className = 'min-fixed';
}
}
else
{
createCookie('podmenu', 1, 9999);
if(fluid == 1)
{
ourBody.setAttribute('class', 'fluid-visible');
ourBody.className = 'fluid-visible';
}
else
{
ourBody.setAttribute('class', 'max-fixed');
ourBody.className = 'max-fixed';
}
}
}
return false;
}
|
More Information