Skip to content

Commit db9be46

Browse files
authored
Merge pull request #19 from TiGBS/master
Thermometer
2 parents f088e62 + 18a1646 commit db9be46

File tree

12 files changed

+483
-110
lines changed

12 files changed

+483
-110
lines changed

editor.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!DOCTYPE html>
1+
<!DOCTYPE html>
22
<html lang="en">
33
<!--
44
.:://++++++//:-.
@@ -68,9 +68,9 @@
6868
<link rel="icon" href="static/img/favicon.ico">
6969
</head>
7070
<body>
71-
<iframe id="sim-iframe" src="about:blank" width="810px" height="310px" frameborder="0" scrolling="no" style="position: absolute; bottom: 20px; right: 20px; z-index: 10;"></iframe>
71+
<iframe id="sim-iframe" src="about:blank" frameborder="0" scrolling="no"></iframe>
7272
<script type="application/javascript">
73-
<!-- VERSION INFORMATION -->
73+
// VERSION INFORMATION
7474
VERSION = "0.1.0";
7575
</script>
7676
<script id="load-template" type="x-tmpl-mustache">
@@ -361,7 +361,7 @@ <h2><i class="fa fa-unlock-alt"></i> <strong>{{ title }}</strong></h2>
361361
}
362362
},
363363
'flags': {
364-
'blocks': true,
364+
'blocks': false,
365365
'snippets': true,
366366
'share': true,
367367
'experimental': false,

lib/lib.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ var PythonIDE = {
4242

4343
files: {'mycode.py': decodeURIComponent(window.location.search.substring(6))},
4444

45-
// functions and data needed for running theh python code
45+
// functions and data needed for running the python code
4646
python: {
4747
outputListeners: [],
4848

lib/skulpt/microbit/__init__.js

Lines changed: 43 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ var compass = function(name) {
102102
});
103103

104104
return mod;
105-
};
105+
}; // END compass
106106

107107
var accelerometer = function(name) {
108108

@@ -162,7 +162,7 @@ var accelerometer = function(name) {
162162
});
163163

164164
return mod;
165-
}
165+
} // END accelerometer
166166

167167
var display = function(name) {
168168
var leds = [[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0],[0,0,0,0,0]];
@@ -925,7 +925,7 @@ var display = function(name) {
925925

926926

927927
return mod;
928-
}
928+
} // END display
929929

930930

931931

