Tutorial 1 for Workshop 18-24 July: Creating a Simple Ball Simulation With ChatGPT and WebEJS
🌟 Building a simulation using ChatGPT3.5 (initial variables and scaffolds) with WebEJS (power customisation to meet designer's and users' needs).
Let's create a simple ball moving to the right as an idea for this tutorial :)
1. Type "Give me an outline of a simulation made in EJSS for a simple case of a ball moving to the right." into text area
hint: when using GPT, it is always good to start simple and ask for more complex features later after the simple things are working properly
![Type "Give me an outline of a simulation made in EJSS for a simple case of a ball moving to the right." into text area](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/99ccf76a-e1a3-44ab-8ef0-2ca0fb6799c6/31eddd31-cd3e-4754-8e85-a86194ac61e2.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6093&fp-y=0.8959&fp-z=1.4532&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=81&mark-y=565&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDM3Jmg9MTExJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
2. Click on this icon to submit the comment
![Click on this icon to submit the comment](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f65e6462-2f01-43df-9768-14c8b5b956de/095a9c67-7c18-4c83-8ecf-7563a51abf9b.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.8809&fp-y=0.9148&fp-z=4.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=547&mark-y=401&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNjEmaD0xNjEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
3. Read the response from ChatGPT & Copy (ctrl+c) the part on the parameters
Parameters are the variables used to build the simulation.
![Read the response from ChatGPT & Copy (ctrl+c) the part on the parameters](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f5a0ad28-2f90-440d-a1be-02dbd3fdb13c/86362d6d-2b25-40f3-8f19-4e4271282479.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6363&fp-y=0.3918&fp-z=1.6161&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=105&mark-y=240&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz05ODkmaD0yNTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
4. Edit the 1st message by pressing on the pencil icon.
![Edit the 1st message by pressing on the pencil icon.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/4c13eacc-4566-45b9-a8ca-0a1dd155b96f/e032955d-c67b-43a8-9a18-1a64ca3e5637.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3732&fp-y=0.2307&fp-z=2.8614&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=548&mark-y=314&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDMmaD0xMDMmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
5. Prompt 2: Refine based on what GPT gives. Add on to the previous message by pasting (ctrl+v) what was copied: "Define the parameters of the simulation: - Initial position of the ball. - Initial velocity of the ball. - Acceleration (if any). - Time step for the simulation. "
Responses from ChatGPT may not always be exactly the same. There are times when words are phrased differently with the same concept.
E.g., it could also be in a form of a sentence like "Define parameters such as initial position, initial velocity, acceleration, and time step." to copy (ctrl+c) and paste (ctrl+v)
![Prompt 2: Refine based on what GPT gives.
Add on to the previous message by pasting (ctrl+v) what was copied:
"Define the parameters of the simulation:
- Initial position of the ball.
- Initial velocity of the ball.
- Acceleration (if any).
- Time step for the simulation.
"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3d2ea5b7-4b25-49fd-a03b-14faface0404/a4664be2-24ff-484e-9cfe-84cb02b4a2a7.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6177&fp-y=0.3211&fp-z=1.5460&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=109&mark-y=252&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz05ODImaD0yMjEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
6. Prompt 2b add: Further add the following into the text area: "Allow users to input these parameters via text fields or sliders Create a graphical representation of the ball. Provide some JavaScript code"
![Prompt 2b add:
Further add the following into the text area:
"Allow users to input these parameters via text fields or sliders
Create a graphical representation of the ball.
Provide some JavaScript code"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/95853bd9-c3ff-43a5-9a81-1a8d26d4c7da/0f8b4d0a-dc0c-4a0c-953c-9f4e8769e45c.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=420&mark-y=300&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz02MTYmaD0xMDUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
7. The final message could look like this too:
![The final message could look like this too:](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/2c719bef-62db-4f11-af2b-3c3d3ecf8e62/fbc8bbd2-d576-40f4-8e4e-dfac78c19fd6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=136&mark-y=179&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz05ODImaD00MzImZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
8. Click on Save & Submit
![Click on Save & Submit](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/5bb35c5e-1bae-4696-a8dc-a88ad737a5f9/a00a80b2-63b3-4cc3-b1e5-f23cd04e69d5.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5932&fp-y=0.5892&fp-z=2.4473&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=441&mark-y=306&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMTkmaD0xMTkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
9. Transfer results from GPT to WebEJSS. https://www.um.es/fem/wikis/runwebejs/?url= Read the defined variables/parameters generated by ChatGPT. Copy the element titled "x0" with 0 as the given value. Take note of the other variables.
In this case, the variables to take note are:
x0, v0, a, dt, t, x & v
![Transfer results from GPT to WebEJSS. https://www.um.es/fem/wikis/runwebejs/?url=
Read the defined variables/parameters generated by ChatGPT.
Copy the element titled "x0" with 0 as the given value.
Take note of the other variables.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/9776739e-0dc0-4966-8384-200d494df1e2/fd2e7d12-edd8-4dc3-9e47-ee773a92e1d2.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6413&fp-y=0.4885&fp-z=1.3283&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=215&mark-y=135&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04MjYmaD00ODQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
10. Click on Model
![Click on Model](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/6c99da4e-058d-4463-9dc1-1d3129e991d2/d43d3f71-ec5f-46f4-8f01-5202ce482be6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2269&fp-y=0.0328&fp-z=2.7354&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=492&mark-y=11&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yMTUmaD0xMTQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
11. Click on "Click to create a page of variables"
![Click on "Click to create a page of variables"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/ed075e05-29c4-4c96-b2b5-a996c9432547/fa4a9196-5d91-4d7c-965a-3c9776381211.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2567&fp-y=0.4406&fp-z=1.1430&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=4&mark-y=105&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02OTUmaD01NDQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
12. A pop-up message to "Create page" will appear. Click on OK.
![A pop-up message to "Create page" will appear.
Click on OK.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/2ccea95f-d9f3-4678-a485-3381ff15b857/02a2a3c0-a304-41e7-8492-cf31c34e5f85.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5676&fp-y=0.5353&fp-z=1.7757&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=771&mark-y=442&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz05OSZoPTgxJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
13. Paste "x0" into input
![Paste "x0" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/92c53bf1-0009-4fd4-a5f8-33e6c388adfe/fb558f95-eff2-46b0-a85b-052ca6d28065.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2070&fp-y=0.2073&fp-z=2.4156&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=57&mark-y=387&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
14. Type "0" as the given value.
Refer to ChatGPT generated message to recall the value given.
![Type "0" as the given value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/c20ba69c-95c0-486b-9239-48824c234a8b/4fb91a9a-e984-4abb-9883-e9d26deb3bd3.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.2074&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=387&mark-y=387&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
15. Refer back to ChatGPT and copy the rest of the variables required. Our current focus to copy over is "v0", where it is initiated with 10 as the value.
After copying "x0", what's left are:
v0, a, dt, t, x & v.
Jump to the next major step (#31) after filling up all the required variables:
![Refer back to ChatGPT and copy the rest of the variables required.
Our current focus to copy over is "v0", where it is initiated with 10 as the value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d9b32568-d4d6-4202-8c32-91a343e98e95/756e1f58-ff40-4ff1-a163-ee0d43cbb18d.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5590&fp-y=0.3358&fp-z=1.6328&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=264&mark-y=343&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02NzImaD02OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
# WebEJS 1.0beta
16. Paste "v0" into input
![Paste "v0" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/705bd502-b603-434a-a7b8-a4057b5e24b2/4277eefa-c518-4ce4-81ac-8bf53a3c6738.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.2748&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=56&mark-y=348&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
17. Type "10" as the Initial Value
![Type "10" as the Initial Value](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e94d3d77-2fea-4a8c-b584-20d10d9677bc/7d535e28-68a6-4a2a-b07c-879a14709f68.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.2074&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=387&mark-y=471&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
# WebEJS 1.0beta
18. Paste "a" into input.
After copying "v0", what's left are:
a, dt, t, x & v.
Jump to the next major step (#31) after filling up all the required variables:
![Paste "a" into input.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f5dcd571-0a24-4681-8c07-08e3b7608624/a70fc621-d49d-4397-80f1-51ef428b42e0.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.3181&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=56&mark-y=351&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
19. Type "0" as the given value.
![Type "0" as the given value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/73e89293-5d40-45ad-ab58-58ae8d3e2ae2/e7b98072-c69b-4f55-a233-defe4487310b.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.3267&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=387&mark-y=335&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
# ChatGPT
20. Refer back to ChatGPT and copy the rest of the variables required. Our current focus to copy over is "t", where it is initiated with 0 as the value.
After copying "a", what's left are:
dt, t, x & v.
Jump to the next major step (#31) after filling up all the required variables:
![Refer back to ChatGPT and copy the rest of the variables required.
Our current focus to copy over is "t", where it is initiated with 0 as the value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/59b1609a-cdc8-4d10-818b-40a8501e7747/0772fe06-e28b-473d-88de-1976d80524fc.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5380&fp-y=0.5089&fp-z=1.6749&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=301&mark-y=323&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz01OTcmaD0xMDgmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
21. Paste "t" into input
![Paste "t" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/5709b9c5-b694-460d-8b6f-fd58ac9a2d32/68def647-5a65-417b-b968-41775c51d535.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.3594&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=56&mark-y=359&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
22. Type "0" as the given value.
![Type "0" as the given value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f2d7cced-a419-4540-8142-e51ce0660f0e/767c3b72-5634-43aa-8049-5ceeb9885802.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.3306&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=387&mark-y=411&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
23. Refer back to ChatGPT and copy the rest of the variables required. Our current focus to copy over is "dt", where it is initiated with 0.1 as the value for the Time Step.
After copying "t", what's left are:
dt, x & v.
Jump to the next major step (#31) after filling up all the required variables:
![Refer back to ChatGPT and copy the rest of the variables required.
Our current focus to copy over is "dt", where it is initiated with 0.1 as the value for the Time Step.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e0055cd2-0c79-4d0b-aed1-4fb39320591b/374dae9c-0c35-41f4-8d41-1a7f84283d2c.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=474&mark-y=6&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz03MjAmaD01NjkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
24. Paste "dt" into input
![Paste "dt" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/1f73d9e6-f74f-4023-a400-c300c369c0d3/abf36a7c-086f-47da-bb1c-6712606c29ad.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.3883&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=56&mark-y=390&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
25. Type "0.05"
The recommended value for the Time Step (dt) is 0.05
![Type "0.05"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/8c386d72-c20c-4d22-a84b-14e6db135893/541342da-491a-4a24-acc8-1ca88e3e067c.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2071&fp-y=0.2911&fp-z=2.4166&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=387&mark-y=567&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
26. Refer back to ChatGPT and copy the rest of the variables required. Our current focus to copy over is "x" & "v", where it is initiated with 0 as the value.
After copying "dt", what's left are:
x & v.
Jump to the next major step (#31) after filling up all the required variables:
![Refer back to ChatGPT and copy the rest of the variables required.
Our current focus to copy over is "x" & "v", where it is initiated with 0 as the value.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3c6ce1af-1bb2-4806-9c9a-ade460cb684e/f9ec71e3-6458-43bc-9c96-43fbd009645e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6116&fp-y=0.5263&fp-z=1.6754&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=225&mark-y=492&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNDAmaD0xMjUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
27. Type "x"
![Type "x"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/b2d5d96e-bf02-4653-9273-3321c8f1f89f/64a5b041-a951-4511-bfe3-b83ca922a044.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0774&fp-y=0.5115&fp-z=2.4223&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=61&mark-y=322&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMjgmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
28. Type "x0" to initiate 0 as the initial value
![Type "x0" to initiate 0 as the initial value](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/c57e9fc3-33f7-4f91-b89b-c5b54b5232c3/3248f1f0-0bac-4fa7-8acc-9439271f34e3.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1917&fp-y=0.5115&fp-z=2.4223&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=393&mark-y=322&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMjgmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
29. Type "v"
![Type "v"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/22294b6d-b5c2-4813-b903-f4c723e55271/2b4b2ffd-e8ff-4c63-985e-7925cf2ca508.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2067&fp-y=0.4416&fp-z=2.4230&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=60&mark-y=533&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMjgmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
30. Type "v0" to initiate 10 as the initial velocity
![Type "v0" to initiate 10 as the initial velocity](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f6579d00-1c07-4048-af2c-286f27426081/5e307494-6c6d-45e5-aa6d-8bb7be69d867.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2067&fp-y=0.4564&fp-z=2.4230&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=392&mark-y=507&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMjgmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
🌟 Implementing the motion
31. Click on "Evolution" tab
The "Evolution" tab implements the algorithm for the motion of the simulation.
In this editor systems of Ordinary Differential Equations of first order are defined.
![Click on "Evolution" tab](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/ebefeb30-01e2-420d-ba57-cef672cd8e04/b74b2c67-727f-4e3a-8d89-a66f9dc6dfd7.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1997&fp-y=0.1995&fp-z=2.5079&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=591&mark-y=96&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yOTgmaD04OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
32. Click on "Click to create a page of ODEs"
![Click on "Click to create a page of ODEs"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/6dad9b24-9ca2-4886-ac71-e91e6f860d8f/44775777-f61c-4310-b5ba-053ac4b0225b.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2911&fp-y=0.5965&fp-z=1.3795&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=130&mark-y=210&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03MDMmaD0zMzQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
33. A pop-up message to "Create page" will appear. Click on OK.
![A pop-up message to "Create page" will appear.
Click on OK.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/55b08099-3883-42e5-ba89-b75cba00b9c7/cdcafbc9-c211-4193-9c26-b9353b65b03e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6116&fp-y=0.5159&fp-z=2.7757&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=721&mark-y=520&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNTUmaD0xMjcmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
34. Type "t" for the independent variable.
![Type "t" for the independent variable.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d557a127-7c6f-417f-998b-aae30cf38cd3/c911f85c-970e-4114-83d2-330557f7f0b8.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1894&fp-y=0.1892&fp-z=2.6415&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=469&mark-y=339&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNDkmaD0xMTAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
35. Type "dt" as the increment.
![Type "dt" as the increment.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/0f3555f5-2344-4bec-b29f-ce86def149ba/a0355a70-5ad7-41ca-9aac-2e37d7c457f0.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2722&fp-y=0.1909&fp-z=2.6188&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=723&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNTgmaD0xMDkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
36. Click on the 1st option under State
A pop-up message "List of suitable variables" will appear after.
![Click on the 1st option under State](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d6648731-7ce5-43cf-9c31-22d949459f1d/eb3efae8-e736-4a6a-a76c-4f3adfdb770a.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2763&fp-y=0.2813&fp-z=2.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=184&mark-y=359&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMDImaD02MSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
37. Type "x"
OR select "x"
![Type "x"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/699f1aa0-fcb1-4340-bcf7-f31abe0f7f13/c5e0e6f9-452a-45ac-83dc-002142519bb9.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4941&fp-y=0.5145&fp-z=1.7625&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=290&mark-y=525&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz01NjYmaD02OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
38. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/fcded0f7-a2d1-4bbb-ada9-1630930a7562/26285d9f-7181-4002-a4c5-5cf3768ebf07.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&fp-z=1.8499&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=947&mark-y=553&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04NCZoPTcxJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
39. Click on the 2nd option under State
A pop-up message "List of suitable variables" will appear after.
![Click on the 2nd option under State](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e0ea5ea5-8e16-4f3c-82e8-a616b11ab613/deb483cd-e797-4392-9379-c79cefecf863.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1679&fp-y=0.3285&fp-z=2.3194&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=285&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zNjUmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
40. Type "v"
![Type "v"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f2ad778a-ae64-4176-9705-9ef3a50193d6/16cab588-bbf3-41b9-8bde-709b1ad81b17.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5118&fp-z=1.7625&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=278&mark-y=529&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz01NjYmaD02OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
41. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/c2f5361b-74fb-4a46-8a4e-64a80c5e2f90/2c409f47-229b-4c65-a9a9-6407d58f005a.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4905&fp-y=0.5050&fp-z=1.8499&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=968&mark-y=546&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04NCZoPTcxJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
42. Click on the 1st option under Rate
A pop-up message "List of suitable variables" will appear after.
This step is to link velocity (v) to the displacement (x)
![Click on the 1st option under Rate](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/16f0ffb1-fcd5-4df2-8da3-61b1568dcfa5/c5bb3071-d87c-46ac-82f4-f4a6ceef7fe9.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3616&fp-y=0.4390&fp-z=1.1414&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=343&mark-y=240&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNzkmaD00MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
43. Type "v"
or select "v"
![Type "v"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/728671cf-1f4d-4aa3-a557-f3b51682980c/65662fd7-ea13-4069-9e3f-81c21f9783a6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4982&fp-y=0.5185&fp-z=1.6811&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=266&mark-y=513&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz01OTUmaD02OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
44. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/1654c2c7-39ab-4478-9865-79a79daecec5/89daa3b7-6cc0-4bdc-bf71-0b1cce9ef5d7.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5032&fp-y=0.5106&fp-z=1.8036&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=953&mark-y=534&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04OSZoPTc0JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
45. Click on the 2nd option under Rate
A pop-up message "List of suitable variables" will appear after.
This step links velocity (v) to the acceleration (a).
![Click on the 2nd option under Rate](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/ac08ede6-d75a-4aec-8954-fd137ebb206c/3b3e9778-3033-4161-a289-2ece8a98c5b6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3721&fp-y=0.3613&fp-z=1.8246&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=328&mark-y=339&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz01NDMmaD01MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
46. Select "a : (double) :"
or type "a"
![Select "a : (double) :"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/0ed2a6ed-ecff-42c9-8980-6f77fda55426/acb83fcd-16cd-4265-b604-5241d188cbf1.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5007&fp-y=0.4724&fp-z=1.4143&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=247&mark-y=341&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03MDUmaD00OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
47. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/55750b1e-c57b-4d87-8e43-90236078a6de/8809b99e-0551-4742-aa29-905a0c954e46.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4951&fp-y=0.4986&fp-z=1.8036&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=971&mark-y=597&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04OSZoPTc0JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
48. The "Evolution" tab should look like this:
velocity, v = dx / dt
acceleration, a = dv / dt
usually this is the pedagogical math equation that students are taught in math lessons at secondary level so we will use this instead of computing style of
// Update ball position
x += v*dt; // or x = x + v*dt
![The "Evolution" tab should look like this:](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e72598e9-1ab6-4f8e-9514-83228675edfc/6234a5cb-b495-498c-a7cb-47ce882d3a97.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
🌟 Crafting Plotting Panel View with HTML
49. Click on View
![Click on View](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/930703e7-a0bf-4212-a7a4-381c70122c6b/15c5bdbd-9071-4e9c-895d-7f6e0794d782.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2272&fp-y=0.1817&fp-z=2.7658&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=706&mark-y=10&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yMDUmaD0xMjMmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
50. Click & Hold the following image under "Interface" Drag it to "Simulation view" on the left, following the Green markings.
![Click & Hold the following image under "Interface"
Drag it to "Simulation view" on the left, following the Green markings.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/041fb598-e3e3-40ed-b38f-00f75e476dfd/b14c99bd-614c-4d46-9df9-872632a6879f.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2653&fp-y=0.2662&fp-z=1.8875&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=651&mark-y=257&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02MyZoPTY1JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
51. This will appear after dragging the previous icon.
![This will appear after dragging the previous icon.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/b58e0671-3ee9-4885-9848-660f1c2306a5/a619d576-5b04-458e-aac7-03b3c1d1f824.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2085&fp-y=0.2500&fp-z=2.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=15&mark-y=195&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz00OTEmaD01MjUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
52. Now we want to shift the "controlPanel" (in Green) to the top of the page.
To do this, we will have to shift the "controlPanel" to inside "labelPanel", as indicated with the Red markings.
![Now we want to shift the "controlPanel" (in Green) to the top of the page.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/9225f1ba-8e1e-4054-9586-790afebcce1c/1210a926-76b0-4136-9626-2fec560db4a8.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=50&mark-y=171&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0xOTMmaD0yMiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
53. The Panel should look like this.
![The Panel should look like this.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/2f50ddec-7864-443e-8ebc-7dc50196e2ec/c6e76e5c-e479-4796-a673-297995df7752.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3012&fp-y=0.3009&fp-z=1.6626&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=30&mark-y=207&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz00MDMmaD0xODImZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
54. Drag the highlighted icon (Shape) to the "plottingPanel" . The Panel should look like this.
A pop-up message "Create a new element" will appear after.
![Drag the highlighted icon (Shape) to the "plottingPanel" .
The Panel should look like this.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/2e2422fe-ae75-4969-9323-4a93f102c75a/3c2b7460-ac8e-4461-bee3-5bbc162f29fb.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5364&fp-y=0.5671&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=599&mark-y=540&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04OSZoPTY5JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
55. Type "Ball"
![Type "Ball"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/1c345b66-38b2-4223-ac3d-e120e1dd2bc7/5994a2ae-92ed-4a84-88c7-5e787d2d017a.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5007&fp-y=0.5201&fp-z=1.4143&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=247&mark-y=331&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03MDUmaD02OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
56. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/8117aea0-3aa5-4f06-80be-f8aa687060b8/a3b12035-d086-46bb-8567-ecf2112e78cb.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4897&fp-y=0.5153&fp-z=1.7270&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=947&mark-y=470&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDYmaD04NCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
57. Click on the Shape Icon to open up its menu for more options.
Sometimes WebEJS might end up creating 2 Shapes instead. Delete the extra 2nd element by clicking on the shape icon here.
If this doesn't occur in your case, skip to step #60 here:
![Click on the Shape Icon to open up its menu for more options.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/40f8fa63-f1d1-4c1a-9059-c0bd9feecf1f/d17d6709-db5f-4736-943d-a56bfde55091.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1300&fp-y=0.4522&fp-z=2.8899&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=396&mark-y=317&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDkmaD05NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
58. Click on "Remove" option in the Menu
![Click on "Remove" option in the Menu](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f7323326-592d-4b8d-a7ff-fa427750dfb5/62e2944a-1480-4356-9241-94f3a8ae2bbc.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1689&fp-y=0.5132&fp-z=1.4223&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=163&mark-y=141&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNTEmaD00NTAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
59. Click on Remove
A pop-up message will appear to confirm the removal of the Shape element.
![Click on Remove](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/c7bf5209-3c91-4c79-bd88-668cb088483d/f18cb2f7-e6bd-437e-b146-a5ee19f5b613.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5017&fp-y=0.5228&fp-z=1.6776&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=867&mark-y=427&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNDgmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
60. Click on the Shape icon to open up its menu for its properties.
![Click on the Shape icon to open up its menu for its properties.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/5738dcc1-b731-4fd1-ba87-8a877250e936/9e953307-c5e9-402d-bec3-75c6c4c7738e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1673&fp-y=0.3887&fp-z=2.8875&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=396&mark-y=371&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDkmaD05NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
61. Click on "Properties" in the Menu.
![Click on "Properties" in the Menu.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/29640d37-6437-405b-8148-6a5d8a8d891c/9f6c39f1-a009-4696-b9c8-3410923d593f.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1689&fp-y=0.6467&fp-z=1.7556&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=201&mark-y=88&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMTAmaD01NTUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
62. Type "x"
Link the X position with the variable "x"
![Type "x"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/341e96eb-f267-418a-af85-9f4fdc57081e/5e543eff-69ce-4298-87a7-f25dbd808f56.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2500&fp-y=0.2985&fp-z=2.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=439&mark-y=299&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNzkmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
63. Type "1"
SizeX for this case shall be 1.
![Type "1"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e5c0f66a-8b3e-49b2-82a2-8b062af9cfa1/a3fa6d69-16f4-4186-aeaf-37ff52b8494a.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2411&fp-y=0.4597&fp-z=2.4020&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=432&mark-y=316&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzUmaD05OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
64. Type "1"
SizeY for this case shall be 1.
![Type "1"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/307067a9-fcac-4628-982d-5473fa003205/2826aa70-09f0-4fdf-90f7-fe8d65825807.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2411&fp-y=0.5046&fp-z=2.4020&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=432&mark-y=316&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzUmaD05OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
65. Click on Done
![Click on Done](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/b624d8f1-e259-4517-99c3-49c20edeb649/cbcf4d78-0f79-4a05-9b3f-9f95d1580cf7.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7507&fp-y=0.7925&fp-z=2.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=921&mark-y=608&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNTEmaD05OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
🌟 PREVIEW: the simulation
66. Check "on" for the Live model
![Check "on" for the Live model](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/ef5e82a8-f6f2-4639-a949-6d66f8cf25b7/df9eba4a-db33-4646-b7a5-61c2bdd2765f.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7487&fp-y=0.2525&fp-z=1.9868&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=953&mark-y=91&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz04NCZoPTUwJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
67. "FULL MODEL: Simulation" will appear instead of "PREVIEW: Simulation", indicating that the Live model is on display.
!["FULL MODEL: Simulation" will appear instead of "PREVIEW: Simulation", indicating that the Live model is on display.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/7ccdd9af-4a97-4189-b7d7-b30dec82ec94/508468b7-693b-4171-a5e9-190f52278ee6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7123&fp-y=0.0840&fp-z=2.0893&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=121&mark-y=88&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz05NTgmaD04MSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
68. Wait patiently as the simulation loads up.
![Wait patiently as the simulation loads up.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/7ab39330-9950-460a-8337-5cccbc608d01/01f8267c-1963-41a8-94dc-a52c4902b19d.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7512&fp-y=0.3654&fp-z=1.2349&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=465&mark-y=100&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03MzMmaD00NjAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
69. Click on "Reset" button to reset the simulation
![Click on "Reset" button to reset the simulation](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/72ffb3cc-1dfb-482a-a6d5-b2ec2dd200fc/fbb25f57-9fab-4d59-aef4-368b4aa25261.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7922&fp-y=0.1600&fp-z=2.8899&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=540&mark-y=289&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTkmaD05NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
70. The simulation should look like this as a result.
The ball is moving to the right at a speed of (dx/dt = v = v0 = 10)
^ may go to variables to change v0 = 0.6 or any other desired value to slow the speed.
![The simulation should look like this as a result.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/26c6eb5d-f7de-42ad-b6be-2b014ee8e46c/7d66f9b3-0ccd-452b-aeef-cbf7ada6abef.gif?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
71. ^ may change the velocity value, v0 to "0.6" for a slower motion.
![^ may change the velocity value, v0 to "0.6" for a slower motion.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/f4dd5db6-ae5a-4501-b518-2ffa4b8222c6/f21e9eb3-0cea-4f8d-b889-5ddc42d7245d.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=324&mark-y=255&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yODAmaD01OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
🌟 use Model - Evolution
Go to the "Model" tab under "Evolution".
72. Click on Model
![Click on Model](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/202532c3-750e-4a24-8491-b73274f6c9fb/d212b2b5-4881-4e6f-8ce6-f19ef1950f86.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2241&fp-y=0.1841&fp-z=2.7029&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=516&mark-y=11&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yMjcmaD0xMjAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
73. Click on the "Events" button under "Evol Page 1"
A pop-up window will appear after.
![Click on the "Events" button under "Evol Page 1"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/288b5146-d140-4658-bb50-808441a86104/d689b6fd-6c61-4264-bd4f-4197babfc467.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2931&fp-y=0.5604&fp-z=2.1414&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=992&mark-y=495&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNDYmaD0xMDEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
74. Click on "Click to create a page of Events"
A pop-up window to create the page will appear after.
![Click on "Click to create a page of Events"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/969d81bb-0446-43b2-87b9-7d0ff4a34072/56e510a2-4849-484f-a3d8-161f8b8d28ce.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5004&fp-y=0.5328&fp-z=1.0754&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=45&mark-y=72&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTEwJmg9NTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
75. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3ab31791-d6e9-4b6f-84f2-41d8dc5c7a0c/8e9c79ea-3ca5-4f20-9814-bff4a7846e20.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.4932&fp-y=0.5139&fp-z=1.7244&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=940&mark-y=465&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDYmaD04NCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
76. Edit the Zero Condition for Event 1
Let's start by editing the Zero Condition for Event 1
![Edit the Zero Condition for Event 1](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/bdc0de5d-77c6-4e2f-8312-82c80ecb7d90/e0fade0e-917a-4901-a08c-5b0058e1cc66.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5011&fp-y=0.4304&fp-z=1.0762&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=44&mark-y=245&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTExJmg9MTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
77. go back to GPT and ask "provide a JavaScript code in EJSS, about how to make the ball position (x,y) reflect back after hitting the boundary of the screen with velocity is vx and vy"
![go back to GPT and ask "provide a JavaScript code in EJSS, about how to make the ball position (x,y) reflect back after hitting the boundary of the screen with velocity is vx and vy"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d7d20397-aa13-45e2-a467-401d4113f8c0/238df7a6-c8cb-4997-9044-5e34986a5db2.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
78. Copy element titled "canvasWidth"
![Copy element titled "canvasWidth"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/a7171fc6-3a17-4521-ac21-7043b7ca8950/a911716b-73e9-49dd-b550-5406bf5a90d3.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5882&fp-y=0.6783&fp-z=1.5644&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=202&mark-y=2&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz03OTUmaD03NTAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
79. Paste "canvasWidth" into input
![Paste "canvasWidth" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/573c807b-0e22-4fde-947e-72ac86e45ad3/52ab89db-e584-49d3-b064-b2cca9a88cb4.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0767&fp-y=0.5542&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=57&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
80. Type "2"
![Type "2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/fca4b631-8087-4d86-9802-8f68499d33b2/3c17368f-1822-44c1-9d8f-6dcb22b03c33.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1908&fp-y=0.5542&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=388&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
81. Type "canvasHeight"
![Type "canvasHeight"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/bb842c63-6a94-49d3-bb5d-28e140ef4201/e3548b8b-e659-42dc-a8a9-d3603de83081.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0767&fp-y=0.6001&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=57&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
82. Type "2"
![Type "2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d69748f4-36a1-4576-8473-9d4fc1dabbeb/0f0ccdf1-eba2-4b3b-9375-2224afc68919.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1908&fp-y=0.6001&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=388&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
83. Click on ChatGPT 3.5…
![Click on ChatGPT 3.5…](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/14763f65-3278-4989-a98c-c151deb9d719/cdcf8068-a0c2-4cbe-a7e0-6e1066c22a86.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5882&fp-y=0.5000&fp-z=1.0042&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=449&mark-y=2&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MTAmaD03NTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
84. Click on ChatGPT 3.5…
![Click on ChatGPT 3.5…](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/a1166153-11ff-480a-a018-89a21d28c6bc/6f0695f4-85e9-4a59-bdde-e6fa9b67582a.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5948&fp-y=0.5000&fp-z=1.0042&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=436&mark-y=2&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01NTImaD03NTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
85. Copy element
![Copy element](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/43fb6fdc-7139-4231-a3fa-c14726846b12/21f0995a-26cf-441c-b7ed-2df6562682cf.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5882&fp-y=0.5000&fp-z=1.0042&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=449&mark-y=2&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MTAmaD03NTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
86. Click on Evolution
![Click on Evolution](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3bfb5223-b466-4c15-adc7-a081f3ed9282/e4615de0-84ba-4477-b3f3-4e21e3c0e5f6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2462&fp-y=0.0746&fp-z=2.5062&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=451&mark-y=97&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yOTgmaD04OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
87. Click on Evol Page 1
![Click on Evol Page 1](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/25e46d52-c3c0-46a3-bbb3-21f756233324/b5a7d42a-5974-4d22-9b61-d6aa8aa4927e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2911&fp-y=0.4588&fp-z=1.1943&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=113&mark-y=110&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02MDkmaD01MzQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
88. Click on Event 1
![Click on Event 1](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/63a05c43-e422-4a66-aec2-23688a2187a9/756376fc-fd56-4e96-8f45-d0807ade0b0d.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5003&fp-y=0.5506&fp-z=1.1083&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=65&mark-y=76&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDcxJmg9NjA1JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
89. copy this inside the Zero condition if (x + radius >= canvasWidth/2 || x - radius <= -canvasWidth/2) { return 0; // Condition for Event } copy this inside the Action // Action for Event 1 vx *= -1
ignore the commented lines // as they are previous lines of codes but not needed now
![copy this inside the Zero condition
if (x + radius >= canvasWidth/2 || x - radius <= -canvasWidth/2) {
return 0; // Condition for Event
}
copy this inside the Action
// Action for Event 1
vx *= -1](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/de454dee-b6a2-4446-be61-2a623e93f52c/5c78021a-4557-4ef4-a943-3bc21c5dce83.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
90. Go to HTMLVIEW- Click on Ball image
![Go to HTMLVIEW- Click on Ball image](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/1dd19f6c-196e-4946-88da-b4320359ac4a/f4c92535-6ea3-4bd3-a155-e1bf56442fda.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1216&fp-y=0.3733&fp-z=2.9265&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=375&mark-y=331&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDQmaD05MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
91. Click on image
![Click on image](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/40c8be1e-4668-437d-aab4-f77952bcbff7/c79bdb21-621c-4a74-9597-adb7789fd740.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1757&fp-y=0.5819&fp-z=1.6282&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=209&mark-y=136&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNjkmaD00ODImZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
92. Type "radius*2" for both SizeX and SizeY
93. Type "radius*2" for both SizeX and SizeY
reason is SizeX and SizeY are double of the radius
![Type "radius*2" for both SizeX and SizeY](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/dd645a7c-2af6-4d7d-91c3-0334de8a209a/0edbeddf-cb22-4ced-916b-dfd5f7a64fe6.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2272&fp-y=0.4635&fp-z=2.2744&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=409&mark-y=333&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODEmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
94. Click on Done
![Click on Done](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/9ad21788-1b33-4647-8775-0a51a0deef6d/cc9fb0c0-6563-4890-8860-ce9693ceba13.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.9174&fp-y=0.9489&fp-z=4.0000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=662&mark-y=509&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yODMmaD0xODMmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
95. Go back to Model to introduce your variable
![Go back to Model to introduce your variable](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/629d640e-e3f0-48ad-9ee9-9b90843480ef/877308bc-92e4-4cdd-9112-46618df76864.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2269&fp-y=0.0328&fp-z=2.7354&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=492&mark-y=11&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yMTUmaD0xMTQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
96. Paste "radius" into input
![Paste "radius" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/6ffb1a64-4e63-4305-b3d6-6713e5e912cf/b83bcaa4-0f9d-45f2-bbf9-96a868937942.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0767&fp-y=0.6460&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=57&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
97. Type "0.1"
note that the radius cannot be too big like 1 else it will never be able to meet the event on the ODE event.
![Type "0.1"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/6ed4adc5-a96d-41d6-a885-0099d7db8161/decd2e07-4422-4246-b179-7d19162a74d0.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1816&fp-y=0.6397&fp-z=2.4149&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=361&mark-y=336&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zMzEmaD04MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
98. Add the variable canvasWidth and canvasHeight to the plotingPanel's MinimumX, MaximumX etc , go to Click on View
![Add the variable canvasWidth and canvasHeight to the plotingPanel's MinimumX, MaximumX etc , go to Click on View](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/40ecb22e-acf3-4747-bfe0-122816b40e70/55fac8c8-6aee-45e4-af3a-8c149d9ed8f2.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2813&fp-y=0.0328&fp-z=2.7956&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=503&mark-y=11&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xOTQmaD0xMTcmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
99. Click on image
![Click on image](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/9c8cecd0-7609-44a3-9ab9-88ed14e1bd88/05b2aa8d-b3a1-4c7a-bd84-c5e069bcb927.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0889&fp-y=0.3399&fp-z=2.9265&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=260&mark-y=331&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDQmaD05MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
100. Click on image
![Click on image](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/bb5fdd5e-8612-4c0a-b97f-5eb8115c629d/9ec6f1e7-350c-4c86-a223-289add7ea98c.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.1430&fp-y=0.5652&fp-z=1.5468&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=138&mark-y=130&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNTYmaD00OTQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
101. Type "-canvasWidth/2"
![Type "-canvasWidth/2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/137e350a-2488-4421-b781-1f4d5ee5f1f5/824f01a4-3467-4831-8b43-0e76ff190024.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.3415&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
102. Type "canvasWidth/2"
![Type "canvasWidth/2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d576c13b-3c33-4a3f-ad29-4bec45f926c1/9e62b38d-e10b-44b7-a337-a73fa8e1225e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.3811&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
103. Type "-canvasHeight/2"
![Type "-canvasHeight/2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d8883952-26af-432e-b55e-780470bf2022/1f4be83e-39d4-433c-b2cf-396ca0b76779.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.4218&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
104. Copy input titled "canvasHeight/2"
![Copy input titled "canvasHeight/2"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/c9153f7c-8996-4fc1-bbf0-9b547593241f/7d8cbb2a-ec82-4120-b06c-4467f13a16f1.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.4218&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
105. Paste "canvasHeight/2" into input
![Paste "canvasHeight/2" into input](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3a97b15f-be04-4687-9abd-231410bc7e5e/7b6787e0-9dfb-4163-b418-830b4f80dda8.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.4625&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
106. To make the PlottingPanel length x and length y equal, Click on SquareAspect
![To make the PlottingPanel length x and length y equal, Click on SquareAspect](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/d548d4ee-e40c-43d6-a46f-1b4eebbcddc5/95b1b031-cb6f-4ae2-a555-27c43a9efc58.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2252&fp-y=0.5834&fp-z=2.2542&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=406&mark-y=334&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zODgmaD04NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
107. Click on Main
![Click on Main](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/1856f38a-9824-4e4c-9ec3-4a75931d5a54/508c6172-a530-48be-84ab-d4549e70c9d2.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5003&fp-y=0.5078&fp-z=1.0612&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=36&mark-y=133&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTI3Jmg9NDg4JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
108. Click on true
![Click on true](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/5e340b33-7e32-4667-89ef-e14e230a491e/51506183-63f2-4f24-b3a1-1dda5987821e.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.4906&fp-z=1.4517&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=261&mark-y=353&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02NzcmaD00OSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
109. Click on OK
![Click on OK](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/fd617890-a959-4910-be11-2b60d0d1309d/3d018f53-f2cd-4106-a06b-300a34422943.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6754&fp-y=0.6022&fp-z=2.8482&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=535&mark-y=322&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMzAmaD0xMTAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
110. To make the Width and Height of the PlottingPanel bigger, Click on Width
![To make the Width and Height of the PlottingPanel bigger, Click on Width](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/45a1cad9-18b1-4dd4-b8e4-5fb260606c19/621b95de-8e10-415c-b80b-5074f81cfa46.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.8180&fp-y=0.3811&fp-z=2.8482&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=377&mark-y=322&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz00NDYmaD0xMTAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
111. Click on Main
![Click on Main](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e3fe5e51-b3ad-4e48-993e-28138ba744c5/0b6694ad-cbf9-4a6b-961b-53c83fb17766.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5003&fp-y=0.5078&fp-z=1.0612&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=36&mark-y=133&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTI3Jmg9NDg4JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
112. Type "100%" and "90vh" respectively as shown. remember to have the quotation "" else it will cause an error remember strings need "", numbers don't need.
![Type "100%" and "90vh" respectively as shown.
remember to have the quotation "" else it will cause an error
remember strings need "", numbers don't need.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/e681d228-013e-43bd-9ad1-595f16f07b2a/8596fa51-fa4b-4e3c-b91d-4177ef31ed14.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
113. Example of Error Click on Uncaught ReferenceError: _simulation is not defined (at https://macmath.inf.um.es/static/sessions/78bfa731-67b6-47dd-a7d5-6d9c8a78e9f6/output/_preview.xhtml => line:164)
![Example of Error
Click on Uncaught ReferenceError: _simulation is not defined (at https://macmath.inf.um.es/static/sessions/78bfa731-67b6-47dd-a7d5-6d9c8a78e9f6/output/_preview.xhtml => line:164)](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/b8c4f66a-a29c-4208-9052-a2b2d19752a9/c1bdd30d-d038-4e5c-bc5e-8e57dce7b69b.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.8749&fp-z=1.0033&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=2&mark-y=632&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTk2Jmg9NTUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
114. After the Simulation is loaded up, it will display the conditions here.
![After the Simulation is loaded up, it will display the conditions here.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/cf97b66d-90d2-4566-8bd9-a9dc41fda92d/09c43523-1936-4cb1-ad0b-5b99b6a40c3d.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.7512&fp-y=0.3654&fp-z=1.2349&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=465&mark-y=100&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03MzMmaD00NjAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
115. Click on Run the simulation
An alternative to watch the simulation is by clicking on the "Run the simulation" icon on the top right corner
![Click on Run the simulation](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/22769997-3cda-43bb-ba43-a8782557c1a1/ab34d387-ad81-405b-bbeb-c3acbfda3949.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.8879&fp-y=0.0345&fp-z=2.7969&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=767&mark-y=12&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMTMmaD0xMTgmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
116. Simulation should run in a separate tab
![Simulation should run in a separate tab](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/cfb7aefd-b53a-4ffb-b155-bde51ec39f4c/9acae3cf-eb38-4b99-8a4b-b6af2bfc21c9.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.2673&fp-y=0.7612&fp-z=1.8725&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=6&mark-y=636&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yMDQ3Jmg9NDcmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
117. The simulation should look like this as a result.
![The simulation should look like this as a result.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/26ee69f9-9ef5-4723-b407-b20c31175a35/09ce074c-076c-446a-8b3c-fe1ce0f7fe9e.gif?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
🌟 Exporting the file
118. Click on the icon for Simulation properties
![Click on the icon for Simulation properties](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/655daef0-77b9-4580-acbe-d5366a64dd1d/899f7461-923f-4b4b-989c-2bdfea416b09.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3472&fp-y=0.0362&fp-z=2.7702&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=527&mark-y=12&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xNDcmaD0xMjMmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
119. Click on "Export options"
![Click on "Export options"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/9a1bce35-2675-4fe5-b0c6-26e460736995/243c2e40-605c-4b55-91f7-446a6f665993.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5004&fp-y=0.3458&fp-z=2.3467&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=422&mark-y=303&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0zNTUmaD0xMjQmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
120. Check "Save the source file in XML format (readable by JavaScript EJS 6)"
![Check "Save the source file in XML format (readable by JavaScript EJS 6)"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/2ac4521d-9ebf-42e3-9d72-c2da3fad76ee/309e3553-a8c1-40d0-8735-cfe552310d69.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.3428&fp-y=0.4285&fp-z=2.9868&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=301&mark-y=272&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz03NSZoPTc1JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
121. Click on "Done" button
![Click on "Done" button](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/82a2a223-e459-4774-9bbc-47dac1081922/2d44a2e9-2883-4dd0-b76e-654e84bc29ba.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=836&mark-y=560&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz03NiZoPTQ5JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D)
122. Click on the icon for "Download ZIP with the complete simulation"
A pop-up window will appear after.
![Click on the icon for "Download ZIP with the complete simulation"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/3e8343be-b8b8-48f3-92fa-aa72916616a1/47e86946-3012-4f14-9f90-23ab79dd8aee.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.9114&fp-y=0.0345&fp-z=2.7969&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=852&mark-y=12&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0xMDEmaD0xMTgmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
123. Rename ZIP file to "MovingBall.zip"
![Rename ZIP file to "MovingBall.zip"](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/73e2b667-bf37-4838-a3b5-a57c625e3fbf/34e8ccf7-8641-4084-a2c9-5c40618608c0.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5357&fp-y=0.4914&fp-z=1.5716&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=276&mark-y=327&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz02NDkmaD03NyZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)
124. Click on Download
![Click on Download](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/5a4056ee-735e-417b-8ca9-51eadd2f3d8a/e01daded-eafb-439d-9716-849c88474b00.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.6643&fp-y=0.6145&fp-z=2.6377&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n&mark-x=462&mark-y=301&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTYlMkNGRjc0NDImdz0yNzUmaD0xMjkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
125. After Extracting the file, click on "simulation.xhtml" to open up the simulation on your default browser.
![After Extracting the file, click on "simulation.xhtml" to open up the simulation on your default browser.](https://images.tango.us/workflows/6c7eebac-c16f-42ef-9184-3d5721823284/steps/657551a0-2b33-4a62-a8db-3929b0bcbeef/11ec79c0-c97d-486f-996e-ee03f56b5a87.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&w=1200&border=2%2CF4F2F7&border-radius=8%2C8%2C8%2C8&border-radius-inner=8%2C8%2C8%2C8&blend-align=bottom&blend-mode=normal&blend-x=0&blend-w=1200&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmstdjIucG5n)
No comments:
Post a Comment