|
1 | | -# ES6 Project Update |
2 | | - |
3 | | -The project is converted to ES6 and the code is added to the [master branch](https://github.com/parkjs814/AlgorithmVisualizer/tree/master). |
4 | | -It will stay there until it reaches the same level as`gh-pages`, at which point the master branch will become the default branch. |
| 1 | +# ES6 Project |
5 | 2 |
|
6 | 3 | ## Build System |
7 | 4 |
|
8 | | -The new app uses [gulp](http://gulpjs.com/) to: |
| 5 | +Our project uses [gulp](http://gulpjs.com/) to: |
9 | 6 |
|
10 | 7 | - combine all individual modules into a single file |
11 | 8 | - transpile ES6 code to ES5 with [babel.js](http://babeljs.io/) |
|
31 | 28 |
|
32 | 29 | *Note:* Although no linter is added as of yet, the code closely follows the conventions from [Airbnb's Javascript style guide](https://github.com/airbnb/javascript) |
33 | 30 |
|
34 | | -### [js/index.js](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js) |
| 31 | +### [js/index.js](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/index.js) |
35 | 32 |
|
36 | | -The app entry point is [`js/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js). |
| 33 | +The app entry point is [`js/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/index.js). |
37 | 34 | It performs the initial application setup (loads the app when jQuery loads, loads the initial data from the server etc.) |
38 | 35 |
|
39 | | -### [js/app/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/app) |
| 36 | +### [js/app/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/app) |
40 | 37 |
|
41 | | -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. |
42 | | -It is [extended once the app loads in `index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/index.js#L30) 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). |
| 38 | +The main application object is [`js/app/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/app/index.js), which holds the necessary global application state flags and application level methods. |
| 39 | +It is [extended once the app loads in `index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/index.js#L30) with the contents of [`app/constructor`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/app/constructor.js) and [`app/cache`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/app/cache.js). |
43 | 40 | 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. |
44 | 41 |
|
45 | | -### [js/dom/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/dom) |
| 42 | +### [js/dom/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/dom) |
46 | 43 |
|
47 | 44 | The `js/dom` folder holds all the code interacting with the DOM (go figure 😜). |
48 | 45 | The code is split into: |
49 | 46 |
|
50 | 47 | - "static" methods that are used everywhere (such as adding algorithm info to the DOM) and, |
51 | 48 | - setup code which is called within the `app/constructor`, after the DOM is ready, to initialize all the elements with their contents and listeners. |
52 | 49 |
|
53 | | -### [js/editor/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/editor) |
| 50 | +### [js/editor/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/editor) |
54 | 51 |
|
55 | 52 | The `js/editor` folder holds the code to create and execute code in the ace editor. |
56 | 53 |
|
57 | | -### [js/module/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/module) |
| 54 | +### [js/module/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/module) |
58 | 55 |
|
59 | 56 | The `js/module` folder holds all the tracers and their variations and it is essentially the same as [`js/module`](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/module) on the `gh-pages` branch. |
60 | 57 | The only changes are present in `js/tracer.js` where the code is converted to ES6. |
61 | | -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#L33) so [`eval` can use them](https://github.com/parkjs814/AlgorithmVisualizer/blob/master/js/editor/executor.js#L7) when executing code in the code editor. |
| 58 | +All the modules are exported together and then "required" inside the entry point [`js/index.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/index.js) where they are [attached to the global `window` object](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/index.js#L33) so [`eval` can use them](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/editor/executor.js#L7) when executing code in the code editor. |
62 | 59 |
|
63 | | -### [js/server/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/server) |
| 60 | +### [js/server/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/server) |
64 | 61 |
|
65 | 62 | The `js/server` folder holds all the code to load data from the server and utilizes promises from [RSVP.js](https://github.com/tildeio/rsvp.js/). |
66 | | -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. |
67 | | -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. |
| 63 | +In [`js/server/ajax`](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/server/ajax) are some helper methods to make requesting from the server a little easier. |
| 64 | +The main method is [`js/server/ajax/request.js`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/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. |
68 | 65 |
|
69 | | -### [js/trace_manager/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/server/ajax) |
| 66 | +### [js/trace_manager/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/server/ajax) |
70 | 67 |
|
71 | 68 | The `js/tracer_manager` folder holds the same logic as the [original `tracer_manager`](https://github.com/parkjs814/AlgorithmVisualizer/blob/gh-pages/js/tracer_manager.js) from `gh-pages` branch converted to ES6 and split into modules based on functionality. |
72 | 69 |
|
73 | | -### [js/utils/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/master/js/utils) |
| 70 | +### [js/utils/*.js](https://github.com/parkjs814/AlgorithmVisualizer/tree/gh-pages/js/utils) |
74 | 71 |
|
75 | 72 | The `utils` folder holds a few helper methods that are used everywhere such as building the strings for algorithm and file directories. |
76 | | - |
77 | | -## Remaining updates |
78 | | - |
79 | | -- Any algorithms added since ES6 updates were pushed to master. |
80 | | -- The following pull-request code is still missing from the ES6 project and needs to be added before a full project update can be made: |
81 | | - |
82 | | - - https://github.com/parkjs814/AlgorithmVisualizer/pull/97 |
83 | | - - https://github.com/parkjs814/AlgorithmVisualizer/pull/101 |
84 | | - - https://github.com/parkjs814/AlgorithmVisualizer/pull/102 |
0 commit comments