bestPath.length){ bestPath=candidate; if(bestPath.length>=numOfSquares) break; }\n }\n return bestPath;\n}\n"
},
{
"Name": "fullScreen",
"Active": "true",
"Internal": "false",
"Type": "CODE_EDITOR",
"Comment": "",
"Code": "// fullScreen\n// add toggleFullScreen() to onDoubleclick of plottingPanel\n\n/*jslint browser:true */\n// copy to custom function\nfunction toggleFullScreen() {\n try {\n const doc = document.documentElement;\n \n // Check if any fullscreen element exists\n const isFullScreen = document.fullscreenElement || \n document.mozFullScreenElement || \n document.webkitFullscreenElement || \n document.msFullscreenElement;\n\n if (!isFullScreen) {\n // Request full-screen mode based on the browser\n if (doc.requestFullscreen) {\n doc.requestFullscreen();\n } else if (doc.msRequestFullscreen) {\n doc.msRequestFullscreen();\n } else if (doc.mozRequestFullScreen) {\n doc.mozRequestFullScreen();\n } else if (doc.webkitRequestFullscreen) {\n doc.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); // Pass input permission for older WebKit\n }\n } else {\n // Exit full-screen mode based on the browser\n if (document.exitFullscreen) {\n document.exitFullscreen();\n } else if (document.msExitFullscreen) {\n document.msExitFullscreen();\n } else if (document.mozCancelFullScreen) {\n document.mozCancelFullScreen();\n } else if (document.webkitExitFullscreen) {\n document.webkitExitFullscreen();\n }\n }\n } catch (e) {\n console.error(\"Error toggling full-screen mode:\", e);\n }\n}\n\n// Handle screen orientation for mobile devices (optional)\nwindow.addEventListener(\"orientationchange\", () => {\n if (screen.orientation && screen.orientation.lock) {\n screen.orientation.lock('landscape').catch(err => console.warn('Failed to lock orientation:', err));\n }\n});\n"
}
]
},
"elements": {
"list": []
}
},
"view": {
"Tree": [
{
"Name": "topPanel",
"Type": "Panel",
"Expanded": "true",
"Properties": [
{
"name": "OnMove",
"value": "// make combo box reflect correct state\n\n//_view.comboBox.setSelectedOptions([\"3x3\"])\n//var opts = _view.comboBox.getProperty(\"SelectedOptions\"); \nif (numOfRows==3&&numOfCols==3){\n_view.comboBox.setSelectedOptions([\"3x3\"])\n//alert()\n}\n\nelse if (numOfRows==4&&numOfCols==4){\n_view.comboBox.setSelectedOptions([\"4x4\"])\n}\n\nelse if (numOfRows==5&&numOfCols==5){\n_view.comboBox.setSelectedOptions([\"5x5\"])\n}\n"
},
{
"name": "Width",
"value": "\"100%\""
},
{
"name": "Display",
"value": "\"inline-flex\""
}
],
"Children": [
{
"Name": "button",
"Type": "Button",
"Properties": [
{
"name": "Text",
"value": "\"button\""
},
{
"name": "OnPress",
"value": "//_view.comboBox.setSelectedOptions([\"3x3\"])\nvar opts = _view.comboBox.getProperty(\"SelectedOptions\"); \nif (opts==\"3x3\"){\n_view.comboBox.setSelectedOptions([\"3x3\"])\nalert()\n}\n"
},
{
"name": "Display",
"value": "\"none\""
}
]
},
{
"Name": "comboBox",
"Type": "ComboBox",
"Properties": [
{
"name": "Options",
"value": "[\"\",\"3x3\",\"4x4\",\"5x5\"]"
},
{
"name": "OnChange",
"value": "// to use\nvar opts = _view.comboBox.getProperty(\"SelectedOptions\"); // array of options\n var option = (opts.length > 0)? opts[0]:\"\"; // selected option \nif ( option==\"5x5\"){\n numOfRows=5\n numOfCols=5\n }\n else if ( option==\"4x4\"){\n numOfRows=4\n numOfCols=4\n }\n else if ( option==\"3x3\"){\n numOfRows=3\n numOfCols=3\n }\n_initialize()"
},
{
"name": "Width",
"value": "\"50%\""
},
{
"name": "Font",
"value": "font"
}
]
},
{
"Name": "reset",
"Type": "Button",
"Properties": [
{
"name": "Text",
"value": "\"\u21bbReset\""
},
{
"name": "OnPress",
"value": "\nstopAutoSolve();\nautoSolve=false;\nif (_view.autoSolveCheckbox) _view.autoSolveCheckbox.setProperty(\"Checked\", false);\n_reset()\n"
},
{
"name": "Width",
"value": "\"50%\""
},
{
"name": "Font",
"value": "font"
}
]
},
{
"Name": "autoSolveCheckbox",
"Type": "CheckBox",
"Properties": [
{
"name": "Text",
"value": "\"Auto-solve?\""
},
{
"name": "Checked",
"value": "autoSolve"
},
{
"name": "OnChange",
"value": "\nif (autoSolve) {\n startAutoSolve();\n} else {\n stopAutoSolve();\n}\n"
},
{
"name": "Width",
"value": "\"50%\""
},
{
"name": "Font",
"value": "font"
},
{
"name": "Display",
"value": "showAutoSolve?\"inline\":\"none\""
}
]
}
]
},
{
"Name": "mainPanel",
"Type": "Panel",
"Expanded": "true",
"Properties": [
{
"name": "OnMove",
"value": "// make combo box reflect correct state\n\n//_view.comboBox.setSelectedOptions([\"3x3\"])\n//var opts = _view.comboBox.getProperty(\"SelectedOptions\"); \nif (numOfRows==3&&numOfCols==3){\n_view.comboBox.setSelectedOptions([\"3x3\"])\n//alert()\n}\n\nelse if (numOfRows==4&&numOfCols==4){\n_view.comboBox.setSelectedOptions([\"4x4\"])\n}\n\nelse if (numOfRows==5&&numOfCols==5){\n_view.comboBox.setSelectedOptions([\"5x5\"])\n}\n"
}
],
"Children": [
{
"Name": "plottingPanel",
"Type": "PlottingPanel",
"Expanded": "true",
"Properties": [
{
"name": "Gutters",
"value": "[0, 0, 0, 0]"
},
{
"name": "YScalePrecision",
"value": "0"
},
{
"name": "XFixedTick",
"value": "-0.5"
},
{
"name": "Enabled",
"value": "true"
},
{
"name": "SquareAspect",
"value": "true"
},
{
"name": "YFixedTick",
"value": "-0.5"
},
{
"name": "YAutoTicks",
"value": "false"
},
{
"name": "TRMessage",
"value": "\"High scores\\n3x3 =\"+storehighscore1+\"\\n4x4 =\"+storehighscore2+\"\\n5x5 =\"+storehighscore3"
},
{
"name": "XTickStep",
"value": "numOfRows * squareLength"
},
{
"name": "YTickStep",
"value": "numOfCols * squareLength"
},
{
"name": "AutoScaleY",
"value": "true"
},
{
"name": "AutoScaleX",
"value": "true"
},
{
"name": "CursorTypeForMove",
"value": "\"pointer\""
},
{
"name": "XAutoTicks",
"value": "false"
},
{
"name": "Height",
"value": "\"90vh\""
},
{
"name": "XScalePrecision",
"value": "0"
},
{
"name": "Width",
"value": "\"100%\""
},
{
"name": "OnDoubleClick",
"value": "toggleFullScreen()"
}
],
"Children": [
{
"Name": "shapeSet",
"Type": "ShapeSet2D",
"Properties": [
{
"name": "NumberOfElements",
"value": "numOfSquares"
},
{
"name": "FillColor",
"value": "%squareColor%"
},
{
"name": "Sensitivity",
"value": "0"
},
{
"name": "SizeX",
"value": "squareLength"
},
{
"name": "ShapeType",
"value": "\"RECTANGLE\""
},
{
"name": "X",
"value": "squareX"
},
{
"name": "Y",
"value": "squareY"
},
{
"name": "OnPress",
"value": "onClickSquare(interact);"
},
{
"name": "SizeY",
"value": "squareLength"
},
{
"name": "EnabledPosition",
"value": "\"ENABLED_NO_MOVE\""
},
{
"name": "ElementInteracted",
"value": "interact"
}
]
},
{
"Name": "unicodeknight",
"Type": "Text2D",
"Properties": [
{
"name": "FillColor",
"value": "\"Magenta\""
},
{
"name": "X",
"value": "textXunicode"
},
{
"name": "Y",
"value": "textYunicode"
},
{
"name": "Text",
"value": "\"\u265e\""
},
{
"name": "Font",
"value": "\"normal normal 7vw \""
}
]
},
{
"Name": "textSet",
"Type": "TextSet2D",
"Properties": [
{
"name": "X",
"value": "textX"
},
{
"name": "Y",
"value": "textY"
},
{
"name": "Text",
"value": "%textStr%"
},
{
"name": "Font",
"value": "font"
}
]
}
]
}
]
},
{
"Name": "html",
"Type": "Panel",
"Properties": [
{
"name": "Html",
"value": "\n\n\n Knight's Move \n\n\n Knight's Move \n\n \n \n Watch on YouTube\n \n
\n VIDEO \n\n The knight (\u2658, \u265e) is a piece in the game of chess and is represented by a horse's head and neck.
\n The knight's movement is unique: it may move two squares vertically and one square horizontally, or two squares horizontally and one square vertically (forming an \u201cL\u201d). This way, a knight can have a maximum of 8 moves. While moving, the knight can jump over pieces to reach its destination.
\n\n Single Player Game \n A combo box allows young players to try to discover the best strategy/pattern to maximise the number of moves.
\n Try to move the maximum possible number of knight's moves given the square grid\u2014for example, on a 5\u00d75 grid, the maximum number of visited squares is 25.
\n\n For more resources \n "
}
]
}
],
"RootProperties": []
},
"metadata": {
"APP": "WebEJS",
"CreatedWith": "WebEJS : The web version of Easy JavaScript Simulations",
"MoreInfo": "WebEJS 1.2",
"version": "https://www.um.es/fem/wikis/webejs/"
}
}