Random variations on flip #106

Open
opened 2026-02-20 10:14:15 -05:00 by deekerman · 5 comments
Owner

Originally created by @larkob on GitHub (Feb 1, 2021).

The idea for this enhancement came from looking at the recent dice tutorial which uses a clickRoutine to accomplish small but noticable variations to the dice placement/rotation. It turned out that depending on the dice design, the variations of both x/y placement and rotation would need to be configurable.

In order to simulate dice (or other randomly tossed/flipped tokens) without having to resort to the use of buttons, we would need to allow for random variations in position and/or rotation when flipping Cards/BasicWidgets.

The idea here is to introduce a vary property for faceTemplates which would apply random values to any faceTemplate properties, modifying the values defined per face. For instance, if the next face would rotate to 90°, and the vary property for rotation is set to a range of -10 to 10, the effective rotation would be 80° to 100°, with the same principle for x and y positions.

    "faceTemplates": [
      {
        "objects": [
          {
           ...
          },
          {
           ...
          }
        ],
        "border": false,
        "radius": 16,
        "varyProperties": [
          {
            "property": "rotation",
            "from": -180,
            "to": 180,
            "steps": 90
          },
          {
            "property": "x",
            "from": -10,
            "to": 10,
            "steps": 2
          },
          {
            "property": "y",
            "from": -10,
            "to": 10,
            "steps": 2
          }
        ]
      }
    ]

For each property to be varied, a random value between from and to is determined, which must be a multiple of steps. The steps property has a second application of determining the minimum of change, otherwise the random value may be so small (e.g. 1) to not be noticable.

Originally created by @larkob on GitHub (Feb 1, 2021). The idea for this enhancement came from looking at the recent dice tutorial which uses a clickRoutine to accomplish small but noticable variations to the dice placement/rotation. It turned out that depending on the dice design, the variations of both x/y placement and rotation would need to be configurable. In order to simulate dice (or other randomly tossed/flipped tokens) without having to resort to the use of buttons, we would need to allow for random variations in position and/or rotation when flipping Cards/BasicWidgets. The idea here is to introduce a `vary` property for faceTemplates which would apply random values to any faceTemplate properties, modifying the values defined per face. For instance, if the next face would rotate to 90°, and the `vary` property for rotation is set to a range of -10 to 10, the effective rotation would be 80° to 100°, with the same principle for x and y positions. ``` "faceTemplates": [ { "objects": [ { ... }, { ... } ], "border": false, "radius": 16, "varyProperties": [ { "property": "rotation", "from": -180, "to": 180, "steps": 90 }, { "property": "x", "from": -10, "to": 10, "steps": 2 }, { "property": "y", "from": -10, "to": 10, "steps": 2 } ] } ] ``` For each property to be varied, a random value between `from` and `to` is determined, which must be a multiple of `steps`. The `steps` property has a second application of determining the minimum of change, otherwise the random value may be so small (e.g. 1) to not be noticable.
Author
Owner

@96LawDawg commented on GitHub (Feb 1, 2021):

This sounds like a great idea and I would probably find a way to use it. If this gets adopted into the code, I would just ask that it also definitely be included for basic widgets and not just cards.

@96LawDawg commented on GitHub (Feb 1, 2021): This sounds like a great idea and I would probably find a way to use it. If this gets adopted into the code, I would just ask that it also definitely be included for basic widgets and not just cards.
Author
Owner

@robartsd commented on GitHub (Feb 1, 2021):

No need to apply this to faces; the problem is that if the same face is chosen at random there needs to be a noticeable change. This needs to be recalculated with each flip and might as well belong to the base widget as the selected face.

@robartsd commented on GitHub (Feb 1, 2021): No need to apply this to faces; the problem is that if the same face is chosen at random there needs to be a noticeable change. This needs to be recalculated with each flip and might as well belong to the base widget as the selected face.
Author
Owner

@robartsd commented on GitHub (Feb 1, 2021):

This sounds like a great idea and I would probably find a way to use it. If this gets adopted into the code, I would just ask that it also definitely be included for basic widgets and not just cards.

I agree with this.

@robartsd commented on GitHub (Feb 1, 2021): > This sounds like a great idea and I would probably find a way to use it. If this gets adopted into the code, I would just ask that it also definitely be included for basic widgets and not just cards. I agree with this.
Author
Owner

@robartsd commented on GitHub (Feb 1, 2021):

I'd like the variations created by the flip to be temporary and be cancelled as soon as a player interacts with the widget (moves or sets active face).

@robartsd commented on GitHub (Feb 1, 2021): I'd like the variations created by the flip to be temporary and be cancelled as soon as a player interacts with the widget (moves or sets active face).
Author
Owner

@robartsd commented on GitHub (Mar 29, 2022):

#1167 adds dice widget with animated rolls.

@robartsd commented on GitHub (Mar 29, 2022): #1167 adds dice widget with animated rolls.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/virtualtabletop#106
No description provided.