Dark Filter

.gitignore

@@ -2,4 +2,8 @@
 *.DS_Store
 .DS_Store
 
-node_modules/
+node_modules/
+
+package-lock.json
+package.json
+# node_modules

js/filters/dark.js

@@ -0,0 +1,29 @@
+/* global app */
+window.filters.dark = {
+  name: 'dark',
+  menu: 'Edit',
+  run: function () {
+    const imageData = app.ctx.getImageData(0, 0, app.canvas.width, app.canvas.height)
+    const data = imageData.data
+    for (let i = 0; i < data.length; i += 4) {
+      if (data[i] - 20 <= 0) {
+        data[i] = 0
+      } else {
+        data[i] -= 20
+      }
+
+      if (data[i + 1] - 20 <= 0) {
+        data[i + 1] = 0
+      } else {
+        data[i + 1] -= 20
+      }
+
+      if (data[i + 2] - 20 <= 0) {
+        data[i + 2] = 0
+      } else {
+        data[i + 2] -= 20
+      }
+    }
+    app.ctx.putImageData(imageData, 0, 0)
+  }
+}

js/settings.json

@@ -5,10 +5,12 @@
   ],
   "tools": [
     "pencil",
-    "oscCircles"
+    "oscCircles",
+    "sparkle"
   ],
   "filters": [
-    "invert"
+    "invert",
+    "dark"
   ],
   "options": [
     "randomDog",

js/tools/sparkle.js

@@ -0,0 +1,42 @@
+/* global app */
+window.tools.sparkle = {
+  name: 'sparkle',
+  icon: '/images/sparkle-icon.png',
+  state: {
+    selected: false,
+    mousePressed: false
+  },
+  events: {
+    mousedown: function (e, self) {
+      self.state.mousePressed = true
+    },
+    mouseup: function (e, self) {
+      self.state.mousePressed = false
+    },
+    mousemove: function (e, self) {
+      // if self tool is selected AND the mouse is pressed
+      if (self.state.selected && self.state.mousePressed) {
+        const mouse = app.eventToMouse(e)
+        const alpha = (2 * Math.PI) / 10
+        // const r = 5
+        var r = Math.abs(Math.sin(Date.now() / 500) * 10)
+        var star_pt = [mouse.x, mouse.y]
+
+        app.ctx.beginPath()
+
+        for (var i = 10; i > 0; i--) {
+          var r_tmp = r * (i % 2 + 1)
+          var omega = alpha * i
+          app.ctx.lineTo((r_tmp * Math.sin(omega)) + star_pt[0], (r_tmp * Math.cos(omega)) + star_pt[1])
+        }
+
+        app.ctx.closePath()
+        app.ctx.fill()
+        app.ctx.fillStyle = 'pink'
+        app.ctx.strokeStyle = 'blue'
+        app.ctx.stroke()
+        // self.state.prevMouse = { x: mouse.x, y: mouse.y }
+      }
+    }
+  }
+}