Template:Corso/Fonte

2026-08-01T11:30:08Z

Admin: Creata pagina con "<div class="fonte">{{{1}}}</div>"

Template:Corso/Sfida

2026-08-01T11:29:41Z

Admin: Creata pagina con "{{#switch:{{{1}}} |stella=<span class="badge">⭐ Stella</span> |cometa=<span class="badge">⭐⭐ Cometa</span> |razzo=<span class="badge">⭐⭐⭐ Razzo</span> }} <div clas..."

{{#switch:{{{1}}}
|stella=<span class="badge">⭐ Stella</span>
|cometa=<span class="badge">⭐⭐ Cometa</span>
|razzo=<span class="badge">⭐⭐⭐ Razzo</span>
}}
<div class="sfida {{{1}}}">{{{2}}}</div>

Template:Corso/Warn

2026-08-01T11:29:26Z

Admin: Creata pagina con "<p class="warn">{{{1}}}</p>"

Corsi/Microbit/Lezione 1

2026-08-01T11:28:57Z

Admin: Creata pagina con "{{Corso/Microbit/Pagina|1=Lezione 1 · 90-120 minuti|2=👋 Ciao, micro:bit!|obiettivo=Obiettivo: '''accendere il tuo micro:bit, scrivere il primo programma e mostrare il tuo..."

Template:Corso/Passo

2026-08-01T11:28:25Z

Admin: Creata pagina con "<div class="passo">{{{1}}}</div>"

Template:Corso/FinePassi

2026-08-01T11:28:03Z

Admin: Creata pagina con "</div>"

</div>

Template:Corso/Passi

2026-08-01T11:27:43Z

Admin: Creata pagina con "<div class="passi">"

Template:Corso/FineMateriali

2026-08-01T11:27:06Z

Admin: Creata pagina con "</ul>"

</ul>

Template:Corso/Materiali

2026-08-01T11:26:37Z

Admin: Creata pagina con "<ul class="materiali">"

Template:Corso/Pagina

2026-08-01T11:24:16Z

Admin: Creata pagina con "<div class="course course-microbit"> <div class="lesson-num">{{{1}}}</div> <h1>{{{2}}}</h1> <p class="obiettivo">{{{obiettivo}}}</p>"

<div class="course course-microbit">
<div class="lesson-num">{{{1}}}</div>
<h1>{{{2}}}</h1>
<p class="obiettivo">{{{obiettivo}}}</p>

Template:Corso/Tip

2026-08-01T11:23:25Z

Admin: Creata pagina con "<div class="card tip">{{{1}}}</div>"

Template:Corso/FinePagina

2026-08-01T11:22:42Z

Admin: Creata pagina con "<div class="lesson-footer"> <div class="pagination">{{#if:{{{prev|}}}|<span>← {{{prev}}}</span>|}} {{#if:{{{next|}}}|<span>{{{next}}} →</span>|}}</div> </div> </div>"

Corsi/Microbit

2026-08-01T11:22:05Z

Admin: Creata pagina con "{{Corso/Microbit/Pagina|1=Corso completo · 9 lezioni|2=🤖 Corso micro:bit|obiettivo=Obiettivo: '''imparare a programmare il micro:bit in MakeCode, dai primi passi ai compon..."

{{Corso/Microbit/Pagina|1=Corso completo · 9 lezioni|2=🤖 Corso micro:bit|obiettivo=Obiettivo: '''imparare a programmare il micro:bit in MakeCode, dai primi passi ai componenti esterni — sensori, luci, servo e radio.'''}}
== 🗺️ Il percorso ==

Nove lezioni autonome, a progetti. Ogni lezione ha '''passi di costruzione''', '''sfide a 3 livelli''' (⭐ Stella, ⭐⭐ Cometa, ⭐⭐⭐ Razzo) e un '''quiz'''. Le prime sei usano solo il micro:bit; le ultime tre collegano componenti esterni (LED, servomotore, sensori).

