mouse down action on remaining graphical components

cypress/e2e/DoenetML/tagSpecific/callaction.cy.js

@@ -1285,6 +1285,146 @@ describe('CallAction Tag Tests', function () {
 
   })
 
+  it('action triggered when mouse down', () => {
+
+    cy.window().then(async (win) => {
+      win.postMessage({
+        doenetML: `
+    <text>a</text>
+    <graph>
+      <point name="P">(-1,2)</point>
+    </graph>
+    <copy prop="coords" target="P" assignNames="P2" />
+
+    <p name="nums"><aslist><sampleRandomNumbers name="s" numberOfSamples="5" type="discreteUniform" from="1" to="6" /></aslist></p>
+    <p><callAction target="s" actionName="resample" name="rs" triggerWhenMouseDownOnObjects="P" >
+      <label>roll dice</label>
+    </callAction></p>
+    `}, "*");
+    });
+
+    cy.get('#\\/_text1').should('have.text', 'a') //wait for page to load
+
+    let numbers;
+
+    cy.get('#\\/nums').invoke('text').then(text => {
+      numbers = text.split(',').map(Number);
+      expect(numbers.length).eq(5);
+      for (let num of numbers) {
+        expect(Number.isInteger(num)).be.true;
+        expect(num).gte(1)
+        expect(num).lte(6)
+      }
+    })
+
+    cy.get('#\\/P2').should('contain.text', '(−1,2)')
+
+    cy.get('#\\/rs').should('not.exist');
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 3, y: -4 }
+      });
+      cy.get('#\\/P2').should('contain.text', '(3,−4)')
+
+      cy.get('#\\/nums').invoke('text').then(text => {
+        let numbers2 = text.split(',').map(Number);
+        expect(numbers2).eqls(numbers)
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+
+      cy.waitUntil(() => cy.get('#\\/nums').invoke('text').then(text => {
+        let numbers2 = text.split(',').map(Number);
+        if (numbers2.length !== 5) {
+          return false;
+        }
+        let foundChange = false;
+        for (let [i, num] of numbers2.entries()) {
+          if (!Number.isInteger(num) || num < 1 || num > 6) {
+            return false;
+          }
+          if (num !== numbers[i]) {
+            foundChange = true;
+          }
+        }
+        if (!foundChange) {
+          return false;
+        }
+        numbers = numbers2;
+        return true;
+      }))
+
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 5, y: 9 }
+      });
+
+      cy.get('#\\/P2').should('contain.text', '(5,9)')
+
+      cy.get('#\\/nums').invoke('text').then(text => {
+        let numbers2 = text.split(',').map(Number);
+        expect(numbers2).eqls(numbers)
+      });
+    })
+
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+
+      cy.waitUntil(() => cy.get('#\\/nums').invoke('text').then(text => {
+        let numbers2 = text.split(',').map(Number);
+        if (numbers2.length !== 5) {
+          return false;
+        }
+        let foundChange = false;
+        for (let [i, num] of numbers2.entries()) {
+          if (!Number.isInteger(num) || num < 1 || num > 6) {
+            return false;
+          }
+          if (num !== numbers[i]) {
+            foundChange = true;
+          }
+        }
+        if (!foundChange) {
+          return false;
+        }
+        numbers = numbers2;
+        return true;
+      }))
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 9, y: 7 }
+      });
+
+      cy.get('#\\/P2').should('contain.text', '(9,7)')
+
+      cy.get('#\\/nums').invoke('text').then(text => {
+        let numbers2 = text.split(',').map(Number);
+        expect(numbers2).eqls(numbers)
+      });
+
+    });
+  })
+
   it('chained updates based on trigger', () => {
 
     cy.window().then(async (win) => {

cypress/e2e/DoenetML/tagSpecific/triggerset.cy.js

@@ -723,6 +723,110 @@ describe('TriggerSet Tag Tests', function () {
     });
   })
 
+  it('triggerSet triggered when mouse down', () => {
+
+    cy.window().then(async (win) => {
+      win.postMessage({
+        doenetML: `
+  <text>a</text>
+  <graph>
+    <point name="P">(-1,2)</point>
+  </graph>
+  <math name="x">x</math>
+  <math name="y">y</math>
+  
+  <triggerSet triggerWhenMouseDownOnObjects="P" >
+    <updateValue name="trip" target="x" newValue="3$x" simplify />
+    <updateValue name="quad" target="y" newValue="4$y" simplify />
+  </triggerSet>
+  `}, "*");
+    });
+    cy.get('#\\/_text1').should('have.text', 'a') //wait for page to load
+
+    cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+      expect(text.trim()).equal('x')
+    });
+    cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+      expect(text.trim()).equal('y')
+    });
+
+    cy.get('#\\/trip').should('not.exist');
+    cy.get('#\\/quad').should('not.exist');
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: -1, y: -7 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('x')
+      });
+      cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('y')
+      });
+    })
+
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+      cy.get('#\\/x').should('contain.text', '3x')
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('3x')
+      });
+      cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('4y')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 5, y: 9 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('3x')
+      });
+      cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('4y')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+      cy.get('#\\/x').should('contain.text', '9x')
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('9x')
+      });
+      cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('16y')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 9, y: 7 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('9x')
+      });
+      cy.get('#\\/y').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('16y')
+      });
+
+
+    });
+  })
+
   it('triggerWhen supercedes chaining for triggerset', () => {
 
     cy.window().then(async (win) => {

cypress/e2e/DoenetML/tagSpecific/updatevalue.cy.js

@@ -826,6 +826,86 @@ describe('UpdateValue Tag Tests', function () {
     });
   })
 
+  it('update triggered when mouse down', () => {
+
+    cy.window().then(async (win) => {
+      win.postMessage({
+        doenetML: `
+    <text>a</text>
+    <graph>
+      <point name="P">(-1,2)</point>
+    </graph>
+    <math name="x">x</math>
+    
+    <updateValue name="trip" target="x" newValue="3$x" simplify triggerWhenMouseDownOnObjects="P" />
+    `}, "*");
+    });
+    cy.get('#\\/_text1').should('have.text', 'a') //wait for page to load
+
+    cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+      expect(text.trim()).equal('x')
+    })
+
+    cy.get('#\\/trip').should('not.exist');
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: -1, y: -7 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('x')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+      cy.get('#\\/x').should('contain.text', '3x')
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('3x')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 5, y: 9 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('3x')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "mouseDownOnPoint",
+        componentName: "/P",
+      });
+      cy.get('#\\/x').should('contain.text', '9x')
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('9x')
+      });
+    })
+
+    cy.window().then(async (win) => {
+      await win.callAction1({
+        actionName: "movePoint",
+        componentName: "/P",
+        args: { x: 9, y: 7 }
+      });
+      cy.get('#\\/x').find('.mjx-mrow').eq(0).invoke('text').then((text) => {
+        expect(text.trim()).equal('9x')
+      });
+
+
+    });
+  })
+
   it('chained updates based on trigger', () => {
 
     cy.window().then(async (win) => {

src/Core/components/Circle.js

@@ -11,6 +11,7 @@ export default class Circle extends Curve {
   actions = {
     moveCircle: this.moveCircle.bind(this),
     circleClicked: this.circleClicked.bind(this),
+    mouseDownOnCircle: this.mouseDownOnCircle.bind(this),
   };
 
 
@@ -2417,6 +2418,17 @@ export default class Circle extends Curve {
     this.coreFunctions.resolveAction({ actionId });
 
   }
+
+  async mouseDownOnCircle({ actionId }) {
+
+    await this.coreFunctions.triggerChainedActions({
+      triggeringAction: "down",
+      componentName: this.componentName,
+    })
+
+    this.coreFunctions.resolveAction({ actionId });
+
+  }
 }
 
 function circleFromTwoNumericalPoints({ point1, point2 }) {

src/Core/components/Curve.js

@@ -16,7 +16,8 @@ export default class Curve extends GraphicalComponent {
     moveThroughPoint: this.moveThroughPoint.bind(this),
     changeVectorControlDirection: this.changeVectorControlDirection.bind(this),
     switchCurve: this.switchCurve.bind(this),
-    curveClicked: this.curveClicked.bind(this)
+    curveClicked: this.curveClicked.bind(this),
+    mouseDownOnCurve: this.mouseDownOnCurve.bind(this),
   };
 
   static primaryStateVariableForDefinition = "fShadow";
@@ -3287,6 +3288,17 @@ export default class Curve extends GraphicalComponent {
 
   }
 
+  async mouseDownOnCurve({ actionId, name }) {
+
+    await this.coreFunctions.triggerChainedActions({
+      triggeringAction: "down",
+      componentName: name,  // use name rather than this.componentName to get original name if adapted
+    })
+
+    this.coreFunctions.resolveAction({ actionId });
+
+  }
+
 }
 
 function getNearestPointFunctionCurve({ dependencyValues, numerics }) {