add wiki (fixed)

wiki @ 45b509c9

-Subproject commit 45b509c969758ee20fc3a75eb96f3f62498e7377

wiki/Array1DTracer.md

+**Array1DTracer** inherits **[Array2DTracer](Array2DTracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **Array1DTracer**((String) name) | create Array1DTracer and set its name |
+| **attach**((ChartTracer) chartTracer)| automatically visualize array data to the bar chart |
+| **palette**((Object) {selected, notified, default})| set colors (e.g., `{selected: 'green', notified: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setData**((Number[]) data)| set one-dimensional array data to visualize |
+| **_notify**((Number) idx, (Number) v) | notify that the value of element _idx_ has been changed to _v_ |
+| **_denotify**((Number) idx) | stop notifying that the value of element _idx_ has been changed |
+| **_select**((Number) s, (Number) e) | select a range between elements _s_ and _e_ |
+| **_select**((Number) idx) | select element _idx_ |
+| **_deselect**((Number) s, (Number) e) | deselect a range between elements _s_ and _e_ |
+| **_deselect**((Number) idx) | deselect element _idx_ |
+| **_separate**((Number) idx) | put a divider between elements _idx_ and (_idx+1_) |
+| **_deseparate**((Number) idx) | remove a divider between elements _idx_ and (_idx+1_) |
+| **_clear**() | erase traces on the array |
+| **_wait**() | wait for a certain amount of time |
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=Array1DTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/Array2DTracer.md

+**Array2DTracer** inherits **[Tracer](Tracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **Array2DTracer**((String) name)| create Array2DTracer and set its name |
+| **palette**((Object) {selected, notified, default})| set colors (e.g., `{selected: 'green', notified: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setData**((Number[][]) data)| set two-dimensional array data to visualize |
+| **_notify**((Number) x, (Number) y, (Number) v) | notify that the value of (x, y) has been changed to _v_ |
+| **_denotify**((Number) x, (Number) y) | stop notifying that the value of (x, y) has been changed |
+| **_select**((Number) sx, (Number) sy, (Number) ex, (Number) ey) | select a rectangle formed by (sx, sy) and (ex, ey) |
+| **_select**((Number) x, (Number) y) | select (x, y) |
+| **_selectRow**((Number) x, (Number) sy, (Number) ey) | equivalent to **_select**(x, sy, x, ey) |
+| **_selectCol**((Number) y, (Number) sx, (Number) ex) | equivalent to **_select**(sx, y, ex, y) |
+| **_deselect**((Number) sx, (Number) sy, (Number) ex, (Number) ey) | deselect a rectangle formed by (sx, sy) and (ex, ey) |
+| **_deselect**((Number) x, (Number) y) | deselect (x, y) |
+| **_deselectRow**((Number) x, (Number) sy, (Number) ey) | equivalent to **_deselect**(x, sy, x, ey) |
+| **_deselectCol**((Number) y, (Number) sx, (Number) ex) | equivalent to **_deselect**(sx, y, ex, y) |
+| **_separate**((Number) x, (Number) y) | put dividers between _x_-th and (_x+1_)-th rows and between _y_-th and (_y+1_)-th columns |
+| **_separateRow**((Number) x) | put a divider between _x_-th and (_x+1_)-th rows |
+| **_separateCol**((Number) y) | put a divider between _y_-th and (_y+1_)-th columns |
+| **_deseparate**((Number) x, (Number) y) | remove dividers between _x_-th and (_x+1_)-th rows and between _y_-th and (_y+1_)-th columns |
+| **_deseparateRow**((Number) x) | remove a divider between _x_-th and (_x+1_)-th rows |
+| **_deseparateCol**((Number) y) | remove a divider between _y_-th and (_y+1_)-th columns |
+| **_clear**() | erase traces on the array |
+| **_wait**() | wait for a certain amount of time |
+
+## Child Modules
+
+* [Array1DTracer](Array1DTracer)
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=Array2DTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/ChartTracer.md

+**ChartTracer** inherits **[Tracer](Tracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **ChartTracer**((String) name)| create ChartTracer and set its name |
+| **palette**((Object) {selected, notified, default})| set colors (e.g., `{selected: 'green', notified: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setData**((Number[]) data)| set one-dimensional array data to visualize |
+| **_notify**((Number) idx, (Number) v) | notify that the value of element _idx_ has been changed to _v_ |
+| **_denotify**((Number) idx) | stop notifying that the value of element _idx_ has been changed |
+| **_select**((Number) s, (Number) e) | select a range between elements _s_ and _e_ |
+| **_select**((Number) idx) | select element _idx_ |
+| **_deselect**((Number) s, (Number) e) | deselect a range between elements _s_ and _e_ |
+| **_deselect**((Number) idx) | deselect element _idx_ |
+| **_clear**() | erase traces on the chart |
+| **_wait**() | wait for a certain amount of time |
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=ChartTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/Contributing.md

+**NOTE**: Check out [**Project Details**](Project-Details) before running it locally!
+
+To add changes and improvements or resolve issues, these are the usual steps:
+
+1. Fork the project on Github then clone it to your machine:
+  
+  ```bash
+  git clone https://github.com/<your-username>/AlgorithmVisualizer # clone your forked repo
+  cd AlgorithmVisualizer                                           # navigate inside the created directory
+  git submodule init                                               # initialize wiki submodule
+  git submodule update                                             # setup wiki submodule updates
+  ```
+2. Your fork's remote repository should be named `origin` by default, so add the main repository as a remote as well and give it a name to distinguish it from your fork (something like `main` would work):
+
+  ```bash
+  git remote add main https://github.com/parkjs814/AlgorithmVisualizer
+  ```
+
+3. Create a branch addressing the issue/improvement you'd like to tackle.
+
+  ```bash
+  git checkout -b my-problem-fixer-branch
+  ```
+
+4. Make your changes and push to `my-problem-fixer-branch` on your repo
+
+  ```bash
+  # write some awesome code and then ...
+  git add .
+  git commit -m "Explain my awesome changes"
+  git push origin my-problem-fixer-branch
+  ```
+
+5. Next create a pull request from `my-problem-fixer-branch` branch on `origin` to `master` branch on `main`.
+
+6. Once approved, just delete `my-problem-fixer-branch` both locally and remotely because it's not needed anymore.
+
+7. Finally, checkout `master` locally, pull the approved changes from the `main` repo, and push them to your `origin` repo:
+
+  ```bash
+  git checkout master  # checkout master locally
+  git pull main master # pull new changes from main repository
+  git push main master # push the changes to your fork
+  ```
+
+That's it, everything should be in sync now.
+
+If you run into problems, feel free to [ask us for help on gitter](https://gitter.im/parkjs814/AlgorithmVisualizer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+
+As mentioned, check out [**Project Details**](Project-Details) for more information on how to run the project.
\ No newline at end of file

wiki/DirectedGraphTracer.md

+**DirectedGraphTracer** inherits **[Tracer](Tracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **DirectedGraphTracer**((String) name)| create DirectedGraphTracer and set its name |
+| **attach**((LogTracer) logTracer)| automatically print log when visiting or leaving nodes |
+| **palette**((Object) {visited, left, default})| set colors (e.g., `{visited: 'green', left: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setTreeData**((Number[][]) tree, (Number) root) | set tree data to visualize |
+| **_setData**((Number[][]) graph) | set graph data to visualize |
+| **_visit**((Number) target, (Number) source) | visit _target_ node from _source_ node |
+| **_leave**((Number) target, (Number) source) | leave _target_ node to _source_ node |
+| **_clear**() | erase traces on the graph |
+| **_wait**() | wait for a certain amount of time |
+
+## Child Modules
+
+* [UndirectedGraphTracer](UndirectedGraphTracer)
+* [WeightedDirectedGraphTracer](WeightedDirectedGraphTracer)
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=DirectedGraphTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/Home.md

+Check out:
+- [**Contributing**](Contributing) for details on how to contribute to our project and 
+- [**Project Details**](Project-Details) for details on how to build/run the project
+
+## Hierarchy of `algorithm` Directory
+| Path | Description |
+|------|-------------|
+| [/algorithm/category.json](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/algorithm/category.json) | This file contains the list of categories and their algorithms. |
+| [/algorithm/[category]/[algorithm]/desc.json](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/algorithm/graph_search/dfs/desc.json) | This file contains the description of the algorithm and the list of its examples. |
+| [/algorithm/[category]/[algorithm]/[example]/data.js](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/algorithm/graph_search/dfs/tree/data.js) | This file predefines data variables that will be shown in a visualizing module. |
+| [/algorithm/[category]/[algorithm]/[example]/code.js](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/algorithm/graph_search/dfs/tree/code.js) | This file actually implements and visualizes the algorithm. |
+
+## Visualizing Modules
+* [Tracer](Tracer)
+* [LogTracer](LogTracer)
+* [Array2DTracer](Array2DTracer)
+* [Array1DTracer](Array1DTracer)
+* [DirectedGraphTracer](DirectedGraphTracer)
+* [UndirectedGraphTracer](UndirectedGraphTracer)
+* [WeightedDirectedGraphTracer](WeightedDirectedGraphTracer)
+* [WeightedUndirectedGraphTracer](WeightedUndirectedGraphTracer)
+* [ChartTracer](ChartTracer)
+
+## Creating Random Data
+| Function | Description |
+|----------|-------------|
+| **Integer.random**((Number) min, (Number) max) | Create a random integer inclusively between _min_ and _max_. |
+| **Array2D.random**((Number) N, (Number) M, (Number) min, (Number) max) | Create random _N_ * _M_ array data that elements have a random value between _min_ and _max_. |
+| **Array2D.randomSorted**((Number) N, (Number) M, (Number) min, (Number) max) | Basically same as `Array2D.random` but elements in each row are sorted in increasing order. |
+| **Array1D.random**((Number) N, (Number) min, (Number) max) | Create random one-dimensional array data of size _N_ that elements have a random value between _min_ and _max_. |
+| **Array1D.randomSorted**((Number) N, (Number) min, (Number) max) | Basically same as `Array1D.random` but elements are sorted in increasing order. |
+| **DirectedGraph.random**((Number) N, (Number) ratio) | Create random graph data containing _N_ nodes and having directed edges between nodes at the probability of _ratio_ (between 0 and 1). |
+| **UndirectedGraph.random**((Number) N, (Number) ratio) | Basically same as `DirectedGraph.random` but edges do not have direction. |
+| **WeightedDirectedGraph.random**((Number) N, (Number) ratio, (Number) min, (Number) max) | Basically same as `DirectedGraph.random` but edges have a random weight between _min_ and _max_. |
+| **WeightedUndirectedGraph.random**((Number) N, (Number) ratio) | Basically same as `WeightedDirectedGraph.random` but edges do not have direction. |
\ No newline at end of file

wiki/LogTracer.md

+**LogTracer** inherits **[Tracer](Tracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **LogTracer**((String) name)| create LogTracer and set its name |
+| **_print**(msg) | print `msg` |
+| **_setData**(args) | _inherited, but not used_ |
+| **_clear**() | erase all logs |
+| **_wait**() | wait for a certain amount of time |
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=LogTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/Project-Details.md

+## Build System
+
+Our project uses [gulp](http://gulpjs.com/) to:
+
+- combine all individual modules into a single file
+- transpile ES6 code to ES5 with [babel.js](http://babeljs.io/)
+- minimize JS and CSS code
+- generate source maps
+- add vendor prefixer to the css
+- provide a server with live-reload
+
+## Installation
+
+```bash
+# install gulp globally so you can run it from the command line
+npm install -g gulp-cli
+
+# install all dependencies
+npm install
+
+# run gulp to start the livereload server on http://localhost:8080 
+gulp
+```
+
+**NOTE**: For Node.js versions below 0.12, you need to install an ES6-style Promise Polyfill (in case you receive a "Promise is undefined" error). To run with Promise, use:
+
+```bash
+npm install es6-promise
+```
+
+Then add the following line at the top of your *gulpfile.babel.js*:
+
+```javascript
+var Promise = require ('es6-promise').Promise;
+```
+Check out [stackoverflow](http://stackoverflow.com/questions/32490328/gulp-autoprefixer-throwing-referenceerror-promise-is-not-defined) for more details on this issue.
+
+To check your Node.js version, use:
+
+```bash
+node --version
+```
+
+## Code Structure
+
+*Note:* Although no linter is added as of yet, the code closely follows the conventions from [Airbnb's ECMAScript 6 Javascript style guide](https://github.com/airbnb/javascript)
+
+### [js/index.js](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js)
+
+The app entry point is [`js/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js). 
+It performs the initial application setup (loads the app when jQuery loads, loads the initial data from the server etc.)
+
+### [js/app/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/app)
+
+The main application object is [`js/app/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/app/index.js), which holds the necessary global application state flags and application level methods.
+It is [extended once the app loads in `index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js#L39) with  the contents of [`app/constructor`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/app/constructor.js) and [`app/cache`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/app/cache.js).
+This means that from here on now, any file that does `require(/* path to js/app */)` is getting that populated object since calls to `require` are cached.
+
+### [js/dom/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/dom)
+
+The `js/dom` directory holds all the code interacting with the DOM (go figure 😜). 
+The code is split into:
+
+- "static" methods that are used everywhere (such as adding algorithm info to the DOM) and,
+- setup code which is called within the `app/constructor`, after the DOM is ready, to initialize all the elements with their contents and listeners.
+
+### [js/editor/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/editor)
+
+The `js/editor` directory holds the code to create and execute code in the ace editor.
+
+### [js/module/\*/\*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/module)
+
+The `js/module` directory holds all the tracers and the random-data-creators. 
+All the modules are exported together and then "required" inside the entry point [`js/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js) where they are [attached to the global `window` object](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js#L42) so [`eval` can use them](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/editor/executor.js#L12) when executing code in the code editor.
+
+### [js/server/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/server)
+
+The `js/server` directory holds all the code to load data from the server and utilizes promises from [RSVP.js](https://github.com/tildeio/rsvp.js/). 
+In [`js/server/ajax`](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/server/ajax) are some helper methods to make requesting from the server a little easier. 
+The main method is [`js/server/ajax/request.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/server/ajax/request.js) that is used by all other methods to call `$.ajax` with certain options and set/reset the global `isLoading` flag for every request.
+
+### [js/trace_manager/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/server/ajax)
+
+The `js/tracer_manager` directory holds the manager of tracers, which controls all the present tracers simultaneously.
+
+### [js/utils/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/utils)
+
+The `utils` directory holds a few helper methods that are used everywhere such as building the strings for algorithm and file directories.

wiki/Tracer.md

+**Tracer** is inherited by any other tracer modules.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **Tracer**((String) name)| create Tracer and set its name |
+| **_setData**(args) | set data to visualize |
+| **_clear**() | clear the tracer |
+| **_wait**() | wait for a certain amount of time |
+
+## Child Modules
+
+* [LogTracer](LogTracer)
+* [DirectedGraphTracer](DirectedGraphTracer)
+* [Array2DTracer](Array2DTracer)
+* [ChartTracer](ChartTracer)
\ No newline at end of file

wiki/UndirectedGraphTracer.md

+**UndirectedGraphTracer** inherits **[DirectedGraphTracer](DirectedGraphTracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **UndirectedGraphTracer**((String) name)| create UndirectedGraphTracer and set its name |
+| **attach**((LogTracer) logTracer)| automatically print log when visiting or leaving nodes |
+| **palette**((Object) {visited, left, default})| set colors (e.g., `{visited: 'green', left: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setTreeData**((Number[][]) tree, (Number) root) | set tree data to visualize |
+| **_setData**((Number[][]) graph) | set graph data to visualize |
+| **_visit**((Number) target, (Number) source) | visit _target_ node from _source_ node |
+| **_leave**((Number) target, (Number) source) | leave _target_ node to _source_ node |
+| **_clear**() | erase traces on the graph |
+| **_wait**() | wait for a certain amount of time |
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=UndirectedGraphTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/WeightedDirectedGraphTracer.md

+**WeightedDirectedGraphTracer** inherits **[DirectedGraphTracer](DirectedGraphTracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **WeightedDirectedGraphTracer**((String) name)| create WeightedDirectedGraphTracer and set its name |
+| **attach**((LogTracer) logTracer)| automatically print log when visiting or leaving nodes |
+| **palette**((Object) {visited, left, selected, default})| set colors (e.g., `{visited: 'green', left: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setTreeData**((Number[][]) tree, (Number) root) | set tree data to visualize |
+| **_setData**((Number[][]) graph) | set graph data to visualize |
+| **_weight**((Number) target, (Number) weight) | set weight of _target_ node |
+| **_visit**((Number) target, (Number) source, (Number) weight) | visit _target_ node from _source_ node and set weight of _target_ node |
+| **_leave**((Number) target, (Number) source, (Number) weight) | leave _target_ node to _source_ node and set weight of _target_ node |
+| **_clear**() | erase traces on the graph |
+| **_wait**() | wait for a certain amount of time |
+
+## Child Modules
+
+* [WeightedUndirectedGraphTracer](WeightedUndirectedGraphTracer)
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=WeightedDirectedGraphTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file

wiki/WeightedUndirectedGraphTracer.md

+**WeightedUndirectedGraphTracer** inherits **[WeightedDirectedGraphTracer](WeightedDirectedGraphTracer)**.
+
+## Methods
+
+| Method | Description |
+|--------|-------------|
+| **WeightedUnirectedGraphTracer**((String) name)| create WeightedUnirectedGraphTracer and set its name |
+| **attach**((LogTracer) logTracer)| automatically print log when visiting or leaving nodes |
+| **palette**((Object) {visited, left, default})| set colors (e.g., `{visited: 'green', left: '#FFA500', default: 'rgb(255,255,255)'}`) |
+| **_setTreeData**((Number[][]) tree, (Number) root) | set tree data to visualize |
+| **_setData**((Number[][]) graph) | set graph data to visualize |
+| **_weight**((Number) target, (Number) weight) | set weight of _target_ node |
+| **_visit**((Number) target, (Number) source, (Number) weight) | visit _target_ node from _source_ node and set weight of _target_ node |
+| **_leave**((Number) target, (Number) source, (Number) weight) | leave _target_ node to _source_ node and set weight of _target_ node |
+| **_clear**() | erase traces on the graph |
+| **_wait**() | wait for a certain amount of time |
+
+## Usage
+[Show examples](https://github.com/search?utf8=✓&q=WeightedUndirectedGraphTracer+repo%3Aparkjs814%2FAlgorithmVisualizer+path%3A%2Falgorithm&type=Code&ref=advsearch&l=&l=)
\ No newline at end of file