{| class="wikitable"
|-
! #
! Lezione
! Cosa impari
|-
| 1
| [[Corsi/Microbit/Lezione 1|👋 Ciao, micro:bit!]]
| MakeCode, il display 5×5, {{Corso/Microbit/Blocco|1=basic|2=mostra stringa}} e le icone.
|-
| 2
| [[Corsi/Microbit/Lezione 2|🕹️ Pulsanti e variabili]]
| Eventi, variabili, {{Corso/Microbit/Blocco|1=logic|2=se … allora}} e un dado.
|-
| 3
| [[Corsi/Microbit/Lezione 3|🎲 Movimento]]
| Sensori di movimento e il blocco {{Corso/Microbit/Blocco|1=math|2=mappa _}}.
|-
| 4
| [[Corsi/Microbit/Lezione 4|🎵 Suono e musica]]
| Melodie, note e la tastiera musicale del micro:bit.
|-
| 5
| [[Corsi/Microbit/Lezione 5|🌡️ Sensori: temperatura e luce]]
| Sensori interni, {{Corso/Microbit/Blocco|1=led|2=disegna un grafico a barre}} e un termometro.
|-
| 6
| [[Corsi/Microbit/Lezione 6|📡 Radio: messaggi tra due micro:bit]]
| La radio, i gruppi e il walkie-talkie tra due schede.
|-
| 7
| [[Corsi/Microbit/Lezione 7|💡 LED: luci esterne]]
| I pin, {{Corso/Microbit/Blocco|1=pin|2=scrivi digitale/analogico}} e un semaforo.
|-
| 8
| [[Corsi/Microbit/Lezione 8|🦾 Servomotore]]
| La breadboard, il servo SG90 e l'angolo {{Corso/Microbit/Blocco|1=pin|2=imposta l'angolo del servo}}.
|-
| 9
| [[Corsi/Microbit/Lezione 9|🌊 Sensori: acqua e temperatura]]
| Segnali analogici, {{Corso/Microbit/Blocco|1=pin|2=leggi pin analogico}} e sensori esterni.
|}
== 🧰 Reference ==

{{Corso/Microbit/Tip|1=
'''[[Microbit/Riferimento/Glossario|Glossario]]''' — le parole nuove spiegate semplici, dal blocco alla variabile al pin.
'''[[Microbit/Riferimento/Blocchi|Cheat-sheet dei blocchi]]''' — tutti i blocchi MakeCode che usiamo, con i loro nomi italiani ufficiali e i link alla documentazione.
}}

== 🎓 Consigli per lo studio ==

* Fai le lezioni '''in ordine''': i concetti si costruiscono uno sull'altro.
* Non saltare le '''sfide''': è lì che diventi davvero bravo.
* Riprova le sfide Razzo in '''vista Python''' per vedere il codice vero.
* Se ti blocchi, usa il '''tutor automatico''' o chiedi a un '''mentor'''.

{{Corso/Microbit/FinePagina|prev=|next=}}

Template:Corso/BloccoBool

2026-08-01T11:19:51Z

Admin: Creata pagina con "<span class="blk blk-bool blk-{{{1}}}">{{{2}}}</span>"

Template:Corso/BloccoVal

2026-08-01T11:19:05Z

Admin: Creata pagina con "<span class="blk blk-val blk-{{{1}}}">{{{2}}}</span>"

Template:Corso/BloccoHat

2026-08-01T11:18:38Z

Admin: Creata pagina con "<span class="blk blk-hat blk-{{{1}}}">{{{2}}}</span>"

Template:Corso/Quiz

2026-08-01T11:18:03Z

Admin: Creata pagina con "<div class="quiz-q" data-answer="{{{risposta}}}" data-ok="{{{ok}}}" data-retry="{{{riprova}}}"> <p class="q-text">{{{domanda}}}</p> <div class="quiz-btns"> <span class="quiz-b..."

