//Ensures that we load SWS at the very end, after MathJax has
//been initialized
+ var toggle_circuit = function (id) {
+ var v = $("#" + id).text();
+ var nv = "0";
+ if (v == "0") { nv = "1"; };
+ $("#" + id).text(nv);
+ draw_circuit();
+ };
+
+ var draw_circuit = function() {
+ var i0 = parseInt($("#input0").text());
+ var i1 = parseInt($("#input1").text());
+ var r = (i0 + i1) % 2;
+ var c = (Math.floor((i0 + i1) / 2)) %2;
+ $("#result").text(r)
+ $("#carry").text(c)
+ $(".num").each(function (i, e) {
+ var txt = parseInt($(e).text());
+ if (txt == 0) {
+ $(e).css( 'background', '#aaaaff');
+ } else {
+ $(e).css( 'background', '#aaffaa');
+ }
+ });
+
+ };
+
+
+
$(window).load(SWS.Presentation.init);
</script>
+ <style>
+ .num { display:inline-block;
+ width: 5em;
+ font-size: 150%;
+ }
+ </style>
</head>
<body>
<div class="sws-slide">
<h1> Comment fonctionne un ordinateur ? </h1>
<div style="text-align:center;vertical-align:center">
- <img id="id_eniac" style="width:75%"
- src="http://www.fi.edu/learn/case-files/eckertmauchly/ENIAC_Image_2.jpg"
+ <img id="id_eniac" style="width:70%" src="Eniac.jpg"
/>
</div>
</div>
<h1> Comment fonctionne un ordinateur ? </h1>
<div style="text-align:center;vertical-align:center">
<img style="width:25%"
- src="http://www.resistors-and-diodes-and-picchips-oh-my.co.uk/wp-content/uploads/2011/03/vacuum-tube.jpg"
+ src="vacuum-tube.jpg"
/>
<svg width="100%" height="15%" xmlns="http://www.w3.org/2000/svg"
version="1.1">
passe (1) ou ne passe pas (0)</p>
</div>
<div class="sws-slide">
- <h1> Compter avec des 0 et des 1 ? </h1>
- <iframe class="sws-onframe-0_1" src="cartes.html"
+ <h1> Représenter tous les nombres des 0 et des 1 ? </h1>
+ <iframe class="sws-onframe-0_1" src="anim/cartes.html"
style="padding-left:5%;width:90%; height:50vh;border-width:0;" />
<p class="sws-onframe-1" >
On groupe les <i>bits</i> par paquets de 8 qu'on appelle des <em>octets</em>!
</p>
</div>
+ <div class="sws-slide">
+ <h1>Compter avec du courant électrique ?</h1>
+ <div style="text-align:center;">
+ <div style=";display:inline-block;">
+ <span class="num" id="input0" onclick="toggle_circuit('input0');">0</span><br/>
+ <span class="num" id="input1" onclick="toggle_circuit('input1');">0</span>
+ </div>
+ <img style="vertical-align:top;border:width:300px;height:200px" src="Half_Adder.svg" />
+ <div style=";display:inline-block;vertical-align:top;"><br/>
+ <span class="num" id="result">0</span><br/><br/><br/>
+ <span class="num" id="carry">0</span>
+ </div>
+ <p><img style="vertical-align:middle;" src="xor.svg" /> renvoie un 1 si les deux valeurs sont
+ différentes <br/><br/>
+<img style="vertical-align:middle;" src="and.svg" /> renvoie un 1 si les deux valeurs sont
+ à 1
+ </p>
+ <script type="text/javascript">
+ SWS.Presentation.registerCallback(0, function (c) {
+ draw_circuit(); });
+ </script>
+ </div>
+ </div>
+ <div class="sws-slide">
+ <h1>Et ensuite ?</h1>
+ <div style="position:relative;text-align:center;">
+ <img src="mb_adder.png" style="left:0pt;top:0pt;width:600px"
+ />
+
+ </div>
+ </div>
+ <div class="sws-slide">
+ <h1>Et ensuite ?</h1>
+ <div style="position:relative;text-align:center;">
+ <img src="pentium_internal_detail.jpg" style="left:0pt;top:0pt;height:300px"
+ />
+
+ </div>
+ </div>
<div class="sws-slide">
<h1> Écrire (des lettres) avec des 0 et des 1 ? </h1>
<form>
</div>
<div class="sws-slide">
<h1> Dessiner avec des 0 et des 1 ? </h1>
- <iframe class="sws-onframe-0_1" src="dessin.html"
+ <iframe class="sws-onframe-0_1" src="anim/dessin.html"
style="padding-left:5%;width:90%; height:75vh;border-width:0;" />
</div>
</body>
projects / hacks / simpleWebSlides.git / blobdiff