├── app ├── views │ ├── footer.html │ ├── error.html │ ├── canvas_03_12.html │ ├── canvas_03_10.html │ ├── canvas_03_11.html │ ├── canvas_03_07.html │ ├── canvas_03_09.html │ ├── canvas_03_08.html │ ├── canvas_03_03.html │ ├── canvas_03_02.html │ ├── canvas_03_05.html │ ├── canvas_03_04.html │ ├── canvas_03_06.html │ ├── canvas_03_01.html │ ├── canvas_01_01.html │ ├── canvas_02_01.html │ ├── canvas_01_02.html │ └── index.html ├── public │ ├── semantic │ │ └── dist │ │ │ ├── themes │ │ │ ├── basic │ │ │ │ └── assets │ │ │ │ │ └── fonts │ │ │ │ │ ├── icons.eot │ │ │ │ │ ├── icons.ttf │ │ │ │ │ └── icons.woff │ │ │ ├── default │ │ │ │ └── assets │ │ │ │ │ ├── fonts │ │ │ │ │ ├── icons.eot │ │ │ │ │ ├── icons.ttf │ │ │ │ │ ├── icons.woff │ │ │ │ │ └── icons.woff2 │ │ │ │ │ └── images │ │ │ │ │ └── flags.png │ │ │ ├── github │ │ │ │ └── assets │ │ │ │ │ └── fonts │ │ │ │ │ ├── octicons.ttf │ │ │ │ │ ├── octicons.woff │ │ │ │ │ └── octicons-local.ttf │ │ │ └── material │ │ │ │ └── assets │ │ │ │ └── fonts │ │ │ │ ├── icons.eot │ │ │ │ ├── icons.ttf │ │ │ │ ├── icons.woff │ │ │ │ └── icons.woff2 │ │ │ └── components │ │ │ ├── sticky.min.css │ │ │ ├── tab.min.css │ │ │ ├── breadcrumb.min.css │ │ │ ├── rail.min.css │ │ │ ├── nag.min.css │ │ │ └── sticky.css │ └── javascripts │ │ ├── 02-01-Get-PI-with-Monte-Carlo │ │ ├── main.js.map │ │ ├── main.js │ │ ├── Point.js.map │ │ ├── Point.js │ │ ├── AlgoVisHelper.js │ │ ├── AlgoVisHelper.js.map │ │ ├── Circle.js │ │ ├── Circle.js.map │ │ ├── AlgoVisualizer.js.map │ │ └── AlgoVisualizer.js │ │ ├── 01-01-A-Money-Experiment-Basics │ │ ├── main.js.map │ │ ├── main.js │ │ ├── AlgoVisHelper.js │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoVisualizer.js.map │ │ ├── AlgoVisualizer.js │ │ ├── AlgoFrame.js.map │ │ └── AlgoFrame.js │ │ ├── 01-02-A-Money-Experiment-Extends │ │ ├── main.js.map │ │ ├── main.js │ │ ├── AlgoVisHelper.js │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoVisualizer.js.map │ │ └── AlgoVisualizer.js │ │ ├── 03-01-Selection-Sort-Visualization │ │ ├── Point.js.map │ │ ├── Point.js │ │ ├── main.js │ │ ├── main.js.map │ │ ├── Circle.js │ │ ├── Circle.js.map │ │ ├── SelectionSortData.js │ │ ├── SelectionSortData.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoFrame.js.map │ │ └── AlgoVisHelper.js │ │ ├── Ant-Colony-Optimization │ │ ├── World.js.map │ │ └── World.js │ │ ├── 03-02-Insertion-Sort-Visualization │ │ ├── main.js │ │ ├── main.js.map │ │ ├── InsertionSortData.js │ │ ├── InsertionSortData.js.map │ │ ├── SelectionSortData.js │ │ ├── SelectionSortData.js.map │ │ ├── AlgoFrame.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoFrame.js │ │ └── AlgoVisHelper.js │ │ ├── 03-04-Merge-Sort-TD-Visualization │ │ ├── main.js │ │ ├── main.js.map │ │ ├── MergeSortData.js │ │ ├── MergeSortData.js.map │ │ ├── InsertionSortData.js │ │ ├── InsertionSortData.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoFrame.js.map │ │ └── AlgoVisHelper.js │ │ ├── 03-05-Merge-Sort-BU-Visualization │ │ ├── main.js │ │ ├── main.js.map │ │ ├── MergeSortData.js │ │ ├── MergeSortData.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── AlgoFrame.js.map │ │ └── AlgoVisHelper.js │ │ ├── 03-06-Quick-Sort-Visualization │ │ ├── main.js │ │ ├── main.js.map │ │ ├── MergeSortData.js │ │ ├── MergeSortData.js.map │ │ ├── QuickSortData.js │ │ ├── QuickSortData.js.map │ │ ├── AlgoVisHelper.js.map │ │ └── AlgoVisHelper.js │ │ ├── 03-08-Quick-Sort-with-Random-Pivot │ │ ├── main.js │ │ ├── main.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── QuickSortData.js │ │ └── AlgoVisHelper.js │ │ ├── 03-09-Quick-Sort-with-Identical-Array │ │ ├── main.js │ │ ├── main.js.map │ │ ├── QuickSortData.js │ │ ├── AlgoVisHelper.js.map │ │ ├── QuickSortData.js.map │ │ └── AlgoVisHelper.js │ │ ├── 03-07-Quick-Sort-with-Nearly-Ordered-Array │ │ ├── main.js │ │ ├── main.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── QuickSortData.js │ │ └── AlgoVisHelper.js │ │ └── 03-03-Insertion-Sort-with-Nearly-Ordered-Array │ │ ├── main.js │ │ ├── main.js.map │ │ ├── AlgoFrame.js.map │ │ ├── AlgoVisHelper.js.map │ │ ├── InsertionSortData.js │ │ ├── AlgoFrame.js │ │ └── AlgoVisHelper.js ├── bin │ ├── www.js │ └── www.js.map ├── app.js ├── app.js.map └── routes │ └── index.js ├── .gitignore ├── bower.json ├── process.json ├── tsconfig.json ├── src ├── public │ └── javascripts │ │ ├── 02-01-Get-PI-with-Monte-Carlo │ │ ├── main.ts │ │ ├── Point.ts │ │ ├── AlgoVisHelper.ts │ │ ├── Circle.ts │ │ └── AlgoVisualizer.ts │ │ ├── 01-01-A-Money-Experiment-Basics │ │ ├── main.ts │ │ ├── AlgoVisHelper.ts │ │ ├── AlgoVisualizer.ts │ │ └── AlgoFrame.ts │ │ ├── 01-02-A-Money-Experiment-Extends │ │ ├── main.ts │ │ ├── AlgoVisHelper.ts │ │ ├── AlgoVisualizer.ts │ │ └── AlgoFrame.ts │ │ ├── Ant-Colony-Optimization │ │ └── World.ts │ │ ├── 03-01-Selection-Sort-Visualization │ │ ├── main.ts │ │ ├── SelectionSortData.ts │ │ ├── AlgoVisHelper.ts │ │ └── AlgoFrame.ts │ │ ├── 03-02-Insertion-Sort-Visualization │ │ ├── main.ts │ │ ├── InsertionSortData.ts │ │ ├── AlgoFrame.ts │ │ └── AlgoVisHelper.ts │ │ ├── 03-04-Merge-Sort-TD-Visualization │ │ ├── main.ts │ │ ├── MergeSortData.ts │ │ ├── AlgoVisHelper.ts │ │ └── AlgoFrame.ts │ │ ├── 03-05-Merge-Sort-BU-Visualization │ │ ├── main.ts │ │ ├── MergeSortData.ts │ │ ├── AlgoVisHelper.ts │ │ └── AlgoFrame.ts │ │ ├── 03-06-Quick-Sort-Visualization │ │ ├── main.ts │ │ ├── QuickSortData.ts │ │ ├── AlgoVisHelper.ts │ │ └── AlgoFrame.ts │ │ ├── 03-08-Quick-Sort-with-Random-Pivot │ │ ├── main.ts │ │ ├── AlgoVisHelper.ts │ │ ├── QuickSortData.ts │ │ └── AlgoFrame.ts │ │ ├── 03-09-Quick-Sort-with-Identical-Array │ │ ├── main.ts │ │ ├── QuickSortData.ts │ │ ├── AlgoVisHelper.ts │ │ └── AlgoFrame.ts │ │ ├── 03-07-Quick-Sort-with-Nearly-Ordered-Array │ │ ├── main.ts │ │ ├── AlgoVisHelper.ts │ │ ├── QuickSortData.ts │ │ └── AlgoFrame.ts │ │ └── 03-03-Insertion-Sort-with-Nearly-Ordered-Array │ │ ├── main.ts │ │ ├── AlgoFrame.ts │ │ ├── AlgoVisHelper.ts │ │ └── InsertionSortData.ts ├── routes │ └── index.ts └── app.ts ├── package.json └── README.md /app/views/footer.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/* 2 | typings/* 3 | npm-debug.log 4 | .settings/* 5 | .git/* 6 | bower_components/* 7 | 8 | .idea/ 9 | .vscode/ 10 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "app", 3 | "version": "0.0.1", 4 | "ignore": [ 5 | "**/.*", 6 | "node_modules", 7 | "components" 8 | ] 9 | } 10 | -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/basic/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/basic/assets/fonts/icons.eot -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/basic/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/basic/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/basic/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/basic/assets/fonts/icons.woff -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/default/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/default/assets/fonts/icons.eot -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/default/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/default/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/default/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/default/assets/fonts/icons.woff -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/default/assets/fonts/icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/default/assets/fonts/icons.woff2 -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/default/assets/images/flags.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/default/assets/images/flags.png -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/github/assets/fonts/octicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/github/assets/fonts/octicons.ttf -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/material/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/material/assets/fonts/icons.eot -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/material/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/material/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/material/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/material/assets/fonts/icons.woff -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/github/assets/fonts/octicons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/github/assets/fonts/octicons.woff -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/material/assets/fonts/icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/material/assets/fonts/icons.woff2 -------------------------------------------------------------------------------- /app/views/error.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 | 3 |

<%= message %>

4 |

<%= error.status %>

5 | 
<%= error.stack %>
6 | 7 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/public/semantic/dist/themes/github/assets/fonts/octicons-local.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/airingursb/algorithm-lab/HEAD/app/public/semantic/dist/themes/github/assets/fonts/octicons-local.ttf -------------------------------------------------------------------------------- /process.json: -------------------------------------------------------------------------------- 1 | { 2 | "apps": [{ 3 | "name": "app", 4 | "script": "app/bin/www.js", 5 | "node_args": "--harmony", 6 | "log_date_format": "YYYY - MM - DD HH: mm Z", 7 | "env": { 8 | "NODE_ENV" : "production", 9 | "PORT": 3000 10 | } 11 | }] 12 | } -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "module": "commonjs", 5 | "removeComments": true, 6 | "sourceMap": true, 7 | "outDir": "app", 8 | "rootDir": "src", 9 | "allowJs": false 10 | }, 11 | "exclude": [ 12 | "node_modules" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /src/public/javascripts/02-01-Get-PI-with-Monte-Carlo/main.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisualizer as AlgoVisualizer_01} from './AlgoVisualizer' 2 | 3 | let containerWidth: any = document.getElementById('container').clientWidth; 4 | let sceneWidth = containerWidth - 20; 5 | 6 | let vis_01 = new AlgoVisualizer_01(sceneWidth, sceneWidth, 20000); 7 | -------------------------------------------------------------------------------- /src/public/javascripts/01-01-A-Money-Experiment-Basics/main.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisualizer as AlgoVisualizer_01} from './AlgoVisualizer' 2 | 3 | let containerWidth: any = document.getElementById('container').clientWidth; 4 | let sceneWidth = containerWidth - 20; 5 | let sceneHeight = 400; 6 | 7 | let vis_01 = new AlgoVisualizer_01(sceneWidth, sceneHeight); 8 | -------------------------------------------------------------------------------- /src/public/javascripts/01-02-A-Money-Experiment-Extends/main.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisualizer as AlgoVisualizer_01} from './AlgoVisualizer' 2 | 3 | let containerWidth: any = document.getElementById('container').clientWidth; 4 | let sceneWidth = containerWidth - 20; 5 | let sceneHeight = 800; 6 | 7 | let vis_01 = new AlgoVisualizer_01(sceneWidth, sceneHeight); 8 | -------------------------------------------------------------------------------- /src/public/javascripts/02-01-Get-PI-with-Monte-Carlo/Point.ts: -------------------------------------------------------------------------------- 1 | export class Point { 2 | private x: number; 3 | private y: number; 4 | 5 | constructor(x, y) { 6 | this.x = x; 7 | this.y = y; 8 | } 9 | 10 | public getX() { 11 | return this.x; 12 | } 13 | 14 | public getY() { 15 | return this.y; 16 | } 17 | } -------------------------------------------------------------------------------- /app/public/javascripts/02-01-Get-PI-with-Monte-Carlo/main.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"main.js","sourceRoot":"","sources":["../../../../src/public/javascripts/02-01-Get-PI-with-Monte-Carlo/main.ts"],"names":[],"mappings":";;AAAA,mDAAoE;AAEpE,IAAI,cAAc,GAAQ,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC;AAC3E,IAAI,UAAU,GAAG,cAAc,GAAG,EAAE,CAAC;AAErC,IAAI,MAAM,GAAG,IAAI,+BAAiB,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC"} -------------------------------------------------------------------------------- /app/public/javascripts/02-01-Get-PI-with-Monte-Carlo/main.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisualizer_1 = require("./AlgoVisualizer"); 4 | var containerWidth = document.getElementById('container').clientWidth; 5 | var sceneWidth = containerWidth - 20; 6 | var vis_01 = new AlgoVisualizer_1.AlgoVisualizer(sceneWidth, sceneWidth, 20000); 7 | //# sourceMappingURL=main.js.map -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/main.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"main.js","sourceRoot":"","sources":["../../../../src/public/javascripts/01-01-A-Money-Experiment-Basics/main.ts"],"names":[],"mappings":";;AAAA,mDAAoE;AAEpE,IAAI,cAAc,GAAQ,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC;AAC3E,IAAI,UAAU,GAAG,cAAc,GAAG,EAAE,CAAC;AACrC,IAAI,WAAW,GAAG,GAAG,CAAC;AAEtB,IAAI,MAAM,GAAG,IAAI,+BAAiB,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC"} -------------------------------------------------------------------------------- /app/public/javascripts/01-02-A-Money-Experiment-Extends/main.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"main.js","sourceRoot":"","sources":["../../../../src/public/javascripts/01-02-A-Money-Experiment-Extends/main.ts"],"names":[],"mappings":";;AAAA,mDAAoE;AAEpE,IAAI,cAAc,GAAQ,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC;AAC3E,IAAI,UAAU,GAAG,cAAc,GAAG,EAAE,CAAC;AACrC,IAAI,WAAW,GAAG,GAAG,CAAC;AAEtB,IAAI,MAAM,GAAG,IAAI,+BAAiB,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC"} -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/main.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisualizer_1 = require("./AlgoVisualizer"); 4 | var containerWidth = document.getElementById('container').clientWidth; 5 | var sceneWidth = containerWidth - 20; 6 | var sceneHeight = 400; 7 | var vis_01 = new AlgoVisualizer_1.AlgoVisualizer(sceneWidth, sceneHeight); 8 | //# sourceMappingURL=main.js.map -------------------------------------------------------------------------------- /app/public/javascripts/01-02-A-Money-Experiment-Extends/main.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisualizer_1 = require("./AlgoVisualizer"); 4 | var containerWidth = document.getElementById('container').clientWidth; 5 | var sceneWidth = containerWidth - 20; 6 | var sceneHeight = 800; 7 | var vis_01 = new AlgoVisualizer_1.AlgoVisualizer(sceneWidth, sceneHeight); 8 | //# sourceMappingURL=main.js.map -------------------------------------------------------------------------------- /src/public/javascripts/Ant-Colony-Optimization/World.ts: -------------------------------------------------------------------------------- 1 | import {Map} from './Map'; 2 | import {Ant} from './Ant'; 3 | 4 | 5 | export class World { 6 | 7 | private map: any; 8 | private ant: any; 9 | 10 | constructor(x, y, ant_counts, food_counts) { 11 | this.map = new Map(x,y, food_counts); 12 | for (let i =0; i { 21 | this.frame.render(this.money); 22 | for (let i = 0; i < this.money.length; i++) { 23 | let j = Math.floor(Math.random() * this.money.length); 24 | this.money[i] -= 1; 25 | this.money[j] += 1; 26 | } 27 | }, this.DELAY); 28 | } 29 | } -------------------------------------------------------------------------------- /app/views/canvas_03_12.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.12 三路快速排序
8 |
9 | 10 |

