Merge remote-tracking branch 'upstream/master' into werksimon1/master

maurobertozzi · Oct 12, 2017 · 3a13fdf · 3a13fdf
2 parents 7fdb92a + b23b3e9
commit 3a13fdf
Show file tree

Hide file tree

Showing 8 changed files with 207 additions and 0 deletions.
diff --git a/opdrachten-MD2/opdracht-1.html b/opdrachten-MD2/opdracht-1.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width">
+    <title>Opdracht 1</title>
+</head>
+<body>
+
+<p>Opdracht 1</p>
+
+<button id='start' value="start">Start</button>
+<ol id='ol'>Tijd tussen start en stop in milliseconden</ol>
+
+<script src="opdracht-1.js"></script>
+</body>
+</html>
diff --git a/opdrachten-MD2/opdracht-1.js b/opdrachten-MD2/opdracht-1.js
@@ -0,0 +1,66 @@
+function init() {
+    let btn = document.getElementById('start');
+
+    btn.addEventListener('click', function() {
+
+        action(btn);
+
+    }, false);
+
+    // btn.addEventListener('click', action, false);
+}
+init();
+
+function addToList(item) {
+
+    let ol = document.getElementById('ol');
+    let newListItem = document.createElement('li');
+    let newListText = document.createTextNode(item);
+    newListItem.appendChild(newListText);
+    ol.appendChild(newListItem);
+
+}
+
+function switchValue (value) {
+    return value == 'start' ? 'stop' : 'start';
+}
+
+let timeLogged = (function (btn) {
+
+    let timeObject = {
+        started: 0,
+        ended: 0
+    };
+
+    return {
+        timeToSet: function (btn) {
+            if (btn.value == 'start') {
+                timeObject.started = Date.now();
+            } else {
+                timeObject.ended = Date.now();
+            }
+        },
+        value: function (btn) {
+            return timeObject;
+        }
+    }
+
+}) ();
+
+function action (btn) {
+
+    timeLogged.timeToSet(btn);
+
+    if (btn.value == 'stop') {
+        let message = timeLogged.value(btn);
+
+        addToList((message.ended - message.started));
+    }
+
+    let value = switchValue(btn.value);
+    btn.value = value;
+    btn.innerHTML = value;
+
+}
+
+
diff --git a/opdrachten-MD3/arrow-opdrachten b/opdrachten-MD3/arrow-opdrachten
@@ -0,0 +1,28 @@
+Opdrachten
+
+DOEL: Gebruik van arrow functies en verschillende array methods.
+
+Beschrijving
+De lijst geeft de cijfers aan voor een aantal vakken die behaald zijn. Dit is de basis voor elk van de onderstaande opdrachten
+Er zitten 20 studenten in een klas maar niet iedere student heeft de opdrachten voor elk vak ingeleverd. 
+De lijst is dus alleen gebaseerd op de ingeleverde opdrachten. 
+Als je een functie nodig hebt gebruik je een arrow functie.
+
+1.  Maak een array aan waarin je alle data zet.
+1.1 Zet de gegevens van elk vak in een aparte array.
+
+HINT: Voor de volgende opdracht zie
+    https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset
+
+2.  Voor elk vak geef je nu alleen de cijfers weer.
+2.1 Maak gebruik van default parameters waarbij je de arays aanvult met ontbrekende cijfers.
+    Elke niet ingeleverde opdracht krijgt een 0.
+2.2 Bereken ook het gemiddelde cijfer per vak.
+2.3 Per vak geef je alleen de voldoendes weer. (een voldoende is 5,5 of hoger.
+2.4 Bereken het gemiddelde cijfer voor alle voldoendes
+    en ook het gemiddelde voor alle onvoldoendes, hiervoor gebruik je alleen de echte onvoldoendes, dus niet de 0.
+
+3.  Geef de resultaten van alle opdrachten overzichtelijk weer in je webpagina bijv. in een tabel.
+
+
+
diff --git a/opdrachten-MD3/arrow.html b/opdrachten-MD3/arrow.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Arrow functions</title>
+</head>
+<body>
+
+
+<ul>
+    <li data-grade="5.2">Engels</li>
+    <li data-grade="8.1">Engels</li>
+    <li data-grade="3.6">Engels</li>
+    <li data-grade="5.0">Engels</li>
+    <li data-grade="7.2">Engels</li>
+    <li data-grade="7.2">Engels</li>
+    <li data-grade="6.9">Engels</li>
+    <li data-grade="4.0">Engels</li>
+    <li data-grade="4.3">Engels</li>
+    <li data-grade="7.9">Engels</li>
+    <li data-grade="1.0">Engels</li>
+    <li data-grade="9.0">Engels</li>
+    <li data-grade="5.1">Engels</li>
+    <li data-grade="5.2">Engels</li>
+    <li data-grade="5.1">Engels</li>
+    <li data-grade="8.8">Engels</li>
+    <li data-grade="1.0">Engels</li>
+    <li data-grade="3.1">Engels</li>
+    <li data-grade="5.0">Engels</li>
+    <li data-grade="3.1">Engels</li>
+    <li data-grade="7.2">Engels</li>
+    <li data-grade="6.9">JavaScript</li>
+    <li data-grade="4.2">JavaScript</li>
+    <li data-grade="4.3">JavaScript</li>
+    <li data-grade="7.9">JavaScript</li>
+    <li data-grade="1.0">JavaScript</li>
+    <li data-grade="9.0">JavaScript</li>
+    <li data-grade="8.8">BAP</li>
+    <li data-grade="2.0">BAP</li>
+    <li data-grade="3.1">BAP</li>
+    <li data-grade="6.0">BAP</li>
+    <li data-grade="3.0">BAP</li>
+    <li data-grade="7.2">BAP</li>
+    <li data-grade="6.0">BAP</li>
+    <li data-grade="4.2">BAP</li>
+    <li data-grade="4.1">BAP</li>
+    <li data-grade="7.9">BAP</li>
+    <li data-grade="1.0">BAP</li>
+    <li data-grade="5.0">BAP</li>
+</ul>
+
+<script src="arrow.js"></script>
+</body>
+</html>
diff --git a/opdrachten-MD3/arrow.js b/opdrachten-MD3/arrow.js
@@ -0,0 +1,2 @@
+
+// voer hier de javascript code in
diff --git a/opdrachten-MD3/template-literals.txt b/opdrachten-MD3/template-literals.txt
@@ -0,0 +1 @@
+template literals
diff --git a/template-literals/templateliterals.html b/template-literals/templateliterals.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Template literals</title>
+</head>
+<body>
+
+
+<script src="templateliterals.js"></script>
+</body>
+</html>
diff --git a/template-literals/templateliterals.js b/template-literals/templateliterals.js
@@ -0,0 +1,27 @@
+
+// Single line
+let greeting = `Hello`;
+
+
+// Multi line
+
+let helloWorld = `Hello
+World`;
+console.log(helloWorld);
+
+var helloWorldOld = 'Hello\nWorld';
+console.log(helloWorldOld);
+
+// Expressions
+let course = `ES6`;
+const url = 'https://developer.mozilla.org/en-US/';
+console.log (`Cursus: ${course}`);
+
+const es6 = `<article>
+
+    <h3>${course} is the new standard of JavaScript</h3>
+    <p>You can find more at ${url}.</p>
+
+</article>`;
+
+document.write(es6);