From c2053e91c78d0437e5c1eff6dd39cb8cd7e5bfad Mon Sep 17 00:00:00 2001
From: Luis Fernando Molina <Luis-Fernando-Molina@users.noreply.github.com>
Date: Tue, 18 Feb 2020 16:22:38 +0100
Subject: [PATCH] more icons

---
 Spaces/DesignSpace.js |  9 +++++++--
 VideoRecorder.js      | 18 ++++++++++--------
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/Spaces/DesignSpace.js b/Spaces/DesignSpace.js
index 346285d0e..d1c1f7faf 100644
--- a/Spaces/DesignSpace.js
+++ b/Spaces/DesignSpace.js
@@ -255,12 +255,17 @@ function newDesignSpace () {
       'mouse-pointer',
       'mouse-left-click',
       'mouse-right-click',
-      'mouse-wheel',
+      'mouse-wheel-up',
+      'mouse-wheel-down',
       'mouse-wheel-click',
       'key-alt',
       'key-shift',
       'key-ctrl',
-      'hand-drag'
+      'hand-drag',
+      'key-down',
+      'key-left',
+      'key-right',
+      'key-up'
     ]
 
     for (let i = 0; i < iconsNames.length; i++) {
diff --git a/VideoRecorder.js b/VideoRecorder.js
index 9a85e41b5..99b9af090 100644
--- a/VideoRecorder.js
+++ b/VideoRecorder.js
@@ -11,9 +11,7 @@ function newVideoRecorder () {
       const ICON_SIZES = 50
 
       let mousePointerIcon = canvas.designSpace.iconCollection.get('mouse-pointer')
-      let wheelIcon = canvas.designSpace.iconCollection.get('mouse-wheel')
       let draggingIcon = canvas.designSpace.iconCollection.get('hand-drag')
-      let keyDownIcon = canvas.designSpace.iconCollection.get('tron')
 
       let leftClickIcon = canvas.designSpace.iconCollection.get('mouse-left-click')
       let rightClickIcon = canvas.designSpace.iconCollection.get('mouse-right-click')
@@ -35,7 +33,12 @@ function newVideoRecorder () {
           break
         }
         case 'wheel': {
-          pointerIcon = wheelIcon
+          if (canvas.mouse.event.delta > 0) {
+            pointerIcon = canvas.designSpace.iconCollection.get('mouse-wheel-up')
+          } else {
+            pointerIcon = canvas.designSpace.iconCollection.get('mouse-wheel-down')
+          }
+
           break
         }
         case 'key down': {
@@ -113,7 +116,7 @@ function newVideoRecorder () {
       }
 
       if (canvas.mouse.event.code === 'ArrowUp') {
-        let icon = canvas.designSpace.iconCollection.get('mouse-wheel')
+        let icon = canvas.designSpace.iconCollection.get('key-up')
         imagePosition = {
           x: canvas.mouse.position.x - 0,
           y: canvas.mouse.position.y + DISTANCE_BETWEEN_ICONS
@@ -122,7 +125,7 @@ function newVideoRecorder () {
       }
 
       if (canvas.mouse.event.code === 'ArrowDown') {
-        let icon = canvas.designSpace.iconCollection.get('mouse-wheel')
+        let icon = canvas.designSpace.iconCollection.get('key-down')
         imagePosition = {
           x: canvas.mouse.position.x - 0,
           y: canvas.mouse.position.y + DISTANCE_BETWEEN_ICONS * 2
@@ -131,7 +134,7 @@ function newVideoRecorder () {
       }
 
       if (canvas.mouse.event.code === 'ArrowLeft') {
-        let icon = canvas.designSpace.iconCollection.get('mouse-wheel')
+        let icon = canvas.designSpace.iconCollection.get('key-left')
         imagePosition = {
           x: canvas.mouse.position.x - DISTANCE_BETWEEN_ICONS,
           y: canvas.mouse.position.y + DISTANCE_BETWEEN_ICONS * 2
@@ -140,7 +143,7 @@ function newVideoRecorder () {
       }
 
       if (canvas.mouse.event.code === 'ArrowRight') {
-        let icon = canvas.designSpace.iconCollection.get('mouse-wheel')
+        let icon = canvas.designSpace.iconCollection.get('key-right')
         imagePosition = {
           x: canvas.mouse.position.x + DISTANCE_BETWEEN_ICONS,
           y: canvas.mouse.position.y + DISTANCE_BETWEEN_ICONS * 2
@@ -163,4 +166,3 @@ function newVideoRecorder () {
     }
   }
 }
-