Skip to content

Commit d8aa483

Browse files
namyakhannamyakhan
authored
Merge pull request namyakhan#10 from tanishqkrk/iptracker-tanishqkrk
ip address tracker by @tanishqkrk
2 parents 48a41f3 + 2182483 commit d8aa483

15 files changed

+1222
-0
lines changed

‎ipTracker/.gitignore

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎ipTracker/design/active-states.jpg

167 KB
Loading

‎ipTracker/design/desktop-design.jpg

168 KB
Loading

‎ipTracker/design/desktop-preview.jpg

73.8 KB
Loading

‎ipTracker/design/mobile-design.jpg

55.8 KB
Loading

‎ipTracker/images/favicon-32x32.png

1.04 KB
Loading

‎ipTracker/images/icon-arrow.svg

Lines changed: 1 addition & 0 deletions
Loading

‎ipTracker/images/icon-location.svg

Lines changed: 1 addition & 0 deletions
Loading

‎ipTracker/images/logo.jpg

5.93 KB
Loading

‎ipTracker/images/pattern-bg.png

78.8 KB
Loading

‎ipTracker/index.html

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<link rel="icon" type="image/svg+xml" href="./images/logo.jpg" />
7+
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9+
<title>IP Tracker</title>
10+
<script src="./main.js" defer></script>
11+
<link rel="stylesheet" href="./style.css">
12+
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
13+
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
14+
crossorigin="" />
15+
<script src="https://unpkg.com/leaflet@1.8.0/dist/lewaflet.js"
16+
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
17+
crossorigin=""></script>
18+
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
19+
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
20+
crossorigin=""></script>
21+
<script src="https://kit.fontawesome.com/cffed4b148.js" crossorigin="anonymous"></script>
22+
23+
</head>
24+
25+
<body>
26+
<div class="warning">
27+
<i class="fa-solid fa-circle-exclamation"></i> Please disable your ad blocker to use this app
28+
</div>
29+
<div id="header">
30+
<div class="header__title">IP Address Tracker</div>
31+
<div class="header__input"><input placeholder="Enter an IP address" type="float" class="header__input--input">
32+
<button class="header__input--button" type="submit"><i class="fa-solid fa-arrow-down button-arrow"></i></button>
33+
</div>
34+
</div>
35+
<div id="data">
36+
<div class="section" id="ip">
37+
<div class="section__title ip__title">IP Address</div>
38+
<div class="section__value ip__value">-</div>
39+
</div>
40+
<div class="section" id="location">
41+
<div class="section__title location__title">Location</div>
42+
<div class="section__value location__value">-</div>
43+
</div>
44+
<div class="section" id="timezone">
45+
<div class="section__title timezone__title">Timezone</div>
46+
<div class="section__value timezone__value">-</div>
47+
</div>
48+
<div class="section" id="isp">
49+
<div class="section__title isp__title">ISP</div>
50+
<div class="section__value isp__value">-</div>
51+
</div>
52+
<div class="section" id="vpn">
53+
<div class="section__title vpn__title">VPN/Proxy/Tor</div>
54+
<div class="section__value vpn__value">-</div>
55+
</div>
56+
</div>
57+
<div id="map"></div>
58+
</body>
59+
60+
</html>

‎ipTracker/main.js

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
const outerFunction = () => {
2+
let map = L.map('map');
3+
const mainFunction = e => {
4+
let ipAddress = document.querySelector('.header__input--input').value;
5+
let userIp = document.querySelector('.ip__value');
6+
let userLocation = document.querySelector('.location__value');
7+
let userTimezone = document.querySelector('.timezone__value');
8+
let userIsp = document.querySelector('.isp__value');
9+
let userVpn = document.querySelector('.vpn__value');
10+
const apiKey = 'at_ptq5iCtbeeu2pV1kxSlEAZ43nLKYS';
11+
const URL = `https://geo.ipify.org/api/v2/country,city,vpn?apiKey=${apiKey}&ipAddress=${ipAddress}`;
12+
console.log(URL);
13+
fetch(URL).then(response => response.json())
14+
.then(data => update(data))
15+
// .catch(data => clear(data))
16+
17+
const clear = () => {
18+
ip.innerHTML = '-';
19+
location.innerHTML = '-'
20+
timezone.innerHTML = '-'
21+
isp.innerHTML = '-'
22+
}
23+
24+
const update = (data) => {
25+
const updateMap = () => {
26+
let x = data.location.lat;
27+
let y = data.location.lng;
28+
let z = 8;
29+
map.setView([x, y], z);
30+
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?', {
31+
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
32+
}).addTo(map)
33+
L.marker([x, y]).addTo(map)
34+
.bindPopup(ipAddress)
35+
.openPopup();
36+
}
37+
userIp.innerHTML = ipAddress;
38+
userLocation.innerHTML = data.location.city
39+
userTimezone.innerHTML = data.location.timezone
40+
userIsp.innerHTML = data.isp
41+
if (data.proxy.proxy == true) {
42+
userVpn.innerHTML = 'Proxy'
43+
}
44+
else if (data.proxy.vpn == true) {
45+
userVpn.innerHTML = 'VPN'
46+
}
47+
else if (data.proxy.tor == true) {
48+
userVpn.innerHTML = 'Tor'
49+
}
50+
else {
51+
userVpn.innerHTML = '-'
52+
}
53+
updateMap();
54+
}
55+
}
56+
if (document.querySelector('.header__input').value != '') {
57+
document.querySelector('.header__input--button').addEventListener('click', mainFunction)
58+
}
59+
}
60+
61+
outerFunction()
62+

0 commit comments

Comments
 (0)