basic tutorial;

This commit is contained in:
Matei Adriel 2019-07-25 18:44:07 +03:00
parent 96ae3f44a1
commit c1c84f1a6e
7 changed files with 64 additions and 25 deletions

BIN
docs/assets/4-bit-adder.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 105 KiB

BIN
docs/assets/full-adder.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3 KiB

BIN
docs/assets/half-adder.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

View file

@ -1,12 +1,9 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
ess of creating a full adder.
# Introduction ## Running the simulator
These docs will walk you trough the process of creating a full adder. There are 3 ways to get the simulator up and running:
## Opening the simulator
There are 3 ways to open the simulator:
1. Using the version hosted on github-pages: 1. Using the version hosted on github-pages:
@ -63,24 +60,66 @@ open http://localhost:5000
start http://localhost:5000 start http://localhost:5000
``` ```
## Building a 4 - bit adder:
1. Create a new ic called `half-adder` (`Create simulation` > `Integrated circuit` > `Half adder`)
2. Add the following logic gates (`Logic gates` > the name of the gate):
- 2 buttons
- 2 light bulbs
- a XOR gate
- an AND gate
> You can get more info about these gates by clicking `Logic gates` > the <i class='material-icons'>info</i> icon at the rght of the gate.
3. To move a gate, drag & drop it with the right mouse button. To connect 2 pins, click once on each. Build the following configuration:
![Half adder](./assets/half-adder.png)
3. Create a new ic called `full-adder` (See step 1)
4. Add the following gates (See step 2):
- 3 buttons
- 2 light bulbs
- 2 half adders
- an OR gate
5) Build the following configuration (See step 3):
![Full adder](./assets/full-adder.png)
6) Create a new project called `4-bit-adder` (`Create simulation` > `Project` > `4-bit-adder`)
7) Add the following components (See step 2):
- 8 button
- 5 light bulbs
- 3 full adders
- 1 half adder
8) Build the following configuration (See step 3):
![4-bit-adder](./assets/4-bit-adder.png)
9) Enjoy!
Congratiulations! You've made your first circuit! With this simulator at your dispossal, the possibilities are endless! Here are a few things you can try and create yourself: - A 4-bit substractor - A counter - Different latches - If you are confident in you skills, you can even make a full 4-bit processor!
## The controls ## The controls
| Action | Keybinding | Gui | | Action | Keybinding | Gui |
| :---------------------------------: | :-------------: | :--------------------------------------------------------------------------: | | :---------------------------------: | :---------------------: | :--------------------------------------------------------------------------: |
| Save | `ctrl + s` | `Simulation` > `Save` | | Save | `ctrl + s` | `Simulation` > `Save` |
| Add a gate | - | click `logic-gates` > the gate you want to add | | Add a gate | - | click `logic-gates` > the gate you want to add |
| Move a gate | - | drag & drop the gate using the `right mouse button` | | Move a gate | - | drag & drop the gate using the `right mouse button` |
| Pan | - | click & move & release the background useing the `right mouse button` | | Pan | - | click & move & release the background useing the `right mouse button` |
| Select multiple gates | - | click & move & release using the `left mouse button` | | Select multiple gates | - | click & move & release using the `left mouse button` |
| Add to selection | `shift` | select while holding `shift` | | Add to selection | `shift` | select while holding `shift` |
| Select all gates | `ctrl + a` | `Simulation` > `Select all` | | Select all gates | `ctrl + a` | `Simulation` > `Select all` |
| Delete selection | `delete` | `Simulation` > `Delete selection` | | Delete selection | `delete` | `Simulation` > `Delete selection` |
| Undo _(to last save)_ | `ctrl + z` | `Simulation` > `Undo` | | Undo _(to last save)_ | `ctrl + z` | `Simulation` > `Undo` |
| Refresh (reload) simulation | `ctrl + r` | `Simulation` > `Refresh` | | Refresh (reload) simulation | `ctrl + r` | `Simulation` > `Refresh` |
| Clean (delete unconnected gates) | `ctrl + delete` | `Simulation` > `Clean` | | Clean (delete unconnected gates) | `ctrl + delete` | `Simulation` > `Clean` |
| Open simulation | - | `Open simulation` > the simulation you want to open | | Delete simulation | `ctrl + shift + delete` | `Simulation` > `Delete simulation` |
| Create simulation | - | `Create simulation` > `Project` | `Integrated circuit` > type the name of the simulation | | Open simulation | - | `Open simulation` > the simulation you want to open |
| Create project | - | `Create simulation` > `Project` > type the name of the simulation | | Create simulation | - | `Create simulation` > `Project` | `Integrated circuit` > type the name of the simulation |
| Create integrated circuit | - | `Create simulation` > `Integrated circuit` > type the name of the simulation | | Create project | - | `Create simulation` > `Project` > type the name of the simulation |
| Change language | - | Click on the `Language: \<language\>` button (bottom of the sidebar) | | Create integrated circuit | - | `Create simulation` > `Integrated circuit` > type the name of the simulation |
| Get more info about a built in gate | - | `Logic gates` > <i class="material-icons">info</i> | | Change language | - | Click on the `Language: \<language\>` button (bottom of the sidebar) |
| Get more info about a built in gate | - | `Logic gates` > <i class="material-icons">info</i> |