basic docs
This commit is contained in:
parent
ae49b390cd
commit
af04b85b55
39
README.md
39
README.md
|
@ -1,20 +1,35 @@
|
|||
# logicGateSimulator2
|
||||
# Logic gate simulator
|
||||
|
||||
a better version of my logic gate simulator
|
||||
This is a logic gate simulator made for infoeducatie 2019.
|
||||
|
||||
## Getting started
|
||||
|
||||
Check out the [demo](https://mateiadrielrafael.github.io/logicGateSimulator/)
|
||||
Or read the [docs](./docs/main.md) (work in progess)
|
||||
|
||||
To run locally clone this repo, and then run: `npm install`
|
||||
to install all dependenices, `npm run dev` to start the development server or `npm run build` to bundle it.
|
||||
## Features
|
||||
|
||||
This project wouldnt have been possible without the follownig libraries:
|
||||
- Simple & intuitive UI
|
||||
- Multiple simulations support
|
||||
- Integrated circuits
|
||||
- Multiple language support: Romanian, English, German, Dutch, Spanish & more in the future
|
||||
|
||||
- [typescript](https://github.com/microsoft/TypeScript) and [sass](https://github.com/sass/sass)
|
||||
- [lit-html](https://github.com/Polymer/lit-html) , [lit-rx](https://github.com/Dabolus/lit-rx) and [rxjs](https://github.com/ReactiveX/rxjs)
|
||||
- [material components for the web](https://github.com/material-components/material-components-web)
|
||||
- [webpack](https://github.com/webpack/webpack)
|
||||
- [gh-pages](https://github.com/tschaub/gh-pages)
|
||||
- [eix-js](https://github.com/eix-js)
|
||||
## Playing with the source
|
||||
|
||||
I used lit-html, lit-rx and rxjs mainly for the rendering, MCW for the styling, webpack for bundling, gh-pages for deploying and eix-js (a game engine me and a friend are working on) for input handling and common decorators.
|
||||
To run locally clone this repo, and then install all dependencies by rrunning:
|
||||
|
||||
```sh
|
||||
npm install
|
||||
```
|
||||
|
||||
Start the development server by running:
|
||||
|
||||
```sh
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Or bundle the source with:
|
||||
|
||||
```sh
|
||||
npm run build
|
||||
```
|
||||
|
|
88
docs/main.md
88
docs/main.md
|
@ -1,10 +1,86 @@
|
|||
# Welcome
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||
|
||||
Hello, and welcome to my logic gate simulator! I know it can look kinda scary at first, so that's why i wrote these docs!
|
||||
# Introduction
|
||||
|
||||
I recomand reading the first 3 chapters before you start, and then only dig deeper into the others when you feel you mastered the basics!
|
||||
These docs will walk you trough the process of creating a full adder.
|
||||
|
||||
# Table of contents
|
||||
## Opening the simulator
|
||||
|
||||
1. [Basic controls](./controls.md)
|
||||
2. [Importing a custom logic gate](import.md)
|
||||
There are 3 ways to open the simulator:
|
||||
|
||||
1. Using the version hosted on github-pages:
|
||||
|
||||
This is by far the fastest solution - everything you need to do is open
|
||||
[the github-pages url](https://mateiadrielrafael.github.io/logicGateSimulator/)
|
||||
|
||||
2. Using a development server:
|
||||
|
||||
First you need to have [node.js & npm](https://nodejs.org/en/download/) and [git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) installed on your machine.
|
||||
|
||||
Open a terminal in the desired folder and run:
|
||||
|
||||
```sh
|
||||
# Clone repo
|
||||
git clone https://github.com/Mateiadrielrafael/logicGateSimulator
|
||||
|
||||
# Cd into the folder
|
||||
cd logicGateSimulator
|
||||
|
||||
# install dependencies
|
||||
npm install
|
||||
|
||||
# run development server
|
||||
npm run dev
|
||||
```
|
||||
|
||||
3. Building the simulation yourself
|
||||
|
||||
First, clone the repo and install the dependencies as explained in option 2.
|
||||
|
||||
To build the source run:
|
||||
|
||||
```sh
|
||||
# build program
|
||||
npm run build
|
||||
```
|
||||
|
||||
To then run the simulation, open a server in the dist directory. A simple solution using npm:
|
||||
|
||||
```sh
|
||||
# instal nano-server globally
|
||||
npm i nano-server -g
|
||||
|
||||
# change directory
|
||||
cd dist
|
||||
|
||||
# run server
|
||||
nano-server
|
||||
|
||||
# linux
|
||||
open http://localhost:5000
|
||||
|
||||
# Windows
|
||||
start http://localhost:5000
|
||||
```
|
||||
|
||||
## The controls
|
||||
|
||||
| Action | Keybinding | Gui |
|
||||
| :---------------------------------: | :-------------: | :--------------------------------------------------------------------------: |
|
||||
| Save | `ctrl + s` | `Simulation` > `Save` |
|
||||
| Add a gate | - | click `logic-gates` > the gate you want to add |
|
||||
| Move a gate | - | drag & drop the gate using 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` |
|
||||
| Add to selection | `shift` | select while holding `shift` |
|
||||
| Select all gates | `ctrl + a` | `Simulation` > `Select all` |
|
||||
| Delete selection | `delete` | `Simulation` > `Delete selection` |
|
||||
| Undo _(to last save)_ | `ctrl + z` | `Simulation` > `Undo` |
|
||||
| Refresh (reload) simulation | `ctrl + r` | `Simulation` > `Refresh` |
|
||||
| Clean (delete unconnected gates) | `ctrl + delete` | `Simulation` > `Clean` |
|
||||
| Open simulation | - | `Open simulation` > the simulation you want to open |
|
||||
| Create simulation | - | `Create simulation` > `Project` | `Integrated circuit` > type the name of the simulation |
|
||||
| Create project | - | `Create simulation` > `Project` > type the name of the simulation |
|
||||
| Create integrated circuit | - | `Create simulation` > `Integrated circuit` > type the name of the simulation |
|
||||
| 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> |
|
||||
|
|
Loading…
Reference in a new issue