Let's add an input:
<input type="file" id="myIfcFile">
A simple approach to run a function on each file change:
<input type="file" id="myIfcFile" onchange="myFunction()">
The detailed insctructions covered the bascis of reading a file and using BIMWHALE.js
.
var file = document.getElementById('myIfcFile').files[0];
var reader = new FileReader();
reader.onload = function(e) {
var lines = e.target.result.split(/\r\n|\n/);
// TODO
};
reader.readAsText(file);
Our HTML should look something like this:
<!DOCTYPE html>
<html>
<body>
<h3>Advanced Example</h3>
<!-- Input -->
<input type="file" id="myIfcFile" onchange="myFunction()" />
<!-- Bootstrap, jQuery, DataTables -->
<link
rel="stylesheet"
type="text/css"
href="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.22/datatables.min.css"
/>
<script
type="text/javascript"
src="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.22/datatables.min.js"
></script>
<!-- BIMWHALE.js -->
<script src="https://cdn.jsdelivr.net/gh/andrewisen/bim-whale/dist/bundle.min.js"></script>
<script>
function myFunction() {
var file = document.getElementById("myIfcFile").files[0];
var reader = new FileReader();
reader.onload = function (e) {
var lines = e.target.result.split(/\r\n|\n/);
// Create new BIMWHALE.js object
var ifcFile = new BIMWHALE.IfcFile(lines, config);
// Parse file and get IFC entiteis
var ifcEntites = ifcFile.parseIfcFile();
console.log(ifcEntites);
};
reader.readAsText(file);
}
</script>
</body>
</html>