11 |
三路快速排序 Three Ways Quick Sort
12 |

13 | 14 |
15 | PREV：双路快速排序 | 完全一致 16 |
17 | NEXT：堆排序 18 |
19 | 20 |

21 | 22 | Experiment 23 |

24 | 25 |
26 | 27 |
28 | 29 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_10.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.10 双路快速排序
8 |
9 | 10 |

11 |
双路快速排序 Two Ways Quick Sort
12 |

13 | 14 |
15 | PREV：快速排序 | 随机定点 16 |
17 | NEXT：双路快速排序 | 完全一致 18 |
19 | 20 |

21 | 22 | Experiment 23 |

24 | 25 |
26 | 27 |
28 | 29 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_11.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.11 双路快速排序 | 完全一致
8 |
9 | 10 |

11 |
双路快速排序 | 完全一致 Two Ways Quick Sort
12 |

13 | 14 |
15 | PREV：双路快速排序 16 |
17 | NEXT：三路快速排序 18 |
19 | 20 |

21 | 22 | Experiment 23 |

24 | 25 |
26 | 27 |
28 | 29 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_07.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.7 快速排序 | 近乎有序
8 |
9 | 10 |

11 |
快速排序 | 近乎有序 Quick Sort
12 |

13 | 14 |

快速排序在数组近乎有序的情况下，会退化成O(n^2)的算法。

15 | 16 |
17 | PREV：快速排序 18 |
19 | NEXT：快速排序 | 随机定点 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_09.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.9 快速排序 | 完全一致
8 |
9 | 10 |

11 |
快速排序 | 完全一致 Quick Sort
12 |

13 | 14 |

快速排序在数组完全一致的情况下，会完全退化成O(n^2)的算法。

15 | 16 |
17 | PREV：快速排序 | 随机定点 18 |
19 | NEXT：双路快速排序 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_08.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.8 快速排序 | 随机定点
8 |
9 | 10 |

11 |
快速排序 | 随机定点 Quick Sort
12 |

13 | 14 |

快速排序在数组近乎有序的情况下，会退化成O(n^2)的算法。可以在Partition的过程中随机定点优化以解决。

15 | 16 |
17 | PREV：快速排序 | 近乎有序 18 |
19 | NEXT： 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /src/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoVisualizer.ts: -------------------------------------------------------------------------------- 1 | import {AlgoFrame} from './AlgoFrame' 2 | 3 | export class AlgoVisualizer { 4 | 5 | private DELAY: number = 10; 6 | private money: any; 7 | private frame: AlgoFrame; 8 | 9 | constructor(sceneWidth, sceneHeight) { 10 | this.money = []; 11 | for (let i = 0; i < 100; i++) { 12 | this.money[i] = 100; 13 | } 14 | 15 | this.frame = new AlgoFrame(sceneWidth, sceneHeight); 16 | this.run(); 17 | } 18 | 19 | private run() { 20 | setInterval(() => { 21 | this.frame.render(this.money); 22 | for (let i = 0; i < this.money.length; i++) { 23 | if (this.money[i] > 0) { 24 | let j = Math.floor(Math.random() * this.money.length); 25 | this.money[i] -= 1; 26 | this.money[j] += 1; 27 | } 28 | } 29 | }, this.DELAY); 30 | } 31 | } -------------------------------------------------------------------------------- /app/views/canvas_03_03.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.3 插入排序 | 近乎有序
8 |
9 | 10 |

11 |
插入排序 | 近乎有序 Insertion Sort
12 |

13 | 14 |

在近乎数组有序的情况下，插入排序的时间复杂度可进化成O(n)级别，因此可以用来优化其他的排序算法。

15 | 16 |
17 | PREV：插入排序 18 |
19 | NEXT：归并排序 | 自顶向下 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_02.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.2 插入排序
8 |
9 | 10 |

11 |
插入排序 Insertion Sort
12 |

13 | 14 |
15 | PREV：选择排序 16 |
17 | NEXT：插入排序 | 近乎有序 18 |
19 | 20 |

插入排序的基本操作就是将一个数据插入到已经排好序的有序数据中，从而得到一个新的、个数加一的有序数据，算法适用于少量数据的排序，时间复杂度为O(n^2)。是稳定的排序方法。

21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_05.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.5 归并排序 | 自底向上
8 |
9 | 10 |

11 |
归并排序 | 自底向上 Merge Sort BU
12 |

13 | 14 |

归并排序是建立在归并操作上的一种有效的排序算法,该算法是采用分治法（Divide and Conquer）的一个非常典型的应用。将已有序的子序列合并，得到完全有序的序列；即先使每个子序列有序，再使子序列段间有序。若将两个有序表合并成一个有序表，称为二路归并。是稳定的排序算法，时间复杂度为O(nlogn)，效率仅次于快速排序。

15 | 16 |
17 | PREV：归并排序 | 自顶向下 18 |
19 | NEXT：快速排序 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /src/public/javascripts/03-04-Merge-Sort-TD-Visualization/MergeSortData.ts: -------------------------------------------------------------------------------- 1 | export class MergeSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public mergeIndex; 7 | 8 | constructor(N: number, randomBound: number) { 9 | 10 | this.numbers = new Array(N); 11 | for (let i = 0; i < N; i++) { 12 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 13 | } 14 | } 15 | 16 | N() { 17 | return this.numbers.length; 18 | } 19 | 20 | get(index) { 21 | if (index < 0 || index >= this.numbers.length) { 22 | throw ReferenceError("Invalid index to access Sort Data."); 23 | } 24 | 25 | return this.numbers[index]; 26 | } 27 | 28 | swap(i, j) { 29 | 30 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 31 | throw ReferenceError("Invalid index to access Sort Data."); 32 | } 33 | 34 | let t = this.numbers[i]; 35 | this.numbers[i] = this.numbers[j]; 36 | this.numbers[j] = t; 37 | } 38 | 39 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-05-Merge-Sort-BU-Visualization/MergeSortData.ts: -------------------------------------------------------------------------------- 1 | export class MergeSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public mergeIndex; 7 | 8 | constructor(N: number, randomBound: number) { 9 | 10 | this.numbers = new Array(N); 11 | for (let i = 0; i < N; i++) { 12 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 13 | } 14 | } 15 | 16 | N() { 17 | return this.numbers.length; 18 | } 19 | 20 | get(index) { 21 | if (index < 0 || index >= this.numbers.length) { 22 | throw ReferenceError("Invalid index to access Sort Data."); 23 | } 24 | 25 | return this.numbers[index]; 26 | } 27 | 28 | swap(i, j) { 29 | 30 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 31 | throw ReferenceError("Invalid index to access Sort Data."); 32 | } 33 | 34 | let t = this.numbers[i]; 35 | this.numbers[i] = this.numbers[j]; 36 | this.numbers[j] = t; 37 | } 38 | 39 | } -------------------------------------------------------------------------------- /app/public/javascripts/01-02-A-Money-Experiment-Extends/AlgoVisualizer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisualizer.js","sourceRoot":"","sources":["../../../../src/public/javascripts/01-02-A-Money-Experiment-Extends/AlgoVisualizer.ts"],"names":[],"mappings":";;AAAA,yCAAqC;AAErC;IAMI,wBAAY,UAAU,EAAE,WAAW;QAJ3B,UAAK,GAAW,EAAE,CAAC;QAKvB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;QACxB,CAAC;QAED,IAAI,CAAC,KAAK,GAAG,IAAI,qBAAS,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QACpD,IAAI,CAAC,GAAG,EAAE,CAAC;IACf,CAAC;IAEO,4BAAG,GAAX;QAAA,iBASC;QARG,WAAW,CAAC;YACR,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;gBACzC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;gBACtD,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;gBACnB,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;YACvB,CAAC;QACL,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC;IACL,qBAAC;AAAD,CAAC,AA1BD,IA0BC;AA1BY,wCAAc"} -------------------------------------------------------------------------------- /app/public/semantic/dist/components/tab.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * # Semantic UI 2.2.13 - Tab 3 | * http://github.com/semantic-org/semantic-ui/ 4 | * 5 | * 6 | * Released under the MIT license 7 | * http://opensource.org/licenses/MIT 8 | * 9 | */.ui.tab{display:none}.ui.tab.active,.ui.tab.open{display:block}.ui.tab.loading{position:relative;overflow:hidden;display:block;min-height:250px}.ui.tab.loading *{position:relative!important;left:-10000px!important}.ui.tab.loading.segment:before,.ui.tab.loading:before{position:absolute;content:'';top:100px;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;border-radius:500rem;border:.2em solid rgba(0,0,0,.1)}.ui.tab.loading.segment:after,.ui.tab.loading:after{position:absolute;content:'';top:100px;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;-webkit-animation:button-spin .6s linear;animation:button-spin .6s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;border-radius:500rem;border-color:#767676 transparent transparent;border-style:solid;border-width:.2em;-webkit-box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px transparent} -------------------------------------------------------------------------------- /app/views/canvas_03_04.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.4 归并排序 | 自顶向下
8 |
9 | 10 |

11 |
归并排序 | 自顶向下 Merge Sort TD
12 |

13 | 14 |

归并排序是建立在归并操作上的一种有效的排序算法,该算法是采用分治法（Divide and Conquer）的一个非常典型的应用。将已有序的子序列合并，得到完全有序的序列；即先使每个子序列有序，再使子序列段间有序。若将两个有序表合并成一个有序表，称为二路归并。是稳定的排序算法，时间复杂度为O(nlogn)，效率仅次于快速排序。

15 | 16 |
17 | PREV：插入排序 | 近乎有序 18 |
19 | NEXT：归并排序 | 自底向上 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_03_06.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.6 快速排序
8 |
9 | 10 |

11 |
快速排序 Quick Sort
12 |

13 | 14 |

快速排序是对冒泡排序的一种改进。快速排序由C. A. R. Hoare在1962年提出。它的基本思想是：通过一趟排序将要排序的数据分割成独立的两部分，其中一部分的所有数据都比另外一部分的所有数据都要小，然后再按此方法对这两部分数据分别进行快速排序，整个排序过程可以递归进行，以此达到整个数据变成有序序列。快速排序不是一种稳定的排序算法，它是目前最有效率的排序算法，时间复杂度为O(nlogn)。

15 | 16 |
17 | PREV：归并排序 | 自底向上 18 |
19 | NEXT：快速排序 | 近乎有序 20 |
21 | 22 |

23 | 24 | Experiment 25 |

