search

empiricaly / meteor-empirica-core

Core Meteor package for the experiment Empirica platform. This is where you should submit issues.
MIT License
27 stars 13 forks source link

"Skip Task" or "Skip Round" a functionality of Core #264

Open dawnwages opened 2 years ago

dawnwages commented 2 years ago

Expected Behavior

In the Multi-Task-App modification, where multiple tasks are ordered in one game, we would like to be able to click "skip task" (or some variation) and move through the stages associated with that game until it we are at the next task. This feature works only if treatment specifies that users can game.treatment.skipRoundEarly === true

There is an attempt created in: https://github.com/Watts-Lab/multi-task-empirica

Current Behavior

Feature does not exist but in https://github.com/Watts-Lab/multi-task-empirica there are issues with flashing elements hard to access as they are in core. It iterates very quickly through the breadcrumbs and the UI goes wonky as it's switching.

Possible Solution

Bring this behavior into core perhaps similar to player.stage.submit()

Steps to Reproduce (for bugs)

Not able to reproduce because it is a feature that doesn't exist. In order to see attempted approach in multi-task-empirica, uncomment the button on Task.jsx and click. https://github.com/Watts-Lab/multi-task-empirica/blob/a9f9103efbdb033fd951ddf8c61fa872a96a4c8e/multi-task-app/client/game/Task.jsx#L76

Context

A feature that would be beneficial for the Multi-Task-Empirica experiement

Your Environment

Chrome/FF Node 14.17.0 npm 6.14.13 Desktop

Version used:
Environment name and version (e.g. Chrome 39, node.js 5.4):
Operating System and version (desktop or mobile):
Link to your project: https://github.com/Watts-Lab/multi-task-empirica/
npaton commented 2 years ago

You want to skip a full round, right? Or multiple rounds? Adding this to Empirica might be tricky, but we can take a look.

I do not have access to https://github.com/Watts-Lab/multi-task-empirica to look at the examples.

shawnzam commented 2 years ago

I have added you to the repo @npaton

shawnzam commented 2 years ago

The issue is that updates to the game, round, stage, etc. do no sync with the server when using dynamic imports for react components.

npaton commented 2 years ago

I see. I think it would be quite difficult to do within core. But if the main problem is the UI popping around, it could be due to the async import. By the time the import callback is called, the next one is triggered, and they might load out of order and generally create a mess. I think it might be solved with a variable on the component class, to check whether the import callback should be executed (if another import ran since this one was requested, return).

this.lastComponent = componentPath;

import(componentPath)
  .then((MyComp) => {
    if (this.unmounted || componentPath !== this.lastComponent) {
      return;
    }

    if (player.get("quitStageEarly")) {
      // submits stage last stage in round or intro stage
      if (
        stage.get("stage_type") === "intro" ||
        stage.get("stage_count") === stage.playerStageIds.length
      ) {
        player.set("quitStageEarly", false);
        this.setState({ myComp: <MyComp.default {...this.props} /> });
      } else {
        this.setState({ myComp: <div>Loading...</div> });
        player.stage.submit();
      }
    } else {
      this.setState({ myComp: <MyComp.default {...this.props} /> });
    }
  })
  .catch((err) => {
    console.error("Failed to load component:");
    console.error(err);

    if (!this.unmounted && componentPath === this.lastComponent) {
      this.setState({ myComp: <div>Error message for player here</div> });
    }
  });