className={
  active:"active",
  hover:"hover",
  focus:"focus",
  warn:"warn",
  hide:"hide",
  required:"required", // For form elements
  bypass:"bypass" // For form elements
}

css={};



/* ********************************************** */
/* Functions to add, remove, and swap class names */
/* ********************************************** */
css.add=function(elm, cssClass) {
  elm.className+=" " + cssClass;
}

css.del=function(elm, cssClass){
  elm.className = elm.className.replace( new RegExp('[\s]*'+cssClass+'[\s]*','g') ,'');
}

css.swap=function(elm, cssClass1, cssClass2){
  if( elm.className.indexOf(cssClass1) < 0 ){
    css.del( elm, cssClass2);
    css.add( elm, cssClass1);
  } else {
    css.del(elm,cssClass1);
    css.add(elm,cssClass2);
  }
}



/* Get objects style */
css.getStyle=function(elm,name){
  if(elm.style[name])
    return elm.style[name];
  else if(elm.currentStyle)
    return elm.currentStyle[name];
  else if(document.defaultView && document.defaultView.getComputedStyle){
    name = name.replace(/([A-Z])/g,"-$1").toLowerCase();
    var style=document.defaultView.getComputedStyle(elm,"");
    return style && style.getPropertyValue(name);
  }
  else return null;
}

/* Sets new values, returns old */
css.reset=function(elm, prop){
  var old = {};
  for (var i in prop){
    old[i] = elm.style[i];
    elm.style[i]=prop[i];
  }
  return old;
}


/* dx from documents left */
css.pageX=function(elm){
  return elm.offsetParent ? elm.offsetLeft + css.pageX(elm.offsetParent) : elm.offsetLeft;
}

/* dy from documents top */
css.pageY=function(elm){
  return elm.offsetParent ? elm.offsetTop + css.pageY(elm.offsetParent) : elm.offsetTop;
}



/* dx from parent's left */
css.parentX=function(elm){
  return elm.parentNode == elm.offsetParent ? elm.offsetLeft : css.pageX(elm) - css.pageX(elm.parentNode);
}

/* dy from parent's top */
css.parentY=function(elm){
  return elm.parentNode == elm.offsetParent ? elm.offsetTop : css.pageY(elm) - css.pageY(elm.parentNode);
}



/* dx from css containers left */
css.posX=function(elm){
  return parseFloat( css.getStyle(elm,'left') );
}

/* dy from css containers top */
css.posY=function(elm){
  return parseFloat(css.getStyle(elm,'top') );
}


/* Set X position */
css.setX=function(elm,x){
  elm.style.left=x+'px';
}

/* Set Y position */
css.setY=function(elm,y){
  elm.style.top=y+'px';
}

/*Set Both X And Y of an Element */
css.setXY=function(elm, x, y){
  css.setX(elm, x);
  css.setY(elm, y);
}

/* Adjust X position relative to current position */
css.addX=function(elm,dx){
  css.setX(elm, css.posX(elm) + dx );
}

/* Adjust Y position relative to current position */
css.addY=function(elm,dy){
  css.setY(elm, css.posY(elm) + dy);
}

/*Add both X and Y */
css.addXY=function(elm,dx,dy){
  css.addX(elm,dx);
  css.addY(elm,dy);
}


/* Get the css height of elm */
css.getHeight=function(elm){
  return parseFloat( css.getStyle(elm, 'height') );
}

/* Get height with force */
css.getFullHeight=function(elm){
  if(css.getStyle(elm,'display') != 'none')
    return elm.offsetHeight || css.getHeight(elm);

  var old = css.reset(elm,{
    display:'',
    visibility:'hidden',
    position:'absolute'
  });

  var h = elm.clientHeight || css.getHeight(elm);
  css.reset(elm, old);
  return h;
}

/*Get the css width of element  */
css.getWidth=function(elm){
  return parseInt( css.getStyle( elm, 'width') );
}

/* get width with force */
css.getFullWidth=function(elm){
  if(css.getStyle(elm,'display')!='none' )
    return elm.offsetWidth || css.getWidth(elm);

  var old = css.reset(elm,{
    display:'',
    visibility:'hidden',
    position:'absolute'
  });

  var w = elm.clientWidth || css.getWidth(elm);
  css.reset(elm, old);
  return w;
}

/* Get the page height */
css.pageHeight=function(){
  return document.body.scrollHeight;
}

/* Get the page width */
css.pageWidth=function(){
  return document.body.scrollWidth;
}

/* How far horizontally browser is scrolled */
css.scrollX=function(){
  var de=document.documentElement;
  return self.pageXOffset || (de && de.scrollLeft) || document.body.scrollLeft;
}

/* How far vertically browser is scrolled */
css.scrollY=function(){
  var de=document.documentElement;
  return self.pageYOffset || (de && de.scrollTop) || document.body.scrollTop;
}

/* Current viewport height */
css.windowHeight=function(){
  var de=document.documentElement;
  return self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;
}

/* Current viewport width */
css.windowWidth=function(){
  var de=document.documentElement;
  return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
}


/* Mouse dx relative to element */
css.mouseParentX=function(e){
  return (e && e.layerX) || window.event.offsetX;
}

/* Mouse dy relative to element */
css.mouseParentY=function(e){
  return (e && e.layerY) || window.event.offsetY;
}

/* mouse dx relative to document */
css.mousePageX=function(e){
  return (e || window.event).pageX || (e || window.event).clientX + document.body.scrollLeft;
}

/* mouse dy relative to document */
css.mousePageY=function(e) {
  return (e || window.event).pageY || (e || window.event).clientY + document.body.scrollTop;
}


/* Store current display status, and hide element */
css.hide=function(elm){
  var nowDisplay=css.getStyle(elm,'display');
  if(nowDisplay!='none') elm.$oldDisplay=nowDisplay;
  elm.style.display='none';
}

/* Restore display from storage or to its default */
css.show=function(elm){
  elm.style.display=elm.$oldDisplay || '';
}

css.setOpacity=function(elm, opacity){
  elm.style.filter='alpha(opacity=' + opacity + ')';
  elm.style.opacity=opacity/100;
}