Skip to content

Commit 843d0ef

Browse files
Sethuram52001Sethuram52001
committed
not much change cleaned up some code
1 parent bc97d70 commit 843d0ef

File tree

6 files changed

+55
-124
lines changed

6 files changed

+55
-124
lines changed

‎.eslintcache‎

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎src/components/DarkModeToggle/DarkModeToggle.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,4 +93,8 @@
9393
opacity: 0.5;
9494
-webkit-transition: opacity 0.25s;
9595
transition: opacity 0.25s;
96+
}
97+
98+
.toggleClasses {
99+
margin-left: 5px;
96100
}

‎src/components/Node/Node.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
import React, { Component } from 'react';
22
import "./Node.scss";
3-
import xwing from "../../images/x-wing.png";
4-
import deathstar from "../../images/death-star.png";
53

64
const Node = (props) => {
75
const { row, col, isStart, isFinish, isWall, onMouseDown, onMouseEnter, onMouseUp } = props; //, onMouseLeave

‎src/components/Node/Node.scss‎

Lines changed: 16 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -13,53 +13,24 @@ $outline-dark-theme: white;
1313
}
1414
}
1515

16-
@media only screen and (min-width: 320px) {
17-
.node {
18-
width: var(--width); //9px
19-
height: var(--height);//9px;
20-
border: 1px solid black;
21-
//outline: 0.5px solid black;
22-
display: inline-block;
23-
//margin-bottom: 0px;
24-
}
16+
.node {
17+
@media only screen and (min-width: 320px) {
18+
width: 8px;//2.1875vw 28px
19+
height: 20px;//3.89vh 28px
20+
}
21+
@media only screen and (min-width: 481px) {
22+
width: 17px;
23+
height: 17px;
24+
}
25+
@media only screen and (min-width: 769px) {
26+
width: 28px;//2.1875vw 28px
27+
height: 28px;//3.89vh 28px
28+
}
29+
display: inline-block;
30+
margin-bottom: -4px;
31+
box-sizing: border-box;
2532
}
2633

27-
@media only screen and (min-width: 481px) {
28-
.node {
29-
width: var(--width);
30-
height: var(--height);
31-
display: inline-block;
32-
margin-bottom: 0px;
33-
border: 2px;
34-
}
35-
}
36-
37-
@media only screen and (min-width: 769px) {
38-
.node {
39-
width: 28px;
40-
height: 28px;
41-
display: inline-block;
42-
margin-bottom: -4px;
43-
}
44-
}
45-
// @media only screen and (min-width: 900px) {
46-
// .node {
47-
// width: 28px;
48-
// height: 28px;
49-
// display: inline-block;
50-
// margin-bottom: -4px;
51-
// }
52-
// }
53-
54-
// @media only screen and (max-width: 899px) {
55-
// .node {
56-
// width: 6px;
57-
// height: 6px;
58-
// outline: 0.5px solid black;
59-
// display: inline-block;
60-
// margin-bottom: 0px;
61-
// }
62-
// }
6334

6435
.node-start {
6536
background-color: green;

‎src/components/PathVisualizer/PathVisualizer.js‎

Lines changed: 34 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -31,26 +31,10 @@ class PathVisualizer extends Component {
3131

3232
// creates the grid when the component is mounted
3333
componentDidMount() {
34-
// this.setState({
35-
// startNode: [START_NODE_ROW, START_NODE_COL],
36-
// finishNode: [FINISH_NODE_ROW, FINISH_NODE_COL]
37-
// });
3834
let grid = getInitialGrid();
39-
this.setState({ grid });
40-
//window.addEventListener("resize", this.updateDimesions);
35+
this.setState({ grid });
4136
}
4237

43-
// updateDimesions = () => {
44-
// console.log("update dimesions:- " + "width: " + window.screen.width + " height: " + window.screen.height);
45-
// console.log("updated width: " + (28 / 1280) * window.screen.width);
46-
// console.log("updated height: " + (28 / 720) * window.screen.height);
47-
// const updatedWidth = (28 / 1280) * window.screen.width;
48-
// const updatedHeight = (28 / 720) * window.screen.height;
49-
// //footer.style.setProperty('--footer-color', input.value)
50-
// document.querySelector('node').style.setProperty('--width', updatedWidth);
51-
// document.querySelector('node').style.setProperty('--height', updatedHeight)
52-
// }
53-
5438
toggle = () => {
5539
this.setState({ tooltipOpen: !this.state.tooltipOpen });
5640
}
@@ -115,11 +99,11 @@ class PathVisualizer extends Component {
11599
visualizeDijkstra = () => {
116100
if (this.state.isVisualizing)
117101
return;
118-
const { grid,startNode_Pos,finishNode_Pos } = this.state;
119-
//const startNode = grid[START_NODE_ROW][START_NODE_COL];
120-
const startNode = grid[startNode_Pos[0]][startNode_Pos[1]];
121-
//const finishNode = grid[FINISH_NODE_ROW][FINISH_NODE_COL];
122-
const finishNode = grid[finishNode_Pos[0]][finishNode_Pos[1]];
102+
const { grid, startNode_Pos, finishNode_Pos } = this.state;
103+
const start_X = startNode_Pos[0], start_Y = startNode_Pos[1];
104+
const startNode = grid[start_X][start_Y];
105+
const finish_X = finishNode_Pos[0], finish_Y = finishNode_Pos[1];
106+
const finishNode = grid[finish_X][finish_Y];
123107
try {
124108
const visitedNodesInOrder = dijkstra(grid, startNode, finishNode);
125109
const nodesInShortestPathOrder = getNodesInShortestPathOrder(finishNode);
@@ -143,12 +127,11 @@ class PathVisualizer extends Component {
143127
visualizeDFS = () => {
144128
if (this.state.isVisualizing)
145129
return;
146-
const { grid, startNode_Pos,finishNode_Pos } = this.state;
147-
//const startNode = grid[START_NODE_ROW][START_NODE_COL];
148-
//console.log(StartNode);
149-
const startNode = grid[startNode_Pos[0]][startNode_Pos[1]];
150-
//const finishNode = grid[FINISH_NODE_ROW][FINISH_NODE_COL];
151-
const finishNode = grid[finishNode_Pos[0]][finishNode_Pos[1]];
130+
const { grid, startNode_Pos, finishNode_Pos } = this.state;
131+
const start_X = startNode_Pos[0], start_Y = startNode_Pos[1];
132+
const startNode = grid[start_X][start_Y];
133+
const finish_X = finishNode_Pos[0], finish_Y = finishNode_Pos[1];
134+
const finishNode = grid[finish_X][finish_Y];
152135
try {
153136
const visitedNodesInOrder = dfs(grid, startNode, finishNode);
154137
const nodesInShortestPathOrder = getNodesInShortestPathOrder(finishNode);
@@ -171,11 +154,11 @@ class PathVisualizer extends Component {
171154
visualizeBFS = async () => {
172155
if (this.state.isVisualizing)
173156
return;
174-
const { grid, startNode_Pos,finishNode_Pos } = this.state;
175-
//const startNode = grid[START_NODE_ROW][START_NODE_COL];
176-
const startNode = grid[startNode_Pos[0]][startNode_Pos[1]];
177-
//const finishNode = grid[FINISH_NODE_ROW][FINISH_NODE_COL];
178-
const finishNode = grid[finishNode_Pos[0]][finishNode_Pos[1]];
157+
const { grid, startNode_Pos, finishNode_Pos } = this.state;
158+
const start_X = startNode_Pos[0], start_Y = startNode_Pos[1];
159+
const startNode = grid[start_X][start_Y];
160+
const finish_X = finishNode_Pos[0], finish_Y = finishNode_Pos[1];
161+
const finishNode = grid[finish_X][finish_Y];
179162
try {
180163
const visitedNodesInOrder = bfs(grid, startNode, finishNode);
181164
const nodesInShortestPathOrder = getNodesInShortestPathOrder(finishNode);
@@ -197,12 +180,11 @@ class PathVisualizer extends Component {
197180
visualizeAstar = () => {
198181
if (this.state.isVisualizing)
199182
return;
200-
console.log("a star");
201183
const { grid,startNode_Pos,finishNode_Pos } = this.state;
202-
//const startNode = grid[START_NODE_ROW][START_NODE_COL];
203-
const startNode = grid[startNode_Pos[0]][startNode_Pos[1]];
204-
//const finishNode = grid[FINISH_NODE_ROW][FINISH_NODE_COL];
205-
const finishNode = grid[finishNode_Pos[0]][finishNode_Pos[1]];
184+
const start_X = startNode_Pos[0], start_Y = startNode_Pos[1];
185+
const startNode = grid[start_X][start_Y];
186+
const finish_X = finishNode_Pos[0], finish_Y = finishNode_Pos[1];
187+
const finishNode = grid[finish_X][finish_Y];
206188
try {
207189
const visitedNodesInOrder = astar(grid, startNode, finishNode);
208190
const nodesInShortestPathOrder = getNodesInShortestPathOrder(finishNode);
@@ -369,25 +351,22 @@ export default PathVisualizer;
369351

370352
/*------------------------------------------------------------helper functions----------------------------------------------------------------*/
371353

372-
// prev getInitialGrid func was here
373-
// creating the initial grid, calls the createNode() function
374-
// to initialise the node with initial properties
375-
//const
376-
const getInitialGrid = () => {
377-
let grid = [];
378-
//const { startNode, finishNode } = this.state;
379-
const startNode_Pos = [10, 15];
380-
const finishNode_Pos = [10, 35];
381-
for (let row = 0; row < 20; row++) {
382-
const currRow = [];
383-
for (let col = 0; col < 40; col++) { // previously I had it as 20*50
384-
//currRow.push(createNode(row, col));
385-
currRow.push(createNode(row, col, startNode_Pos, finishNode_Pos));
386-
}
387-
grid.push(currRow);
354+
// creating the initial grid, calls the createNode() function
355+
// to initialise the node with initial properties
356+
const getInitialGrid = () => {
357+
let grid = [];
358+
//const { startNode, finishNode } = this.state;
359+
const startNode_Pos = [10, 15];
360+
const finishNode_Pos = [10, 35];
361+
for (let row = 0; row < 20; row++) {
362+
const currRow = [];
363+
for (let col = 0; col < 40; col++) { // previously I had it as 20*50
364+
currRow.push(createNode(row, col, startNode_Pos, finishNode_Pos));
388365
}
389-
return grid;
366+
grid.push(currRow);
390367
}
368+
return grid;
369+
}
391370

392371
// initialising the node with its initial properties
393372
const createNode = (row, col, startNode, finishNode) => {

‎src/components/PathVisualizer/PathVisualizer.scss‎

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -42,24 +42,3 @@
4242
// }
4343
// }
4444

45-
/*credits: https://codepen.io/demilad/pen/bZRjpb?editors=1100*/
46-
.circle {
47-
position: relative;
48-
border-radius: 100%;
49-
width: 8rem;
50-
height: 8rem;
51-
background: linear-gradient(40deg, #FF0080,#FF8C00 70%);
52-
margin: auto;
53-
}
54-
55-
.crescent {
56-
position: absolute;
57-
border-radius: 100%;
58-
right: 0;
59-
width: 6rem;
60-
height: 6rem;
61-
background: white;
62-
transform: scale(0);
63-
transform-origin: top right;
64-
transition: transform .6s cubic-bezier(0.645, 0.045, 0.355, 1);
65-
}

0 commit comments

Comments
 (0)