26 | 27 |
28 | 29 |
30 | 31 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/public/javascripts/01-02-A-Money-Experiment-Extends/AlgoVisualizer.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoFrame_1 = require("./AlgoFrame"); 4 | var AlgoVisualizer = (function () { 5 | function AlgoVisualizer(sceneWidth, sceneHeight) { 6 | this.DELAY = 10; 7 | this.money = []; 8 | for (var i = 0; i < 100; i++) { 9 | this.money[i] = 100; 10 | } 11 | this.frame = new AlgoFrame_1.AlgoFrame(sceneWidth, sceneHeight); 12 | this.run(); 13 | } 14 | AlgoVisualizer.prototype.run = function () { 15 | var _this = this; 16 | setInterval(function () { 17 | _this.frame.render(_this.money); 18 | for (var i = 0; i < _this.money.length; i++) { 19 | var j = Math.floor(Math.random() * _this.money.length); 20 | _this.money[i] -= 1; 21 | _this.money[j] += 1; 22 | } 23 | }, this.DELAY); 24 | }; 25 | return AlgoVisualizer; 26 | }()); 27 | exports.AlgoVisualizer = AlgoVisualizer; 28 | //# sourceMappingURL=AlgoVisualizer.js.map -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoVisualizer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisualizer.js","sourceRoot":"","sources":["../../../../src/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoVisualizer.ts"],"names":[],"mappings":";;AAAA,yCAAqC;AAErC;IAMI,wBAAY,UAAU,EAAE,WAAW;QAJ3B,UAAK,GAAW,EAAE,CAAC;QAKvB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;QACxB,CAAC;QAED,IAAI,CAAC,KAAK,GAAG,IAAI,qBAAS,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QACpD,IAAI,CAAC,GAAG,EAAE,CAAC;IACf,CAAC;IAEO,4BAAG,GAAX;QAAA,iBAWC;QAVG,WAAW,CAAC;YACR,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;gBACzC,EAAE,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;oBACpB,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;oBACtD,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;oBACnB,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;gBACvB,CAAC;YACL,CAAC;QACL,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC;IACL,qBAAC;AAAD,CAAC,AA5BD,IA4BC;AA5BY,wCAAc"} -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoVisualizer.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoFrame_1 = require("./AlgoFrame"); 4 | var AlgoVisualizer = (function () { 5 | function AlgoVisualizer(sceneWidth, sceneHeight) { 6 | this.DELAY = 10; 7 | this.money = []; 8 | for (var i = 0; i < 100; i++) { 9 | this.money[i] = 100; 10 | } 11 | this.frame = new AlgoFrame_1.AlgoFrame(sceneWidth, sceneHeight); 12 | this.run(); 13 | } 14 | AlgoVisualizer.prototype.run = function () { 15 | var _this = this; 16 | setInterval(function () { 17 | _this.frame.render(_this.money); 18 | for (var i = 0; i < _this.money.length; i++) { 19 | if (_this.money[i] > 0) { 20 | var j = Math.floor(Math.random() * _this.money.length); 21 | _this.money[i] -= 1; 22 | _this.money[j] += 1; 23 | } 24 | } 25 | }, this.DELAY); 26 | }; 27 | return AlgoVisualizer; 28 | }()); 29 | exports.AlgoVisualizer = AlgoVisualizer; 30 | //# sourceMappingURL=AlgoVisualizer.js.map -------------------------------------------------------------------------------- /app/public/semantic/dist/components/breadcrumb.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * # Semantic UI 2.2.13 - Breadcrumb 3 | * http://github.com/semantic-org/semantic-ui/ 4 | * 5 | * 6 | * Released under the MIT license 7 | * http://opensource.org/licenses/MIT 8 | * 9 | */.ui.breadcrumb{line-height:1;display:inline-block;margin:0 0;vertical-align:middle}.ui.breadcrumb:first-child{margin-top:0}.ui.breadcrumb:last-child{margin-bottom:0}.ui.breadcrumb .divider{display:inline-block;opacity:.7;margin:0 .21428571rem 0;font-size:.92857143em;color:rgba(0,0,0,.4);vertical-align:baseline}.ui.breadcrumb a{color:#4183c4}.ui.breadcrumb a:hover{color:#1e70bf}.ui.breadcrumb .icon.divider{font-size:.85714286em;vertical-align:baseline}.ui.breadcrumb a.section{cursor:pointer}.ui.breadcrumb .section{display:inline-block;margin:0;padding:0}.ui.breadcrumb.segment{display:inline-block;padding:.78571429em 1em}.ui.breadcrumb .active.section{font-weight:700}.ui.mini.breadcrumb{font-size:.78571429rem}.ui.tiny.breadcrumb{font-size:.85714286rem}.ui.small.breadcrumb{font-size:.92857143rem}.ui.breadcrumb{font-size:1rem}.ui.large.breadcrumb{font-size:1.14285714rem}.ui.big.breadcrumb{font-size:1.28571429rem}.ui.huge.breadcrumb{font-size:1.42857143rem}.ui.massive.breadcrumb{font-size:1.71428571rem} -------------------------------------------------------------------------------- /src/public/javascripts/02-01-Get-PI-with-Monte-Carlo/AlgoVisualizer.ts: -------------------------------------------------------------------------------- 1 | import {AlgoFrame} from './AlgoFrame' 2 | import {Circle} from './Circle' 3 | import {Point} from './Point' 4 | 5 | export class AlgoVisualizer { 6 | 7 | private DELAY: number = 200; 8 | 9 | private circle: Circle; 10 | private points: any; 11 | 12 | private frame: AlgoFrame; 13 | private N: number; 14 | 15 | constructor(sceneWidth, sceneHeight, N) { 16 | 17 | this.N = N; 18 | this.circle = new Circle(sceneWidth / 2, sceneHeight / 2, sceneWidth / 2); 19 | 20 | this.points = []; 21 | 22 | this.frame = new AlgoFrame(sceneWidth, sceneHeight); 23 | this.run(); 24 | } 25 | 26 | private run() { 27 | let i = 0; 28 | setInterval(() => { 29 | if (i < this.N) { 30 | let x = Math.floor(Math.random() * this.frame.getCanvasWidth()); 31 | let y = Math.floor(Math.random() * this.frame.getCanvasHeight()); 32 | let p: Point = new Point(x, y); 33 | this.points.push(p); 34 | this.frame.render(this.circle, this.points); 35 | i++ 36 | } 37 | }, this.DELAY); 38 | 39 | } 40 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-02-Insertion-Sort-Visualization/InsertionSortData.ts: -------------------------------------------------------------------------------- 1 | export class InsertionSortData { 2 | 3 | public numbers; 4 | public orderedIndex; 5 | public currentIndex; 6 | 7 | constructor(N: number, randomBound: number) { 8 | 9 | this.numbers = new Array(N); 10 | this.orderedIndex = -1; // [0...orderedIndex) 是有序的 11 | this.currentIndex = -1; // 当前正在比较的元素索引 12 | 13 | for (let i = 0; i < N; i++) { 14 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 15 | } 16 | } 17 | 18 | N() { 19 | return this.numbers.length; 20 | } 21 | 22 | get(index) { 23 | if (index < 0 || index >= this.numbers.length) { 24 | throw ReferenceError("Invalid index to access Sort Data."); 25 | } 26 | 27 | return this.numbers[index]; 28 | } 29 | 30 | swap(i, j) { 31 | 32 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 33 | throw ReferenceError("Invalid index to access Sort Data."); 34 | } 35 | 36 | let t = this.numbers[i]; 37 | this.numbers[i] = this.numbers[j]; 38 | this.numbers[j] = t; 39 | } 40 | 41 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-06-Quick-Sort-Visualization/QuickSortData.ts: -------------------------------------------------------------------------------- 1 | export class QuickSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public fixedPivots; 7 | public curPivot; 8 | public curElement; 9 | 10 | constructor(N: number, randomBound: number) { 11 | 12 | this.numbers = new Array(N); 13 | this.fixedPivots = new Array(N); 14 | for (let i = 0; i < N; i++) { 15 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 16 | this.fixedPivots[i] = false; 17 | } 18 | } 19 | 20 | N() { 21 | return this.numbers.length; 22 | } 23 | 24 | get(index) { 25 | if (index < 0 || index >= this.numbers.length) { 26 | throw ReferenceError("Invalid index to access Sort Data."); 27 | } 28 | 29 | return this.numbers[index]; 30 | } 31 | 32 | swap(i, j) { 33 | 34 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 35 | throw ReferenceError("Invalid index to access Sort Data."); 36 | } 37 | 38 | let t = this.numbers[i]; 39 | this.numbers[i] = this.numbers[j]; 40 | this.numbers[j] = t; 41 | } 42 | 43 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/MergeSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var MergeSortData = (function () { 4 | function MergeSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | for (var i = 0; i < N; i++) { 7 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 8 | } 9 | } 10 | MergeSortData.prototype.N = function () { 11 | return this.numbers.length; 12 | }; 13 | MergeSortData.prototype.get = function (index) { 14 | if (index < 0 || index >= this.numbers.length) { 15 | throw ReferenceError("Invalid index to access Sort Data."); 16 | } 17 | return this.numbers[index]; 18 | }; 19 | MergeSortData.prototype.swap = function (i, j) { 20 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 21 | throw ReferenceError("Invalid index to access Sort Data."); 22 | } 23 | var t = this.numbers[i]; 24 | this.numbers[i] = this.numbers[j]; 25 | this.numbers[j] = t; 26 | }; 27 | return MergeSortData; 28 | }()); 29 | exports.MergeSortData = MergeSortData; 30 | //# sourceMappingURL=MergeSortData.js.map -------------------------------------------------------------------------------- /app/views/canvas_03_01.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 3 排序算法 6 | / 7 |
3.1 选择排序
8 |
9 | 10 |

11 |
选择排序 Selection Sort
12 |

13 | 14 |

选择排序是一种简单直观的排序算法。它的工作原理是每一次从待排序的数据元素中选出最小（或最大）的一个元素，存放在序列的起始位置，直到全部待排序的数据元素排完。 选择排序是不稳定的排序方法（比如序列[5， 5， 3]第一次就将第一个[5]与[3]交换，导致第一个5挪动到第二个5后面）。它的时间复杂度为O(n^2)

15 | 16 |

参考资料

17 |
18 |
19 | 深度实战玩转算法——选择排序算法可视化 | 慕课网 20 |
21 |
22 | 23 |
24 | PREV：求解圆周率 25 |
26 | NEXT：插入排序 27 |
28 | 29 |

30 | 31 | Experiment 32 |

