Click to See Complete Forum and Search --> : Need help with CSS style switcher


matt1776
02-04-2007, 02:48 AM
Hello,

Ive tried several ways of doing this with no success. I would like to give my web-visitor the ability to change his/her stylesheets. I would like to do this with PHP and sessions, so that there is no javascript and no cookies (in case the user has them disabled). Also I want the links to change the styles to look like this:

Previous Style Next Style

Most of the tutorials online use explicit links to specific stylesheets. Also they use cookies. At any rate ive been racking my brain, and im relatively new to PHP so this is well beyond me.

The way ive attempted to solve this is to create a list of styles, and iterate through them using an iterator variable. Depending on the link they select, i would post back an incremented or decremented value on the iterator. However this doesnt work, because i have to set the initial value somewhere, and this code gets called again, resetting the whole process.

Can anyone shed light?

sameer.net.in
02-04-2007, 03:43 AM
hi,
you can store the selected stylesheet name in session and then u can use it for all pages, or you can also store the selected stylesheet name in database for that particular user.
initial value of the session variable will be your default stylesheet,
after that the user selected stylesheet will be in session.

this way your user wont have to set stylesheet again and again

matt1776
02-04-2007, 05:04 AM
yes but this still dosent answer how i am supposed to construct an iterator that will allow the links to move through the list in succession.

If i declare an iterator, say $n, and store it in the session, then if i increment or decrement it, the iterator var will be reset the next time the page is called.

sameer.net.in
02-04-2007, 05:49 AM
<?php

//initialize your style sheet list
$styles={ 0 => "stylesheet1.css",
1 => "stylesheet2.css",
2 => "stylesheet3.css",
3 => "stylesheet4.css" };

//initialize your session variable to store the index of stylesheet
//check if a stylesheet is set in session, if not selet 0 as default style index
if( ! isset( $_SESSION[ 'selectedStyle' ] ) {
$_SESSION[ 'selectedStyleIndex' ] = 0;
$currentStyleIndex = 0;
}else{
$currentStyleIndex = $_SESSION[ 'selectedStyleIndex' ];
}


// if user selected some style by it will be available as some post or GET //variable, u can use SELECT menu for such thingm its better than using
/// next and previous links
if( isset( $_REQUEST[ 'style' ] ) ){
$_SESSION['selectStyleIndex'] = $_REQUEST[ 'style' ];
$currentStyleIndex = $_REQUEST[ 'style' ];
}

//now get the actual filename of the stylesheet from $styles

$currentStylesheetName = $styles[ $currentStyleIndex ];


?>


so my suggestion is to use select box instead of the next and previous links

html code will be something like

<form method="get" action="<?php echo $_SERVER['script_name']; ?>">
<select name="style">
<option value="0">stylesheet1.css</option>
<option value="1">stylesheet2.css</option>
<option value="2">stylesheet3.css</option>
<option value="3">stylesheet4.css</option>
</select>
</form>

bokeh
02-04-2007, 11:45 AM
What you are trying to do is known as pagination. Here is a DEMO (http://bokehman.com/tests/StylesheetSwitcher) of the code below.<?php

header('Content-Type: text/html; charset=ISO-8859-1');

$styles = array(1 => "one.css","two.css","three.css","four.css");

$style = isset($_GET['style']) ? $_GET['style'] : 1 ;
$style = ((is_numeric($style)) and ($style >= 1) and ($style <= ($count = count($styles)))) ? (int)$style : 1 ;

$links = '';

if($style > 1)
{
$links .= '<a href="'.htmlentities($_SERVER['PHP_SELF']).'?style='.($style - 1).'">Previous Style</a>';
}
else
{
$links .= '<span class="gray_out">Previous Style</span>';
}

$links .= ' | ';

if($style < $count)
{
$links .= '<a href="'.htmlentities($_SERVER['PHP_SELF']).'?style='.($style + 1).'">Next Style</a>';
}
else
{
$links .= '<span class="gray_out">Next Style</span> ';
}

?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>

<style type="text/css">
.gray_out{
color: #bbb;
}

a{
color: #00f;
text-decoration:none;
}

a:hover{
color: #f00;
text-decoration:underline;
}

.bold{
font-weight:bold;
}
</style>

<title>Stylesheet switcher</title>
</head>

<body>

<h1>Stylesheet switcher!</h1>

<p>The current stylesheet is:
<span class="bold"><?php echo $styles[$style] ?></span>
</p>

<p class="bold"><?php echo $links ?></p>

</body>
</html>