@@ -1389,6 +1389,25 @@ var $builtinmodule = function (name) {
13891389
html += '<div class="mb_led mb_led_row_' + y + ' mb_led_col_' + x + '"></div>';
13901390
}
13911391
}
1392+
1393+
var pinTp = '';
1394+
for (var i = 0; i < 21; i++)
1395+
{
1396+
switch (i)
1397+
{
1398+
case 0: case 1: case 2:
1399+
pinTp = 'tch';
1400+
break;
1401+
case 3: case 4: case 10:
1402+
pinTp = 'anlg';
1403+
break;
1404+
default:
1405+
pinTp = 'dgtl';
1406+
break;
1407+
}
1408+
1409+
html += '<div id="mb_pin_' + i + '" class="mb_pin mb_pin_' + pinTp + '"></div>';
1410+
}
13921411
html += '</div>';
13931412
PythonIDE.python.output(html, true);
13941413
$('#mb_btn_radio_send').button().click(function() {
@@ -1497,7 +1516,7 @@ var $builtinmodule = function (name) {
14971516
}
14981517
}
14991518
function updatePinSpinner(pinNumber) {
1500-
var pinType = undefined;
1519+
var pinType = undefined, pTC = undefined;
15011520
var pin = undefined;
15021521
var html = '';
15031522
function sliderChange(event, ui) {
@@ -1508,7 +1527,7 @@ var $builtinmodule = function (name) {
15081527
case 0:
15091528
case 1:
15101529
case 2:
1511-
pinType = "Touch";
1530+
pinType = "Touch"; pTC = 'Touch';
15121531
pin = mod['pin' + pinNumber];
15131532
html = '<button id="mb_btn_pin_touch">Touch</button>';
15141533
$('#mb_pin_detail').html(html);
@@ -1521,12 +1540,13 @@ var $builtinmodule = function (name) {
15211540
case 3:
15221541
case 4:
15231542
case 10:
1524-
pinType = "Analog";
1543+
pinType = "Analog"; pTC = 'Analog';
15251544
pin = mod['pin' + pinNumber];
15261545
html = 'Value: <span id="mb_pin_analog_value">' + pin.value + '</span><div class="mb_slider" id="mb_pin_analog"></div> PWM period: ' + pin.period_us / 1000 + 'ms';
15271546
$('#mb_pin_detail').html(html);
15281547
$('#mb_pin_analog').slider({
15291548
value: pin.value,
1549+
orientation: 'vertical',
15301550
min: 0,
15311551
max: 1023,
15321552
step: 1,
@@ -1546,10 +1566,10 @@ var $builtinmodule = function (name) {
15461566
case 16:
15471567
case 19:
15481568
case 20:
1549-
pinType = "Digital";
1569+
pinType = "Digital"; pTC = 'Digital';
15501570
pin = mod['pin' + pinNumber];
15511571

1552-
html = 'Currently switched: <button id="mb_btn_pin_digital">' + (pin.value? 'On' : 'Off') + '</button>';
1572+
html = 'Currently switched:<br/> <button id="mb_btn_pin_digital">' + (pin.value? 'On' : 'Off') + '</button>';
15531573

15541574
$('#mb_pin_detail').html(html);
15551575
$('#mb_btn_pin_digital').button().click(function() {
@@ -1558,18 +1578,23 @@ var $builtinmodule = function (name) {
15581578
});
15591579
break;
15601580
default:
1561-
pinType = "+3v";
1581+
pinType = "+3v"; pTC = 'threeVolts';
15621582
$('#mb_pin_detail').html(html);
15631583
break;
15641584

15651585
}
15661586

15671587

1568-
$('#mb_pin_type').text('Type: ' + pinType);
1588+
$('#mb_pin_type').html('Type: <strong class="' + pTC + '">' + pinType + '</strong>');
15691589
}
15701590
$('#mb_pin_num').spinner({
15711591
spin: function(event, ui) {
15721592
updatePinSpinner(ui.value);
1593+
1594+
$('.mb_pin').each(function() {
1595+
$(this).animate({opacity: '0'}, 500);
1596+
});
1597+
15731598
if(ui.value < 0) {
15741599
$('#mb_pin_num').spinner("value", 20 );
15751600
return false;
@@ -1578,6 +1603,8 @@ var $builtinmodule = function (name) {
15781603
$('#mb_pin_num').spinner("value", 0 );
15791604
return false;
15801605
}
1606+
1607+
$('#mb_pin_' + ui.value).animate({opacity: '1'}, 500);
15811608
}
15821609
});
15831610
$('#mb_pin_num').spinner("value", 0);
@@ -1641,16 +1668,17 @@ var $builtinmodule = function (name) {
16411668
mod.compass.$d.data.heading = ui.value;
16421669
}
16431670

1644-
$('.mb_slider').slider({
1645-
value: 0,
1646-
min: -1024,
1647-
max: 1024,
1671+
$('.mb_slider').slider({
1672+
orientation: 'vertical',
1673+
value: 23,
1674+
min: 0,
1675+
max: 100,
16481676
step: 1,
16491677
change: sliderChange
16501678
}).on("slide", sliderChange);
16511679
$('#mb_therm_slider').slider({
16521680
value: 23,
1653-
min: 0,
1681+
min: -50,
16541682
max: 100
16551683
});
16561684
$('.mb_slider_com').slider({

lib/skulpt/microbit/mb.css

Lines changed: 121 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
#mb_tabs {
22
font-size:10pt;
33
}
4-
#mb_pin_num {
5-
font-size: 0.8em;
6-
}
74

85
#microbit {
96
width: 300px;
@@ -36,21 +33,21 @@
3633
}
3734

3835
.mb_help_link {
39-
font-size: small;
40-
background-color: #FFF;
41-
border-radius: 10px;
42-
padding: 10px;
43-
color: #000;
36+
width: 100%;
37+
display: block;
38+
font-size: 10px;
39+
color: #000000;
40+
background-color: #FFFFFF;
41+
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 5%, rgba(255, 255, 255, 0.6) 95%, rgba(255, 255, 255, 0) 100%);
42+
text-align: center;
4443
transition: all 0.5s;
45-
margin: 5px;
46-
border-style: solid;
47-
border-width: 1px;
48-
border-color: #000;
49-
display:inline-block;
44+
45+
margin: 2px 0;
46+
padding: 10px 0;
5047
}
5148

5249
.mb_help_link:hover {
53-
background-color: #F00;
50+
background: linear-gradient(90deg, rgba(255, 46, 46, 0) 0%, rgba(255, 46, 46, 0.6) 5%, rgba(255, 46, 46, 0.6) 95%, rgba(255, 46, 46, 0) 100%);
5451
}
5552
.mb_led_brightness_0 { background-color: #000; }
5653
.mb_led_brightness_1 { background-color: #300; }
@@ -127,7 +124,7 @@
127124
}
128125
.mb_current_gesture {
129126
color: #F00;
130-
margin; 1em;
127+
margin: 1em;
131128
}
132129
.mb_active_gesture_down {
133130
transform: rotate(180deg);
@@ -162,4 +159,113 @@
162159
.mb_active_gesture_8g {
163160
animation-name: shake;
164161
animation-duration: 0.1s;
162+
}
163+
164+
/* Thermometer */
165+
#mb_therm_slider
166+
{
167+
height: 320px; width: 12px;
168+
position: absolute;
169+
left: 320px;
170+
bottom: 0;
171+
float: right;
172+
background: linear-gradient(180deg, rgba(255, 0, 0, 1) 0%, rgba(255, 255, 255, 1) 66%, rgba(0, 255, 255, 1) 100%);
173+
}
174+
175+
.mb_pin {
176+
position: absolute;
177+
bottom: -8px;
178+
background-color: green;
179+
height: 34px;
180+
border-radius: 0 0 3px 3px;
181+
opacity: 0;
182+
}
183+
.mb_pin_dgtl {
184+
width: 5px;
185+
background: linear-gradient(0deg, rgb(3, 231, 3) 0%, rgba(3, 231, 3, 1) 30%, rgba(3, 231, 3, 0) 100%);
186+
}
187+
.mb_pin_anlg {
188+
width: 5px;
189+
background: linear-gradient(0deg, rgb(7, 7, 207) 0%, rgba(7, 7, 207, 1) 30%, rgba(7, 7, 207, 0) 100%)
190+
}
191+
.mb_pin_tch {
192+
width: 24px;
193+
background: linear-gradient(0deg, rgb(255, 17, 17) 0%, rgba(255, 17, 17, 1) 30%, rgba(255, 17, 17, 0) 100%)
194+
}
195+
196+
197+
#mb_pin_num {
198+
font-size: 0.8em;
199+
}
200+
201+
#mb_pin_analog {
202+
height: 240px; width: 12px;
203+
left: 320px; bottom: 0;
204+
float: left;
205+
border: none;
206+
background: rgb(3, 3, 121);
207+
}
208+
209+
#mb_pin_analog span {
210+
height: 20px; width: 30px;
211+
position: absolute;
212+
left: -18px;
213+
border: none;
214+
border-radius: 10px 0 0 10px;
215+
background: rgb(7, 7, 207);
216+
cursor: pointer;
217+
}
218+
219+
/* Touch Pins */
220+
#mb_pin_0 { left: 15px; opacity: 1; }
221+
#mb_pin_1 { left: 74px; }
222+
#mb_pin_2 { left: 141px; }
223+
224+
/* Analogue Pins */
225+
#mb_pin_3 { left: 5px; }
226+
#mb_pin_4 { left: 42.5px; }
227+
#mb_pin_10 { left: 117px; }
228+
229+
/* Digital Pins */
230+
#mb_pin_5 { left: 50px; }
231+
#mb_pin_6 { left: 57.5px; }
232+
#mb_pin_7 { left: 65.5px; }
233+
#mb_pin_8 { left: 102px; }
234+
#mb_pin_9 { left: 109px; }
235+
#mb_pin_11 { left: 125px; }
236+
#mb_pin_12 { left: 132px; }
237+
#mb_pin_13 { left: 168.5px; }
238+
#mb_pin_14 { left: 176px; }
239+
#mb_pin_15 { left: 184px; }
240+
#mb_pin_16 { left: 191px; }
241+
#mb_pin_17 { left: 198px; }
242+
#mb_pin_18 { left: 234.5px; }
243+
#mb_pin_19 { left: 242.5px; }
244+
#mb_pin_20 { left: 249px; }
245+
246+
247+
#mb_pin_type {
248+
margin: 10px 0;
249+
padding: 0 0 0 10px;
250+
background-color: rgba(20, 20, 20, 0.4);
251+
}
252+
253+
#mb_pin_type strong { font-weight: 700; }
254+
#mb_pin_type strong.Analog { color: rgb(7, 7, 207); }
255+
#mb_pin_type strong.Digital { color: rgb(3, 231, 3); }
256+
#mb_pin_type strong.Touch { color: #d40d0d; }
257+
#mb_pin_type strong.threeVolts { color: #eed814; }
258+
259+
#mb_btn_pin_touch {
260+
color: #FFFFFF;
261+
background: #d40d0d;
262+
border-radius: 5px;
263+
border: none;
264+
}
265+
266+
#mb_btn_pin_digital {
267+
color: #FFFFFF;
268+
background: rgb(3, 231, 3);
269+
border-radius: 5px;
270+
border: none;
165271
}

python-main.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -207,7 +207,7 @@ function pythonEditor(id) {
207207
}
208208

209209
return editor;
210-
};
210+
}; // END func pythonEditor
211211

212212
/*
213213
The following code contains the various functions that connect the behaviour of

show.sh

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
#!/bin/bash
22
echo "http://localhost:8000/editor.html"
3-
python3 -m http.server --bind 0.0.0.0
3+
py -m http.server --bind 0.0.0.0

0 commit comments

Comments
 (0)