Skip to content

Commit f0f9408

Browse files
microbit-carlosmicrobit-carlos
committed
Example: Provide example page to separate a Universal Hex into iHex files.
1 parent 9e6cb14 commit f0f9408

File tree

3 files changed

+224
-1
lines changed

3 files changed

+224
-1
lines changed

‎README.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,10 @@ generate a Universal Hex from two Intel Hex files.
3535
It can be accessed online on this URL:
3636
https://tech.microbit.org/software/universal-hex-creator/
3737

38+
There is also an example showing the reverse process of separating a Universal
39+
Hex into individual Intel Hex files:
40+
https://microbit-foundation.github.io/microbit-universal-hex/examples/separate.html
41+
3842
## License
3943

4044
This software is under the MIT open source license.

‎docs/examples/separate.html

Lines changed: 219 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,219 @@
1+
<!--
2+
Based on the DAPJs web flash example:
3+
https://github.com/ARMmbed/dapjs/blob/17e2b8a421c587349b3754189bbd44cb82c1dd0c/examples/daplink-flash/web.html
4+
5+
Copyright Arm Limited 2018
6+
7+
Permission is hereby granted, free of charge, to any person obtaining a copy
8+
of this software and associated documentation files (the "Software"), to deal
9+
in the Software without restriction, including without limitation the rights
10+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11+
copies of the Software, and to permit persons to whom the Software is
12+
furnished to do so, subject to the following conditions:
13+
14+
The above copyright notice and this permission notice shall be included in all
15+
copies or substantial portions of the Software.
16+
17+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
23+
SOFTWARE.
24+
-->
25+
<!DOCTYPE html>
26+
<html>
27+
<head>
28+
<title>Universal Hex Creator</title>
29+
<meta charset="UTF-8" />
30+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
31+
<style>
32+
html {
33+
margin: 0;
34+
padding: 0;
35+
border: 0;
36+
height: 100%;
37+
}
38+
body {
39+
font: 400 16px/1.5 'Helvetica Neue', Helvetica, Arial, sans-serif;
40+
-webkit-font-smoothing: antialiased;
41+
color: #ffffff;
42+
text-align: center;
43+
background-image: linear-gradient(135deg, #cd0365 -3%, #e7645c 70%);
44+
background-attachment: fixed;
45+
}
46+
h1 {
47+
font-weight: 600;
48+
}
49+
h2 {
50+
font-weight: 500;
51+
}
52+
strong {
53+
font-weight: 600;
54+
}
55+
.drop {
56+
position: relative;
57+
margin: 20px auto;
58+
max-width: 500px;
59+
background-color: rgba(255, 255, 255, 0.1);
60+
padding: 40px 20px 65px 20px;
61+
outline: 2px dashed #ffffff;
62+
outline-offset: -10px;
63+
}
64+
.drop.hover {
65+
outline-offset: -10px;
66+
background-color: rgba(255, 255, 255, 0.2);
67+
}
68+
#icon-uh, #icon-v2 {
69+
width: 100%;
70+
fill: #ffffff;
71+
margin-top: 26px;
72+
margin-bottom: 30px;
73+
}
74+
.file {
75+
width: 0.1px;
76+
height: 0.1px;
77+
opacity: 0;
78+
z-index: -1;
79+
}
80+
.label {
81+
cursor: pointer;
82+
}
83+
.label:hover strong {
84+
color: #fccfe2;
85+
}
86+
#separate {
87+
position: absolute;
88+
left: 0;
89+
right: 0;
90+
}
91+
#button {
92+
font-size: 16px;
93+
color: inherit;
94+
margin: 20px auto;
95+
border: 1px solid #ffffff;
96+
background-color: rgba(255, 255, 255, 0.1);
97+
height: 48px;
98+
padding: 0px 48px;
99+
border-radius: 6px;
100+
text-transform: uppercase;
101+
cursor: pointer;
102+
}
103+
#button:hover {
104+
background: rgba(255, 255, 255, 0.8);
105+
color: #e6645b;
106+
}
107+
</style>
108+
</head>
109+
110+
<body>
111+
<h1>Universal Hex Creator</h1>
112+
<div id="drop-uh" class="drop">
113+
<h2>Universal Hex</h2>
114+
<svg id="icon-uh" xmlns="http://www.w3.org/2000/svg" width="50" height="43" viewBox="0 0 50 43">
115+
<path d="M48.4 26.5c-.9 0-1.7.7-1.7 1.7v11.6h-43.3v-11.6c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v13.2c0 .9.7 1.7 1.7 1.7h46.7c.9 0 1.7-.7 1.7-1.7v-13.2c0-1-.7-1.7-1.7-1.7zm-24.5 6.1c.3.3.8.5 1.2.5.4 0 .9-.2 1.2-.5l10-11.6c.7-.7.7-1.7 0-2.4s-1.7-.7-2.4 0l-7.1 8.3v-25.3c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v25.3l-7.1-8.3c-.7-.7-1.7-.7-2.4 0s-.7 1.7 0 2.4l10 11.6z" />
116+
</svg>
117+
118+
<input id="file-uh" type="file" class="file" />
119+
<label id="label-uh" for="file-uh" class="label">
120+
<strong>Select a Universal Hex file from your computer</strong><br />
121+
<span>or drag and drop it here</span>
122+
</label>
123+
</div>
124+
125+
<div id="separate">
126+
<button id="button">Separate Universal Hex</button>
127+
</div>
128+
129+
<script type="text/javascript" src="microbit-uh.umd.min.js"></script>
130+
131+
<script>
132+
let dropUhEl = document.getElementById('drop-uh');
133+
let fileUhEl = document.getElementById('file-uh');
134+
135+
// Load Intel Hex files
136+
let uHexStr = null;
137+
const setUHex = function (file) {
138+
if (!file) return;
139+
const reader = new FileReader();
140+
reader.onloadend = function (evt) {
141+
uHexStr = evt.target.result;
142+
console.log(uHexStr);
143+
document.getElementById('label-uh').textContent =
144+
'File "' + file.name + '" loaded';
145+
document.getElementById('icon-uh').style.display = 'none';
146+
};
147+
reader.readAsText(file);
148+
};
149+
150+
// Set up the file loading event listeners
151+
fileUhEl.addEventListener('change', function (event) {
152+
setUHex(event.target.files[0]);
153+
});
154+
dropUhEl.addEventListener('drop', function (event) {
155+
setUHex(event.dataTransfer.files[0]);
156+
});
157+
158+
[
159+
'drag',
160+
'dragstart',
161+
'dragend',
162+
'dragover',
163+
'dragenter',
164+
'dragleave',
165+
'drop',
166+
].forEach(function (eventName) {
167+
dropUhEl.addEventListener(eventName, function (event) {
168+
event.preventDefault();
169+
event.stopPropagation();
170+
});
171+
});
172+
173+
// Set the the listeners to highlight the drop area
174+
['dragover', 'dragenter'].forEach(function (eventName) {
175+
dropUhEl.addEventListener(eventName, function (event) {
176+
dropUhEl.classList.add('hover');
177+
});
178+
});
179+
['dragleave', 'dragend', 'drop'].forEach(function (eventName) {
180+
dropUhEl.addEventListener(eventName, function (event) {
181+
dropUhEl.classList.remove('hover');
182+
});
183+
});
184+
185+
// Function to trigger the browser to download a file
186+
let downloadTextFile = function (filename, fileStr) {
187+
let fileBlob = new Blob([fileStr], { type: 'text/plain' });
188+
let tempLink = window.document.createElement('a');
189+
tempLink.href = window.URL.createObjectURL(fileBlob);
190+
tempLink.download = filename;
191+
tempLink.style.display = 'none';
192+
document.body.appendChild(tempLink);
193+
tempLink.click();
194+
document.body.removeChild(tempLink);
195+
};
196+
197+
// Create the Universal Hex at button press
198+
let createButton = document.getElementById('button');
199+
createButton.addEventListener('click', function () {
200+
// Create the hex file and download it
201+
if (!uHexStr) {
202+
let errorMsg = 'Must have have a Universal Hex file loaded first.';
203+
console.error(errorMsg);
204+
return alert(errorMsg);
205+
}
206+
try {
207+
if (microbitUh.isUniversalHex(uHexStr)) {
208+
var separatedBinaries = microbitUh.separateUniversalHex(uHexStr);
209+
}
210+
separatedBinaries.forEach(function (hexObj) {
211+
downloadTextFile('ih-' + hexObj.boardId.toString(16) + '.hex', hexObj.hex);
212+
});
213+
} catch (e) {
214+
alert(e);
215+
}
216+
});
217+
</script>
218+
</body>
219+
</html>

‎docs/examples/webtool.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -245,7 +245,7 @@ <h2>V2 Intel Hex</h2>
245245
if (!v1HexStr || !v2HexStr) {
246246
let errorMsg = 'Must have both hex files loaded first.';
247247
console.error(errorMsg);
248-
alert(errorMsg);
248+
return alert(errorMsg);
249249
}
250250
try {
251251
let universalHex = microbitUh.createUniversalHex([{

0 commit comments

Comments
 (0)