//select_btn.js  設定

function btn1_over(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select_on01.gif';
}

function btn2_over(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select_on02.gif';
}

function btn3_over(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select_on03.gif';
}

function btn1_out(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select01.gif';
}

function btn2_out(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select02.gif';
}

function btn3_out(){
    var objElement = document.getElementById( 'select_btn01' );
    objElement.src = templatePath + '/resources/images/home/btn_select03.gif';
}

Ext.onReady(function() {

    // カルーセル生成
    var cl = new Ext.ux.Carousel('car_wrap', {
        itemSelector: 'div.car_item',
        interval: 10,
        transitionDuration: 1,
        transitionEasing: 'easeOut',
        hideNavigation: true,
        freezeOnHover: true,
        showPlayButton: false,
        autoPlay: true
    });

    Ext.fly('btn').on('click', function(e, t) {

        // ボタンクリック時
        if (t = e.getTarget('area')) {

            // 番号取得
            var n = t.id.replace('carousel_btn', '');
            if (!isNaN(n)) {
                e.stopEvent();
                n = parseInt(n, 10);
                cl.pause();
                cl.setSlide(n-1);
                cl.play();
            }

        }

    });

    cl.on('change', function(dom, idx) {
        // カルーセル内容変更時
        var n = (idx + 1).toString();
        Ext.fly('select_btn01').set({
            src: templatePath + '/resources/images/home/btn_select0'+n+'.gif'
        });
    });

})