This repository is under developement! If you wish to contribute your time go ahed and do that. Give me a pull request if you are done.

This git repository has some simulations to learn physics visually and it is not intended for professional prototyping or testing as the accuracy will be very low.

The acuracy of the simulations depend on the frame rate of the browser and for each frame the simulation do many calculations. The framerate and accuracy will drop if the performance is low or throttled.

I came upon this idea to create simulations that are ment to explain things rater being accurate, when I am preparing for a presentation on Inductors. I searched the web far and wide but I can't find an easy way to explain the functioning of an inductor ( I have tried animated videos but none of then fits ) so I made this.

There are many softwares for simulations but they are all designed to be used used for prototyping and for testing designs. But the simulations in this repo are different because the are realtime. You can actually see how the components behave and change the parameters while the simulation is running.

The pre-built HTML, CSS and JavaScript are availabe in the folder 'docs', so there is no need to build these simulations if you are not changing the actual source code.

gulp

gulp <simulation_name>

gulp dev-<simulation_name>

Most of the simulations in this repo are written in Svelte along with TypeScript and SASS. They are compiled, bundled, minified and optimised by the webpack module bundler. The tasks are orchestrated by the Gulp task runner.

The simulations utilises the Window.requestAnimationFrame() API to do the integration calculations of the simulation and to prepare the animation frames before the browser renders them. For each frame the time interval between the frames are calculated and the integrations are done within this time interval. If this time interval exceeds 500ms ( It occours when the performance is very low or is being throttled) a warning will be shown to the user.

The source code lies within the src folder. For each simulation there must be folder for the simulation inside the src folder. This simulation folder must contain an 'index.ts' file which is the entry point of the bundler for that simulation. Every folder inside the src directory must correspond to a simulation unless the folder is lib where a common library for all simulations is seated.