<html>
<head>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta charset="UTF-8">
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"/>
<link rel="stylesheet" href="./script/tocas/tocas.css">
<script src="./script/jquery.min.js"></script>
<title>vAOB Installer</title>
    <style type="text/css">
        .segment {
            max-width: 300px;
        }
    </style>
</head>
<body>
    <div class="ts fluid basic link big menu">
        <div class="ts very narrow container">
            <a href="#!" class="item">vArOZ Installer</a>
        </div>
    </div>
    <div class="ts padded horizontally fitted fluid slate">
        <div class="ts very narrow container">
            <h1 class="ts header">
                Installing
                <div class="sub header">We are going to install the system into devices...</div>
            </h1>
        </div>
    </div>
    <div class="ts very narrow container">
        <br>
			<div class="ts indeterminate progress">
				<div class="bar"></div>
			</div>
			<p>We are starting to configruate your system, it should takes about 10-15 minutes to install, depends on your system configration it may longer or shorter.</p>
    </div>
<script>
$.get( "cmd.php?step=1", function( data ) {
	if(data == "false"){
		window.location = "version.php?invaild=true";
	}else{
		$(".ts.indeterminate.progress").attr("class","ts active progress");
		$(".bar").animate({width:"10%"},3000);
		step2();
	}
});

function step2(){
	$.get( "cmd.php?step=2", function( data ) {
	if(data == "true"){
		$(".bar").animate({width:"30%"},5000);
		step3();
	}else{
	}
});
}

function step3(){
	$.get( "cmd.php?step=3", function( data ) {
	if(data == "true"){
		$(".bar").animate({width:"70%"},8000);
		step4();
	}else{
	}
});
}

function step4(){
	$.get( "cmd.php?step=4", function( data ) {
	if(data == "true"){
		$(".bar").width("100%");
		finish();
	}else{
	}
});
}
</script>
</body>
</html>