﻿
function ColorfulInput() {
   this.skip  = [];
   this.color = { 'blur': '', 'focus': '#BAFFC2', 'mouseover': '#BAFFC2', 'mouseout': '' };

   this.set = function() {
      for (var i = 0; i < document.forms.length; i++) {
         for (var f = 0; f < document.forms[i].length; f++) {
            var elm = document.forms[i][f];
            if(!this._checkSkip(elm)) continue;

            this._setColor(elm, 'focus');
            this._setColor(elm, 'blur');
            
            if(elm.type == "button" || elm.type == "submit" || elm.type == "reset" )
            {
                this._setColor(elm, 'mouseover');
                this._setColor(elm, 'mouseout');

                this._setCursor(elm, 'mouseover');
            }
         }
      }
   }

   this._checkSkip = function(elm) {
      for(var i in this.skip) {
         if(elm.type == this.skip[i]) return false;
      }
      return true;
   }

   this._setColor = function(elm, type) { 
      var color = this.color[type];
      var event = function() { elm.style.backgroundColor = color; };

      if(elm.addEventListener) {
         elm.addEventListener(type, event, false); 
      } else if(elm.attachEvent) {
         elm.attachEvent('on'+type, event); 
      } else {
         elm['on'+type] = event;
      }
   }

   this._setCursor = function(elm, type) { 
      var event = function() { elm.style.cursor = "pointer"; };

      if(elm.addEventListener) {
         elm.addEventListener(type, event, false); 
      } else if(elm.attachEvent) {
         elm.attachEvent('on'+type, event); 
      } else {
         elm['on'+type] = event;
      }
   }
}



/*
 * テロップ表示関数
 * msgs : 表示メッセージ配列
 * len  : 移動距離(px)
 * time : 移動間隔(ms)
 * id   : テロップ表示要素ID
 */
function terop(msgs, len, time, id){
    var base = document.getElementById(id);
    var stylePosition = getElementStyle(base, "position", "position");
    if(stylePosition == "" || stylePosition == "static"){
        base.style.position = "relative";
    }
    
    var styleWidth = getElementStyle(base, "width", "width");
    if(styleWidth == "" || styleWidth == "auto"){
        base.style.width = "100%";
    }
    base.style.overflow = 'hidden';
    
    var msg = document.createElement("span");
    base.appendChild(msg);
    msg.style.position = "relative";
    msg.style.left = base.offsetWidth + "px";
    msg.style.whiteSpace = "nowrap";
    
    var i = 0;
    msg.innerHTML = msgs[i];
    
    var move = function(){
        if(parseInt(msg.style.left) < -(msg.offsetWidth)){
            msg.style.left = (base.offsetWidth + 1) + "px";
            i++;
            if(i >= msgs.length) i = 0;
            msg.innerHTML = msgs[i];
        }
        
        if(parseInt(msg.style.left) > base.offsetWidth){
            msg.style.left = base.offsetWidth + "px"; 
        }else{
            msg.style.left = (parseInt(msg.style.left) - len) + "px";
        }
        setTimeout(move, time);
    };
    move();
}

/**
 * スタイル値取得関数
 * elemID       : 対象要素ID
 * IEStyleProp  : IE用CSS属性名(aaaBbb形式)
 * CSSStyleProp : その他用CSS属性名(aaa-bbb形式)
 */
function getElementStyle(elemID, IEStyleProp, CSSStyleProp){
    var elem;
    if(typeof(elemID) == "string"){
        elem = document.getElementById(elemID);
    }else{
        elem = elemID;
    }
    if(elem.currentStyle){
        return elem.currentStyle[IEStyleProp];
    }else if(window.getComputedStyle){
        var compStyle = window.getComputedStyle(elem, "");
        return compStyle.getPropertyValue(CSSStyleProp);
    }
}
