wolfmanjm/get-file.html

## get-file.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Upload Files</title>
</head>
<body>

    <h2>File Upload</h2>

    Select file

    <input type="file" id="filename" />

    <br>

    <input type="button" value="Connect" onclick="connectChatServer()" />

    <br>

    <input type="button" value="Upload" onclick="sendFile()" />

    <script>

        var ws;

        function connectChatServer() {

            ws = new WebSocket("ws://192.168.1.101/upload");

            ws.binaryType = "arraybuffer";

            ws.onopen = function() {

                alert("Connected.")

            };

            ws.onmessage = function(evt) {

                alert(evt.msg);

            };

            ws.onclose = function() {

                alert("Connection is closed...");

            };

            ws.onerror = function(e) {

                alert(e.msg);

            }

        }

        function sendFile() {
            var file = document.getElementById('filename').files[0];
            var reader = new FileReader();
            var rawData = new ArrayBuffer();
            reader.loadend = function() { }
            reader.onload = function(e) {
                rawData = e.target.result;
		ws.send(file.name);
		ws.send(rawData.byteLength);
		for (var i = 0; i < rawData.byteLength; i+=1024) {
		    if(i+1024 <= rawData.byteLength) {
		        console.log("sending: " + i + " - " + (i + 1024));
			ws.send(rawData.slice(i, i+1024));
		    }else{
		        console.log("sending: " + i + " - " + (rawData.byteLength - i));
			ws.send(rawData.slice(i));
		    }
		}
                alert("the File has been transferred.")
            }
            reader.readAsArrayBuffer(file);
        }

    </script>

</body>

</html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Upload Files</title>
	</head>
	<body>

	<h2>File Upload</h2>

	Select file

	<input type="file" id="filename" />

	<br>

	<input type="button" value="Connect" onclick="connectChatServer()" />

	<br>

	<input type="button" value="Upload" onclick="sendFile()" />

	<script>

	var ws;

	function connectChatServer() {

	ws = new WebSocket("ws://192.168.1.101/upload");

	ws.binaryType = "arraybuffer";

	ws.onopen = function() {

	alert("Connected.")

	};

	ws.onmessage = function(evt) {

	alert(evt.msg);

	};

	ws.onclose = function() {

	alert("Connection is closed...");

	};

	ws.onerror = function(e) {

	alert(e.msg);

	}

	}

	function sendFile() {
	var file = document.getElementById('filename').files[0];
	var reader = new FileReader();
	var rawData = new ArrayBuffer();
	reader.loadend = function() { }
	reader.onload = function(e) {
	rawData = e.target.result;
	ws.send(file.name);
	ws.send(rawData.byteLength);
	for (var i = 0; i < rawData.byteLength; i+=1024) {
	if(i+1024 <= rawData.byteLength) {
	console.log("sending: " + i + " - " + (i + 1024));
	ws.send(rawData.slice(i, i+1024));
	}else{
	console.log("sending: " + i + " - " + (rawData.byteLength - i));
	ws.send(rawData.slice(i));
	}
	}
	alert("the File has been transferred.")
	}
	reader.readAsArrayBuffer(file);
	}

	</script>

	</body>

	</html>