jsgt_indicator001.js 3.41 KB
//--jsGadget--------------------------------------------------------------------------
// 最新情報   : http://jsgt.org/mt/01/
// Public Domain 著作権表示義務無し。商用利用、改造、自由。連絡不要。

////
// jsgt_Indicator インジケータ オブジェクト 
//
// @author     Toshiro Takahashi 
// @support    http://jsgt.org/mt/archives/01/000747.html
// @download   http://jsgt.org/lib/indicator/
// @version    0.02 jsgt_indicator001.js
// @license    Public Domain 著作権表示義務無し。商用利用、改造、自由。連絡不要。
// @syntax     oj = new jsgt_Indicator(src[,id])
// @sample     oj = new jsgt_Indicator('img.gif')             //DIVを自動生成する場合
// @sample     oj = new jsgt_Indicator('img.gif','nloading')  //既存のDIV名で指定する場合
// @param      id                 インジケータ用DIVのID名(省略時は"_indicator"+(new Date()).getTime())
// @method     oj.indi_start()    インジケータスタート
// @method     oj.indi_stop()     インジケータスタート
// @property   oj.div             バーを出力するdivオブジェクト
// @property   oj.div.style       スタイルオブジェクト(CSSを利用できます)
// @return     インジケータオブジェクトのインスタンス
//
// @Thanx      Thanx for AJAX Activity indicators http://mentalized.net/activity-indicators/
// 

function jsgt_Indicator(src,id)
{

  this.div        = setIndicatorDIV(src,id)
  this.indi_start = indi_start
  this.indi_stop  = indi_stop

  function setIndicatorDIV(src,id)
  {

    // インジケータを出力するdiv
    if(!id){
      id = "_indicator"+(new Date()).getTime();//idを生成;
      if(document.getElementsByTagName('BODY').length==0)
        document.write('<body>')//ダミーのbodyタグ
      var creDIV = document.createElement("DIV") ;
      this.div = document.body.appendChild(creDIV) ;
      this.div.setAttribute("id",id) ;

      this.div.style.position = "relative";
      this.div.style.top      = "0px";
      this.div.style.left     = "0px";
      this.div.style.width    = "0px";
      this.div.style.height   = "0px";

    } else {
      this.div = document.getElementById(id)
    }

    // インジケータ用DIVのデフォルト値(インスタンスで上書き変更できます)
    this.div.style.margin  = '0px' ; //バーのマージン
    this.div.style.padding = '0px' ; //バーのパディング

    //インジケータ画像のプレロード
    this.div.img = new Image()
    this.div.img.src = src

    // インジケータのデフォルト値
    this.div.indi_bar= '|';             //バーのキャラクタ
    this.div.indi_interval= 50;         //インジケータ インターバル 1/1000秒単位
    this.div.indi_count =0;             //インジケータカウンター初期値
    this.div.indi_count_max =18;        //インジケータ カウンターMax

    this.div.indi_array= [];             //バーのタイマーIDを格納する配列
    return this.div
  }

  //インジケータ スタート
  function indi_start()
  {
    //サイズを与えることで表示する
    this.div.style.height ="12px";
    this.div.style.width ="auto";
    this.div.innerHTML  = '<img src="'+this.div.img.src+'">' ;
  }

  //インジケータ ストップ
  function indi_stop()
  {
    this.div.style.width ="0px";
    this.div.style.height ="0px";
    this.div.innerHTML  = '' ;
  }

  return this
}