// Plugin for creating a simple body-class-switching control. Assumes that you now have submit buttons in a form that
// have name='groupOfClasses' value='newClass' and the server-side code sets
// and removes all other classes in groupOfClasses, and uses a cookie to remember the desired class.
// In PHP it would be:
// $group = 'groupOfClasses';
// $bodyclass = $_GET[$group];
// if ($bodyclass){
// echo "";
// setcookie ($group, $bodyclass, time()+365*24*60*60, '/');
// }elseif ($_COOKIE[$group]){
// echo "";
// }else{
// echo "";
// }
// With appropriate input-scrubbing, of course!
// And HTML of
//
// The plugin is called with $('input:submit.whateverSelector').bodySwitcher()
// and hides the original submit buttons and creates radio buttons that when clicked
// remove the old body classes from that group and add the new one:
//
(function($){
// private variables
var uid=0;
var date = new Date();
date.setTime (date.getTime() +365*24*60*60*1000);
var cookieExpires = "; path=/; expires="+date.toGMTString();
$.fn.bodySwitcher = function(){
var $body = $('body');
return this.each(function(){
$('').insertAfter(this).attr('for', 'bodyswitcher'+(++uid)).text(this.value).prepend(
$(''). // stupid IE won't take attr ('name') or attr('checked')
attr({
className: this.className,
value: this.value,
id: 'bodyswitcher'+(uid) // stupid IE doesn't support implicit labels!
}).
click(function(){
$('input:radio[name='+this.name+']').each (function(){$body.removeClass(this.value)});
$body.addClass(this.value);
document.cookie = this.name+"="+this.value+cookieExpires;
})
)
$(this).hide(); // remove the original
});
};
})(jQuery);