<div class="quiz-q" data-answer="{{{risposta}}}" data-ok="{{{ok}}}" data-retry="{{{riprova}}}">
<p class="q-text">{{{domanda}}}</p>
<div class="quiz-btns">
<span class="quiz-btn" data-opt="A" role="button" tabindex="0">{{{A}}}</span>
<span class="quiz-btn" data-opt="B" role="button" tabindex="0">{{{B}}}</span>
{{#if:{{{C|}}}|<span class="quiz-btn" data-opt="C" role="button" tabindex="0">{{{C}}}</span>}}
</div>
<p class="quiz-feedback" aria-live="polite"></p>
</div>

Template:Corso/Blocco

2026-08-01T11:17:23Z

Admin: Creata pagina con "<span class="blk blk-{{{1}}}">{{{2}}}</span>"

MediaWiki:Gadget-course.css

2026-08-01T11:00:33Z

Admin: Creata pagina con "/* Gadget "course" — stili scoped del corso micro:bit. .course = struttura condivisa (qualsiasi corso) .course-microbit = palette della tecnologia micro:bit (fallback..."

/* Gadget "course" — stili scoped del corso micro:bit.
.course = struttura condivisa (qualsiasi corso)
.course-microbit = palette della tecnologia micro:bit (fallback no-JS) */
.course { max-width: 760px; margin: 0 auto; padding: 0 1.25rem 4rem; font-size: 17px; line-height: 1.65; }
.course h2 { font-size: 1.35rem; margin: 2.6rem 0 0.8rem; padding-top: 1.2rem; border-top: 2px solid #e3e0d6; }
.course p { margin: 0.6rem 0; }
.course ul, .course ol { margin: 0.6rem 0; padding-left: 1.4rem; }
.course li { margin: 0.35rem 0; }
.course a { color: #2e2c9c; }
.course code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.course .lesson-num { display: inline-block; font-weight: 800; font-size: 0.85rem; letter-spacing: 0.14em; text-transform: uppercase; background: rgba(46,44,156,0.12); color: #2e2c9c; padding: 0.25rem 0.8rem; border-radius: 999px; margin-bottom: 0.9rem; }
.course h1 { font-size: 2.2rem; line-height: 1.15; letter-spacing: -0.01em; margin: 0 0 0.6rem; }
.course .obiettivo { font-size: 1.15rem; opacity: 0.95; }
.course .obiettivo strong { color: #ffb400; }

.course .materiali { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.course .materiali li { background: #fff; border: 1px solid #e3e0d6; border-radius: 999px; padding: 0.4rem 1rem; font-size: 0.95rem; }

.course .passo { position: relative; counter-increment: passo; background: #fff; border: 1px solid #e3e0d6; border-radius: 14px; padding: 1rem 1.2rem 1rem 3.6rem; margin: 0.9rem 0; }
.course .passi { counter-reset: passo; margin: 1rem 0; }
.course .passo::before { content: counter(passo); position: absolute; left: 1rem; top: 1.15rem; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #2e2c9c; color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; }

.course .sfida { border: 1px solid #e3e0d6; border-radius: 14px; padding: 1rem 1.2rem; margin: 0.9rem 0; background: #fff; }
.course .sfida .badge { display: inline-block; font-weight: 800; font-size: 0.8rem; letter-spacing: 0.06em; color: #fff; border-radius: 999px; padding: 0.18rem 0.7rem; margin-right: 0.5rem; }
.course .sfida.stella { border-left: 6px solid #c9a227; } .course .sfida.stella .badge { background: #c9a227; }
.course .sfida.cometa { border-left: 6px solid #1e8cc4; } .course .sfida.cometa .badge { background: #1e8cc4; }
.course .sfida.razzo { border-left: 6px solid #b13a5b; } .course .sfida.razzo .badge { background: #b13a5b; }

.course .quiz-q { background: #fff; border: 1px solid #e3e0d6; border-radius: 14px; padding: 1rem 1.2rem; margin: 1rem 0; }
.course .quiz-q .q-text { font-weight: 600; margin-bottom: 0.6rem; }
.course .quiz-btns { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.course .quiz-btn { flex: 1 1 40%; font: inherit; font-size: 0.95rem; padding: 0.6rem 0.8rem; border: 2px solid #e3e0d6; border-radius: 10px; background: #fff; color: #22242e; cursor: pointer; }
.course .quiz-btn:hover:not(:disabled) { border-color: #00a5c4; }
.course .quiz-btn.correct { border-color: #2e9e5b; background: #eaf7ef; color: #1b6e3d; font-weight: 700; }
.course .quiz-btn.wrong { border-color: #e0343f; background: #fdecee; color: #a32630; text-decoration: line-through; }
.course .quiz-btn:disabled { cursor: default; }
.course .quiz-feedback { margin-top: 0.6rem; font-weight: 600; min-height: 1.4em; }
.course .quiz-feedback.ok { color: #1b6e3d; }
.course .quiz-feedback.no { color: #a32630; }

.course .ledgrid { display: inline-grid; grid-template-columns: repeat(5, 22px); gap: 5px; padding: 10px; background: #10132e; border-radius: 12px; }
.course .ledgrid .led { width: 22px; height: 22px; border-radius: 50%; background: #262b4f; }
.course .ledgrid .led.on { background: #ffb400; box-shadow: 0 0 8px 2px rgba(255,180,0,0.7); }
.course .ledgrid.blu .led.on { background: #4dd0ff; }
.course .ledgrid.verde .led.on { background: #66e07a; }
.course .ledgrid.rosso .led.on { background: #ff6b6b; }

.course .card { background: #fff; border: 1px solid #e3e0d6; border-radius: 14px; padding: 1.1rem 1.3rem; margin: 1.1rem 0; }
.course .tip { border-left: 5px solid #ffb400; }
.course .warn { border-left: 5px solid #e0343f; background: #fff7f7; }
.course .fonte { background: #eef4fb; border: 1px solid #d4e3f5; border-radius: 14px; padding: 1rem 1.2rem; margin: 1.5rem 0; }

.course .lesson-footer { margin-top: 3rem; padding-top: 1.2rem; border-top: 2px solid #e3e0d6; font-size: 0.95rem; }
.course .pagination { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1rem; }
.course .pagination span { background: #fff; border: 1px solid #e3e0d6; padding: 0.5rem 1rem; border-radius: 10px; font-weight: 600; color: #2e2c9c; }

.course .blk { display: inline-block; padding: 0.05rem 0.5rem; border-radius: 6px; color: #fff; font-weight: 700; font-size: 0.92em; white-space: nowrap; }
.course .blk.blk-upgraded { background: none; padding: 0; border-radius: 0; }
.course-microbit .blk-basic { background: #0e6bb0; }
.course-microbit .blk-input { background: #1e9e46; }
.course-microbit .blk-music { background: #d96716; }
.course-microbit .blk-led { background: #2e2c9c; }
.course-microbit .blk-var { background: #e0621f; }
.course-microbit .blk-logic { background: #00a3a6; }
.course-microbit .blk-loop { background: #0077b6; }
.course-microbit .blk-math { background: #c4314b; }
.course-microbit .blk-radio { background: #7c3c98; }
.course-microbit .blk-game { background: #c24b99; }
.course-microbit .blk-pin { background: #0f8a5f; }

@media print {
.course { max-width: none; padding: 0; font-size: 11pt; }
.course a { color: inherit; text-decoration: none; }
.course .quiz-btn { border-color: #ccc; }
}

MediaWiki:Gadget-course.js

2026-08-01T10:59:46Z

Admin: Creata pagina con "/* Gadget "course": rende interattivi blocchi MakeCode, quiz e griglie LED. Port di assets/blocks.js + assets/quiz.js + assets/led-grid.js per MediaWiki. Scoped: agisce..."

/* Gadget "course": rende interattivi blocchi MakeCode, quiz e griglie LED.
Port di assets/blocks.js + assets/quiz.js + assets/led-grid.js
per MediaWiki. Scoped: agisce solo sugli elementi con le classi attese.
Tecnologia: legge la classe blk-<tech> sul blocco per scegliere la palette;
fallback: classe course-<tech> sul wrapper. */
(function () {
"use strict";

var PALETTES = {
microbit: {
basic: "#0E6BB0", input: "#1E9E46", music: "#D96716", led: "#2E2C9C",
var: "#E0621F", logic: "#00A3A6", loop: "#0077B6", math: "#C4314B",
radio: "#7C3C98", game: "#C24B99", pin: "#0F8A5F"
}
};

var FONT = "700 13px -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif";
var H = 26, PAD = 9, uid = 0;

function measure(text) {
try {
var c = document.createElement("canvas");
var ctx = c.getContext("2d");
if (!ctx) throw new Error("no canvas");
ctx.font = FONT;
return ctx.measureText(text).width;
} catch (e) {
return text.length * 7.5;
}
}

function escapeHtml(s) {
return s.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """);
}

function classList(el) {
return (el.className || "").split(/\s+/).filter(Boolean);
}

function kindOf(el) {
var c = classList(el);
if (c.indexOf("blk-hat") >= 0) return "hat";
if (c.indexOf("blk-val") >= 0) return "val";
if (c.indexOf("blk-bool") >= 0) return "bool";
return "stmt";
}

function techOf(el, root) {
var c = classList(el);
var tech = null;
for (var key in PALETTES) {
if (c.indexOf("blk-" + key) >= 0) tech = key;
}
if (!tech) {
var w = root && root.className || document.body.className || "";
for (var k2 in PALETTES) {
if (w.indexOf("course-" + k2) >= 0) tech = k2;
}
}
return tech || Object.keys(PALETTES)[0];
}

function colorOf(el, root) {
var palette = PALETTES[techOf(el, root)];
var c = classList(el);
for (var key in palette) {
if (c.indexOf("blk-" + key) >= 0) return palette[key];
}
return palette.basic;
}

function build(text, kind, color) {
var tw = measure(text);
var W = Math.round(tw + PAD * 2);
var id = "blksvg" + (++uid);
var br = 5, nr = 5, vbX = 0, vbY = -br, vbW = W, vbH = H + br;
var shape = "", maskCircle = "";
if (kind === "stmt") {
shape = '<rect x="0" y="0" width="' + W + '" height="' + H + '" rx="4" fill="' + color + '"/>' +
'<circle cx="8" cy="0" r="' + br + '" fill="' + color + '"/>';
maskCircle = '<circle cx="8" cy="' + H + '" r="' + nr + '" fill="#000"/>';
} else if (kind === "hat") {
vbY = 0; vbH = H + 6;
shape = '<rect x="0" y="0" width="' + W + '" height="' + H + '" rx="8" fill="' + color + '"/>' +
'<circle cx="8" cy="0" r="' + br + '" fill="' + color + '"/>';
maskCircle = '<circle cx="8" cy="' + H + '" r="' + nr + '" fill="#000"/>';
} else if (kind === "val") {
vbX = -6; vbW = W + 6;
shape = '<rect x="0" y="0" width="' + W + '" height="' + H + '" rx="' + H / 2 + '" fill="' + color + '"/>' +
'<circle cx="0" cy="' + H / 2 + '" r="6" fill="' + color + '"/>';
maskCircle = '<circle cx="' + W + '" cy="' + H / 2 + '" r="6" fill="#000"/>';
} else {
vbX = -6; vbW = W + 12;
shape = '<path d="M0 ' + H / 2 + ' L8 0 L' + (W - 8) + ' 0 L' + W + ' ' + H / 2 +
' L' + (W - 8) + ' ' + H + ' L8 ' + H + ' Z" fill="' + color + '"/>' +
'<circle cx="0" cy="' + H / 2 + '" r="5" fill="' + color + '"/>';
maskCircle = '<circle cx="' + W + '" cy="' + H / 2 + '" r="5" fill="#000"/>';
}
return '<svg class="blk-svg" viewBox="' + vbX + " " + vbY + " " + vbW + " " + vbH +
'" width="' + vbW + '" height="' + vbH + '" role="img" aria-label="' + escapeHtml(text) + '">' +
'<defs><mask id="' + id + '">' +
'<rect x="-8" y="-8" width="' + (vbW + 16) + '" height="' + (vbH + 16) + '" fill="#fff"/>' +
maskCircle + "</mask></defs>" +
'<g mask="url(#' + id + ')">' + shape + "</g>" +
'<text x="' + W / 2 + '" y="' + H / 2 + '" dominant-baseline="central" text-anchor="middle" ' +
'fill="#fff" font-family="-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif" ' +
'font-size="13" font-weight="700">' + escapeHtml(text) + "</text></svg>";
}

function upgradeBlks(root) {
root.querySelectorAll(".blk").forEach(function (el) {
if (el.querySelector("svg")) return;
var text = (el.textContent || "").replace(/\s+/g, " ").trim();
if (!text) return;
var svg = build(text, kindOf(el), colorOf(el, root));
el.innerHTML = svg;
el.classList.add("blk-upgraded");
});
}

function wireQuiz(root) {
root.querySelectorAll(".quiz-q").forEach(function (q) {
if (q.getAttribute("data-bound")) return;
q.setAttribute("data-bound", "1");
var answer = q.getAttribute("data-answer");
var okMsg = q.getAttribute("data-ok") || "Sì! Esatto. 👏";
var retryMsg = q.getAttribute("data-retry") || "Non ancora, riprova!";
var feedback = q.querySelector(".quiz-feedback");
function answerPick(btn) {
var correct = btn.getAttribute("data-opt") === answer;
btn.disabled = true;
if (correct) {
btn.classList.add("correct");
q.querySelectorAll(".quiz-btn").forEach(function (b) { b.disabled = true; });
q.classList.add("answered");
if (feedback) { feedback.textContent = okMsg; feedback.className = "quiz-feedback ok"; }
} else {
btn.classList.add("wrong");
if (feedback) { feedback.textContent = retryMsg; feedback.className = "quiz-feedback no"; }
}
}
q.querySelectorAll(".quiz-btn").forEach(function (btn) {
btn.addEventListener("click", function () { answerPick(btn); });
btn.addEventListener("keydown", function (e) {
if (e.key === "Enter" || e.key === " ") { e.preventDefault(); answerPick(btn); }
});
});
});
}

function renderGrids(root) {
root.querySelectorAll(".ledgrid[data-leds]").forEach(function (grid) {
if (grid.querySelector(".led")) return;
var pattern = (grid.getAttribute("data-leds") || "").replace(/[\/\s]+/g, "");
for (var i = 0; i < 25; i++) {
var led = document.createElement("span");
led.className = "led" + (pattern[i] === "#" ? " on" : "");
grid.appendChild(led);
}
});
}

function init(root) {
var target = root || document;
upgradeBlks(target);
wireQuiz(target);
renderGrids(target);
}

window.course = { init: init };

if (typeof mw !== "undefined" && mw.hook) {
mw.hook("wikipage.content").add(function ($content) {
init(($content && $content[0]) || document);
});
} else {
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", function () { init(document); });
} else {
init(document);
}
}
})();