jspsych-tangram 0.0.3 → 0.0.5
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 +23 -63
- package/dist/construct/index.browser.js.map +1 -1
- package/dist/construct/index.browser.min.js +11 -15
- package/dist/construct/index.browser.min.js.map +1 -1
- package/dist/construct/index.cjs +23 -63
- package/dist/construct/index.cjs.map +1 -1
- package/dist/construct/index.js +23 -63
- package/dist/construct/index.js.map +1 -1
- package/dist/index.cjs +26 -64
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +26 -64
- package/dist/index.js.map +1 -1
- package/dist/prep/index.browser.js +16 -14
- package/dist/prep/index.browser.js.map +1 -1
- package/dist/prep/index.browser.min.js +1 -1
- package/dist/prep/index.browser.min.js.map +1 -1
- package/dist/prep/index.cjs +16 -14
- package/dist/prep/index.cjs.map +1 -1
- package/dist/prep/index.js +16 -14
- package/dist/prep/index.js.map +1 -1
- package/package.json +1 -1
- package/src/core/components/board/GameBoard.tsx +4 -1
- package/src/core/domain/primitives.ts +9 -10
- package/src/core/domain/types.ts +4 -3
- package/src/core/engine/state/BaseGameController.ts +0 -1
- package/src/core/io/InteractionTracker.ts +1 -1
- package/src/core/io/quickstash.ts +3 -29
- package/src/core/types/plugin-interfaces.ts +1 -1
- package/src/plugins/tangram-construct/ConstructionApp.tsx +13 -58
- package/src/plugins/tangram-construct/index.ts +1 -1
- package/src/plugins/tangram-prep/PrepApp.tsx +1 -0
- package/src/plugins/tangram-prep/index.ts +1 -1
- package/tangram-construct.min.js +11 -15
- package/tangram-prep.min.js +1 -1
- package/src/core/io/stims.ts +0 -107
package/dist/construct/index.js
CHANGED
|
@@ -185,7 +185,6 @@ class BaseGameController {
|
|
|
185
185
|
const allDone = Object.values(this.state.sectors).every((s) => !!s.completedAt);
|
|
186
186
|
if (allDone && !this.state.endedAt) {
|
|
187
187
|
this.state.endedAt = NOW();
|
|
188
|
-
console.log("[BaseGameController] all sectors complete");
|
|
189
188
|
}
|
|
190
189
|
}
|
|
191
190
|
// ===== Piece Operations =====
|
|
@@ -2926,8 +2925,7 @@ class InteractionTracker {
|
|
|
2926
2925
|
}
|
|
2927
2926
|
const sectorTangramMap = this.controller.state.cfg.sectors.map((s) => ({
|
|
2928
2927
|
sectorId: s.id,
|
|
2929
|
-
tangramId: s.
|
|
2930
|
-
// In our system, sector ID == tangram ID
|
|
2928
|
+
tangramId: s.tangramId
|
|
2931
2929
|
}));
|
|
2932
2930
|
const blueprintOrder = {
|
|
2933
2931
|
primitives: this.controller.state.primitives.map((bp) => bp.id),
|
|
@@ -3154,7 +3152,9 @@ function GameBoard(props) {
|
|
|
3154
3152
|
if (allSectorsComplete && !gameCompleted) {
|
|
3155
3153
|
setGameCompleted(true);
|
|
3156
3154
|
if (tracker) {
|
|
3157
|
-
|
|
3155
|
+
setTimeout(() => {
|
|
3156
|
+
tracker.finalizeTrial("auto_complete");
|
|
3157
|
+
}, 0);
|
|
3158
3158
|
}
|
|
3159
3159
|
}
|
|
3160
3160
|
};
|
|
@@ -3432,10 +3432,10 @@ function constructFromSpec(sideLens, angles, firstEdgeUnits) {
|
|
|
3432
3432
|
return pts;
|
|
3433
3433
|
}
|
|
3434
3434
|
const FIRST_EDGES_UNITS = {
|
|
3435
|
-
"
|
|
3435
|
+
"smalltriangle": [P(0, 0), P(0.5, 0.5)],
|
|
3436
3436
|
"parallelogram": [P(0, 0), P(0.5, 0)],
|
|
3437
|
-
"
|
|
3438
|
-
"
|
|
3437
|
+
"largetriangle": [P(0, 0), P(0.5, -0.5)],
|
|
3438
|
+
"medtriangle": [P(0, 0), P(0.5, 0)],
|
|
3439
3439
|
"square": [P(0, 0), P(0.5, 0)]
|
|
3440
3440
|
};
|
|
3441
3441
|
const PRIMITIVE_BLUEPRINTS_CACHE = (() => {
|
|
@@ -3448,8 +3448,8 @@ const PRIMITIVE_BLUEPRINTS_CACHE = (() => {
|
|
|
3448
3448
|
color: "#f43f5e"
|
|
3449
3449
|
},
|
|
3450
3450
|
{
|
|
3451
|
-
id: "prim:
|
|
3452
|
-
kind: "
|
|
3451
|
+
id: "prim:smalltriangle",
|
|
3452
|
+
kind: "smalltriangle",
|
|
3453
3453
|
sideLens: [HALFDIAGONAL, HALFDIAGONAL, HALFUNIT, HALFUNIT, HALFUNIT, HALFUNIT],
|
|
3454
3454
|
angles: [180, 45, 180, 90, 180, 45],
|
|
3455
3455
|
color: "#f59e0b"
|
|
@@ -3462,15 +3462,15 @@ const PRIMITIVE_BLUEPRINTS_CACHE = (() => {
|
|
|
3462
3462
|
color: "#10b981"
|
|
3463
3463
|
},
|
|
3464
3464
|
{
|
|
3465
|
-
id: "prim:
|
|
3466
|
-
kind: "
|
|
3465
|
+
id: "prim:medtriangle",
|
|
3466
|
+
kind: "medtriangle",
|
|
3467
3467
|
sideLens: [HALFUNIT, HALFUNIT, HALFUNIT, HALFUNIT, HALFDIAGONAL, HALFDIAGONAL, HALFDIAGONAL, HALFDIAGONAL],
|
|
3468
3468
|
angles: [180, 180, 180, 45, 180, 90, 180, 45],
|
|
3469
3469
|
color: "#3b82f6"
|
|
3470
3470
|
},
|
|
3471
3471
|
{
|
|
3472
|
-
id: "prim:
|
|
3473
|
-
kind: "
|
|
3472
|
+
id: "prim:largetriangle",
|
|
3473
|
+
kind: "largetriangle",
|
|
3474
3474
|
sideLens: [
|
|
3475
3475
|
HALFDIAGONAL,
|
|
3476
3476
|
HALFDIAGONAL,
|
|
@@ -3542,101 +3542,61 @@ function convertAnchorCompositeToPixels(anchorComposite, primsByKind, gridStepPx
|
|
|
3542
3542
|
function startConstructionTrial(display_element, params, _jsPsych) {
|
|
3543
3543
|
const CANON = /* @__PURE__ */ new Set([
|
|
3544
3544
|
"square",
|
|
3545
|
-
"
|
|
3545
|
+
"smalltriangle",
|
|
3546
3546
|
"parallelogram",
|
|
3547
|
-
"
|
|
3548
|
-
"
|
|
3547
|
+
"medtriangle",
|
|
3548
|
+
"largetriangle"
|
|
3549
3549
|
]);
|
|
3550
|
-
const SECTOR_IDS = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L"];
|
|
3551
|
-
console.log("[ConstructionApp] Starting tangram conversion...");
|
|
3552
|
-
console.log("[ConstructionApp] Received tangrams:", params.tangrams);
|
|
3553
|
-
console.log("[ConstructionApp] Number of tangrams:", params.tangrams.length);
|
|
3554
3550
|
const sectors = params.tangrams.map((tangramSpec, index) => {
|
|
3555
|
-
console.log(`
|
|
3556
|
-
[ConstructionApp] Processing tangram ${index}:`, tangramSpec);
|
|
3557
|
-
console.log(`[ConstructionApp] tangramID: ${tangramSpec.tangramID}`);
|
|
3558
|
-
console.log(`[ConstructionApp] setLabel: ${tangramSpec.setLabel}`);
|
|
3559
|
-
console.log(`[ConstructionApp] solutionTans count: ${tangramSpec.solutionTans?.length}`);
|
|
3560
|
-
console.log(`[ConstructionApp] solutionTans:`, tangramSpec.solutionTans);
|
|
3561
3551
|
const filteredTans = tangramSpec.solutionTans.filter((tan) => {
|
|
3562
3552
|
const tanName = tan.name ?? tan.kind;
|
|
3563
3553
|
const isCanonical = CANON.has(tanName);
|
|
3564
|
-
console.log(`[ConstructionApp] Tan "${tanName}": canonical=${isCanonical}, vertices count=${tan.vertices?.length}`);
|
|
3565
3554
|
return isCanonical;
|
|
3566
3555
|
});
|
|
3567
|
-
console.log(`[ConstructionApp] Filtered to ${filteredTans.length} canonical pieces`);
|
|
3568
3556
|
const mask = filteredTans.map((tan, tanIndex) => {
|
|
3569
|
-
const tanName = tan.name ?? tan.kind;
|
|
3570
3557
|
const polygon = tan.vertices.map(([x, y]) => ({ x: x ?? 0, y: -(y ?? 0) }));
|
|
3571
|
-
console.log(`[ConstructionApp] Polygon ${tanIndex} (${tanName}): ${tan.vertices.length} vertices -> ${polygon.length} points`);
|
|
3572
|
-
console.log(`[ConstructionApp] First vertex: [${tan.vertices[0]?.[0]}, ${tan.vertices[0]?.[1]}] -> {x: ${polygon[0]?.x}, y: ${polygon[0]?.y}}`);
|
|
3573
3558
|
return polygon;
|
|
3574
3559
|
});
|
|
3575
|
-
const sectorId =
|
|
3576
|
-
console.log(`[ConstructionApp] Assigned sector ID: ${sectorId}`);
|
|
3577
|
-
console.log(`[ConstructionApp] Final mask has ${mask.length} polygons`);
|
|
3560
|
+
const sectorId = `sector${index}`;
|
|
3578
3561
|
const sector = {
|
|
3579
3562
|
id: sectorId,
|
|
3563
|
+
tangramId: tangramSpec.tangramID,
|
|
3580
3564
|
silhouette: {
|
|
3581
3565
|
id: sectorId,
|
|
3582
3566
|
mask
|
|
3583
3567
|
}
|
|
3584
3568
|
};
|
|
3585
|
-
console.log(`[ConstructionApp] Created sector:`, sector);
|
|
3586
3569
|
return sector;
|
|
3587
3570
|
});
|
|
3588
|
-
console.log("\n[ConstructionApp] Final sectors array:", sectors);
|
|
3589
|
-
console.log(`[ConstructionApp] Total sectors created: ${sectors.length}`);
|
|
3590
|
-
console.log("\n[ConstructionApp] Processing quickstash macros...");
|
|
3591
|
-
console.log("[ConstructionApp] quickstash_macros:", params.quickstash_macros);
|
|
3592
|
-
console.log("[ConstructionApp] quickstash_macros count:", params.quickstash_macros?.length ?? 0);
|
|
3593
3571
|
let quickstash = [];
|
|
3594
3572
|
if (params.quickstash_macros && params.quickstash_macros.length > 0) {
|
|
3595
3573
|
const firstMacro = params.quickstash_macros[0];
|
|
3596
|
-
console.log("[ConstructionApp] First macro:", firstMacro);
|
|
3597
3574
|
if (firstMacro && "parts" in firstMacro && firstMacro.parts && firstMacro.parts[0] && "anchorOffset" in firstMacro.parts[0]) {
|
|
3598
|
-
console.log("[ConstructionApp] Detected anchor-based composites, converting to pixels...");
|
|
3599
3575
|
const primsByKind = /* @__PURE__ */ new Map();
|
|
3600
3576
|
PRIMITIVE_BLUEPRINTS.forEach((p) => primsByKind.set(p.kind, p));
|
|
3601
3577
|
quickstash = params.quickstash_macros.map(
|
|
3602
3578
|
(anchorComposite) => convertAnchorCompositeToPixels(anchorComposite, primsByKind, CONFIG.layout.grid.stepPx)
|
|
3603
3579
|
// Use current CONFIG grid step
|
|
3604
3580
|
);
|
|
3605
|
-
console.log("[ConstructionApp] Converted to pixel-based blueprints:", quickstash);
|
|
3606
3581
|
} else {
|
|
3607
|
-
console.log("[ConstructionApp] Already pixel-based blueprints");
|
|
3608
3582
|
quickstash = params.quickstash_macros;
|
|
3609
3583
|
}
|
|
3610
|
-
} else {
|
|
3611
|
-
console.log("[ConstructionApp] No quickstash macros provided");
|
|
3612
3584
|
}
|
|
3613
3585
|
const gameBoardProps = {
|
|
3614
3586
|
sectors,
|
|
3615
3587
|
quickstash,
|
|
3616
3588
|
primitives: PRIMITIVE_BLUEPRINTS,
|
|
3617
|
-
layout: params.layout
|
|
3618
|
-
target: params.target
|
|
3619
|
-
input: params.input
|
|
3620
|
-
timeLimitMs: params.time_limit_ms
|
|
3589
|
+
layout: params.layout,
|
|
3590
|
+
target: params.target,
|
|
3591
|
+
input: params.input,
|
|
3592
|
+
timeLimitMs: params.time_limit_ms,
|
|
3621
3593
|
maxQuickstashSlots: CONFIG.layout.defaults.maxQuickstashSlots,
|
|
3622
3594
|
mode: "construction",
|
|
3623
|
-
// Explicit construction mode
|
|
3624
3595
|
...params.onInteraction && { onInteraction: params.onInteraction },
|
|
3625
3596
|
...params.onTrialEnd && { onTrialEnd: params.onTrialEnd }
|
|
3626
3597
|
};
|
|
3627
|
-
console.log("\n[ConstructionApp] Final GameBoard props:");
|
|
3628
|
-
console.log("[ConstructionApp] sectors count:", gameBoardProps.sectors.length);
|
|
3629
|
-
console.log("[ConstructionApp] quickstash count:", gameBoardProps.quickstash.length);
|
|
3630
|
-
console.log("[ConstructionApp] primitives count:", gameBoardProps.primitives.length);
|
|
3631
|
-
console.log("[ConstructionApp] layout:", gameBoardProps.layout);
|
|
3632
|
-
console.log("[ConstructionApp] target:", gameBoardProps.target);
|
|
3633
|
-
console.log("[ConstructionApp] input:", gameBoardProps.input);
|
|
3634
|
-
console.log("[ConstructionApp] timeLimitMs:", gameBoardProps.timeLimitMs);
|
|
3635
|
-
console.log("[ConstructionApp] mode:", gameBoardProps.mode);
|
|
3636
|
-
console.log("[ConstructionApp] Full props:", gameBoardProps);
|
|
3637
3598
|
const root = createRoot(display_element);
|
|
3638
3599
|
root.render(React.createElement(GameBoard, gameBoardProps));
|
|
3639
|
-
console.log("[ConstructionApp] GameBoard rendered successfully");
|
|
3640
3600
|
return { root, display_element, jsPsych: _jsPsych };
|
|
3641
3601
|
}
|
|
3642
3602
|
|
|
@@ -3760,7 +3720,7 @@ class TangramConstructPlugin {
|
|
|
3760
3720
|
target: trial.target,
|
|
3761
3721
|
input: trial.input,
|
|
3762
3722
|
layout: trial.layout,
|
|
3763
|
-
time_limit_ms: trial.time_limit_ms
|
|
3723
|
+
time_limit_ms: trial.time_limit_ms,
|
|
3764
3724
|
onInteraction: trial.onInteraction,
|
|
3765
3725
|
onTrialEnd: wrappedOnTrialEnd
|
|
3766
3726
|
};
|