/*
    circle_image_show class  --  v0.0.1  --  下午 04:29 2007/7/25 
    圖片輪播程式
    圖片會自動輪播，點擊可以換圖，點擊之後，還是可以繼續輪播

    ex.
        var circle1 = new circle_image_show();
        circle1.setContainer('show_msg');                       //顯示的id
        circle1.setPage( ['div_0','div_1','div_2','div_3'] );   //多組資料id
        circle1.playMessage();                                  //首次顯示
        setInterval( "circle1.playMessage();" , 1000 );         //連續顯示

        var circle2 = new circle_image_show();
        circle2.setContainer('show_msg2');
        circle2.setPage( ['div2_0','div2_1','div2_2','div2_3'] );
        circle2.playMessage();
        setInterval( "circle2.playMessage();" , 5000 );


*/
function circle_image_show() {
    
    this.playIndex          = -1;           //一開始顯示第幾個輪播點,第一個輪播點為 -1 
    this.countIndex         = 0;            //共有幾個輪播點
    this.objMsg             = null;         //顯示畫面的 div id  ex. document.getElementById('show_msg');
    this.objPage            = new Array();  //資料存放的 div id , 是陣列格式, 會有很多個

    //設定要顯示的 div id 容器
    this.setContainer = function( divName ) {
        this.objMsg = document.getElementById( divName );
    }

    //設定總共有那些可以顯示的頁面的 div id 容器
    this.setPage = function( pageArray ) {
        for( var i=0; i<pageArray.length; i++ ) {
            this.objPage[i] = document.getElementById( pageArray[i] );
        }
        this.countIndex = i;  //設定資料容器總量
    }

    //顯示層信息
    this.showMessage = function( selectIndex ) {
        this.objMsg.innerHTML = this.objPage[ selectIndex ].innerHTML;
    }

    //輪詢核心
    this.playMessage = function() {
        if ( this.playIndex >= (this.countIndex-1) ){
            this.playIndex = -1;
        }
        this.playIndex++;
        this.showMessage( this.playIndex );
    }

    //點擊顯示信息
    this.clickShowMessageByIndex = function(selectIndex) {
        this.showMessage(selectIndex);
        this.playIndex = selectIndex;
    }

    //用下面的執行是錯誤的，因為定義域不同，所以不能設定時間執行在整個物件之中
    //this.go = function() {
    //    var process = setInterval( this.playMessage , 1000 );
    //    clearInterval(porcess);
    //}

}