33 | 34 |
35 | 36 |
37 | 38 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/public/javascripts/02-01-Get-PI-with-Monte-Carlo/AlgoVisualizer.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisualizer.js","sourceRoot":"","sources":["../../../../src/public/javascripts/02-01-Get-PI-with-Monte-Carlo/AlgoVisualizer.ts"],"names":[],"mappings":";;AAAA,yCAAqC;AACrC,mCAA+B;AAC/B,iCAA6B;AAE7B;IAUI,wBAAY,UAAU,EAAE,WAAW,EAAE,CAAC;QAR9B,UAAK,GAAW,GAAG,CAAC;QAUxB,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACX,IAAI,CAAC,MAAM,GAAG,IAAI,eAAM,CAAC,UAAU,GAAG,CAAC,EAAE,WAAW,GAAG,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,CAAC;QAE1E,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC;QAEjB,IAAI,CAAC,KAAK,GAAG,IAAI,qBAAS,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QACpD,IAAI,CAAC,GAAG,EAAE,CAAC;IACf,CAAC;IAEO,4BAAG,GAAX;QAAA,iBAaC;QAZG,IAAI,CAAC,GAAG,CAAC,CAAC;QACV,WAAW,CAAC;YACR,EAAE,CAAC,CAAC,CAAC,GAAG,KAAI,CAAC,CAAC,CAAC,CAAC,CAAC;gBACb,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAI,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC;gBAChE,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC;gBACjE,IAAI,CAAC,GAAU,IAAI,aAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;gBAC/B,KAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBACpB,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAI,CAAC,MAAM,EAAE,KAAI,CAAC,MAAM,CAAC,CAAC;gBAC5C,CAAC,EAAE,CAAA;YACP,CAAC;QACL,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAEnB,CAAC;IACL,qBAAC;AAAD,CAAC,AAnCD,IAmCC;AAnCY,wCAAc"} -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/MergeSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var MergeSortData = (function () { 4 | function MergeSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | for (var i = 0; i < N; i++) { 7 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 8 | } 9 | } 10 | MergeSortData.prototype.N = function () { 11 | return this.numbers.length; 12 | }; 13 | MergeSortData.prototype.get = function (index) { 14 | if (index < 0 || index >= this.numbers.length) { 15 | throw ReferenceError("Invalid index to access Sort Data."); 16 | } 17 | return this.numbers[index]; 18 | }; 19 | MergeSortData.prototype.swap = function (i, j) { 20 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 21 | throw ReferenceError("Invalid index to access Sort Data."); 22 | } 23 | var t = this.numbers[i]; 24 | this.numbers[i] = this.numbers[j]; 25 | this.numbers[j] = t; 26 | }; 27 | return MergeSortData; 28 | }()); 29 | exports.MergeSortData = MergeSortData; 30 | //# sourceMappingURL=MergeSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-05-Merge-Sort-BU-Visualization/MergeSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var MergeSortData = (function () { 4 | function MergeSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | for (var i = 0; i < N; i++) { 7 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 8 | } 9 | } 10 | MergeSortData.prototype.N = function () { 11 | return this.numbers.length; 12 | }; 13 | MergeSortData.prototype.get = function (index) { 14 | if (index < 0 || index >= this.numbers.length) { 15 | throw ReferenceError("Invalid index to access Sort Data."); 16 | } 17 | return this.numbers[index]; 18 | }; 19 | MergeSortData.prototype.swap = function (i, j) { 20 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 21 | throw ReferenceError("Invalid index to access Sort Data."); 22 | } 23 | var t = this.numbers[i]; 24 | this.numbers[i] = this.numbers[j]; 25 | this.numbers[j] = t; 26 | }; 27 | return MergeSortData; 28 | }()); 29 | exports.MergeSortData = MergeSortData; 30 | //# sourceMappingURL=MergeSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/MergeSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"MergeSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-06-Quick-Sort-Visualization/MergeSortData.ts"],"names":[],"mappings":";;AAAA;IAOI,uBAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;QAClE,CAAC;IACL,CAAC;IAED,yBAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,2BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,4BAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,oBAAC;AAAD,CAAC,AAtCD,IAsCC;AAtCY,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/MergeSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"MergeSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-04-Merge-Sort-TD-Visualization/MergeSortData.ts"],"names":[],"mappings":";;AAAA;IAOI,uBAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;QAClE,CAAC;IACL,CAAC;IAED,yBAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,2BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,4BAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,oBAAC;AAAD,CAAC,AAtCD,IAsCC;AAtCY,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-05-Merge-Sort-BU-Visualization/MergeSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"MergeSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-05-Merge-Sort-BU-Visualization/MergeSortData.ts"],"names":[],"mappings":";;AAAA;IAOI,uBAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;QAClE,CAAC;IACL,CAAC;IAED,yBAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,2BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,4BAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,oBAAC;AAAD,CAAC,AAtCD,IAsCC;AAtCY,sCAAa"} -------------------------------------------------------------------------------- /src/public/javascripts/03-01-Selection-Sort-Visualization/SelectionSortData.ts: -------------------------------------------------------------------------------- 1 | export class SelectionSortData { 2 | 3 | public numbers; 4 | public orderedIndex; 5 | public currentCompareIndex; 6 | public currentMinIndex; 7 | 8 | constructor(N: number, randomBound: number) { 9 | 10 | this.numbers = new Array(N); 11 | this.orderedIndex = -1; // [0...orderedIndex) 是有序的 12 | this.currentCompareIndex = -1; // 当前正在比较的元素索引 13 | this.currentMinIndex = -1; // 当前找到的最小元素的索引 14 | 15 | for (let i = 0; i < N; i++) { 16 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 17 | } 18 | } 19 | 20 | N() { 21 | return this.numbers.length; 22 | } 23 | 24 | get(index) { 25 | if (index < 0 || index >= this.numbers.length) { 26 | throw ReferenceError("Invalid index to access Sort Data."); 27 | } 28 | 29 | return this.numbers[index]; 30 | } 31 | 32 | swap(i, j) { 33 | 34 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 35 | throw ReferenceError("Invalid index to access Sort Data."); 36 | } 37 | 38 | let t = this.numbers[i]; 39 | this.numbers[i] = this.numbers[j]; 40 | this.numbers[j] = t; 41 | } 42 | 43 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/QuickSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var QuickSortData = (function () { 4 | function QuickSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.fixedPivots = new Array(N); 7 | for (var i = 0; i < N; i++) { 8 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 9 | this.fixedPivots[i] = false; 10 | } 11 | } 12 | QuickSortData.prototype.N = function () { 13 | return this.numbers.length; 14 | }; 15 | QuickSortData.prototype.get = function (index) { 16 | if (index < 0 || index >= this.numbers.length) { 17 | throw ReferenceError("Invalid index to access Sort Data."); 18 | } 19 | return this.numbers[index]; 20 | }; 21 | QuickSortData.prototype.swap = function (i, j) { 22 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 23 | throw ReferenceError("Invalid index to access Sort Data."); 24 | } 25 | var t = this.numbers[i]; 26 | this.numbers[i] = this.numbers[j]; 27 | this.numbers[j] = t; 28 | }; 29 | return QuickSortData; 30 | }()); 31 | exports.QuickSortData = QuickSortData; 32 | //# sourceMappingURL=QuickSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/InsertionSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var InsertionSortData = (function () { 4 | function InsertionSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.orderedIndex = -1; 7 | this.currentIndex = -1; 8 | for (var i = 0; i < N; i++) { 9 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 10 | } 11 | } 12 | InsertionSortData.prototype.N = function () { 13 | return this.numbers.length; 14 | }; 15 | InsertionSortData.prototype.get = function (index) { 16 | if (index < 0 || index >= this.numbers.length) { 17 | throw ReferenceError("Invalid index to access Sort Data."); 18 | } 19 | return this.numbers[index]; 20 | }; 21 | InsertionSortData.prototype.swap = function (i, j) { 22 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 23 | throw ReferenceError("Invalid index to access Sort Data."); 24 | } 25 | var t = this.numbers[i]; 26 | this.numbers[i] = this.numbers[j]; 27 | this.numbers[j] = t; 28 | }; 29 | return InsertionSortData; 30 | }()); 31 | exports.InsertionSortData = InsertionSortData; 32 | //# sourceMappingURL=InsertionSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/InsertionSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var InsertionSortData = (function () { 4 | function InsertionSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.orderedIndex = -1; 7 | this.currentIndex = -1; 8 | for (var i = 0; i < N; i++) { 9 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 10 | } 11 | } 12 | InsertionSortData.prototype.N = function () { 13 | return this.numbers.length; 14 | }; 15 | InsertionSortData.prototype.get = function (index) { 16 | if (index < 0 || index >= this.numbers.length) { 17 | throw ReferenceError("Invalid index to access Sort Data."); 18 | } 19 | return this.numbers[index]; 20 | }; 21 | InsertionSortData.prototype.swap = function (i, j) { 22 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 23 | throw ReferenceError("Invalid index to access Sort Data."); 24 | } 25 | var t = this.numbers[i]; 26 | this.numbers[i] = this.numbers[j]; 27 | this.numbers[j] = t; 28 | }; 29 | return InsertionSortData; 30 | }()); 31 | exports.InsertionSortData = InsertionSortData; 32 | //# sourceMappingURL=InsertionSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/02-01-Get-PI-with-Monte-Carlo/AlgoVisualizer.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoFrame_1 = require("./AlgoFrame"); 4 | var Circle_1 = require("./Circle"); 5 | var Point_1 = require("./Point"); 6 | var AlgoVisualizer = (function () { 7 | function AlgoVisualizer(sceneWidth, sceneHeight, N) { 8 | this.DELAY = 200; 9 | this.N = N; 10 | this.circle = new Circle_1.Circle(sceneWidth / 2, sceneHeight / 2, sceneWidth / 2); 11 | this.points = []; 12 | this.frame = new AlgoFrame_1.AlgoFrame(sceneWidth, sceneHeight); 13 | this.run(); 14 | } 15 | AlgoVisualizer.prototype.run = function () { 16 | var _this = this; 17 | var i = 0; 18 | setInterval(function () { 19 | if (i < _this.N) { 20 | var x = Math.floor(Math.random() * _this.frame.getCanvasWidth()); 21 | var y = Math.floor(Math.random() * _this.frame.getCanvasHeight()); 22 | var p = new Point_1.Point(x, y); 23 | _this.points.push(p); 24 | _this.frame.render(_this.circle, _this.points); 25 | i++; 26 | } 27 | }, this.DELAY); 28 | }; 29 | return AlgoVisualizer; 30 | }()); 31 | exports.AlgoVisualizer = AlgoVisualizer; 32 | //# sourceMappingURL=AlgoVisualizer.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/QuickSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"QuickSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-06-Quick-Sort-Visualization/QuickSortData.ts"],"names":[],"mappings":";;AAAA;IASI,uBAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,WAAW,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAChC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;YAC9D,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;QAChC,CAAC;IACL,CAAC;IAED,yBAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,2BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,4BAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,oBAAC;AAAD,CAAC,AA1CD,IA0CC;AA1CY,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/InsertionSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"InsertionSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-02-Insertion-Sort-Visualization/InsertionSortData.ts"],"names":[],"mappings":";;AAAA;IAMI,2BAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QAEvB,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC;QACpE,CAAC;IACL,CAAC;IAED,6BAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,+BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,gCAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,wBAAC;AAAD,CAAC,AAxCD,IAwCC;AAxCY,8CAAiB"} -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/InsertionSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"InsertionSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-04-Merge-Sort-TD-Visualization/InsertionSortData.ts"],"names":[],"mappings":";;AAAA;IAMI,2BAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QAEvB,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC;QACpE,CAAC;IACL,CAAC;IAED,6BAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,+BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,gCAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,wBAAC;AAAD,CAAC,AAxCD,IAwCC;AAxCY,8CAAiB"} -------------------------------------------------------------------------------- /app/bin/www.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var app_1 = require("../app"); 4 | var http = require("http"); 5 | var port = normalizePort(process.env.PORT || 9009); 6 | app_1.default.set('port', port); 7 | var server = http.createServer(app_1.default); 8 | server.listen(port, onListening); 9 | server.on('error', onError); 10 | function normalizePort(val) { 11 | var port = parseInt(val, 10); 12 | if (isNaN(port)) { 13 | return val; 14 | } 15 | if (port >= 0) { 16 | return port; 17 | } 18 | return false; 19 | } 20 | function onError(error) { 21 | if (error.syscall != 'listen') { 22 | throw error; 23 | } 24 | var bind = typeof port === 'string' ? 'Pipe ' + port : 'Port ' + port; 25 | switch (error.code) { 26 | case 'EACCES': 27 | console.error(bind + 'requires elevated privileges'); 28 | process.exit(1); 29 | break; 30 | case 'EADDRINUSE': 31 | console.error(bind + 'is already in use'); 32 | process.exit(1); 33 | break; 34 | default: 35 | throw error; 36 | } 37 | } 38 | function onListening() { 39 | var addr = server.address(); 40 | var bind = typeof addr === 'string' ? 'pipe ' + addr : 'port ' + addr.port; 41 | console.log('Listening on ' + bind); 42 | } 43 | //# sourceMappingURL=www.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-01-Selection-Sort-Visualization/SelectionSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var SelectionSortData = (function () { 4 | function SelectionSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.orderedIndex = -1; 7 | this.currentCompareIndex = -1; 8 | this.currentMinIndex = -1; 9 | for (var i = 0; i < N; i++) { 10 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 11 | } 12 | } 13 | SelectionSortData.prototype.N = function () { 14 | return this.numbers.length; 15 | }; 16 | SelectionSortData.prototype.get = function (index) { 17 | if (index < 0 || index >= this.numbers.length) { 18 | throw ReferenceError("Invalid index to access Sort Data."); 19 | } 20 | return this.numbers[index]; 21 | }; 22 | SelectionSortData.prototype.swap = function (i, j) { 23 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 24 | throw ReferenceError("Invalid index to access Sort Data."); 25 | } 26 | var t = this.numbers[i]; 27 | this.numbers[i] = this.numbers[j]; 28 | this.numbers[j] = t; 29 | }; 30 | return SelectionSortData; 31 | }()); 32 | exports.SelectionSortData = SelectionSortData; 33 | //# sourceMappingURL=SelectionSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/SelectionSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var SelectionSortData = (function () { 4 | function SelectionSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.orderedIndex = -1; 7 | this.currentCompareIndex = -1; 8 | this.currentMinIndex = -1; 9 | for (var i = 0; i < N; i++) { 10 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 11 | } 12 | } 13 | SelectionSortData.prototype.N = function () { 14 | return this.numbers.length; 15 | }; 16 | SelectionSortData.prototype.get = function (index) { 17 | if (index < 0 || index >= this.numbers.length) { 18 | throw ReferenceError("Invalid index to access Sort Data."); 19 | } 20 | return this.numbers[index]; 21 | }; 22 | SelectionSortData.prototype.swap = function (i, j) { 23 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 24 | throw ReferenceError("Invalid index to access Sort Data."); 25 | } 26 | var t = this.numbers[i]; 27 | this.numbers[i] = this.numbers[j]; 28 | this.numbers[j] = t; 29 | }; 30 | return SelectionSortData; 31 | }()); 32 | exports.SelectionSortData = SelectionSortData; 33 | //# sourceMappingURL=SelectionSortData.js.map -------------------------------------------------------------------------------- /app/bin/www.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"www.js","sourceRoot":"","sources":["../../src/bin/www.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAKb,8BAAyB;AACzB,2BAA6B;AAM7B,IAAM,IAAI,GAAG,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,CAAC;AACrD,aAAG,CAAC,GAAG,CAAC,MAAM,EAAC,IAAI,CAAC,CAAC;AAMrB,IAAI,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,aAAG,CAAC,CAAC;AAMpC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;AACjC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAC,OAAO,CAAC,CAAC;AAK3B,uBAAuB,GAAS;IAC9B,IAAI,IAAI,GAAG,QAAQ,CAAC,GAAG,EAAC,EAAE,CAAC,CAAC;IAE5B,EAAE,CAAA,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAA,CAAC;QAEd,MAAM,CAAC,GAAG,CAAC;IACb,CAAC;IAED,EAAE,CAAA,CAAC,IAAI,IAAI,CAAC,CAAC,CAAA,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC;IACd,CAAC;IAED,MAAM,CAAC,KAAK,CAAC;AACf,CAAC;AAKD,iBAAiB,KAAK;IACpB,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,IAAI,QAAQ,CAAC,CAAC,CAAC;QAC9B,MAAM,KAAK,CAAC;IACd,CAAC;IAED,IAAI,IAAI,GAAG,OAAO,IAAI,KAAK,QAAQ,GAAG,OAAO,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC;IAGtE,MAAM,CAAA,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;QAClB,KAAK,QAAQ;YACX,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,8BAA8B,CAAC,CAAC;YACrD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAChB,KAAK,CAAC;QACR,KAAK,YAAY;YACf,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,mBAAmB,CAAC,CAAC;YAC1C,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAChB,KAAK,CAAC;QACR;YACE,MAAM,KAAK,CAAC;IAChB,CAAC;AACH,CAAC;AAKD;IACE,IAAI,IAAI,GAAG,MAAM,CAAC,OAAO,EAAE,CAAC;IAC5B,IAAI,IAAI,GAAG,OAAO,IAAI,KAAK,QAAQ,GAAG,OAAO,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;IAC3E,OAAO,CAAC,GAAG,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;AACtC,CAAC"} -------------------------------------------------------------------------------- /app/public/javascripts/03-01-Selection-Sort-Visualization/SelectionSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"SelectionSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-01-Selection-Sort-Visualization/SelectionSortData.ts"],"names":[],"mappings":";;AAAA;IAOI,2BAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QACvB,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;QAE1B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC;QACpE,CAAC;IACL,CAAC;IAED,6BAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,+BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,gCAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,wBAAC;AAAD,CAAC,AA1CD,IA0CC;AA1CY,8CAAiB"} -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/SelectionSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"SelectionSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-02-Insertion-Sort-Visualization/SelectionSortData.ts"],"names":[],"mappings":";;AAAA;IAOI,2BAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;QACvB,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;QAE1B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC;QACpE,CAAC;IACL,CAAC;IAED,6BAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,+BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,gCAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,wBAAC;AAAD,CAAC,AA1CD,IA0CC;AA1CY,8CAAiB"} -------------------------------------------------------------------------------- /src/public/javascripts/03-09-Quick-Sort-with-Identical-Array/QuickSortData.ts: -------------------------------------------------------------------------------- 1 | export class QuickSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public fixedPivots; 7 | public curPivot; 8 | public curElement; 9 | 10 | constructor(N: number, randomBound: number) { 11 | 12 | this.numbers = new Array(N); 13 | this.fixedPivots = new Array(N); 14 | let lBound = 1; 15 | let rBound = randomBound; 16 | let avgNumber = Math.floor((lBound + rBound) / 2); 17 | lBound = avgNumber; 18 | rBound = avgNumber; 19 | 20 | for (let i = 0; i < N; i++) { 21 | this.numbers[i] = Math.floor(Math.random() * (rBound - lBound + 1)) + lBound; 22 | this.fixedPivots[i] = false; 23 | } 24 | } 25 | 26 | N() { 27 | return this.numbers.length; 28 | } 29 | 30 | get(index) { 31 | if (index < 0 || index >= this.numbers.length) { 32 | throw ReferenceError("Invalid index to access Sort Data."); 33 | } 34 | 35 | return this.numbers[index]; 36 | } 37 | 38 | swap(i, j) { 39 | 40 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 41 | throw ReferenceError("Invalid index to access Sort Data."); 42 | } 43 | 44 | let t = this.numbers[i]; 45 | this.numbers[i] = this.numbers[j]; 46 | this.numbers[j] = t; 47 | } 48 | 49 | } -------------------------------------------------------------------------------- /app/views/canvas_01_01.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 1 百人分钱问题 6 | / 7 |
1.1 百人分钱 | 不许负债
8 |
9 | 10 |

11 |
百人分钱问题
12 |

13 |

房间里有100个人，每人都有100元钱，他们在玩一个游戏。每轮游戏中，每个人都要拿出一元钱随机给另一个人，最后这100个人的财富分布是怎样的？

14 | 15 |

参考资料

16 |
17 |
18 | 该如何面对这个残酷的世界？ | 搜狐 19 |
20 |
21 | 关于100个人随机给钱的模拟实验 | 知乎 22 |
23 |
24 | 25 |
26 | PREV：主页 27 |
28 | NEXT：百人分钱 | 允许负债 29 |
30 | 31 |

32 | 33 | Experiment 34 |

35 | 36 |
37 |
38 | ROUNDS 39 |
40 |
41 | 0 42 |
43 |
44 | 45 |
46 | 47 |
48 | 49 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_02_01.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 2 蒙特卡洛算法 6 | / 7 |
2.1 求解圆周率
8 |
9 | 10 |

11 |
求解圆周率
12 |

13 | 14 |

参考资料

15 |
16 |
17 | 蒙特卡罗算法是什么？ | 知乎 18 |
19 |
20 | 21 |
22 | PREV：百人分钱 | 允许负债 23 |
24 | NEXT：选择排序 25 |
26 | 27 |

28 | 29 | Experiment 30 |

