html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<input onchange="eval(document.getElementById('ip').value)" id='ip'>
<p id='s'></p>
<div id='point'>point</div>
<div id='program'>program</div>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
body {
}
div{
position:fixed;
left:100px;
bottom:100px;
width:20px;
height:20px;
border: black solid 2px;
}
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
let arr = [-1,-1,0],//Angle(direction) to turn
pta=[100,500],//pta=Point point,index 0 is x and index 1 is y
pte=[500,500],//pte=Point program
t=0,
mpi=0,
mpa=0,
angle=-90,
oldarr=[Math.hypot(pta[0]-pte[0],pta[1]-pte[1]),Math.hypot(pta[0]-pte[0],pta[1]-pte[1]),Math.hypot(pta[0]-pte[0],pta[1]-pte[1])];
const dist = (p1,p2,d,v) => Math.sqrt((((p2[0]+Math.sin((Math.PI/180)*d))-p1[0])**2) + (((p2[1]+(Math.cos((Math.PI/180)*d))*v-p1[1]))**2));//Calculates the euclidean distance
const update = () => {
let u = pta[1] != pte[1] ? Math.abs(pta[1]-pte[1])/(pta[1]-pte[1]) : 1;
let checkarr=arr.map((a)=>dist(pta,pte,a,u))//returns the distance for each directions
//checkarr=checkarr.map((w,i)=>Math.abs(w-oldarr[i]));
let copy=checkarr.slice();//Copies checkarr
copy.sort((a,b)=>a-b);//Sorts the array
let d=arr[checkarr.indexOf(copy[0])]; //Gets the direction from the distance
mpi += (Math.PI/180)*d;
mpa += (Math.PI/180);
angle+=d;
angle=(Math.abs(angle)>=360) ? angle%360:angle;
pte[0]+=Math.sin(mpi)*1;
pte[1]-=Math.cos(mpi)*u;
pta[0]+=Math.sin(mpa)*1;
pta[1]-=Math.cos(mpa)*1;
oldarr=copy.slice();
//Live Details
document.getElementById('s').innerHTML=(
'res:'+ arr[checkarr.indexOf(copy[0])] +
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run