<![CDATA[Symmetry_Shaded_xAPI_v2]]>
false
true
true
false
false
]]>
true
true
true
false
./Screenshot2025-09-1212921.png
;;
20
1
true
undefined
Var Table 1
true
false
VARIABLE_EDITOR
shaded
true
false
VARIABLE_EDITOR
shaded2
true
false
VARIABLE_EDITOR
xApi
true
false
undefined
init
true
false
[point[1], point[0]]);
} else if (selectedLine === "Diagonal (-)") {
// Reflection over y = -x + 6: (x, y) to (6 - y, 6 - x)
mirroredPolygon = plottedPolygon.map(point => [6 - point[1], 6 - point[0]]);
}
// Find the mirrored polygon in mirroredPolygonPositions
const mirroredIndex = findMirroredPolygonIndex(mirroredPolygon);
if (mirroredIndex === -1) {
console.log(`No mirrored polygon found for plotted polygon index ${i}`);
isValid = false;
break;
}
const mirroredSelected = mirroredPolygonSelected[mirroredIndex];
if (mirroredSelected !== plottedSelected) {
console.log(`Mismatch at polygon index ${i}: Plotted=${plottedSelected}, Mirrored=${mirroredSelected}`);
isValid = false;
break;
}
}
break;
default:
console.log("Invalid line selection.");
isValid = false;
break;
}
if (!pastAttemptsByScenario[pastAttemptsByScenario.length-1].completed) {
pastAttemptsByScenario[pastAttemptsByScenario.length-1].attemptsTakenToComplete += 1;
}
if (isValid) {
if (!pastAttemptsByScenario[pastAttemptsByScenario.length-1].completed) {
pastAttemptsByScenario[pastAttemptsByScenario.length-1].completed = true;
pastAttemptsByScenario[pastAttemptsByScenario.length-1].timeTakenToComplete = `${Math.floor((new Date() - scenarioStartTime) / 1000 / 60)}m ${Math.floor((new Date() - scenarioStartTime) / 1000 % 60)}s`;
score += 1;
}
alert("Success! The mirrored points match the original plotted points.");
} else {
alert("Try again! The mirrored points do not match.");
}
let completedCount = pastAttemptsByScenario.filter(item => item.completed).length;
let totalCount = pastAttemptsByScenario.length;
let feedback = `Configurations completed: ${completedCount}/${totalCount}
`;
pastAttemptsByScenario.forEach((item, index) => {
feedback += `${item.configuration} (Configuration ${index + 1})
` +
`Number of tries to complete: ${item.attemptsTakenToComplete}
` +
`Time taken to Complete: ${item.timeTakenToComplete}
`;
});
console.log(feedback)
console.log(score)
storeState({score, feedback});
initMirroredPoints();
return isValid;
}
/**
* Finds the index of the mirrored polygon in mirroredPolygonPositions that matches the given polygon.
*
* @param {Array} targetPolygon - The polygon to match [ [x1, y1], [x2, y2], ... ].
* @returns {number} - The index of the matching mirrored polygon, or -1 if not found.
*/
function findMirroredPolygonIndex(targetPolygon) {
for (let j = 0; j < mirroredPolygonPositions.length; j++) {
const currentMirroredPolygon = mirroredPolygonPositions[j];
if (arePolygonsEqual(targetPolygon, currentMirroredPolygon)) {
return j;
}
}
return -1;
}
/**
* Compares two polygons for equality, regardless of the order of their points.
*
* @param {Array} poly1 - First polygon's points [ [x1, y1], [x2, y2], ... ].
* @param {Array} poly2 - Second polygon's points [ [x1, y1], [x2, y2], ... ].
* @returns {boolean} - True if polygons are equal, else false.
*/
function arePolygonsEqual(poly1, poly2) {
if (poly1.length !== poly2.length) return false;
// Create copies to avoid mutating original polygons
const sortedPoly1 = [...poly1].map(point => point.join(",")).sort();
const sortedPoly2 = [...poly2].map(point => point.join(",")).sort();
for (let i = 0; i < sortedPoly1.length; i++) {
if (sortedPoly1[i] !== sortedPoly2[i]) return false;
}
return true;
}
]]>
CODE_EDITOR
getPlottedCellPositions
true
false
= xMin ? 1 : -1;
const yStep = yMax >= yMin ? 1 : -1;
// Calculate the number of cells along each axis
const xCount = Math.abs(xMax - xMin);
const yCount = Math.abs(yMax - yMin);
for (let y = 0; y < yCount; y++) {
// Calculate the current Y position based on direction
const currentY = yMin + y * yStep;
const centerY = currentY + (yStep === 1 ? cellSize / 2 : -cellSize / 2);
for (let x = 0; x < xCount; x++) {
// Calculate the current X position based on direction
const currentX = xMin + x * xStep;
const centerX = currentX + (xStep === 1 ? cellSize / 2 : -cellSize / 2);
positions.push([centerX, centerY]);
}
}
console.log("positions", positions);
return positions;
}
]]>
CODE_EDITOR
getGridWithDiagonalSplits
true
false
x;
} else if (diagonalType === "negative") {
// Diagonal (-): y = -x + 6
diagonal = (x) => -x + 6;
} else {
throw new Error("Invalid diagonal type. Use 'positive' or 'negative'.");
}
for (let y = yMin; y < yMax; y += cellSize) {
for (let x = xMin; x < xMax; x += cellSize) {
// Define cell corners
const topLeft = [x, y + cellSize];
const topRight = [x + cellSize, y + cellSize];
const bottomLeft = [x, y];
const bottomRight = [x + cellSize, y];
// Determine the cell's position relative to the diagonal
const above = (pt) => pt[1] > diagonal(pt[0]);
const below = (pt) => pt[1] < diagonal(pt[0]);
const corners = [topLeft, topRight, bottomRight, bottomLeft];
const cornerStatuses = corners.map((pt) => {
// If a corner is essentially on the line, label it 'on'
if (Math.abs(pt[1] - diagonal(pt[0])) < 1e-6) return "on";
return above(pt) ? "above" : "below";
});
const allAbove = cornerStatuses.every((s) => s === "above" || s === "on");
const allBelow = cornerStatuses.every((s) => s === "below" || s === "on");
if (allAbove) {
// Entire cell is above the diagonal
// **Use 4 corners total — do NOT repeat the first corner.**
plottedPolygonPositions.push([
topLeft,
topRight,
bottomRight,
bottomLeft
]);
} else if (allBelow) {
// Entire cell is below the diagonal
mirroredPolygonPositions.push([
topLeft,
topRight,
bottomRight,
bottomLeft
]);
} else {
// Cell is intersected by the diagonal; split into two polygons
if (diagonalType === "negative") {
// Diagonal (-): top-left to bottom-right
// Upper triangle (above)
plottedPolygonPositions.push([topLeft, topRight, bottomRight]);
// Lower triangle (below)
mirroredPolygonPositions.push([topLeft, bottomRight, bottomLeft]);
} else if (diagonalType === "positive") {
// Diagonal (+): bottom-left to top-right
// Upper triangle (above)
plottedPolygonPositions.push([bottomLeft, topLeft, topRight]);
// Lower triangle (below)
mirroredPolygonPositions.push([bottomLeft, topRight, bottomRight]);
}
}
}
}
return {
plottedPolygonPositions,
mirroredPolygonPositions
};
}
]]>
CODE_EDITOR
onPlottedElementClick
true
false
color === plottedColor ? plottedColorDisabled : color
);
plottedPolygonColor = plottedPolygonColor.map(color =>
color === plottedColor ? plottedColorDisabled : color
);
mirroredCellColor = Array(18).fill("White");
mirroredPolygonColor = Array(21).fill("White");
mirroredCellSelected = Array(18).fill(false);
mirroredPolygonSelected = Array(21).fill(false);
start = true;
}
]]>
CODE_EDITOR
xApi
true
false
`;
pastAttemptsByScenario.forEach((item, index) => {
feedback += `${item.configuration} (Configuration ${index + 1})
` +
`Number of tries to complete: ${item.attemptsTakenToComplete}
` +
`Time taken to Complete: ${item.timeTakenToComplete}
`;
});
console.log(feedback)
console.log(score)
storeState({score, feedback});
initMirroredPoints();]]>
true
Elements.PlottingPanel
Elements.ShapeSet2D
Elements.ShapeSet2D
Elements.PolygonSet2D
Elements.PolygonSet2D
Elements.Segment2D