$w.onReady(function () {

    //TODO: write your page related code here...

 

});

 

export function checkbox1_change(event) {

    if($w('#checkbox1').checked===true){

        $w('#box1').style.backgroundColor="rgb(255,155,100)"

        $w('#button2').enable()

        $w('#checkbox2').enable()

        $w('#TXT1').show()

    }

    else {

        $w('#box1').style.backgroundColor="rgb(255,255,255)"

        $w('#button2').disable()

        $w('#checkbox2').disable()

        $w('#TXT1').hide()

    } 

}
 

export function checkbox2_change(event) {

    if($w('#checkbox2').checked===true){

        $w('#box2').style.backgroundColor="rgb(255,155,100)"

        $w('#button3').enable()

        $w('#checkbox1').disable()

        $w('#checkbox3').enable()

        $w('#TXT2').show()

    }

    else {

        $w('#box2').style.backgroundColor="rgb(255,255,255)"

        $w('#button3').disable()

        $w('#checkbox1').enable()

        $w('#checkbox3').disable()

        $w('#TXT2').hide()

    } 

}
 

export function checkbox3_change(event) {

    if($w('#checkbox3').checked===true){

        $w('#box3').style.backgroundColor="rgb(255,155,100)"

        $w('#button4').enable()

        $w('#checkbox2').disable()

        $w('#checkbox4').enable()

        $w('#TXT3').show()

 

    }

    else {

        $w('#box3').style.backgroundColor="rgb(255,255,255)"

        $w('#button4').disable()

        $w('#checkbox2').enable()

        $w('#checkbox4').disable()

        $w('#TXT3').hide()

    } 

}
 

export function checkbox4_change(event) {

    if($w('#checkbox4').checked===true){

        $w('#box4').style.backgroundColor="rgb(255,155,100)"

        $w('#button5').enable()

        $w('#checkbox3').disable()

        $w('#checkbox5').enable()

        $w('#TXT4').show()

        $w('#TXT5').show()

    }

    else {

        $w('#box4').style.backgroundColor="rgb(255,255,255)"

        $w('#button5').disable()

        $w('#checkbox3').enable()

        $w('#checkbox5').disable()

        $w('#TXT4').hide()

    } 

}
 

export function checkbox5_change(event) {

    if($w('#checkbox5').checked===true){

        $w('#box1').style.backgroundColor="rgb(100,155,255)"

        $w('#box2').style.backgroundColor="rgb(100,155,255)"

        $w('#box3').style.backgroundColor="rgb(100,155,255)"

        $w('#box4').style.backgroundColor="rgb(100,155,255)"

        $w('#box5').style.backgroundColor="rgb(100,155,255)"

//      $w('#button2').enable()

        $w('#checkbox4').disable()

        $w('#TXT5').text ="Checkout succsessfully completed!."

    }

    else {

        $w('#box5').style.backgroundColor="rgb(255,255,255)"

//      $w('#button2').disable()

        $w('#checkbox4').enable()

        $w('#TXT5').text ="Please complete the last stage of checkout-process."

    } 

}