31 |
32 |
33 |
34 | PI 35 |
36 |
37 | 0 38 |
39 |
40 |
41 |
42 | Count 43 |
44 |
45 | 0 46 |
47 |
48 |
49 | 50 |
51 | 52 |
53 | 54 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/views/canvas_01_02.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 |
3 | 主页 4 | / 5 | 1 百人分钱问题 6 | / 7 |
1.2 百人分钱 | 允许负债
8 |
9 | 10 |

11 |
百人分钱问题
12 |

13 |

房间里有100个人，每人都有100元钱，他们在玩一个游戏。每轮游戏中，每个人都要拿出一元钱随机给另一个人，最后这100个人的财富分布是怎样的？

14 | 15 |

参考资料

16 |
17 |
18 | 该如何面对这个残酷的世界？ | 搜狐 19 |
20 |
21 | 关于100个人随机给钱的模拟实验 | 知乎 22 |
23 |
24 | 25 |
26 | PREV：百人分钱 | 不许负债 27 |
28 | NEXT：求解圆周率 29 |
30 | 31 |

32 | 33 | Experiment 34 |

35 | 36 |
37 |
38 | ROUNDS 39 |
40 |
41 | 0 42 |
43 |
44 | 45 |
46 | 47 |
48 | 49 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /app/public/semantic/dist/components/rail.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * # Semantic UI 2.2.13 - Rail 3 | * http://github.com/semantic-org/semantic-ui/ 4 | * 5 | * 6 | * Released under the MIT license 7 | * http://opensource.org/licenses/MIT 8 | * 9 | */.ui.rail{position:absolute;top:0;width:300px;height:100%}.ui.left.rail{left:auto;right:100%;padding:0 2rem 0 0;margin:0 2rem 0 0}.ui.right.rail{left:100%;right:auto;padding:0 0 0 2rem;margin:0 0 0 2rem}.ui.left.internal.rail{left:0;right:auto;padding:0 0 0 2rem;margin:0 0 0 2rem}.ui.right.internal.rail{left:auto;right:0;padding:0 2rem 0 0;margin:0 2rem 0 0}.ui.dividing.rail{width:302.5px}.ui.left.dividing.rail{padding:0 2.5rem 0 0;margin:0 2.5rem 0 0;border-right:1px solid rgba(34,36,38,.15)}.ui.right.dividing.rail{border-left:1px solid rgba(34,36,38,.15);padding:0 0 0 2.5rem;margin:0 0 0 2.5rem}.ui.close.rail{width:calc(300px + 1em)}.ui.close.left.rail{padding:0 1em 0 0;margin:0 1em 0 0}.ui.close.right.rail{padding:0 0 0 1em;margin:0 0 0 1em}.ui.very.close.rail{width:calc(300px + .5em)}.ui.very.close.left.rail{padding:0 .5em 0 0;margin:0 .5em 0 0}.ui.very.close.right.rail{padding:0 0 0 .5em;margin:0 0 0 .5em}.ui.attached.left.rail,.ui.attached.right.rail{padding:0;margin:0}.ui.mini.rail{font-size:.78571429rem}.ui.tiny.rail{font-size:.85714286rem}.ui.small.rail{font-size:.92857143rem}.ui.rail{font-size:1rem}.ui.large.rail{font-size:1.14285714rem}.ui.big.rail{font-size:1.28571429rem}.ui.huge.rail{font-size:1.42857143rem}.ui.massive.rail{font-size:1.71428571rem} -------------------------------------------------------------------------------- /src/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i < this.data.orderedIndex) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 33 | } else { 34 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 35 | } 36 | if (i == this.data.currentIndex) { 37 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 38 | } 39 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 40 | } 41 | } 42 | 43 | render(data) { 44 | this.data = data; 45 | this.repaint(); 46 | } 47 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame{ 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint(){ 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if(i < this.data.orderedIndex){ 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 33 | }else{ 34 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 35 | } 36 | if(i == this.data.currentIndex){ 37 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 38 | } 39 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 40 | } 41 | } 42 | 43 | render(data) { 44 | this.data = data; 45 | this.repaint(); 46 | } 47 | } -------------------------------------------------------------------------------- /app/app.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var express = require("express"); 4 | var path = require("path"); 5 | var logger = require("morgan"); 6 | var cookieParser = require("cookie-parser"); 7 | var bodyParser = require("body-parser"); 8 | var index_1 = require("./routes/index"); 9 | var ejs = require("ejs"); 10 | var app = express(); 11 | app.set('views', path.join(__dirname, 'views')); 12 | app.engine('.html', ejs.renderFile); 13 | app.set('view engine', 'html'); 14 | app.use(logger('dev')); 15 | app.use(bodyParser.json()); 16 | app.use(bodyParser.urlencoded({ extended: false })); 17 | app.use(cookieParser()); 18 | app.use(express.static(path.join(__dirname, 'public'))); 19 | app.use('/', index_1.default); 20 | app.use(function (req, res, next) { 21 | var err = new Error('Not Found'); 22 | err['status'] = 404; 23 | next(err); 24 | }); 25 | if (process.env.NODE_ENV === 'development') { 26 | app.use(function (err, req, res, next) { 27 | res.status(err['status'] || 500); 28 | res.render('error', { 29 | title: 'error', 30 | message: err.message, 31 | error: err 32 | }); 33 | }); 34 | } 35 | app.use(function (err, req, res, next) { 36 | res.status(err['status'] || 500); 37 | res.render('error', { 38 | title: 'error', 39 | message: err.message, 40 | error: {} 41 | }); 42 | }); 43 | exports.default = app; 44 | //# sourceMappingURL=app.js.map -------------------------------------------------------------------------------- /app/public/semantic/dist/components/nag.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * # Semantic UI 2.2.13 - Nag 3 | * http://github.com/semantic-org/semantic-ui/ 4 | * 5 | * 6 | * Released under the MIT license 7 | * http://opensource.org/licenses/MIT 8 | * 9 | */.ui.nag{display:none;opacity:.95;position:relative;top:0;left:0;z-index:999;min-height:0;width:100%;margin:0;padding:.75em 1em;background:#555;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.2);box-shadow:0 1px 2px 0 rgba(0,0,0,.2);font-size:1rem;text-align:center;color:rgba(0,0,0,.87);border-radius:0 0 .28571429rem .28571429rem;-webkit-transition:.2s background ease;transition:.2s background ease}a.ui.nag{cursor:pointer}.ui.nag>.title{display:inline-block;margin:0 .5em;color:#fff}.ui.nag>.close.icon{cursor:pointer;opacity:.4;position:absolute;top:50%;right:1em;font-size:1em;margin:-.5em 0 0;color:#fff;-webkit-transition:opacity .2s ease;transition:opacity .2s ease}.ui.nag:hover{background:#555;opacity:1}.ui.nag .close:hover{opacity:1}.ui.overlay.nag{position:absolute;display:block}.ui.fixed.nag{position:fixed}.ui.bottom.nag,.ui.bottom.nags{border-radius:.28571429rem .28571429rem 0 0;top:auto;bottom:0}.ui.inverted.nag,.ui.inverted.nags .nag{background-color:#f3f4f5;color:rgba(0,0,0,.85)}.ui.inverted.nag .close,.ui.inverted.nag .title,.ui.inverted.nags .nag .close,.ui.inverted.nags .nag .title{color:rgba(0,0,0,.4)}.ui.nags .nag{border-radius:0!important}.ui.nags .nag:last-child{border-radius:0 0 .28571429rem .28571429rem}.ui.bottom.nags .nag:last-child{border-radius:.28571429rem .28571429rem 0 0} -------------------------------------------------------------------------------- /app/views/index.html: -------------------------------------------------------------------------------- 1 | <%- include('./layout.html') -%> 2 | 3 |

Airing 的算法实验室

