{
  "information": {
    "Title": "StarsOfChekJawaInteractiveVideo",
    "Author": [],
    "AuthorLogo": [],
    "Password": "unused",
    "Keywords": "",
    "Abstract": "",
    "Copyright": "",
    "Level": "",
    "Language": "",
    "Logo": [
      "./logo.png"
    ],
    "RunAlways": "true",
    "ModelTab": "",
    "ModelTabTitle": "",
    "ModelName": "",
    "FixedNavigationBar": "false",
    "CSSFile": "",
    "DetectedFiles": [
      "./logo.png"
    ],
    "AuxiliaryFiles": [
      "./ChekJawaMap.png",
      "./PulseButton.gif",
      "./logo.png"
    ],
    "HTMLHead": "",
    "SaveInXMLFormat": "false",
    "IncludeSource": "true",
    "UseIndexHtml": "false",
    "IncludeLibrary": "true",
    "UglifyJS": "false",
    "PreviewFullModel": "false",
    "UseInterpreter": "true",
    "UseDeltaForODE": "false"
  },
  "description": {
    "pages": [
      {
        "Name": "Desc Page 1",
        "Active": "true",
        "Internal": "false",
        "Type": "DESCRIPTION_VIEWER",
        "Locale": "_default_",
        "Title": "Desc Page 1",
        "External": "true",
        "Code": ""
      }
    ]
  },
  "model": {
    "variables": {
      "pages": [
        {
          "Name": "Base Image Variable",
          "Active": "true",
          "Internal": "false",
          "Type": "undefined",
          "PageComment": "",
          "Variables": [
            {
              "Name": "visContent ",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visPed",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visKat1",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visKat2",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visVideo1",
              "Value": "false",
              "Type": "boolean",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visCloseVidBut1",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visVideo2",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "visCloseVidBut2",
              "Value": "false",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "showCushion",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "showKnobbly",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "showSpiny",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "showSand",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "showBiscuit",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            },
            {
              "Name": "",
              "Value": "",
              "Type": "double",
              "Dimension": "",
              "Comment": "",
              "Domain": ""
            }
          ]
        }
      ]
    },
    "initialization": {
      "pages": [
        {
          "Name": "Init Page 1",
          "Active": "false",
          "Internal": "false",
          "Type": "undefined",
          "Comment": "",
          "Code": "// Init Page 1\n// Load YouTube IFrame API\nvar tag = document.createElement('script');\ntag.src = \"https://www.youtube.com/iframe_api\";\nvar firstScriptTag = document.getElementsByTagName('script')[0];\nfirstScriptTag.parentNode.insertBefore(tag, firstScriptTag);\n\n// Initialize the player variable\nlet player;\n"
        }
      ]
    },
    "evolution": {
      "information": {
        "FPS": "20",
        "SPD": "1",
        "RealTimeVariable": "",
        "Autoplay": "true"
      },
      "pages": []
    },
    "fixed_relations": {
      "pages": []
    },
    "custom": {
      "pages": [
        {
          "Name": "Custom Page 1",
          "Active": "false",
          "Internal": "false",
          "Type": "undefined",
          "Comment": "",
          "Code": "//custompage1\nlet player;\n\n// This function creates an <iframe> (and YouTube player) after the API code downloads\nfunction onYouTubeIframeAPIReady() {\n    player = new YT.Player('player', {\n        height: '390',\n        width: '640',\n        videoId: '', // Leave it empty initially\n        events: {\n            'onReady': onPlayerReady\n        }\n    });\n}\n\n// The API will call this function when the video player is ready\nfunction onPlayerReady(event) {\n    // Add event listeners to all buttons\n    document.querySelectorAll('button[data-video-id]').forEach(button => {\n        button.addEventListener('click', function() {\n            const videoId = this.getAttribute('data-video-id');\n            player.loadVideoById(videoId);\n            player.playVideo();\n        });\n    });\n}\n"
        },
        {
          "Name": "Custom Page 2",
          "Active": "false",
          "Internal": "false",
          "Type": "CODE_EDITOR",
          "Comment": "",
          "Code": "// Custom Page 2\n// Function to create an <iframe> and YouTube player\nfunction onYouTubeIframeAPIReady() {\n    player = new YT.Player('player', {\n        height: '390',\n        width: '640',\n        videoId: '', // Leave it empty initially\n        events: {\n            'onReady': onPlayerReady\n        }\n    });\n}\n\n// Function to handle player readiness\nfunction onPlayerReady(event) {\n    // Add event listeners to all buttons\n    document.querySelectorAll('button[data-video-id]').forEach(button => {\n        button.addEventListener('click', function() {\n            const videoId = this.getAttribute('data-video-id');\n            player.loadVideoById(videoId);\n            player.playVideo();\n        });\n    });\n}\n"
        }
      ]
    },
    "elements": {
      "list": []
    }
  },
  "view": {
    "Tree": [
      {
        "Name": "singleDrawingPanel",
        "Type": "Panel",
        "Expanded": "true",
        "Properties": [
          {
            "name": "Width",
            "value": "\"100%\""
          },
          {
            "name": "Height",
            "value": "\"90vh\""
          }
        ],
        "Children": [
          {
            "Name": "labelPanel",
            "Type": "Panel",
            "Expanded": "true",
            "Properties": [],
            "Children": [
              {
                "Name": "topLabel",
                "Type": "Label",
                "Properties": []
              }
            ]
          },
          {
            "Name": "wrappedPanel",
            "Type": "WrappedPanel",
            "Expanded": "true",
            "Properties": [],
            "Children": [
              {
                "Name": "ImageButtonPanel",
                "Type": "Panel",
                "Properties": []
              },
              {
                "Name": "drawingPanel",
                "Type": "DrawingPanel",
                "Expanded": "true",
                "Properties": [
                  {
                    "name": "Height",
                    "value": "\"90vh\""
                  },
                  {
                    "name": "Width",
                    "value": "\"100%\""
                  },
                  {
                    "name": "Enabled",
                    "value": "true"
                  },
                  {
                    "name": "ShowAreaRectangle",
                    "value": "false"
                  },
                  {
                    "name": "OnPress",
                    "value": "EJSS_INTERFACE.BoxPanel.showOkDialog(\"Make sure you have stopped the video!\", \n    function(){ \n      showCushion=false\n      showKnobbly=false\n      showSand=false\n      showBiscuit=false\n      showSpiny=false\n    _update(); // to force update view\n    })"
                  },
                  {
                    "name": "TRMessage",
                    "value": "\"Stars Of Chek Jawa Interactive Video\""
                  },
                  {
                    "name": "TLMessage",
                    "value": "\"Click on the icon i to watch the video\""
                  }
                ],
                "Children": [
                  {
                    "Name": "baseImage",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./ChekJawaMap.png\""
                      },
                      {
                        "name": "Visibility",
                        "value": "true"
                      },
                      {
                        "name": "RelativePosition",
                        "value": "\"CENTERED\""
                      },
                      {
                        "name": "SizeX",
                        "value": "2"
                      },
                      {
                        "name": "SizeY",
                        "value": "2"
                      }
                    ]
                  },
                  {
                    "Name": "CushionStarButton_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./PulseButton.gif\""
                      },
                      {
                        "name": "SizeX",
                        "value": "0.065"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.10"
                      },
                      {
                        "name": "X",
                        "value": "-0.15"
                      },
                      {
                        "name": "Y",
                        "value": "0.9"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visContent = true\nshowCushion = true"
                      }
                    ]
                  },
                  {
                    "Name": "KnobblyStarButton_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./PulseButton.gif\""
                      },
                      {
                        "name": "SizeX",
                        "value": "0.065"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.10"
                      },
                      {
                        "name": "X",
                        "value": "0.45"
                      },
                      {
                        "name": "Y",
                        "value": "0.65"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visContent = true\nshowKnobbly = true"
                      }
                    ]
                  },
                  {
                    "Name": "SandSeaStar_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./PulseButton.gif\""
                      },
                      {
                        "name": "SizeX",
                        "value": "0.065"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.10"
                      },
                      {
                        "name": "X",
                        "value": "0.18"
                      },
                      {
                        "name": "Y",
                        "value": "0.4"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visContent = true\nshowSand = true"
                      }
                    ]
                  },
                  {
                    "Name": "Biscuit_2_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./PulseButton.gif\""
                      },
                      {
                        "name": "SizeX",
                        "value": "0.065"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.10"
                      },
                      {
                        "name": "X",
                        "value": "0.48"
                      },
                      {
                        "name": "Y",
                        "value": "0.2"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visContent = true\nshowBiscuit = true"
                      }
                    ]
                  },
                  {
                    "Name": "Spiny_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./PulseButton.gif\""
                      },
                      {
                        "name": "SizeX",
                        "value": "0.065"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.10"
                      },
                      {
                        "name": "X",
                        "value": "0.25"
                      },
                      {
                        "name": "Y",
                        "value": "-0.35"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visKat1 = true\nshowSpiny = true"
                      }
                    ]
                  },
                  {
                    "Name": "bckbutton_2_2",
                    "Type": "Image2D",
                    "Properties": [
                      {
                        "name": "ImageUrl",
                        "value": "\"./bckArrowBut.png\""
                      },
                      {
                        "name": "Y",
                        "value": "0"
                      },
                      {
                        "name": "X",
                        "value": "-0.7"
                      },
                      {
                        "name": "SizeX",
                        "value": "0.05"
                      },
                      {
                        "name": "SizeY",
                        "value": "0.05"
                      },
                      {
                        "name": "Visibility",
                        "value": "visKat2"
                      },
                      {
                        "name": "EnabledPosition",
                        "value": "\"ENABLED_NO_MOVE\""
                      },
                      {
                        "name": "OnPress",
                        "value": "visKat2=false\nvisKat1=true"
                      }
                    ]
                  }
                ]
              },
              {
                "Name": "controlPanel",
                "Type": "Panel",
                "Expanded": "false",
                "Properties": [
                  {
                    "name": "CSS",
                    "value": "{\"display\":\"block\"}"
                  },
                  {
                    "name": "BorderStyle",
                    "value": "\"solid\""
                  },
                  {
                    "name": "BorderColor",
                    "value": "\"Gray\""
                  },
                  {
                    "name": "BorderWidth",
                    "value": "1"
                  },
                  {
                    "name": "Visibility",
                    "value": "false"
                  }
                ],
                "Children": [
                  {
                    "Name": "firstRowPanel",
                    "Type": "Panel",
                    "Expanded": "true",
                    "Properties": [],
                    "Children": [
                      {
                        "Name": "executionPanel",
                        "Type": "Panel",
                        "Expanded": "false",
                        "Properties": [],
                        "Children": [
                          {
                            "Name": "runPauseButton",
                            "Type": "TwoStateButton",
                            "Properties": [
                              {
                                "name": "OffClick",
                                "value": "%_pause%"
                              },
                              {
                                "name": "State",
                                "value": "_isPaused"
                              },
                              {
                                "name": "Tooltip",
                                "value": "\"Play/Pause\""
                              },
                              {
                                "name": "ImageOnUrl",
                                "value": "\"/org/opensourcephysics/resources/controls/images/play.gif\""
                              },
                              {
                                "name": "OnClick",
                                "value": "%_play%"
                              },
                              {
                                "name": "ImageOffUrl",
                                "value": "\"/org/opensourcephysics/resources/controls/images/pause.gif\""
                              }
                            ]
                          },
                          {
                            "Name": "stepButton",
                            "Type": "Button",
                            "Properties": [
                              {
                                "name": "Tooltip",
                                "value": "\"Step\""
                              },
                              {
                                "name": "ImageUrl",
                                "value": "\"/org/opensourcephysics/resources/controls/images/stepforward.gif\""
                              },
                              {
                                "name": "OnClick",
                                "value": "%_step%"
                              }
                            ]
                          },
                          {
                            "Name": "initButton",
                            "Type": "Button",
                            "Properties": [
                              {
                                "name": "Tooltip",
                                "value": "\"Initialize\""
                              },
                              {
                                "name": "ImageUrl",
                                "value": "\"/org/opensourcephysics/resources/controls/images/reset1.gif\""
                              },
                              {
                                "name": "OnClick",
                                "value": "%_initialize%"
                              }
                            ]
                          },
                          {
                            "Name": "resetButton",
                            "Type": "Button",
                            "Properties": [
                              {
                                "name": "Tooltip",
                                "value": "\"Reset\""
                              },
                              {
                                "name": "ImageUrl",
                                "value": "\"/org/opensourcephysics/resources/controls/images/reset.gif\""
                              },
                              {
                                "name": "OnClick",
                                "value": "%_reset%"
                              }
                            ]
                          }
                        ]
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "Name": "CushionVideo",
            "Type": "Panel",
            "Properties": [
              {
                "name": "Html",
                "value": "'<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/0TlHaEG2KzI?si=BChNog3Ky0AkGtqc\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>'"
              },
              {
                "name": "Visibility",
                "value": "showCushion"
              },
              {
                "name": "CSS",
                "value": "{\n  \"position\" : \"absolute\",\n  \"top\" : \"10%\",\n   \"margin-left\":\"0px\",\n   \"left\":\"0%\"\n}"
              }
            ]
          },
          {
            "Name": "KnobblyVideo",
            "Type": "Panel",
            "Properties": [
              {
                "name": "Html",
                "value": "'<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/cUe2c6dmcng?si=yaWCw0sGYd6NFW4v&amp;start=36\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>'"
              },
              {
                "name": "Visibility",
                "value": "showKnobbly"
              },
              {
                "name": "CSS",
                "value": "{\n  \"position\" : \"absolute\",\n  \"top\" : \"10%\",\n   \"margin-left\":\"0px\",\n   \"left\":\"0%\"\n}"
              },
              {
                "name": "OnClick",
                "value": "%_pause%"
              }
            ]
          },
          {
            "Name": "SandVideo",
            "Type": "Panel",
            "Properties": [
              {
                "name": "Html",
                "value": "'<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/Q6ccMdE6IrY?si=GkCfICc_xdwKgkkq&amp;start=50\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>'"
              },
              {
                "name": "Visibility",
                "value": "showSand"
              },
              {
                "name": "CSS",
                "value": "{\n  \"position\" : \"absolute\",\n  \"top\" : \"10%\",\n   \"margin-left\":\"0px\",\n   \"left\":\"0%\"\n}"
              }
            ]
          },
          {
            "Name": "BiscuitVideo",
            "Type": "Panel",
            "Properties": [
              {
                "name": "Html",
                "value": "'<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/dffedrzg-bA?si=-FIWLoRzQKr7kbLm&amp;start=4\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>'"
              },
              {
                "name": "Visibility",
                "value": "showBiscuit"
              },
              {
                "name": "CSS",
                "value": "{\n  \"position\" : \"absolute\",\n  \"top\" : \"10%\",\n   \"margin-left\":\"0px\",\n   \"left\":\"0%\"\n}"
              }
            ]
          },
          {
            "Name": "SpinyVideo",
            "Type": "Panel",
            "Properties": [
              {
                "name": "Html",
                "value": "'<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/aOC4Zjg5OJE?si=YS9lqIdYK_StmVfl&amp;start=69\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen></iframe>'"
              },
              {
                "name": "Visibility",
                "value": "showSpiny"
              },
              {
                "name": "CSS",
                "value": "{\n  \"position\" : \"absolute\",\n  \"top\" : \"10%\",\n   \"margin-left\":\"0px\",\n   \"left\":\"0%\"\n}"
              }
            ]
          }
        ]
      }
    ],
    "RootProperties": []
  },
  "metadata": {
    "APP": "WebEJS",
    "CreatedWith": "WebEJS : the web version of Easy JavaScript Simulations",
    "MoreInfo": "1.0",
    "version": "https://t.um.es/webejs"
  }
}