day 5

Ryan · Ryan · commit 92d0b20c476c · 2016-12-18T23:49:18.000+07:00
diff --git a/07 - Array Cardio Day 2/index-START.html b/07 - Array Cardio Day 2/index-START.html
@@ -26,15 +26,27 @@
 
     // Some and Every Checks
     // Array.prototype.some() // is at least one person 19?
+    const isAdult = people.some(person => ((new Date()).getFullYear() - person.year >= 19));
+    console.log(isAdult);
     // Array.prototype.every() // is everyone 19?
-
+    const allAdults = people.every(person => ((new Date()).getFullYear() - person.year >= 19));
+    console.log(allAdults);
     // Array.prototype.find()
     // Find is like filter, but instead returns just the one you are looking for
     // find the comment with the ID of 823423
-
+    const comment = comments.find(comment => comment.id === 823423);
+    console.log(comment);
     // Array.prototype.findIndex()
     // Find the comment with this ID
     // delete the comment with the ID of 823423
+    const index = comments.findIndex(comment => comment.id === 823423);
+
+    const newComment = [
+      ...comments.slice(0, index),
+      ...comments.slice(index+1)
+    ]
+    console.table(comments);
+    console.table(newComment);
 
   </script>
 </body>
diff --git a/08 - Fun with HTML5 Canvas/index-START.html b/08 - Fun with HTML5 Canvas/index-START.html
@@ -7,6 +7,54 @@
 <body>
 <canvas id="draw" width="800" height="800"></canvas>
 <script>
+const canvas = document.querySelector('#draw');
+const ctx = canvas.getContext('2d');
+canvas.height = window.innerHeight;
+canvas.width = window.innerWidth;
+ctx.strokeStyle = '#BADA55';
+ctx.lineWidth = 100;
+let lastX = 0;
+let lastY = 0;
+ctx.lineJoin ='round';
+ctx.lineCap = 'round';
+ctx.lineWidth = 100;
+let isDrawing = false;
+let direction = false;
+let hue = 0;
+
+function draw(e) {
+  if (isDrawing) {
+    ctx.strokeStyle = `hsl(${hue}, 100%, 50%)`;
+
+    ctx.beginPath()
+    ctx.moveTo(lastX, lastY);
+    ctx.lineTo(e.offsetX, e.offsetY);
+    ctx.stroke();
+    [lastX, lastY] = [e.offsetX, e.offsetY]
+    hue++;
+    if (hue >= 360) {
+      hue = 0;
+    }
+    if (ctx.lineWidth  <= 1 || ctx.lineWidth  >= 100) {
+      direction = !direction;
+    }
+    if (direction) {
+      ctx.lineWidth-=0.1;
+    } else {
+      ctx.lineWidth+=0.1;
+    }
+  }
+}
+
+canvas.addEventListener('mousemove', draw);
+canvas.addEventListener('mousedown', (e) => {
+  isDrawing = true;
+  [lastX, lastY] = [e.offsetX, e.offsetY];
+
+});
+canvas.addEventListener('mouseup', () => isDrawing = false);
+canvas.addEventListener('mouseout', () => isDrawing = false);
+
 </script>
 
 <style>