4 | 5 |
6 |
7 | 百人分钱问题 8 |
9 | 百人分钱 | 不许负债 10 | 百人分钱 | 可以负债 11 |
12 |
13 |
14 | 蒙特卡洛算法 15 |
16 | 求解圆周率 17 |
18 |
19 |
20 | 排序算法 21 |
22 | 选择排序 Selection Sort 23 | 插入排序 Insertion Sort 24 | 插入排序 | 近乎有序 Insertion Sort with Nearly Ordered Array 25 | 归并排序 | 自顶向下 Merge Sort TD 26 | 归并排序 | 自底向上 Merge Sort BU 27 | 快速排序 Quick Sort 28 | 快速排序 | 近乎有序 Quick Sort with Nearly Ordered Array 29 | 快速排序 | 随机定点 Quick Sort with Random Pivot 30 | 快速排序 | 完全一致 Quick Sort with Identical Array 31 | 双路快速排序 Two Ways Quick Sort 32 | 双路快速排序 | 完全一致 Two Ways Quick Sort with Identical Array 33 | 三路快速排序 Three Ways Quick Sort 34 |
35 |
36 |
37 | 38 | <%- include('./footer.html') -%> -------------------------------------------------------------------------------- /src/public/javascripts/03-06-Quick-Sort-Visualization/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoFrame.ts"],"names":[],"mappings":";;AACA;IASI,mBAAY,WAAW,EAAE,YAAY;QAEjC,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;QACjC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;QAEf,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;QAEhD,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;QAChD,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,WAAW,CAAC;QAChC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,YAAY,CAAC;IACtC,CAAC;IAEM,kCAAc,GAArB;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAEM,mCAAe,GAAtB;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAEM,0BAAM,GAAb,UAAc,KAAK;QACf,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IAEO,2BAAO,GAAf;QACI,IAAI,CAAC,KAAK,EAAG,CAAC;QACd,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;QACnC,IAAI,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACvC,GAAG,CAAC,SAAS,GAAG,MAAM,CAAC;QACvB,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACxD,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QAC7C,GAAG,CAAC,SAAS,GAAG,SAAS,CAAC;QAC1B,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACzC,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;QACpF,CAAC;IACL,CAAC;IACL,gBAAC;AAAD,CAAC,AA/CD,IA+CC;AA/CY,8BAAS"} -------------------------------------------------------------------------------- /src/public/javascripts/03-01-Selection-Sort-Visualization/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if (i >= this.data.l && i <= this.data.mergeIndex) { 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 40 | } 41 | 42 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 43 | } 44 | } 45 | 46 | render(data) { 47 | this.data = data; 48 | this.repaint(); 49 | } 50 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if (i >= this.data.l && i <= this.data.mergeIndex) { 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 40 | } 41 | 42 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 43 | } 44 | } 45 | 46 | render(data) { 47 | this.data = data; 48 | this.repaint(); 49 | } 50 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/QuickSortData.ts: -------------------------------------------------------------------------------- 1 | export class QuickSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public fixedPivots; 7 | public curPivot; 8 | public curElement; 9 | 10 | constructor(N: number, randomBound: number) { 11 | 12 | this.numbers = new Array(N); 13 | this.fixedPivots = new Array(N); 14 | for (let i = 0; i < N; i++) { 15 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 16 | this.fixedPivots[i] = false; 17 | } 18 | 19 | this.numbers.sort(); 20 | let swapTime = Math.floor(0.01*N); 21 | for(let i = 0 ; i < swapTime; i ++){ 22 | let a = Math.floor(Math.random()*N); 23 | let b = Math.floor(Math.random()*N); 24 | this.swap(a, b); 25 | } 26 | } 27 | 28 | N() { 29 | return this.numbers.length; 30 | } 31 | 32 | get(index) { 33 | if (index < 0 || index >= this.numbers.length) { 34 | throw ReferenceError("Invalid index to access Sort Data."); 35 | } 36 | 37 | return this.numbers[index]; 38 | } 39 | 40 | swap(i, j) { 41 | 42 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 43 | throw ReferenceError("Invalid index to access Sort Data."); 44 | } 45 | 46 | let t = this.numbers[i]; 47 | this.numbers[i] = this.numbers[j]; 48 | this.numbers[j] = t; 49 | } 50 | 51 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-09-Quick-Sort-with-Identical-Array/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.ts: -------------------------------------------------------------------------------- 1 | export class AlgoVisHelper { 2 | 3 | private constructor() { 4 | } 5 | 6 | static Red = "#F44336"; 7 | static Pink = "#E91E63"; 8 | static Purple = "#9C27B0"; 9 | static DeepPurple = "#673AB7"; 10 | static Indigo = "#3F51B5"; 11 | static Blue = "#2196F3"; 12 | static LightBlue = "#03A9F4"; 13 | static Cyan = "#00BCD4"; 14 | static Teal = "#009688"; 15 | static Green = "#4CAF50"; 16 | static LightGreen = "#8BC34A"; 17 | static Lime = "#CDDC39"; 18 | static Yellow = "#FFEB3B"; 19 | static Amber = "#FFC107"; 20 | static Orange = "#FF9800"; 21 | static DeepOrange = "#FF5722"; 22 | static Brown = "#795548"; 23 | static Grey = "#9E9E9E"; 24 | static BlueGrey = "#607D8B"; 25 | static Black = "#000000"; 26 | static White = "#FFFFFF"; 27 | 28 | public static strokeCircle(g2d, x: number, y: number, r: number) { 29 | g2d.beginPath(); 30 | g2d.arc(x, y, r, 0, 2 * Math.PI); 31 | g2d.closePath(); 32 | g2d.stroke() 33 | } 34 | 35 | public static fillCircle(g2d, x: number, y: number, r: number) { 36 | g2d.beginPath(); 37 | g2d.arc(x, y, r, 0, 2 * Math.PI); 38 | g2d.closePath(); 39 | g2d.fill() 40 | } 41 | 42 | public static fillRectangle(g2d, x, y, w, h){ 43 | g2d.fillRect(x, y, w, h); 44 | } 45 | 46 | public static setColor(g2d, color){ 47 | g2d.fillStyle = color; 48 | } 49 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/QuickSortData.ts: -------------------------------------------------------------------------------- 1 | export class QuickSortData { 2 | 3 | public numbers; 4 | public l; 5 | public r; 6 | public fixedPivots; 7 | public curPivot; 8 | public curElement; 9 | 10 | constructor(N: number, randomBound: number) { 11 | 12 | this.numbers = new Array(N); 13 | this.fixedPivots = new Array(N); 14 | for (let i = 0; i < N; i++) { 15 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 16 | this.fixedPivots[i] = false; 17 | } 18 | 19 | this.numbers.sort(); 20 | let swapTime = Math.floor(0.01*N); 21 | for(let i = 0 ; i < swapTime; i ++){ 22 | let a = Math.floor(Math.random()*N); 23 | let b = Math.floor(Math.random()*N); 24 | this.swap(a, b); 25 | } 26 | } 27 | 28 | N() { 29 | return this.numbers.length; 30 | } 31 | 32 | get(index) { 33 | if (index < 0 || index >= this.numbers.length) { 34 | throw ReferenceError("Invalid index to access Sort Data."); 35 | } 36 | 37 | return this.numbers[index]; 38 | } 39 | 40 | swap(i, j) { 41 | 42 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 43 | throw ReferenceError("Invalid index to access Sort Data."); 44 | } 45 | 46 | let t = this.numbers[i]; 47 | this.numbers[i] = this.numbers[j]; 48 | this.numbers[j] = t; 49 | } 50 | 51 | } -------------------------------------------------------------------------------- /src/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import router from "../../../routes/index"; 2 | export class AlgoFrame { 3 | 4 | private canvasWidth: number; 5 | private canvasHeight: number; 6 | money: any; 7 | canvas: any; 8 | rounds: any; 9 | count: number; 10 | 11 | constructor(canvasWidth, canvasHeight) { 12 | 13 | this.canvasWidth = canvasWidth; 14 | this.canvasHeight = canvasHeight; 15 | this.count = 0; 16 | 17 | this.rounds = document.getElementById('rounds'); 18 | 19 | this.canvas = document.getElementById('canvas'); 20 | this.canvas.width = canvasWidth; 21 | this.canvas.height = canvasHeight; 22 | } 23 | 24 | public getCanvasWidth() { 25 | return this.canvasWidth; 26 | } 27 | 28 | public getCanvasHeight() { 29 | return this.canvasHeight; 30 | } 31 | 32 | public render(money) { 33 | this.money = money; 34 | this.repaint(); 35 | } 36 | 37 | private repaint() { 38 | this.count ++; 39 | this.rounds.innerHTML = this.count; 40 | let ctx = this.canvas.getContext('2d'); 41 | ctx.fillStyle = '#fff'; 42 | ctx.fillRect(0, 0, this.canvasWidth, this.canvasHeight); 43 | let w = this.canvasWidth / this.money.length; 44 | ctx.fillStyle = '#2196F3'; 45 | for (let i = 0; i < this.money.length; i++) { 46 | ctx.fillRect(i * w + 1, this.canvasHeight - this.money[i], w - 1, this.money[i]) 47 | } 48 | } 49 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-09-Quick-Sort-with-Identical-Array/QuickSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var QuickSortData = (function () { 4 | function QuickSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.fixedPivots = new Array(N); 7 | var lBound = 1; 8 | var rBound = randomBound; 9 | var avgNumber = Math.floor((lBound + rBound) / 2); 10 | lBound = avgNumber; 11 | rBound = avgNumber; 12 | for (var i = 0; i < N; i++) { 13 | this.numbers[i] = Math.floor(Math.random() * (rBound - lBound + 1)) + lBound; 14 | this.fixedPivots[i] = false; 15 | } 16 | } 17 | QuickSortData.prototype.N = function () { 18 | return this.numbers.length; 19 | }; 20 | QuickSortData.prototype.get = function (index) { 21 | if (index < 0 || index >= this.numbers.length) { 22 | throw ReferenceError("Invalid index to access Sort Data."); 23 | } 24 | return this.numbers[index]; 25 | }; 26 | QuickSortData.prototype.swap = function (i, j) { 27 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 28 | throw ReferenceError("Invalid index to access Sort Data."); 29 | } 30 | var t = this.numbers[i]; 31 | this.numbers[i] = this.numbers[j]; 32 | this.numbers[j] = t; 33 | }; 34 | return QuickSortData; 35 | }()); 36 | exports.QuickSortData = QuickSortData; 37 | //# sourceMappingURL=QuickSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoFrame.ts"],"names":[],"mappings":";;AAAA,iDAA6C;AAE7C;IAOI,mBAAY,GAAG,EAAE,WAAW,EAAE,YAAY;QACtC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACrC,CAAC;IAED,kCAAc,GAAd;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,mCAAe,GAAf;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAED,2BAAO,GAAP;QAEI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAE9D,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;QAEzC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,EAAE,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;gBAC7B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,GAAG,CAAC,CAAC;YACxD,CAAC;YAAC,IAAI,CAAC,CAAC;gBACJ,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,IAAI,CAAC,CAAC;YACzD,CAAC;YACD,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;gBAC9B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,SAAS,CAAC,CAAC;YAC9D,CAAC;YACD,6BAAa,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAChH,CAAC;IACL,CAAC;IAED,0BAAM,GAAN,UAAO,IAAI;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IACL,gBAAC;AAAD,CAAC,AA5CD,IA4CC;AA5CY,8BAAS"} -------------------------------------------------------------------------------- /app/public/javascripts/01-01-A-Money-Experiment-Basics/AlgoFrame.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoFrame = (function () { 4 | function AlgoFrame(canvasWidth, canvasHeight) { 5 | this.canvasWidth = canvasWidth; 6 | this.canvasHeight = canvasHeight; 7 | this.count = 0; 8 | this.rounds = document.getElementById('rounds'); 9 | this.canvas = document.getElementById('canvas'); 10 | this.canvas.width = canvasWidth; 11 | this.canvas.height = canvasHeight; 12 | } 13 | AlgoFrame.prototype.getCanvasWidth = function () { 14 | return this.canvasWidth; 15 | }; 16 | AlgoFrame.prototype.getCanvasHeight = function () { 17 | return this.canvasHeight; 18 | }; 19 | AlgoFrame.prototype.render = function (money) { 20 | this.money = money; 21 | this.repaint(); 22 | }; 23 | AlgoFrame.prototype.repaint = function () { 24 | this.count++; 25 | this.rounds.innerHTML = this.count; 26 | var ctx = this.canvas.getContext('2d'); 27 | ctx.fillStyle = '#fff'; 28 | ctx.fillRect(0, 0, this.canvasWidth, this.canvasHeight); 29 | var w = this.canvasWidth / this.money.length; 30 | ctx.fillStyle = '#2196F3'; 31 | for (var i = 0; i < this.money.length; i++) { 32 | ctx.fillRect(i * w + 1, this.canvasHeight - this.money[i], w - 1, this.money[i]); 33 | } 34 | }; 35 | return AlgoFrame; 36 | }()); 37 | exports.AlgoFrame = AlgoFrame; 38 | //# sourceMappingURL=AlgoFrame.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-06-Quick-Sort-Visualization/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-01-Selection-Sort-Visualization/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-01-Selection-Sort-Visualization/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/semantic/dist/components/sticky.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * # Semantic UI 2.2.13 - Sticky 3 | * http://github.com/semantic-org/semantic-ui/ 4 | * 5 | * 6 | * Released under the MIT license 7 | * http://opensource.org/licenses/MIT 8 | * 9 | */ 10 | 11 | 12 | /******************************* 13 | Sticky 14 | *******************************/ 15 | 16 | .ui.sticky { 17 | position: static; 18 | -webkit-transition: none; 19 | transition: none; 20 | z-index: 800; 21 | } 22 | 23 | 24 | /******************************* 25 | States 26 | *******************************/ 27 | 28 | 29 | /* Bound */ 30 | .ui.sticky.bound { 31 | position: absolute; 32 | left: auto; 33 | right: auto; 34 | } 35 | 36 | /* Fixed */ 37 | .ui.sticky.fixed { 38 | position: fixed; 39 | left: auto; 40 | right: auto; 41 | } 42 | 43 | /* Bound/Fixed Position */ 44 | .ui.sticky.bound.top, 45 | .ui.sticky.fixed.top { 46 | top: 0px; 47 | bottom: auto; 48 | } 49 | .ui.sticky.bound.bottom, 50 | .ui.sticky.fixed.bottom { 51 | top: auto; 52 | bottom: 0px; 53 | } 54 | 55 | 56 | /******************************* 57 | Types 58 | *******************************/ 59 | 60 | .ui.native.sticky { 61 | position: -webkit-sticky; 62 | position: -moz-sticky; 63 | position: -ms-sticky; 64 | position: -o-sticky; 65 | position: sticky; 66 | } 67 | 68 | 69 | /******************************* 70 | Theme Overrides 71 | *******************************/ 72 | 73 | 74 | 75 | /******************************* 76 | Site Overrides 77 | *******************************/ 78 | 79 | -------------------------------------------------------------------------------- /app/public/javascripts/03-09-Quick-Sort-with-Identical-Array/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-09-Quick-Sort-with-Identical-Array/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /app/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoFrame.ts"],"names":[],"mappings":";;AAAA,iDAA6C;AAE7C;IAOI,mBAAY,GAAG,EAAE,WAAW,EAAE,YAAY;QACtC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACrC,CAAC;IAED,kCAAc,GAAd;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,mCAAe,GAAf;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAED,2BAAO,GAAP;QAEI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAE9D,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;QAEzC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,EAAE,CAAA,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA,CAAC;gBAC3B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,GAAG,CAAC,CAAC;YACxD,CAAC;YAAA,IAAI,CAAA,CAAC;gBACF,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,IAAI,CAAC,CAAC;YACzD,CAAC;YACD,EAAE,CAAA,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA,CAAC;gBAC5B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,SAAS,CAAC,CAAC;YAC9D,CAAC;YACD,6BAAa,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAChH,CAAC;IACL,CAAC;IAED,0BAAM,GAAN,UAAO,IAAI;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IACL,gBAAC;AAAD,CAAC,AA5CD,IA4CC;AA5CY,8BAAS"} -------------------------------------------------------------------------------- /app/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /src/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/InsertionSortData.ts: -------------------------------------------------------------------------------- 1 | export class InsertionSortData { 2 | 3 | public numbers; 4 | public orderedIndex; 5 | public currentIndex; 6 | 7 | constructor(N: number, randomBound: number) { 8 | 9 | this.numbers = new Array(N); 10 | this.orderedIndex = -1; // [0...orderedIndex) 是有序的 11 | this.currentIndex = -1; // 当前正在比较的元素索引 12 | 13 | for (let i = 0; i < N; i++) { 14 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 15 | } 16 | 17 | this.numbers.sort(function (a, b) { 18 | return a - b 19 | }); 20 | let swapTime = Math.floor(0.02 * N); 21 | for (let i = 0; i < swapTime; i++) { 22 | let a = Math.floor(Math.random() * N); 23 | let b = Math.floor(Math.random() * N); 24 | this.swap(a, b); 25 | } 26 | 27 | } 28 | 29 | N() { 30 | return this.numbers.length; 31 | } 32 | 33 | get(index) { 34 | if (index < 0 || index >= this.numbers.length) { 35 | throw ReferenceError("Invalid index to access Sort Data."); 36 | } 37 | 38 | return this.numbers[index]; 39 | } 40 | 41 | swap(i, j) { 42 | 43 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 44 | throw ReferenceError("Invalid index to access Sort Data."); 45 | } 46 | 47 | let t = this.numbers[i]; 48 | this.numbers[i] = this.numbers[j]; 49 | this.numbers[j] = t; 50 | } 51 | 52 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoVisHelper.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.ts"],"names":[],"mappings":";;AAAA;IAEI;IACA,CAAC;IAwBa,0BAAY,GAA1B,UAA2B,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QAC3D,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,MAAM,EAAE,CAAA;IAChB,CAAC;IAEa,wBAAU,GAAxB,UAAyB,GAAG,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;QACzD,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;QACjC,GAAG,CAAC,SAAS,EAAE,CAAC;QAChB,GAAG,CAAC,IAAI,EAAE,CAAA;IACd,CAAC;IAEa,2BAAa,GAA3B,UAA4B,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QACvC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC;IAEa,sBAAQ,GAAtB,UAAuB,GAAG,EAAE,KAAK;QAC7B,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC;IAC1B,CAAC;IACL,oBAAC;AAAD,CAAC,AAhDD;AAKW,iBAAG,GAAG,SAAS,CAAC;AAChB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,oBAAM,GAAG,SAAS,CAAC;AACnB,kBAAI,GAAG,SAAS,CAAC;AACjB,uBAAS,GAAG,SAAS,CAAC;AACtB,kBAAI,GAAG,SAAS,CAAC;AACjB,kBAAI,GAAG,SAAS,CAAC;AACjB,mBAAK,GAAG,SAAS,CAAC;AAClB,wBAAU,GAAG,SAAS,CAAC;AACvB,kBAAI,GAAG,SAAS,CAAC;AACjB,oBAAM,GAAG,SAAS,CAAC;AACnB,mBAAK,GAAG,SAAS,CAAC;AAClB,oBAAM,GAAG,SAAS,CAAC;AACnB,wBAAU,GAAG,SAAS,CAAC;AACvB,mBAAK,GAAG,SAAS,CAAC;AAClB,kBAAI,GAAG,SAAS,CAAC;AACjB,sBAAQ,GAAG,SAAS,CAAC;AACrB,mBAAK,GAAG,SAAS,CAAC;AAClB,mBAAK,GAAG,SAAS,CAAC;AAzBhB,sCAAa"} -------------------------------------------------------------------------------- /src/public/javascripts/03-01-Selection-Sort-Visualization/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame{ 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint(){ 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if(i < this.data.orderedIndex){ 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 33 | }else{ 34 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 35 | } 36 | if(i == this.data.currentCompareIndex){ 37 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 38 | } 39 | if(i == this.data.currentMinIndex){ 40 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Indigo); 41 | } 42 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 43 | } 44 | } 45 | 46 | render(data) { 47 | this.data = data; 48 | this.repaint(); 49 | } 50 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-09-Quick-Sort-with-Identical-Array/QuickSortData.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"QuickSortData.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-09-Quick-Sort-with-Identical-Array/QuickSortData.ts"],"names":[],"mappings":";;AAAA;IASI,uBAAY,CAAS,EAAE,WAAmB;QAEtC,IAAI,CAAC,OAAO,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,WAAW,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;QAChC,IAAI,MAAM,GAAG,CAAC,CAAC;QACf,IAAI,MAAM,GAAG,WAAW,CAAC;QACzB,IAAI,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;QAClD,MAAM,GAAG,SAAS,CAAC;QACnB,MAAM,GAAG,SAAS,CAAC;QAEnB,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;YAC7E,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;QAChC,CAAC;IACL,CAAC;IAED,yBAAC,GAAD;QACI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED,2BAAG,GAAH,UAAI,KAAK;QACL,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YAC5C,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,4BAAI,GAAJ,UAAK,CAAC,EAAE,CAAC;QAEL,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;YACzE,MAAM,cAAc,CAAC,oCAAoC,CAAC,CAAC;QAC/D,CAAC;QAED,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC;IAEL,oBAAC;AAAD,CAAC,AAhDD,IAgDC;AAhDY,sCAAa"} -------------------------------------------------------------------------------- /app/app.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"app.js","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,iCAAmC;AACnC,2BAA6B;AAE7B,+BAAiC;AACjC,4CAA8C;AAC9C,wCAA0C;AAC1C,wCAAmC;AACnC,yBAA2B;AAE3B,IAAM,GAAG,GAAoB,OAAO,EAAE,CAAC;AAIvC,GAAG,CAAC,GAAG,CAAC,OAAO,EAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAC,OAAO,CAAC,CAAC,CAAC;AAC9C,GAAG,CAAC,MAAM,CAAC,OAAO,EAAC,GAAG,CAAC,UAAU,CAAC,CAAC;AACnC,GAAG,CAAC,GAAG,CAAC,aAAa,EAAC,MAAM,CAAC,CAAC;AAI9B,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AACvB,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,CAAC;AAC3B,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,UAAU,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,CAAC,CAAC,CAAC;AAClD,GAAG,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC;AACxB,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;AAEvD,GAAG,CAAC,GAAG,CAAC,GAAG,EAAC,eAAK,CAAC,CAAC;AAGnB,GAAG,CAAC,GAAG,CAAC,UAAC,GAAG,EAAC,GAAG,EAAC,IAAI;IACnB,IAAI,GAAG,GAAG,IAAI,KAAK,CAAC,WAAW,CAAC,CAAC;IACjC,GAAG,CAAC,QAAQ,CAAC,GAAG,GAAG,CAAC;IACpB,IAAI,CAAC,GAAG,CAAC,CAAC;AACZ,CAAC,CAAC,CAAC;AAMH,EAAE,CAAA,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,CAAC,CAAC,CAAC;IAC1C,GAAG,CAAC,GAAG,CAAC,UAAC,GAAU,EAAC,GAAG,EAAC,GAAG,EAAC,IAAI;QAC9B,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,GAAG,CAAC,CAAC;QACjC,GAAG,CAAC,MAAM,CAAC,OAAO,EAAC;YACjB,KAAK,EAAE,OAAO;YACd,OAAO,EAAE,GAAG,CAAC,OAAO;YACpB,KAAK,EAAE,GAAG;SACX,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC;AAID,GAAG,CAAC,GAAG,CAAC,UAAC,GAAU,EAAC,GAAG,EAAC,GAAG,EAAC,IAAI;IAC9B,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,GAAG,CAAC,CAAC;IACjC,GAAG,CAAC,MAAM,CAAC,OAAO,EAAC;QACjB,KAAK,EAAE,OAAO;QACd,OAAO,EAAE,GAAG,CAAC,OAAO;QACpB,KAAK,EAAE,EAAE;KACV,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,kBAAe,GAAG,CAAC"} -------------------------------------------------------------------------------- /app/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/QuickSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var QuickSortData = (function () { 4 | function QuickSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.fixedPivots = new Array(N); 7 | for (var i = 0; i < N; i++) { 8 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 9 | this.fixedPivots[i] = false; 10 | } 11 | this.numbers.sort(); 12 | var swapTime = Math.floor(0.01 * N); 13 | for (var i = 0; i < swapTime; i++) { 14 | var a = Math.floor(Math.random() * N); 15 | var b = Math.floor(Math.random() * N); 16 | this.swap(a, b); 17 | } 18 | } 19 | QuickSortData.prototype.N = function () { 20 | return this.numbers.length; 21 | }; 22 | QuickSortData.prototype.get = function (index) { 23 | if (index < 0 || index >= this.numbers.length) { 24 | throw ReferenceError("Invalid index to access Sort Data."); 25 | } 26 | return this.numbers[index]; 27 | }; 28 | QuickSortData.prototype.swap = function (i, j) { 29 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 30 | throw ReferenceError("Invalid index to access Sort Data."); 31 | } 32 | var t = this.numbers[i]; 33 | this.numbers[i] = this.numbers[j]; 34 | this.numbers[j] = t; 35 | }; 36 | return QuickSortData; 37 | }()); 38 | exports.QuickSortData = QuickSortData; 39 | //# sourceMappingURL=QuickSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/QuickSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var QuickSortData = (function () { 4 | function QuickSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.fixedPivots = new Array(N); 7 | for (var i = 0; i < N; i++) { 8 | this.numbers[i] = Math.floor(Math.random() * randomBound) + 1; 9 | this.fixedPivots[i] = false; 10 | } 11 | this.numbers.sort(); 12 | var swapTime = Math.floor(0.01 * N); 13 | for (var i = 0; i < swapTime; i++) { 14 | var a = Math.floor(Math.random() * N); 15 | var b = Math.floor(Math.random() * N); 16 | this.swap(a, b); 17 | } 18 | } 19 | QuickSortData.prototype.N = function () { 20 | return this.numbers.length; 21 | }; 22 | QuickSortData.prototype.get = function (index) { 23 | if (index < 0 || index >= this.numbers.length) { 24 | throw ReferenceError("Invalid index to access Sort Data."); 25 | } 26 | return this.numbers[index]; 27 | }; 28 | QuickSortData.prototype.swap = function (i, j) { 29 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 30 | throw ReferenceError("Invalid index to access Sort Data."); 31 | } 32 | var t = this.numbers[i]; 33 | this.numbers[i] = this.numbers[j]; 34 | this.numbers[j] = t; 35 | }; 36 | return QuickSortData; 37 | }()); 38 | exports.QuickSortData = QuickSortData; 39 | //# sourceMappingURL=QuickSortData.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoFrame.ts"],"names":[],"mappings":";;AAAA,iDAA6C;AAE7C;IAOI,mBAAY,GAAG,EAAE,WAAW,EAAE,YAAY;QACtC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACrC,CAAC;IAED,kCAAc,GAAd;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,mCAAe,GAAf;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAED,2BAAO,GAAP;QAEI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAE9D,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;QAEzC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;gBACvC,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,KAAK,CAAC,CAAC;YAC1D,CAAC;YACD,IAAI,CAAC,CAAC;gBACF,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,IAAI,CAAC,CAAC;YACzD,CAAC;YAED,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;gBAChD,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,GAAG,CAAC,CAAC;YACxD,CAAC;YAED,6BAAa,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAChH,CAAC;IACL,CAAC;IAED,0BAAM,GAAN,UAAO,IAAI;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IACL,gBAAC;AAAD,CAAC,AA/CD,IA+CC;AA/CY,8BAAS"} -------------------------------------------------------------------------------- /app/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoFrame.ts"],"names":[],"mappings":";;AAAA,iDAA6C;AAE7C;IAOI,mBAAY,GAAG,EAAE,WAAW,EAAE,YAAY;QACtC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACrC,CAAC;IAED,kCAAc,GAAd;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,mCAAe,GAAf;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAED,2BAAO,GAAP;QAEI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAE9D,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;QAEzC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;gBACvC,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,KAAK,CAAC,CAAC;YAC1D,CAAC;YACD,IAAI,CAAC,CAAC;gBACF,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,IAAI,CAAC,CAAC;YACzD,CAAC;YAED,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;gBAChD,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,GAAG,CAAC,CAAC;YACxD,CAAC;YAED,6BAAa,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAChH,CAAC;IACL,CAAC;IAED,0BAAM,GAAN,UAAO,IAAI;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IACL,gBAAC;AAAD,CAAC,AA/CD,IA+CC;AA/CY,8BAAS"} -------------------------------------------------------------------------------- /src/routes/index.ts: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | import * as express from 'express'; 4 | const router = express.Router(); 5 | 6 | router.get('/', (req, res, next) => { 7 | res.render('index'); 8 | }); 9 | 10 | router.get('/1-1', (req, res, next) => { 11 | res.render('canvas_01_01'); 12 | }); 13 | 14 | router.get('/1-2', (req, res, next) => { 15 | res.render('canvas_01_02'); 16 | }); 17 | 18 | router.get('/2-1', (req, res, next) => { 19 | res.render('canvas_02_01'); 20 | }); 21 | 22 | router.get('/3-1', (req, res, next) => { 23 | res.render('canvas_03_01'); 24 | }); 25 | 26 | router.get('/3-2', (req, res, next) => { 27 | res.render('canvas_03_02'); 28 | }); 29 | 30 | router.get('/3-3', (req, res, next) => { 31 | res.render('canvas_03_03'); 32 | }); 33 | 34 | router.get('/3-4', (req, res, next) => { 35 | res.render('canvas_03_04'); 36 | }); 37 | 38 | router.get('/3-5', (req, res, next) => { 39 | res.render('canvas_03_05'); 40 | }); 41 | 42 | router.get('/3-6', (req, res, next) => { 43 | res.render('canvas_03_06'); 44 | }); 45 | 46 | router.get('/3-7', (req, res, next) => { 47 | res.render('canvas_03_07'); 48 | }); 49 | 50 | router.get('/3-8', (req, res, next) => { 51 | res.render('canvas_03_08'); 52 | }); 53 | 54 | router.get('/3-9', (req, res, next) => { 55 | res.render('canvas_03_09'); 56 | }); 57 | 58 | router.get('/3-10', (req, res, next) => { 59 | res.render('canvas_03_10'); 60 | }); 61 | 62 | router.get('/3-11', (req, res, next) => { 63 | res.render('canvas_03_11'); 64 | }); 65 | 66 | router.get('/3-12', (req, res, next) => { 67 | res.render('canvas_03_12'); 68 | }); 69 | 70 | export default router; -------------------------------------------------------------------------------- /src/public/javascripts/03-06-Quick-Sort-Visualization/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if( i == this.data.curPivot ) 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Indigo); 40 | if( i == this.data.curElement) 41 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 42 | if( this.data.fixedPivots[i] ) 43 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 44 | 45 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 46 | } 47 | } 48 | 49 | render(data) { 50 | this.data = data; 51 | this.repaint(); 52 | } 53 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-01-Selection-Sort-Visualization/AlgoFrame.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"AlgoFrame.js","sourceRoot":"","sources":["../../../../src/public/javascripts/03-01-Selection-Sort-Visualization/AlgoFrame.ts"],"names":[],"mappings":";;AAAA,iDAA6C;AAE7C;IAOI,mBAAY,GAAG,EAAE,WAAW,EAAE,YAAY;QACtC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACrC,CAAC;IAED,kCAAc,GAAd;QACI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,mCAAe,GAAf;QACI,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;IAC7B,CAAC;IAED,2BAAO,GAAP;QAEI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QAE9D,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC;QAEzC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;YACrC,EAAE,CAAA,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA,CAAC;gBAC3B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,GAAG,CAAC,CAAC;YACxD,CAAC;YAAA,IAAI,CAAA,CAAC;gBACF,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,IAAI,CAAC,CAAC;YACzD,CAAC;YACD,EAAE,CAAA,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAA,CAAC;gBACnC,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,SAAS,CAAC,CAAC;YAC9D,CAAC;YACD,EAAE,CAAA,CAAC,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA,CAAC;gBAC/B,6BAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,6BAAa,CAAC,MAAM,CAAC,CAAC;YAC3D,CAAC;YACD,6BAAa,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;QAChH,CAAC;IACL,CAAC;IAED,0BAAM,GAAN,UAAO,IAAI;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;IACnB,CAAC;IACL,gBAAC;AAAD,CAAC,AA/CD,IA+CC;AA/CY,8BAAS"} -------------------------------------------------------------------------------- /src/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if( i == this.data.curPivot ) 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Indigo); 40 | if( i == this.data.curElement) 41 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 42 | if( this.data.fixedPivots[i] ) 43 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 44 | 45 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 46 | } 47 | } 48 | 49 | render(data) { 50 | this.data = data; 51 | this.repaint(); 52 | } 53 | } -------------------------------------------------------------------------------- /app/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/InsertionSortData.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var InsertionSortData = (function () { 4 | function InsertionSortData(N, randomBound) { 5 | this.numbers = new Array(N); 6 | this.orderedIndex = -1; 7 | this.currentIndex = -1; 8 | for (var i = 0; i < N; i++) { 9 | this.numbers[i] = Math.floor((Math.random() * randomBound)) + 1; 10 | } 11 | this.numbers.sort(function (a, b) { 12 | return a - b; 13 | }); 14 | var swapTime = Math.floor(0.02 * N); 15 | for (var i = 0; i < swapTime; i++) { 16 | var a = Math.floor(Math.random() * N); 17 | var b = Math.floor(Math.random() * N); 18 | this.swap(a, b); 19 | } 20 | } 21 | InsertionSortData.prototype.N = function () { 22 | return this.numbers.length; 23 | }; 24 | InsertionSortData.prototype.get = function (index) { 25 | if (index < 0 || index >= this.numbers.length) { 26 | throw ReferenceError("Invalid index to access Sort Data."); 27 | } 28 | return this.numbers[index]; 29 | }; 30 | InsertionSortData.prototype.swap = function (i, j) { 31 | if (i < 0 || i >= this.numbers.length || j < 0 || j >= this.numbers.length) { 32 | throw ReferenceError("Invalid index to access Sort Data."); 33 | } 34 | var t = this.numbers[i]; 35 | this.numbers[i] = this.numbers[j]; 36 | this.numbers[j] = t; 37 | }; 38 | return InsertionSortData; 39 | }()); 40 | exports.InsertionSortData = InsertionSortData; 41 | //# sourceMappingURL=InsertionSortData.js.map -------------------------------------------------------------------------------- /src/public/javascripts/03-09-Quick-Sort-with-Identical-Array/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if( i == this.data.curPivot ) 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Indigo); 40 | if( i == this.data.curElement) 41 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 42 | if( this.data.fixedPivots[i] ) 43 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 44 | 45 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 46 | } 47 | } 48 | 49 | render(data) { 50 | this.data = data; 51 | this.repaint(); 52 | } 53 | } -------------------------------------------------------------------------------- /src/public/javascripts/01-02-A-Money-Experiment-Extends/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | export class AlgoFrame { 2 | 3 | private canvasWidth: number; 4 | private canvasHeight: number; 5 | money: any; 6 | canvas: any; 7 | rounds: any; 8 | count: number; 9 | 10 | constructor(canvasWidth, canvasHeight) { 11 | 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | this.count = 0; 15 | 16 | this.rounds = document.getElementById('rounds'); 17 | 18 | this.canvas = document.getElementById('canvas'); 19 | this.canvas.width = canvasWidth; 20 | this.canvas.height = canvasHeight; 21 | } 22 | 23 | public getCanvasWidth() { 24 | return this.canvasWidth; 25 | } 26 | 27 | public getCanvasHeight() { 28 | return this.canvasHeight; 29 | } 30 | 31 | public render(money) { 32 | this.money = money; 33 | this.repaint(); 34 | } 35 | 36 | private repaint() { 37 | this.count ++; 38 | this.rounds.innerHTML = this.count; 39 | 40 | let ctx = this.canvas.getContext('2d'); 41 | ctx.fillStyle = '#fff'; 42 | ctx.fillRect(0, 0, this.canvasWidth, this.canvasHeight); 43 | 44 | let w = this.canvasWidth / this.money.length; 45 | 46 | for (let i = 0; i < this.money.length; i++) { 47 | if (this.money[i] > 0) { 48 | ctx.fillStyle = '#2196F3'; 49 | ctx.fillRect(i * w + 1, this.canvasHeight / 2 - this.money[i], w - 1, this.money[i]) 50 | } else { 51 | ctx.fillStyle = '#F44336'; 52 | ctx.fillRect(i * w + 1, this.canvasHeight / 2, w - 1, -this.money[i]) 53 | } 54 | } 55 | } 56 | } -------------------------------------------------------------------------------- /src/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/AlgoFrame.ts: -------------------------------------------------------------------------------- 1 | import {AlgoVisHelper} from './AlgoVisHelper' 2 | 3 | export class AlgoFrame { 4 | 5 | private g2d; 6 | private canvasWidth; 7 | private canvasHeight; 8 | private data; 9 | 10 | constructor(g2d, canvasWidth, canvasHeight) { 11 | this.g2d = g2d; 12 | this.canvasWidth = canvasWidth; 13 | this.canvasHeight = canvasHeight; 14 | } 15 | 16 | getCanvasWidth() { 17 | return this.canvasWidth; 18 | } 19 | 20 | getCanvasHeight() { 21 | return this.canvasHeight; 22 | } 23 | 24 | repaint() { 25 | // 具体绘制 26 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 27 | 28 | let w = this.canvasWidth / this.data.N(); 29 | 30 | for (let i = 0; i < this.data.N(); i++) { 31 | if (i >= this.data.l && i <= this.data.r) { 32 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Green); 33 | } 34 | else { 35 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Grey); 36 | } 37 | 38 | if( i == this.data.curPivot ) 39 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Indigo); 40 | if( i == this.data.curElement) 41 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.LightBlue); 42 | if( this.data.fixedPivots[i] ) 43 | AlgoVisHelper.setColor(this.g2d, AlgoVisHelper.Red); 44 | 45 | AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 46 | } 47 | } 48 | 49 | render(data) { 50 | this.data = data; 51 | this.repaint(); 52 | } 53 | } -------------------------------------------------------------------------------- /app/routes/index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var express = require("express"); 4 | var router = express.Router(); 5 | router.get('/', function (req, res, next) { 6 | res.render('index'); 7 | }); 8 | router.get('/1-1', function (req, res, next) { 9 | res.render('canvas_01_01'); 10 | }); 11 | router.get('/1-2', function (req, res, next) { 12 | res.render('canvas_01_02'); 13 | }); 14 | router.get('/2-1', function (req, res, next) { 15 | res.render('canvas_02_01'); 16 | }); 17 | router.get('/3-1', function (req, res, next) { 18 | res.render('canvas_03_01'); 19 | }); 20 | router.get('/3-2', function (req, res, next) { 21 | res.render('canvas_03_02'); 22 | }); 23 | router.get('/3-3', function (req, res, next) { 24 | res.render('canvas_03_03'); 25 | }); 26 | router.get('/3-4', function (req, res, next) { 27 | res.render('canvas_03_04'); 28 | }); 29 | router.get('/3-5', function (req, res, next) { 30 | res.render('canvas_03_05'); 31 | }); 32 | router.get('/3-6', function (req, res, next) { 33 | res.render('canvas_03_06'); 34 | }); 35 | router.get('/3-7', function (req, res, next) { 36 | res.render('canvas_03_07'); 37 | }); 38 | router.get('/3-8', function (req, res, next) { 39 | res.render('canvas_03_08'); 40 | }); 41 | router.get('/3-9', function (req, res, next) { 42 | res.render('canvas_03_09'); 43 | }); 44 | router.get('/3-10', function (req, res, next) { 45 | res.render('canvas_03_10'); 46 | }); 47 | router.get('/3-11', function (req, res, next) { 48 | res.render('canvas_03_11'); 49 | }); 50 | router.get('/3-12', function (req, res, next) { 51 | res.render('canvas_03_12'); 52 | }); 53 | exports.default = router; 54 | //# sourceMappingURL=index.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoFrame.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper_1 = require("./AlgoVisHelper"); 4 | var AlgoFrame = (function () { 5 | function AlgoFrame(g2d, canvasWidth, canvasHeight) { 6 | this.g2d = g2d; 7 | this.canvasWidth = canvasWidth; 8 | this.canvasHeight = canvasHeight; 9 | } 10 | AlgoFrame.prototype.getCanvasWidth = function () { 11 | return this.canvasWidth; 12 | }; 13 | AlgoFrame.prototype.getCanvasHeight = function () { 14 | return this.canvasHeight; 15 | }; 16 | AlgoFrame.prototype.repaint = function () { 17 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 18 | var w = this.canvasWidth / this.data.N(); 19 | for (var i = 0; i < this.data.N(); i++) { 20 | if (i < this.data.orderedIndex) { 21 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.Red); 22 | } 23 | else { 24 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.Grey); 25 | } 26 | if (i == this.data.currentIndex) { 27 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.LightBlue); 28 | } 29 | AlgoVisHelper_1.AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 30 | } 31 | }; 32 | AlgoFrame.prototype.render = function (data) { 33 | this.data = data; 34 | this.repaint(); 35 | }; 36 | return AlgoFrame; 37 | }()); 38 | exports.AlgoFrame = AlgoFrame; 39 | //# sourceMappingURL=AlgoFrame.js.map -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Airing 的算法实验室 2 | 3 | 使用 TypeScript 编写的一些有趣的算法实验。 4 | 5 | 线上地址：[http://lib.ursb.me](http://lib.ursb.me) 6 | 7 | ## 目录 8 | 9 | 1. 百人分钱问题 10 | 1. [百人分钱 | 不许负债](http://lib.ursb.me/1-1) 11 | 2. [百人分钱 | 允许负债](http://lib.ursb.me/1-2) 12 | 2. 蒙特卡洛算法 13 | 1. [求解圆周率](http://lib.ursb.me/2-1) 14 | 3. 排序算法 15 | 1. [选择排序 Selection Sort](http://lib.ursb.me/3-1) 16 | 2. [插入排序 Insertion Sort](http://lib.ursb.me/3-2) 17 | 3. [插入排序 | 近乎有序 Insertion Sort with Nearly Ordered Array](http://lib.ursb.me/3-3) 18 | 4. [归并排序 | 自顶向下 Merge Sort TD](http://lib.ursb.me/3-4) 19 | 5. [归并排序 | 自底向上 Merge Sort BD](http://lib.ursb.me/3-5) 20 | 6. [快速排序 Quick Sort](http://lib.ursb.me/3-6) 21 | 7. [快速排序 | 近乎有序 Quick Sort with Nearly Ordered Array](http://lib.ursb.me/3-7) 22 | 8. [快速排序 | 随机定点 Quick Sort with Random Pivot](http://lib.ursb.me/3-8) 23 | 9. [快速排序 | 完全一致 Quick Sort with Identical Array](http://lib.ursb.me/3-9) 24 | 10. [双路快速排序 Two Ways Quick Sort](http://lib.ursb.me/3-10) 25 | 11. [双路快速排序 | 完全一致 Two Ways Quick Sort with Identical Array](http://lib.ursb.me/3-11) 26 | 12. [三路快速排序 Three Ways Quick Sort](http://lib.ursb.me/3-12) 27 | ## 安装 28 | 29 | ``` 30 | git clone https://github.com/airingursb/algorithm-lab.git 31 | cd algorithm-lab 32 | npm install 33 | node app/bin/www.js --harmony 34 | ``` 35 | 36 | Then open Browser at 'http://localhost:9009' 37 | 38 | ## 修改算法代码 39 | 40 | ### Step 1. 编译 TypeScript 41 | 42 | ``` 43 | tsc 44 | ``` 45 | 46 | ### Step 2. 打包 js 文件 47 | 48 | 需要先安装 browserify 49 | 50 | ``` 51 | npm install -g browserify 52 | ``` 53 | 54 | 再进入对应的算法输出目录，打包代码 55 | 56 | ``` 57 | browserify main.js -o bundle.js 58 | ``` 59 | 60 | ## Screenshots 61 | 62 | ![](http://airing.ursb.me/image/cover/lib-sreenshots.png) 63 | -------------------------------------------------------------------------------- /app/public/javascripts/03-01-Selection-Sort-Visualization/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-02-Insertion-Sort-Visualization/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoFrame.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper_1 = require("./AlgoVisHelper"); 4 | var AlgoFrame = (function () { 5 | function AlgoFrame(g2d, canvasWidth, canvasHeight) { 6 | this.g2d = g2d; 7 | this.canvasWidth = canvasWidth; 8 | this.canvasHeight = canvasHeight; 9 | } 10 | AlgoFrame.prototype.getCanvasWidth = function () { 11 | return this.canvasWidth; 12 | }; 13 | AlgoFrame.prototype.getCanvasHeight = function () { 14 | return this.canvasHeight; 15 | }; 16 | AlgoFrame.prototype.repaint = function () { 17 | this.g2d.clearRect(0, 0, this.canvasWidth, this.canvasHeight); 18 | var w = this.canvasWidth / this.data.N(); 19 | for (var i = 0; i < this.data.N(); i++) { 20 | if (i < this.data.orderedIndex) { 21 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.Red); 22 | } 23 | else { 24 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.Grey); 25 | } 26 | if (i == this.data.currentIndex) { 27 | AlgoVisHelper_1.AlgoVisHelper.setColor(this.g2d, AlgoVisHelper_1.AlgoVisHelper.LightBlue); 28 | } 29 | AlgoVisHelper_1.AlgoVisHelper.fillRectangle(this.g2d, i * w, this.canvasHeight - this.data.get(i), w - 1, this.data.get(i)); 30 | } 31 | }; 32 | AlgoFrame.prototype.render = function (data) { 33 | this.data = data; 34 | this.repaint(); 35 | }; 36 | return AlgoFrame; 37 | }()); 38 | exports.AlgoFrame = AlgoFrame; 39 | //# sourceMappingURL=AlgoFrame.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-04-Merge-Sort-TD-Visualization/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-05-Merge-Sort-BU-Visualization/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-06-Quick-Sort-Visualization/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-08-Quick-Sort-with-Random-Pivot/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-09-Quick-Sort-with-Identical-Array/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /src/app.ts: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | import * as express from 'express'; 4 | import * as path from 'path'; 5 | import * as favicon from 'serve-favicon'; 6 | import * as logger from 'morgan'; 7 | import * as cookieParser from 'cookie-parser'; 8 | import * as bodyParser from 'body-parser'; 9 | import index from './routes/index'; 10 | import * as ejs from 'ejs'; 11 | 12 | const app: express.Express = express(); 13 | 14 | //view engine setup 15 | 16 | app.set('views',path.join(__dirname,'views')); 17 | app.engine('.html',ejs.renderFile); 18 | app.set('view engine','html'); 19 | 20 | //uncomment after placing your favicon in /public 21 | //app.use(favicon(path.join(__dirname,'public','favicon.ico'))); 22 | app.use(logger('dev')); 23 | app.use(bodyParser.json()); 24 | app.use(bodyParser.urlencoded({extended: false})); 25 | app.use(cookieParser()); 26 | app.use(express.static(path.join(__dirname,'public'))); 27 | 28 | app.use('/',index); 29 | 30 | //catch 404 and forward to error handler 31 | app.use((req,res,next) => { 32 | var err = new Error('Not Found'); 33 | err['status'] = 404; 34 | next(err); 35 | }); 36 | 37 | //error handlers 38 | 39 | //development error handler 40 | //will print stacktrace 41 | if(process.env.NODE_ENV === 'development') { 42 | app.use((err: Error,req,res,next) => { 43 | res.status(err['status'] || 500); 44 | res.render('error',{ 45 | title: 'error', 46 | message: err.message, 47 | error: err 48 | }); 49 | }); 50 | } 51 | 52 | //production error handler 53 | // no stacktrace leaked to user 54 | app.use((err: Error,req,res,next) => { 55 | res.status(err['status'] || 500); 56 | res.render('error',{ 57 | title: 'error', 58 | message: err.message, 59 | error: {} 60 | }); 61 | }); 62 | 63 | export default app; 64 | -------------------------------------------------------------------------------- /app/public/javascripts/03-07-Quick-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map -------------------------------------------------------------------------------- /app/public/javascripts/03-03-Insertion-Sort-with-Nearly-Ordered-Array/AlgoVisHelper.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | var AlgoVisHelper = (function () { 4 | function AlgoVisHelper() { 5 | } 6 | AlgoVisHelper.strokeCircle = function (g2d, x, y, r) { 7 | g2d.beginPath(); 8 | g2d.arc(x, y, r, 0, 2 * Math.PI); 9 | g2d.closePath(); 10 | g2d.stroke(); 11 | }; 12 | AlgoVisHelper.fillCircle = function (g2d, x, y, r) { 13 | g2d.beginPath(); 14 | g2d.arc(x, y, r, 0, 2 * Math.PI); 15 | g2d.closePath(); 16 | g2d.fill(); 17 | }; 18 | AlgoVisHelper.fillRectangle = function (g2d, x, y, w, h) { 19 | g2d.fillRect(x, y, w, h); 20 | }; 21 | AlgoVisHelper.setColor = function (g2d, color) { 22 | g2d.fillStyle = color; 23 | }; 24 | return AlgoVisHelper; 25 | }()); 26 | AlgoVisHelper.Red = "#F44336"; 27 | AlgoVisHelper.Pink = "#E91E63"; 28 | AlgoVisHelper.Purple = "#9C27B0"; 29 | AlgoVisHelper.DeepPurple = "#673AB7"; 30 | AlgoVisHelper.Indigo = "#3F51B5"; 31 | AlgoVisHelper.Blue = "#2196F3"; 32 | AlgoVisHelper.LightBlue = "#03A9F4"; 33 | AlgoVisHelper.Cyan = "#00BCD4"; 34 | AlgoVisHelper.Teal = "#009688"; 35 | AlgoVisHelper.Green = "#4CAF50"; 36 | AlgoVisHelper.LightGreen = "#8BC34A"; 37 | AlgoVisHelper.Lime = "#CDDC39"; 38 | AlgoVisHelper.Yellow = "#FFEB3B"; 39 | AlgoVisHelper.Amber = "#FFC107"; 40 | AlgoVisHelper.Orange = "#FF9800"; 41 | AlgoVisHelper.DeepOrange = "#FF5722"; 42 | AlgoVisHelper.Brown = "#795548"; 43 | AlgoVisHelper.Grey = "#9E9E9E"; 44 | AlgoVisHelper.BlueGrey = "#607D8B"; 45 | AlgoVisHelper.Black = "#000000"; 46 | AlgoVisHelper.White = "#FFFFFF"; 47 | exports.AlgoVisHelper = AlgoVisHelper; 48 | //# sourceMappingURL=AlgoVisHelper.js.map --------------------------------------------------------------------------------