Skip to content

Commit 7a0a8ac

Browse files
mime9599mime9599
committed
finishing board rendering algo
1 parent 3e0a9e6 commit 7a0a8ac

3 files changed

Lines changed: 99 additions & 95 deletions

File tree

‎src/components/Animation/Animation.js‎

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,57 @@
1-
import { Document } from "postcss";
1+
import {Document} from 'postcss';
2+
3+
24

35
class Animation {
46

5-
constructor() {
7+
constructor() {
68
Animation.threads = [];
79
// SG 07/09/2022 15:11 Singleton pattern
8-
if(Animation._instance) {
10+
if (Animation._instance) {
911
return Animation._instance;
1012
}
1113
Animation._instance = this;
12-
Animation.stop = false;
14+
Animation.stop = false;
1315
}
1416

1517

1618
// SG 07/07/2022 22:00 define differnet animaitons here and call it in sorting algorithms
1719

1820
static async clearTimeout() {
1921
Animation.stop = true;
20-
for(const timeout of Animation.threads) {
22+
for (const timeout of Animation.threads) {
2123
await this.clearTimeout(timeout);
2224
}
2325
}
2426

27+
2528
/**
2629
* takes indecies to be swapped
27-
* @param {Integer} i
30+
* @param {Integer} i
2831
* @param {Integer} minBarIndex
2932
*/
3033
swap(i, minBarIndex) {
31-
let unSortedBars = document.querySelectorAll('.array-bars');
32-
var temp1 = unSortedBars[minBarIndex].style.height;
34+
let unSortedBars = document.querySelectorAll('.array-bars');
35+
var temp1 = unSortedBars[minBarIndex].style.height;
3336
unSortedBars[minBarIndex].style.height = unSortedBars[i].style.height;
34-
unSortedBars[i].style.height = temp1;
37+
unSortedBars[i].style.height = temp1;
3538

36-
var temp2 = unSortedBars[minBarIndex].id;
39+
var temp2 = unSortedBars[minBarIndex].id;
3740
unSortedBars[minBarIndex].id = unSortedBars[i].id;
38-
unSortedBars[i].id = temp1;
41+
unSortedBars[i].id = temp1;
3942
}
4043

4144

4245
static async getAnimation(delay) {
43-
if(!Animation.stop) {
46+
if (!Animation.stop) {
4447
await new Promise((resolve) =>
45-
Animation.threads.push(setTimeout(() => {
46-
resolve();
47-
}, delay)));
48+
Animation.threads.push(setTimeout(() => {
49+
resolve();
50+
}, delay)));
4851
}
4952
}
5053
}
5154

5255

53-
export { Animation }
56+
57+
export {Animation};

‎src/components/InputHandler/Helper.js‎

Whitespace-only changes.

‎src/components/Page/Container.js‎

Lines changed: 79 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,79 @@
1-
import React, {Component} from 'react';
2-
import {BuildTrigger} from '../../modals/buttons/buildbutton/BuildTrigger';
3-
import {BuildForm} from '../../modals/form/BuildForm';
4-
5-
// TODO: To MainCanvas
6-
7-
export class Container extends Component {
8-
state = {isShown: false};
9-
10-
showModal = () => {
11-
this.setState({isShown: true}, () => {
12-
this.closeModal = this.closeModal.bind(this);
13-
this.closeButton.focus();
14-
});
15-
this.toggleScrollLock();
16-
};
17-
18-
onCloseModal = () => {
19-
this.setState({isShown: false});
20-
this.toggleScrollLock();
21-
22-
}
23-
24-
onClickOutside = (e) => {
25-
if (this.modalRef && !this.modalRef.contains(e.target)) {
26-
this.onCloseModal();
27-
}
28-
}
29-
30-
onKeyDown = (e) => {
31-
if (e.key === 'Escape') {
32-
this.onCloseModal();
33-
}
34-
35-
else {
36-
switch (e.key) {
37-
case 'Enter': {
38-
39-
break;
40-
}
41-
case 'ArrowUp': {
42-
43-
break;
44-
}
45-
case 'ArrowDown': {
46-
47-
break;
48-
}
49-
default:
50-
break;
51-
}
52-
}
53-
}
54-
55-
toggleScrollLock = () => {
56-
document.querySelector('html').classList.toggle('scroll-lock');
57-
}
58-
59-
60-
render() {
61-
return (
62-
<React.Fragment>
63-
<BuildTrigger triggerID = "bar" buttonRef = {this.buttonRef} showModal = {this.showModal} onSubmit = {this.onSubmit}/>
64-
{this.state.isShown ? (
65-
<BuildForm
66-
onSubmit = {this.onSubmit}
67-
onCloseModal = {this.onCloseModal}
68-
onClickOutside = {this.onClickOutside}
69-
onKeyDown = {this.onKeyDown}
70-
/>
71-
) : null}
72-
</React.Fragment>
73-
)
74-
}
75-
}
76-
77-
78-
79-
export default Container;
1+
// import React, {Component} from 'react';
2+
// import {BuildTrigger} from '../../modals/buttons/buildbutton/BuildTrigger';
3+
// import {BuildForm} from '../../modals/form/BuildForm';
4+
//
5+
// // TODO: To MainCanvas
6+
//
7+
// export class Container extends Component {
8+
// state = {isShown: false};
9+
//
10+
// showModal = () => {
11+
// this.setState({isShown: true}, () => {
12+
// this.closeModal = this.closeModal.bind(this);
13+
// this.closeButton.focus();
14+
// });
15+
// this.toggleScrollLock();
16+
// };
17+
//
18+
// onCloseModal = () => {
19+
// this.setState({isShown: false});
20+
// this.toggleScrollLock();
21+
//
22+
// }
23+
//
24+
// onClickOutside = (e) => {
25+
// if (this.modalRef && !this.modalRef.contains(e.target)) {
26+
// this.onCloseModal();
27+
// }
28+
// }
29+
//
30+
// onKeyDown = (e) => {
31+
// if (e.key === 'Escape') {
32+
// this.onCloseModal();
33+
// }
34+
//
35+
// else {
36+
// switch (e.key) {
37+
// case 'Enter': {
38+
//
39+
// break;
40+
// }
41+
// case 'ArrowUp': {
42+
//
43+
// break;
44+
// }
45+
// case 'ArrowDown': {
46+
//
47+
// break;
48+
// }
49+
// default:
50+
// break;
51+
// }
52+
// }
53+
// }
54+
//
55+
// toggleScrollLock = () => {
56+
// document.querySelector('html').classList.toggle('scroll-lock');
57+
// }
58+
//
59+
//
60+
// render() {
61+
// return (
62+
// <React.Fragment>
63+
// <BuildTrigger triggerID = "bar" buttonRef = {this.buttonRef} showModal = {this.showModal} onSubmit = {this.onSubmit}/>
64+
// {this.state.isShown ? (
65+
// <BuildForm
66+
// onSubmit = {this.onSubmit}
67+
// onCloseModal = {this.onCloseModal}
68+
// onClickOutside = {this.onClickOutside}
69+
// onKeyDown = {this.onKeyDown}
70+
// />
71+
// ) : null}
72+
// </React.Fragment>
73+
// )
74+
// }
75+
// }
76+
//
77+
//
78+
//
79+
// export default Container;

0 commit comments

Comments
 (0)