jspsych-tangram 0.0.4 → 0.0.6
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 +18 -49
- package/dist/construct/index.browser.js.map +1 -1
- package/dist/construct/index.browser.min.js +10 -14
- package/dist/construct/index.browser.min.js.map +1 -1
- package/dist/construct/index.cjs +18 -49
- package/dist/construct/index.cjs.map +1 -1
- package/dist/construct/index.d.ts +12 -0
- package/dist/construct/index.js +18 -49
- package/dist/construct/index.js.map +1 -1
- package/dist/index.cjs +30 -52
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +24 -0
- package/dist/index.js +30 -52
- package/dist/index.js.map +1 -1
- package/dist/prep/index.browser.js +15 -5
- package/dist/prep/index.browser.js.map +1 -1
- package/dist/prep/index.browser.min.js +11 -11
- package/dist/prep/index.browser.min.js.map +1 -1
- package/dist/prep/index.cjs +15 -5
- package/dist/prep/index.cjs.map +1 -1
- package/dist/prep/index.d.ts +12 -0
- package/dist/prep/index.js +15 -5
- 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/engine/state/BaseGameController.ts +0 -1
- package/src/plugins/tangram-construct/ConstructionApp.tsx +13 -53
- package/src/plugins/tangram-construct/index.ts +8 -1
- package/src/plugins/tangram-prep/PrepApp.tsx +8 -2
- package/src/plugins/tangram-prep/index.ts +8 -1
- package/tangram-construct.min.js +10 -14
- package/tangram-prep.min.js +11 -11
|
@@ -16,6 +16,12 @@ declare const info: {
|
|
|
16
16
|
default: never[];
|
|
17
17
|
description: string;
|
|
18
18
|
};
|
|
19
|
+
/** Array of primitive names in the order they should be displayed */
|
|
20
|
+
primitive_order: {
|
|
21
|
+
type: ParameterType;
|
|
22
|
+
default: string[];
|
|
23
|
+
description: string;
|
|
24
|
+
};
|
|
19
25
|
/** Whether to place pieces in workspace or directly on silhouette */
|
|
20
26
|
target: {
|
|
21
27
|
type: ParameterType;
|
|
@@ -118,6 +124,12 @@ declare class TangramConstructPlugin implements JsPsychPlugin<Info> {
|
|
|
118
124
|
default: never[];
|
|
119
125
|
description: string;
|
|
120
126
|
};
|
|
127
|
+
/** Array of primitive names in the order they should be displayed */
|
|
128
|
+
primitive_order: {
|
|
129
|
+
type: ParameterType;
|
|
130
|
+
default: string[];
|
|
131
|
+
description: string;
|
|
132
|
+
};
|
|
121
133
|
/** Whether to place pieces in workspace or directly on silhouette */
|
|
122
134
|
target: {
|
|
123
135
|
type: ParameterType;
|
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 =====
|
|
@@ -3153,7 +3152,9 @@ function GameBoard(props) {
|
|
|
3153
3152
|
if (allSectorsComplete && !gameCompleted) {
|
|
3154
3153
|
setGameCompleted(true);
|
|
3155
3154
|
if (tracker) {
|
|
3156
|
-
|
|
3155
|
+
setTimeout(() => {
|
|
3156
|
+
tracker.finalizeTrial("auto_complete");
|
|
3157
|
+
}, 0);
|
|
3157
3158
|
}
|
|
3158
3159
|
}
|
|
3159
3160
|
};
|
|
@@ -3546,33 +3547,18 @@ function startConstructionTrial(display_element, params, _jsPsych) {
|
|
|
3546
3547
|
"medtriangle",
|
|
3547
3548
|
"largetriangle"
|
|
3548
3549
|
]);
|
|
3549
|
-
|
|
3550
|
-
console.log("[ConstructionApp] Received tangrams:", params.tangrams);
|
|
3551
|
-
console.log("[ConstructionApp] Number of tangrams:", params.tangrams.length);
|
|
3550
|
+
const PRIMITIVE_BLUEPRINTS_ORDERED = [...PRIMITIVE_BLUEPRINTS].sort((a, b) => params.primitiveOrder.indexOf(a.kind) - params.primitiveOrder.indexOf(b.kind));
|
|
3552
3551
|
const sectors = params.tangrams.map((tangramSpec, index) => {
|
|
3553
|
-
console.log(`
|
|
3554
|
-
[ConstructionApp] Processing tangram ${index}:`, tangramSpec);
|
|
3555
|
-
console.log(`[ConstructionApp] tangramID: ${tangramSpec.tangramID}`);
|
|
3556
|
-
console.log(`[ConstructionApp] setLabel: ${tangramSpec.setLabel}`);
|
|
3557
|
-
console.log(`[ConstructionApp] solutionTans count: ${tangramSpec.solutionTans?.length}`);
|
|
3558
|
-
console.log(`[ConstructionApp] solutionTans:`, tangramSpec.solutionTans);
|
|
3559
3552
|
const filteredTans = tangramSpec.solutionTans.filter((tan) => {
|
|
3560
3553
|
const tanName = tan.name ?? tan.kind;
|
|
3561
3554
|
const isCanonical = CANON.has(tanName);
|
|
3562
|
-
console.log(`[ConstructionApp] Tan "${tanName}": canonical=${isCanonical}, vertices count=${tan.vertices?.length}`);
|
|
3563
3555
|
return isCanonical;
|
|
3564
3556
|
});
|
|
3565
|
-
console.log(`[ConstructionApp] Filtered to ${filteredTans.length} canonical pieces`);
|
|
3566
3557
|
const mask = filteredTans.map((tan, tanIndex) => {
|
|
3567
|
-
const tanName = tan.name ?? tan.kind;
|
|
3568
3558
|
const polygon = tan.vertices.map(([x, y]) => ({ x: x ?? 0, y: -(y ?? 0) }));
|
|
3569
|
-
console.log(`[ConstructionApp] Polygon ${tanIndex} (${tanName}): ${tan.vertices.length} vertices -> ${polygon.length} points`);
|
|
3570
|
-
console.log(`[ConstructionApp] First vertex: [${tan.vertices[0]?.[0]}, ${tan.vertices[0]?.[1]}] -> {x: ${polygon[0]?.x}, y: ${polygon[0]?.y}}`);
|
|
3571
3559
|
return polygon;
|
|
3572
3560
|
});
|
|
3573
3561
|
const sectorId = `sector${index}`;
|
|
3574
|
-
console.log(`[ConstructionApp] Assigned sector ID: ${sectorId}`);
|
|
3575
|
-
console.log(`[ConstructionApp] Final mask has ${mask.length} polygons`);
|
|
3576
3562
|
const sector = {
|
|
3577
3563
|
id: sectorId,
|
|
3578
3564
|
tangramId: tangramSpec.tangramID,
|
|
@@ -3581,61 +3567,37 @@ function startConstructionTrial(display_element, params, _jsPsych) {
|
|
|
3581
3567
|
mask
|
|
3582
3568
|
}
|
|
3583
3569
|
};
|
|
3584
|
-
console.log(`[ConstructionApp] Created sector:`, sector);
|
|
3585
3570
|
return sector;
|
|
3586
3571
|
});
|
|
3587
|
-
console.log("\n[ConstructionApp] Final sectors array:", sectors);
|
|
3588
|
-
console.log(`[ConstructionApp] Total sectors created: ${sectors.length}`);
|
|
3589
|
-
console.log("\n[ConstructionApp] Processing quickstash macros...");
|
|
3590
|
-
console.log("[ConstructionApp] quickstash_macros:", params.quickstash_macros);
|
|
3591
|
-
console.log("[ConstructionApp] quickstash_macros count:", params.quickstash_macros?.length ?? 0);
|
|
3592
3572
|
let quickstash = [];
|
|
3593
3573
|
if (params.quickstash_macros && params.quickstash_macros.length > 0) {
|
|
3594
3574
|
const firstMacro = params.quickstash_macros[0];
|
|
3595
|
-
console.log("[ConstructionApp] First macro:", firstMacro);
|
|
3596
3575
|
if (firstMacro && "parts" in firstMacro && firstMacro.parts && firstMacro.parts[0] && "anchorOffset" in firstMacro.parts[0]) {
|
|
3597
|
-
console.log("[ConstructionApp] Detected anchor-based composites, converting to pixels...");
|
|
3598
3576
|
const primsByKind = /* @__PURE__ */ new Map();
|
|
3599
|
-
|
|
3577
|
+
PRIMITIVE_BLUEPRINTS_ORDERED.forEach((p) => primsByKind.set(p.kind, p));
|
|
3600
3578
|
quickstash = params.quickstash_macros.map(
|
|
3601
3579
|
(anchorComposite) => convertAnchorCompositeToPixels(anchorComposite, primsByKind, CONFIG.layout.grid.stepPx)
|
|
3602
3580
|
// Use current CONFIG grid step
|
|
3603
3581
|
);
|
|
3604
|
-
console.log("[ConstructionApp] Converted to pixel-based blueprints:", quickstash);
|
|
3605
3582
|
} else {
|
|
3606
|
-
console.log("[ConstructionApp] Already pixel-based blueprints");
|
|
3607
3583
|
quickstash = params.quickstash_macros;
|
|
3608
3584
|
}
|
|
3609
|
-
} else {
|
|
3610
|
-
console.log("[ConstructionApp] No quickstash macros provided");
|
|
3611
3585
|
}
|
|
3612
3586
|
const gameBoardProps = {
|
|
3613
3587
|
sectors,
|
|
3614
3588
|
quickstash,
|
|
3615
|
-
primitives:
|
|
3616
|
-
layout: params.layout
|
|
3617
|
-
target: params.target
|
|
3618
|
-
input: params.input
|
|
3619
|
-
timeLimitMs: params.time_limit_ms
|
|
3589
|
+
primitives: PRIMITIVE_BLUEPRINTS_ORDERED,
|
|
3590
|
+
layout: params.layout,
|
|
3591
|
+
target: params.target,
|
|
3592
|
+
input: params.input,
|
|
3593
|
+
timeLimitMs: params.time_limit_ms,
|
|
3620
3594
|
maxQuickstashSlots: CONFIG.layout.defaults.maxQuickstashSlots,
|
|
3621
3595
|
mode: "construction",
|
|
3622
|
-
// Explicit construction mode
|
|
3623
3596
|
...params.onInteraction && { onInteraction: params.onInteraction },
|
|
3624
3597
|
...params.onTrialEnd && { onTrialEnd: params.onTrialEnd }
|
|
3625
3598
|
};
|
|
3626
|
-
console.log("\n[ConstructionApp] Final GameBoard props:");
|
|
3627
|
-
console.log("[ConstructionApp] sectors count:", gameBoardProps.sectors.length);
|
|
3628
|
-
console.log("[ConstructionApp] quickstash count:", gameBoardProps.quickstash.length);
|
|
3629
|
-
console.log("[ConstructionApp] primitives count:", gameBoardProps.primitives.length);
|
|
3630
|
-
console.log("[ConstructionApp] layout:", gameBoardProps.layout);
|
|
3631
|
-
console.log("[ConstructionApp] target:", gameBoardProps.target);
|
|
3632
|
-
console.log("[ConstructionApp] input:", gameBoardProps.input);
|
|
3633
|
-
console.log("[ConstructionApp] timeLimitMs:", gameBoardProps.timeLimitMs);
|
|
3634
|
-
console.log("[ConstructionApp] mode:", gameBoardProps.mode);
|
|
3635
|
-
console.log("[ConstructionApp] Full props:", gameBoardProps);
|
|
3636
3599
|
const root = createRoot(display_element);
|
|
3637
3600
|
root.render(React.createElement(GameBoard, gameBoardProps));
|
|
3638
|
-
console.log("[ConstructionApp] GameBoard rendered successfully");
|
|
3639
3601
|
return { root, display_element, jsPsych: _jsPsych };
|
|
3640
3602
|
}
|
|
3641
3603
|
|
|
@@ -3655,6 +3617,12 @@ const info = {
|
|
|
3655
3617
|
default: [],
|
|
3656
3618
|
description: "Array of MacroSpec objects created in prep trial"
|
|
3657
3619
|
},
|
|
3620
|
+
/** Array of primitive names in the order they should be displayed */
|
|
3621
|
+
primitive_order: {
|
|
3622
|
+
type: ParameterType.OBJECT,
|
|
3623
|
+
default: ["square", "smalltriangle", "parallelogram", "medtriangle", "largetriangle"],
|
|
3624
|
+
description: "Array of primitive names in the order they should be displayed"
|
|
3625
|
+
},
|
|
3658
3626
|
/** Whether to place pieces in workspace or directly on silhouette */
|
|
3659
3627
|
target: {
|
|
3660
3628
|
type: ParameterType.SELECT,
|
|
@@ -3756,10 +3724,11 @@ class TangramConstructPlugin {
|
|
|
3756
3724
|
const params = {
|
|
3757
3725
|
tangrams: trial.tangrams,
|
|
3758
3726
|
quickstash_macros: trial.quickstash_macros,
|
|
3727
|
+
primitiveOrder: trial.primitive_order,
|
|
3759
3728
|
target: trial.target,
|
|
3760
3729
|
input: trial.input,
|
|
3761
3730
|
layout: trial.layout,
|
|
3762
|
-
time_limit_ms: trial.time_limit_ms
|
|
3731
|
+
time_limit_ms: trial.time_limit_ms,
|
|
3763
3732
|
onInteraction: trial.onInteraction,
|
|
3764
3733
|
onTrialEnd: wrappedOnTrialEnd
|
|
3765
3734
|
};
|