var Styles = {};



Styles.getStyle = function(el, style) { 
   if(!document.getElementById) return; 
    
   var value;
   if (el.style) {
     value = el.style[Styles.toCamelCase(style)];
   }
    
    if(!value) 
        if(document.defaultView) 
            value = document.defaultView. 
                 getComputedStyle(el, "").getPropertyValue(style); 
        
        else if(el.currentStyle) 
            value = el.currentStyle[Styles.toCamelCase(style)]; 
      
     return value; 
} 

Styles.setStyle = function (objId, style, value) { 
    document.getElementById(objId).style[style] = value; 
} 

Styles.getMousePosition = function(event) {
  var obj = new Object();
  if (event.pageX) {
    obj.x = event.pageX;
    obj.y = event.pageY;
  } else if (event.clientX) {
    obj.x = event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
    obj.y = event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
  } else {
  }
  return obj;
}

Styles.containsDOM = function(container, containee) {
  var isParent = false;
  while (containee != null) {
    if ((isParent = container == containee))
      break;
    containee = containee.parentNode;
  }
  return isParent;
}

Styles.checkMouseEnter = function(element, evt) {
  if (document.all) {
    return !element.contains(evt.fromElement);
  } else {
    return !Styles.containsDOM(element, evt.relatedTarget);
  }
}

Styles.checkMouseLeave = function (element, evt) {
  if (document.all) {
    return !element.contains(evt.toElement);
  } else {
    return !Styles.containsDOM(element, evt.relatedTarget);
  }
}

Styles.findPosition = function(obj) {
  obj = Styles.getElement(obj);
  var pos = {x:0, y:0};
  if (obj.offsetParent) {
    pos.x = obj.offsetLeft;
    pos.y = obj.offsetTop;
    if (obj.scrollTop && obj.offsetParent) {
      pos.y -= obj.scrollTop;
    }
    if (obj.scrollLeft && obj.offsetParent) {
      pos.x -= obj.scrollLeft;
    }
    while (obj = obj.offsetParent) {
      pos.x += obj.offsetLeft;
      pos.y += obj.offsetTop;
      
      if (obj.scrollTop && obj.offsetParent) {
        pos.y -= obj.scrollTop;
      }
      if (obj.scrollLeft && obj.offsetParent) {
        pos.x -= obj.scrollLeft;
      }
      
    }
  }
  return pos;
}

Styles.toCamelCase = function ( sInput ) { 
    var oStringList = sInput.split('-'); 
    if(oStringList.length == 1)    
        return oStringList[0]; 
    var ret = sInput.indexOf("-") == 0 ? 
       oStringList[0].charAt(0).toUpperCase() + oStringList[0].substring(1) : oStringList[0]; 
    for(var i = 1, len = oStringList.length; i < len; i++){ 
        var s = oStringList[i]; 
        ret += s.charAt(0).toUpperCase() + s.substring(1) 
    } 
    return ret; 
} 

Styles.getStylePixels = function(elName, style) {
  var el = Styles.getElement(elName);
  
  pixels = Styles.getStyle(el, style);

  if (pixels && pixels.substring && pixels.substring(pixels.length-2, pixels.length) == "px") {
    pixels = pixels.substring(0, pixels.length-2);
  }

  return pixels;
}

Styles.getStyleWidth = function(elName) {
  var x = Styles.getStylePixels(elName, "width");
  if (x == "auto") {
    return Styles.getElement(elName).clientWidth;
  } else {
    return x;
  }
}

Styles.getStyleHeight = function(elName) {
  var x = Styles.getStylePixels(elName, "height");
  if (x == "auto") {
    return Styles.getElement(elName).clientHeight;
  } else {
    return x;
  }
}

Styles.getActualHeight = function(elName) {
  var el = Styles.getElement(elName);
  return el.offsetHeight;
}

var scrollbarWidth = -1;
Styles.getScrollbarWidth = function() {
  if (scrollbarWidth != -1) {
    return scrollbarWidth;
  }
  var a, tf = document.forms.scrollbarWidth.elements.tf;
  tf.wrap = 'off'; a = tf.offsetHeight;
  tf.wrap = 'soft'; a -= tf.offsetHeight;

  scrollbarWidth = a;
  return scrollbarWidth;
}

Styles.setVisible = function(elName, visible, inline) {
  var el = Styles.getElement(elName);
  if (visible) {
	if (inline) {
		el.style.display = "inline";
	} else {
		el.style.display = "block";
	}
  } else {
    el.style.display = "none";
  }
}

Styles.getVisible = function(elName, visible) {
  var el = Styles.getElement(elName);
  return el.style.display == "block" || el.style.display == "inline";
}

Styles.getElement = function(elName) {
  if (typeof(elName) == "string") {
    var x = document.getElementById(elName);
    if (x == null) {
      //alert("invalid element: " + elName);
    }
    return x;
  } else {
    return elName;
  }
}

Styles.changeClass = function(elName, newClass) {
  var e = Styles.getElement(elName);
  if (e.className != newClass) {
    e.className = newClass;
  }
}

Styles.getElementsByClass = function(className, node, tag) {
  var classElements = new Array();
  if (node == null ) {
    node = document;
  }
  if (tag == null ) {
    tag = '*';
  }
  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp('(^|\\s)'+className+'(\\s|$)');
  for (i = 0, j = 0; i < elsLen; i++) {
    if (pattern.test(els[i].className) ) {
      classElements[j] = els[i];
      j++;
    }
  }
  return classElements;
}

Styles.changeImage = function(elName, newSrc, overSrc) {
  var i = Styles.getElement(elName);
  
  if (!i.src.endsWith(newSrc) && (overSrc == null || !i.src.endsWith(overSrc))) {
    i.src = newSrc;
    if (overSrc != null) {
      i.outSrc = newSrc;
      i.overSrc = overSrc;
      i.onmouseover = function() {this.src = this.overSrc;}; 
      i.onmouseout = function() {this.src = this.outSrc; };
    }
  }
}

String.prototype.endsWith = function (str) {
  return (this.substring(this.length - str.length, this.length) == str);
}