jspsych-tangram 0.0.8 → 0.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/construct/index.browser.js +41 -2
- package/dist/construct/index.browser.js.map +1 -1
- package/dist/construct/index.browser.min.js +14 -11
- package/dist/construct/index.browser.min.js.map +1 -1
- package/dist/construct/index.cjs +41 -2
- package/dist/construct/index.cjs.map +1 -1
- package/dist/construct/index.js +41 -2
- package/dist/construct/index.js.map +1 -1
- package/dist/index.cjs +41 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +41 -2
- package/dist/index.js.map +1 -1
- package/dist/prep/index.browser.js +41 -2
- package/dist/prep/index.browser.js.map +1 -1
- package/dist/prep/index.browser.min.js +16 -13
- package/dist/prep/index.browser.min.js.map +1 -1
- package/dist/prep/index.cjs +41 -2
- package/dist/prep/index.cjs.map +1 -1
- package/dist/prep/index.js +41 -2
- package/dist/prep/index.js.map +1 -1
- package/package.json +1 -1
- package/src/assets/README.md +6 -0
- package/src/assets/images.d.ts +19 -0
- package/src/assets/locked.png +0 -0
- package/src/assets/unlocked.png +0 -0
- package/src/core/components/board/BoardView.tsx +72 -29
- package/src/core/io/InteractionTracker.ts +16 -8
- package/src/core/io/data-tracking.ts +3 -0
- package/tangram-construct.min.js +14 -11
- package/tangram-prep.min.js +16 -13
package/dist/construct/index.js
CHANGED
|
@@ -823,6 +823,10 @@ function shouldUseSelectiveBorders(blueprintId) {
|
|
|
823
823
|
return CONFIG.game.showBorders;
|
|
824
824
|
}
|
|
825
825
|
|
|
826
|
+
var lockedIcon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAA4qEECAAAACXBIWXMAAAsSAAALEgHS3X78AAAFY0lEQVR4nO2d7XXrNgyGH/r0f7zB9QbXnaDqBt6gvhM0I2SE3A2UDXwnqLKBPEHdDewJ0B+kYieWZEoiQfrjPQcnjqOI0GuYAAFQMiJCLjDGLIEFsHQyB/7w/Pd397MCamAnInVgFUfDpCTaGLMACmDlfj4FHuKAJX4DVCKyC3x+b6gTbYyZA2sn31UHhy1QAqWI7FVHFhEVwVpsCUgmUgKF2vUrEVxlQGyXVBqE3zPBqoTHIHhOXlPEUCmBedZEY6OHfQZkTZU9sMqO6Buw4ujWHYLkJXaBkJqUWFIDy6REYx3eLUwVl2TPREc5heR1BgRoy1qV6DsleRLZD5KVyH6QrET2UMeX+uJyE28H6UvykvuILobKHs/Qz4fkObcdJ0+VGo9FzcV8tDGmBP7qPSg+DtgLqrFWBLYSs8C/AhMTbyKy7j3igjWvSPu1LPH4ajo9y4S6ChdyI5emjFTz8isjcgxYC98kNIxOnfuUTmEhk5e6Tvd1IiMpBxFNmlDOy6kMIDtVpNRqKK3O0BhToetk/sPOxZ0FU1cxX2CNAGxFZCc9lW3XvlARvrreh3cRKc7ezcSaOx0e1tH1hZc1PY6INA79zKrbFKuUlXrpccZDdKnomHqwzlXzmqpeotG35l0PyWMWSa3zPGkiqKKP6FJZmXUH0VVIa0pk1WUr0e5T11REaLe+dYwPEOtIk13fqSLPykp0Wd4uwLm7piTtnM1zM/aMI9boovr6hgvHvgU49zdjTNHyvnZ36bp5MYOPGFW74bDtoouA52871y7g+X3w3XH7YdGFsgJwzMKdYh55zCry+dtQwJHoVQIF7gUrSGvR94ICYOYckGYu4N7wZIxZzLDx5QNxsZxh04kPxMUS9JNINfBChB7kS4KNal4JsygaIhtNooNUTwKS/oxeoqky7kVsbB3JujuhLkCzMKBF9O+S0ebKU7il+j+xx5ldPmQyfuZKMoCIVMCv2ONoEP2qMMZUlLEHiD11HEQkdv4iCIwxUafQ2Bad7ZShjd9SK+CLkz3kTQJsQ4o93RMQNX4MFPN2NcN4t816jBE1ltZwhpPgLLmiPdZ9Aip3TNbInmjsdNG3oHhCvww3GDOOd27JFT5FidwLF+8z2ktKD4TFfkb+Idgm0DEpUV8L0Yeevx94ED0dYttyC9rJPmCzgjtFlcagnjkl+ywmOVxSasHn5M8vYJFzwsrhICK7JryrUmriA7cCPCW1vpJVYQXHODr3Oe6asYEj0VU6PW4eFTii3Ty9TajMrWLbOOrTJXiZRJXbRtm8eBAdF2Xz4oNo58HfUmhzo3g7jYq+Zu9KXV0Go+54nSPKT7+1JMArwiW86wiNL2sm3ERKKfF/VvA42zkbus9BREyoc8WC68r/N+Ap/3RtDB84S/y7A4LlqI0xueeKIWx/+PtXkoHzqeOkRpdV3TCmELbpsbWG2Td4yA2QwefUgCS/BLzO185xehSYB/6ksyObsLeX2zHmxihOkdB3Biixqc3UBC8If6eaom9Mn5tXvQJ/9x40HFtsGKmd5pxjHV/oPZU/ReS57wCvp1YYY2r0N3xeC7YicnF7im9fx4rMqzCJcMCz1cGLaDnW7R74jEI865XenUpia3M/xmp0g/ghQ+qViUOia5XBoWoO8ee1yaj1QC7B/rXIKJK94ug+JLqvXAo0jTqjc+CT2nbdwEtuu7C7xSaKphUaAi1pm62/qb/aoWXUzWiDztEdhD8e4aRB9I1YdzArjkr0CeGNo0xNnK9UBNp4pEr0CeFF5oRXXPODIzsILzMgtpFSg+BGHg/3VcLjcdVKSEr0Vzjil4x/AHvTrF5jm3d2wZUcif8BqSLxz8FiAOgAAAAASUVORK5CYII=";
|
|
827
|
+
|
|
828
|
+
var unlockedIcon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAA4qEECAAAACXBIWXMAAAsSAAALEgHS3X78AAAFYklEQVR4nO1d0ZGjOBB9ct3/+iJYMlg2giODcwjeDCYEbwbeDNgMvBloIjgmAyYDHEHfh4SHsQUIaLVk7FfVNTblkZpHq1u0GqGICKlAKZUDyADkVrYA/vH891f7VwOoANREVDGrOBsqJtFKqQxAAWBn/35h7uIMQ/wJgCaimrl9b4gTrZTaAthb+SbaOfAGoARQElEj2jMRiQiMxZYAKBEpARRi5y9EsE6A2D7REoQ/MsGihIcgeIu0XMRUKQFskyYaZvbQJEDWUmkA7JIjegVWHNy6OUjOYW4QYpMSSioAeVSiYQLeGlzFmDRYGCiXkLxPgABp2YsS/aAkLyL7SbIQ2U+ShcieGvhin1xq4h0gvbJ3Nk+swZ/G9MEZZooFmKlkDB36cIYhezzv7WHJW8jOkxsAR5i7TOfNAszoOgKoBfXqk6pPz0muA3J3fDXmBBkTN2ITXi4i2lqVhKJHH6sYGXXHyGQP5kbGlJe465tsxSPWHYvoZshYYrsMNpITIbvXhfQpWwgo9eJB2AmfR1Vjjw1eoMhkF1OI1oGV0SNxofZoo8aAX7QXJAbRznOLZc1ZDzlzAtqxp60sEtEEh1XHsGanHwNwWNCm0w0h3mLEjVUnYc1M/d4k55GQVUtbQBUwJpx62q4jEV06iYaZN4fu/MafgtfqXKMlFtGEzrx6gw/sER6u5MuOsf1D94tS6gXAV8b2p2J/+dS58hKJo9tovCwIukTbNrXA+YxJ9cl1QC5ouIiONd+VkqzrOgrEQzI1zIFQALgQzeknh5AJ9ZMSdgDELTpzHDsJ9R0LRfshR4TgkNAUTMRPbyA7nL/ZxymuoQV1iIF8A2PRknDFg7W7j3wD+RnHTX9EdIJZUV4r8r8idPqvUmpLtw/rHBH+oscqV9gCskGhgblrY6+o9xWYmHSAfBWsWEenmAQ7CN9C9q5UpJMyNrEDhGsJDlTLdkC8wyTlZR+g9IR9wLRGYN+9Gf/JYhxSJRkArG7H0P1IWPTfKRMNXIo4/wvaB8IS/U5EWcD22aCUCmpwoV1HHbj9u4GEj2aBUmqnlKqUUmSlUkpJpXdZEHJao5mmYEOFNc4Cmhl9BJ9H65SJhl/NR5E40XoDcyuaMnzcwz60EgvRbJD+mp1PGjcLrcRCVPdAtM+IS31U3gXRPosCqS8cVG0gCJUy5Jp1DBX3ONchEwqGDdFHXYdmuGohUQD44zj+B3FrUnyggY8blqSHHhE1RLQD8LNz+CcR7VLPo8Byey8Wfc/QgCWazA6HbxGVWSveLLefch1lFFXWjbL98CQ6LMr2w4VoG1R+x9BmpfjdDdTXadJSVpdVo+x++UQ0EWl87MP8xHy8Wi4vcCX+DyKqzENbOnZG2nP/w/UB5w40SikN/53Ih8C+ZmgXUkHMu50zrhm+ElFx034P0Zyrwo+2Cv7dZQTONUP7w19MHd/Duh6Xjr96R9pANqut4FmavaqRUM1dz3lyZC8Hz7N3FdwO95cJV7MPXyFQCbQAJ/CUg+0HXaTHFefaq6hEQpYN3mrS0ZV4X6W4nqqtYRZS11Qf7bXw4LvBYGbJ5qy4fId8JRN3xf8ZplK2Hvuh93tYJAoB7xDOqZwL3iVhtsEfs1VaH374kgzAz0df+bg9eHzbPct+Mm8zA8ojkz2Z5NlEPzDZs0j2nnX0IfJ2x5Lw3764B4vqo23HOda9sPsGM4Vbli1kuglIYbfbELJoF2AWH91D+PMVThJEr8S62aw4KNEdwttAGZs4X9FgeFWTONEdwovECde45xdH9hBeJkBsK6UEwa08X+4rhOfrqoUQlehrWOJzzH8BewOTN69gEvI1u5Iz8T+TOcUtjzRRXwAAAABJRU5ErkJggg==";
|
|
829
|
+
|
|
826
830
|
function pathD(poly) {
|
|
827
831
|
return `M ${poly.map((pt) => `${pt.x} ${pt.y}`).join(" L ")} Z`;
|
|
828
832
|
}
|
|
@@ -993,10 +997,20 @@ function BoardView(props) {
|
|
|
993
997
|
}
|
|
994
998
|
)));
|
|
995
999
|
}),
|
|
1000
|
+
/* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("filter", { id: "invert-to-white" }, /* @__PURE__ */ React.createElement(
|
|
1001
|
+
"feColorMatrix",
|
|
1002
|
+
{
|
|
1003
|
+
type: "matrix",
|
|
1004
|
+
values: "-1 0 0 0 1\n 0 -1 0 0 1\n 0 0 -1 0 1\n 0 0 0 1 0"
|
|
1005
|
+
}
|
|
1006
|
+
))),
|
|
996
1007
|
(() => {
|
|
997
1008
|
const isPrep = controller.state.cfg.mode === "prep";
|
|
998
1009
|
const isSubmitEnabled = isPrep ? controller.isSubmitEnabled() : true;
|
|
999
1010
|
const isClickable = !draggingId && (!isPrep || isSubmitEnabled);
|
|
1011
|
+
const [imageError, setImageError] = React.useState(false);
|
|
1012
|
+
const iconSize = badgeR * 1.6;
|
|
1013
|
+
const iconOffset = iconSize / 2;
|
|
1000
1014
|
return /* @__PURE__ */ React.createElement(
|
|
1001
1015
|
"g",
|
|
1002
1016
|
{
|
|
@@ -1012,7 +1026,7 @@ function BoardView(props) {
|
|
|
1012
1026
|
opacity: isSubmitEnabled ? 1 : 0.5
|
|
1013
1027
|
}
|
|
1014
1028
|
),
|
|
1015
|
-
/* @__PURE__ */ React.createElement(
|
|
1029
|
+
isPrep ? /* @__PURE__ */ React.createElement(
|
|
1016
1030
|
"text",
|
|
1017
1031
|
{
|
|
1018
1032
|
textAnchor: "middle",
|
|
@@ -1021,7 +1035,29 @@ function BoardView(props) {
|
|
|
1021
1035
|
fill: isSubmitEnabled ? CONFIG.color.blueprint.labelFill : "#888",
|
|
1022
1036
|
pointerEvents: "none"
|
|
1023
1037
|
},
|
|
1024
|
-
|
|
1038
|
+
"Submit"
|
|
1039
|
+
) : imageError ? /* @__PURE__ */ React.createElement(
|
|
1040
|
+
"text",
|
|
1041
|
+
{
|
|
1042
|
+
textAnchor: "middle",
|
|
1043
|
+
dominantBaseline: "middle",
|
|
1044
|
+
fontSize: CONFIG.size.badgeFontPx,
|
|
1045
|
+
fill: CONFIG.color.blueprint.labelFill,
|
|
1046
|
+
pointerEvents: "none"
|
|
1047
|
+
},
|
|
1048
|
+
"inventory"
|
|
1049
|
+
) : /* @__PURE__ */ React.createElement(
|
|
1050
|
+
"image",
|
|
1051
|
+
{
|
|
1052
|
+
href: controller.state.blueprintView === "quickstash" ? lockedIcon : unlockedIcon,
|
|
1053
|
+
x: -iconOffset,
|
|
1054
|
+
y: -iconOffset,
|
|
1055
|
+
width: iconSize,
|
|
1056
|
+
height: iconSize,
|
|
1057
|
+
pointerEvents: "none",
|
|
1058
|
+
onError: () => setImageError(true),
|
|
1059
|
+
filter: "url(#invert-to-white)"
|
|
1060
|
+
}
|
|
1025
1061
|
)
|
|
1026
1062
|
);
|
|
1027
1063
|
})(),
|
|
@@ -2609,6 +2645,7 @@ class InteractionTracker {
|
|
|
2609
2645
|
const trialEndTime = Date.now();
|
|
2610
2646
|
const totalDuration = trialEndTime - this.trialStartTime;
|
|
2611
2647
|
const finalSnapshot = this.buildStateSnapshot();
|
|
2648
|
+
const anchorToStimuliRatio = CONFIG.layout.grid.stepPx / CONFIG.layout.grid.unitPx;
|
|
2612
2649
|
const mode = this.controller.state.cfg.mode;
|
|
2613
2650
|
if (mode === "construction") {
|
|
2614
2651
|
const finalBlueprintState = this.buildFinalBlueprintState(finalSnapshot);
|
|
@@ -2623,6 +2660,7 @@ class InteractionTracker {
|
|
|
2623
2660
|
trialStartTime: this.trialStartTime,
|
|
2624
2661
|
trialEndTime,
|
|
2625
2662
|
totalDuration,
|
|
2663
|
+
anchorToStimuliRatio,
|
|
2626
2664
|
trialParams: this.trialParams,
|
|
2627
2665
|
endReason,
|
|
2628
2666
|
completionTimes: this.completionTimes,
|
|
@@ -2645,6 +2683,7 @@ class InteractionTracker {
|
|
|
2645
2683
|
trialStartTime: this.trialStartTime,
|
|
2646
2684
|
trialEndTime,
|
|
2647
2685
|
totalDuration,
|
|
2686
|
+
anchorToStimuliRatio,
|
|
2648
2687
|
trialParams: this.trialParams,
|
|
2649
2688
|
endReason: "submit",
|
|
2650
2689
|
createdMacros: finalMacros,
|