Add setting to select swipe guesture type

apps/flashcards/README.md

@@ -10,7 +10,7 @@ Configuration:
 4. Add ".json" to the end of the Trello board URL and refresh page
 5. Find your list ID
 6. Save list ID to the "flashcards.settings.json" file on your watch, e.g.: 
-{"listId":"65942f7b27z68000996ddc00","fontSize":1,"textSize":9}
+{"listId":"65942f7b27z68000996ddc00","fontSize":1,"cardWidth":9,"swipeGesture":0}
 7. Connect phone with Gadgetbridge to the watch
 8. Enable "Allow Internet Access" in Gadgetbridge
 9. On the watch go to Settings -> Apps -> Flash Cards -> Get from Trello

apps/flashcards/app.js

@@ -18,17 +18,20 @@ let cardIndex = 0;
 let backSide = false;
 let drawTimeout = undefined;
 let fontSizes = ["15%","20%","25%"];
+let lastDragX = 0;
+let lastDragY = 0;
 
 let settings = Object.assign({
   listId: "",
   fontSize: 1,
-  textSize: 9
+  cardWidth: 9,
+  swipeGesture: 0
 }, storage.readJSON(CARD_SETTINGS_FILE, true) || {});
 
 // Cards data
 function wordWrap(str, maxLength) {
   if (maxLength == undefined) {
-    maxLength = settings.textSize;
+    maxLength = settings.cardWidth;
   }
   let res = '';
   while (str.length > maxLength) {
@@ -116,6 +119,17 @@ function draw() {
   queueDraw();
 }
 
+function swipeCard(forward)
+{
+  if(forward) {
+    cardIndex = (cardIndex + 1) % cards.length;
+  }
+  else if(--cardIndex < 0) {
+    cardIndex = cards.length - 1;
+  }
+  drawCard();
+}
+
 // Handle a touch: swap card side
 function handleTouch(zone, event) {
   backSide = !backSide;
@@ -123,23 +137,27 @@ function handleTouch(zone, event) {
   Bangle.buzz(SWAP_SIDE_BUZZ_MILLISECONDS);
 }
 
-// Handle a drag event: cycle cards
-function handleDrag(event) {
+// Handle a stroke event: cycle cards
+function handleStroke(event) {
   let first_x = event.xy[0];
   let last_x = event.xy[event.xy.length - 2];
-  let xdiff = last_x - first_x;
-  /*
-  let first_y = event.xy[1];
-  let last_y = event.xy[event.xy.length - 1];
-  let ydiff = last_y - first_y;
-  */
-  if(xdiff > 0) {
-    cardIndex = (cardIndex + 1) % cards.length;
+  swipeCard((last_x - first_x) > 0);
+}
+
+// Handle a drag event: cycle cards
+function handleDrag(event) {
+  let isFingerReleased = (event.b === 0);
+  if(isFingerReleased) {
+    let isHorizontalDrag = (Math.abs(lastDragX) >= Math.abs(lastDragY)) &&
+                           (lastDragX !== 0);
+    if(isHorizontalDrag) {
+      swipeCard(lastDragX > 0);
     }
-  else if(--cardIndex < 0) {
-    cardIndex = cards.length - 1;
   }
-  drawCard();
+  else {
+    lastDragX = event.dx;
+    lastDragY = event.dy;
+  }
 }
 
 
@@ -149,7 +167,7 @@ Bangle.loadWidgets();
 loadLocalCards();
 
 Bangle.on("touch", handleTouch);
-Bangle.on("stroke", handleDrag);
+if (settings.swipeGesture) { Bangle.on("drag", handleDrag); } else { Bangle.on("stroke", handleStroke); }
 
 // On start: display the first card
 g.clear();
@@ -160,5 +178,5 @@ Bangle.setUI({mode:"clock", remove:function() {
   if (drawTimeout) clearTimeout(drawTimeout);
   drawTimeout = undefined;
   Bangle.removeListener("touch", handleTouch);
-  Bangle.removeListener("stroke", handleDrag);
+  if (settings.swipeGesture) { Bangle.removeListener("drag", handleDrag);} else { Bangle.removeListener("stroke", handleStroke); }  
 }});

apps/flashcards/flashcards.settings.json

@@ -1 +1 @@
-{"listId":"","fontSize":1,"textSize":9}
+{"listId":"","fontSize":1,"cardWidth":9,"swipeGesture":0}

apps/flashcards/settings.js

@@ -9,27 +9,35 @@
   var settings = Object.assign({
     listId: "",
     fontSize: 1,
-    textSize: 9
+    cardWidth: 9,
+    swipeGesture: 0
   }, storage.readJSON(settingsFile, true) || {});
 
   function writeSettings() {
     storage.writeJSON(settingsFile, settings);
   }
 
-  const fontSizes = ["15%","20%","25%"];
+  const fontSizes = [/*LANG*/"Small",/*LANG*/"Medium",/*LANG*/"Large"];
+  const swipeGestures = [/*LANG*/"Stroke",/*LANG*/"Drag"];  
   var settingsMenu = {
     "" : { "title" : "Flash Cards" },
     "< Back" : () => back(),
-    /*LANG*/"Font Size": {
+    /*LANG*/"Font size": {
       value: settings.fontSize,
       min: 0, max: 2, wrap: true,
       format: v => fontSizes[v],
       onchange: v => { settings.fontSize = v; writeSettings(); }
     },
-    /*LANG*/"Text Size": {
-      value: settings.textSize,
+    /*LANG*/"Card width": {
+      value: settings.cardWidth,
       min: 5, max: 14,
-      onchange: v => { settings.textSize = v; writeSettings(); }
+      onchange: v => { settings.cardWidth = v; writeSettings(); }
+    },    
+    /*LANG*/"Swipe gesture": {
+      value: settings.swipeGesture,
+      min: 0, max: 1, wrap: true,
+      format: v => swipeGestures[v],
+      onchange: v => { settings.swipeGesture = v; writeSettings(); }
     },     
     /*LANG*/"Get from Trello": () => {
       if (!storage.read(settingsFile)) { writeSettings();}