csu3_am335x/EVSE/rootfs/var/www/upgrade_iso.php

<?php
	ini_set('error_reporting', E_ALL | E_STRICT);
	$tag_header = 'upgrade';
	include 'head.php';
?>
<style>
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
</style>
	<div class="envor-content">
		<!--
		Page Title start
		//-->
		<section class="envor-page-title-1" data-stellar-background-ratio="0.5">
			<div class="container">
				<div class="row">
					<div class="col-lg-9 col-md-9 col-sm-9">
						<h1><?php echo $lang->showWord("upgrade"); ?></h1>
					</div>
				</div>
			</div>
		<!--
		Page Title end
		//-->
		</section>
		<!--
		Main Content start
		//-->
		<a id="loadinghref"><div id="loading" style="display:none;"><img src="img/giphy.gif"/></div></a>
		<div id="loading2" style="display:none;"><img id="5minutes" src="img/5minutes.gif"/></div>
		<section class="envor-section">
			<div class="container">
				<div class="row">
					<div class="col-lg-12">
						<h2>Image <?php echo $lang->showWord("upgrade");?></h2>
						<div class="file-loading">
							<input name="file_iso" id="file_iso" type="file" class="file" data-show-preview="false" data-show-upload="false" <?php //data-allowed-file-extensions='["iso"]' ?>>
						</div>

<?php /*				<input type="submit" class="btn btn-primary" id="upload_iso"></button>
				<input type="reset" class="btn btn-outline-secondary"></button>*/?>
								<article class="envor-sorting-item css">
									<div align="center"><button id="upload_iso"><?php echo $lang->showWord("set")?></button></div>
								</article>
					</div>

					<div class="col-lg-12">
						<h2><?php echo $lang->showWord("upgrade_status");?></h2>
<!--                <textarea id="description" rows="2" class="form-control" placeholder=""></textarea>-->
						<p id="createResult"></p>
					</div>
				</div>
			</div>
      <!--
      Main Content start
      //-->
		</section>
	</div>

<?php
	include 'foot.php';
?>

<script type="text/JavaScript">

	document.getElementById("upload_iso").onclick = function() {
		if(formCheck("iso"))
		{
			window.location="#loadinghref";
			document.getElementById("loading").style.display="block";
			var fileInput = document.getElementById('file_iso');

			// 發送 Ajax 查詢請求並處理
			var request = new XMLHttpRequest();
			request.open("POST", "upgrade_iso_action.php");

			// POST 參數須使用 send() 發送
			var formData = new FormData();
			//var formData = new FormData(document.getElementById("file_iso"));
			var file = fileInput.files[0];
			formData.append("fw_tag", "iso");
			formData.append("files[]", file);

			// POST 請求必須設置表頭在 open() 下面，send() 上面
			request.upload.onprogress = function(e) {
				document.getElementById("createResult").innerHTML = "Upload " + (Math.round( (e.loaded/e.total) *10000)/100) + "%";
			}
			request.send(formData);
			request.onreadystatechange = function() {
				// 伺服器請求完成
				if (request.readyState == 4) {
					document.getElementById("loading").style.display="none";
					// 伺服器回應成功
					if (request.status == 200) {
						document.getElementById("createResult").innerHTML = "";
						document.getElementById("createResult").innerHTML = request.responseText;
						document.getElementById("5minutes").src = "";
						document.getElementById("5minutes").src = "img/5minutes.gif";
						document.getElementById("loading2").style.display="block";
						var ts = 4*60*1000;
						var idx=0;
						var x = setInterval(function() { 
							idx++;
							var t=ts-1000*idx;
							if (t < 0) { 
								clearInterval(x); 
								document.getElementById("createResult").innerHTML = "<font color='#ff0000'>Upgrade done!</font>";
								document.getElementById("loading2").style.display="none";
								//location.href="upgrade_iso.php";
							}
						}, 1000); 
						var cnt=0;
						//location.href="upgrade_iso.php";
						setInterval(function(){
							var result=serverReachable();
							if(!result) cnt=1;
							if(result && cnt>=1) cnt++;
							if(cnt>=2) {
								document.getElementById("createResult").innerHTML = "<font color='#ff0000'>Upgrade done!</font>";
								document.getElementById("loading2").style.display="none";
								cnt=0;
							}
						},3000);
					} else {
						alert(JSON.parse(request.responseText).message);
					}
					request = null;
				}
				else{
					document.getElementById("createResult").innerHTML = request.responseText;
				}
			}
		}
	}

	function formCheck(fw_tag)
	{
		var file_type;

		if(fw_tag=="iso")
		{
			if(document.getElementById("file_iso").value.substring(document.getElementById("file_iso").value.length-3) != "hex")
			{
//				alert("Firmware file type is wrong, please check file type.(*.hex)");
//				document.getElementById("file_iso").focus();

//				return false;
			}

			if(document.getElementById("file_iso").value.length <= 0)
			{
				alert("Firmware is not select, please check!");
				document.getElementById("file_iso").focus();

				return false;
			}

//			if(confirm("Are you sure to update AC MCU firmware file now?...") == 1 )
				return true;
			// else
				// return false;
		}
		else
			return false;
	}

	function isNumberKey(evt)
	{
		var charCode = (evt.which) ? evt.which : event.keyCode

		if (charCode > 31 && (charCode < 48 || charCode > 57) && (charCode != 46))
			return false;

		return true;
	}

	function serverReachable() {
		// IE vs. standard XHR creation
		var x = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" ),
		s;
		x.open(
			// requesting the headers is faster, and just enough
			"HEAD",
			// append a random string to the current hostname,
			// to make sure we're not hitting the cache
			"//" + window.location.hostname + "/?rand=" + Math.random(),
			// make a synchronous request
			false
		);
		try {
			x.send();
			s = x.status;
			// Make sure the server is reachable
			return ( s >= 200 && s < 300 || s === 304 );
			// catch network & other problems
		} catch (e) {
			return false;
		}
	}
</script>