├── digibanner.jpg
├── digital-fingerprint.png
├── index.html
├── style.css
├── Script2.js
├── Script1.js
└── Script.js
/digibanner.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mohittiwari98/your-information-project/main/digibanner.jpg
--------------------------------------------------------------------------------
/digital-fingerprint.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mohittiwari98/your-information-project/main/digital-fingerprint.png
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 | Digital Fingerprint
11 |
15 |
19 |
23 |
24 |
25 |
26 |
27 |
28 |
32 |
36 |
37 |
38 |
39 |
44 |
45 |
46 |
47 |
51 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
76 |
77 |
82 |
83 |
84 |
85 |
86 |
87 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | /* Define custom CSS variables */
2 | :root {
3 | --color-bg: #061a32;
4 | --color-default: #fff;
5 | --color-fg: #333444;
6 | --color-primary: #32cd32;
7 | --color-selection-text: #111;
8 | --color-text: #2db82d;
9 | --font-fira-code: "Fira Code", monospace;
10 | --font-fira-mono: "Fira Mono", monospace;
11 | --text-shadow: 0px 0px 0.9px #32cd32;
12 | }
13 |
14 | /* Reset default styles for all elements */
15 | * {
16 | box-sizing: border-box;
17 | font-size: 14.8px;
18 | margin: 0;
19 | padding: 0;
20 | }
21 |
22 | /* Style for selected text */
23 | ::selection {
24 | background: var(--color-primary);
25 | color: var(--color-selection-text);
26 | text-shadow: var(--text-shadow);
27 | }
28 |
29 | /* Style for scrollbar */
30 |
31 | ::-webkit-scrollbar {
32 | width: 6px;
33 | }
34 | ::-webkit-scrollbar-track {
35 | margin: 2px;
36 | }
37 | ::-webkit-scrollbar-thumb {
38 | background-color: var(--color-fg);
39 | }
40 |
41 | /* Style for body */
42 | body {
43 | background-color: var(--color-bg);
44 | color: var(--color-default);
45 | font-family: var(--font-fira-mono);
46 | height: 100%;
47 | width: 100%;
48 | }
49 |
50 | /* Bold text styles */
51 | b {
52 | color: var(--color-primary);
53 | font-family: var(--font-fira-mono);
54 | font-size: 15px;
55 | letter-spacing: 0.8px;
56 | text-shadow: var(--text-shadow);
57 | }
58 |
59 | /* Style the header element */
60 | .header {
61 | align-items: center;
62 | background-color: var(--color-fg);
63 | display: flex;
64 | height: 43px;
65 | justify-content: center;
66 | position: sticky;
67 | top: 0;
68 | user-select: none;
69 | width: 100%;
70 | }
71 |
72 | /* Logo styles */
73 | #df {
74 | font-size: 17px;
75 | font-weight: bold;
76 | letter-spacing: 0.8px;
77 | text-align: center;
78 | width: auto;
79 | }
80 |
81 | /* Button container styles */
82 | .buttons {
83 | display: flex;
84 | left: 0;
85 | position: absolute;
86 | }
87 |
88 | /* Button styles */
89 | .button {
90 | border-radius: 50%;
91 | height: 14px;
92 | margin-left: 12px;
93 | width: 14px;
94 | }
95 |
96 | .button:hover {
97 | border: 1px solid #56576c;
98 | box-shadow: 0px 0px 7px #6c6e91;
99 | transform: scale(1.1);
100 | }
101 |
102 | /* Style the buttons with different colors */
103 | .red {
104 | background-color: #ff5f56;
105 | }
106 |
107 | .yellow {
108 | background-color: #ffbd2e;
109 | }
110 |
111 | .green {
112 | background-color: #27c93f;
113 | }
114 |
115 | /* Style for terminal screen */
116 | .screen {
117 | background: var(--color-selection-text);
118 | height: 100%;
119 | overflow-y: scroll;
120 | padding: 10px 10px 60px 10px;
121 | position: fixed;
122 | scrollbar-color: #444 var(--color-selection-text);
123 | scrollbar-width: thin;
124 | width: 100%;
125 | }
126 |
127 | /* Command line styles */
128 | .command-line {
129 | display: flex;
130 | margin-bottom: 3px;
131 | }
132 |
133 | /* Prompt styles */
134 | .prompt {
135 | color: var(--color-text);
136 | text-shadow: var(--text-shadow);
137 | }
138 |
139 | /* Style the input text field */
140 | input[type="text"] {
141 | background-color: var(--color-selection-text);
142 | border: none;
143 | caret-color: var(--color-primary);
144 | color: var(--color-default);
145 | font-family: var(--font-fira-code);
146 | margin-left: 5px;
147 | outline: none;
148 | text-transform: lowercase;
149 | width: 100%;
150 | }
151 |
152 | /* Style the output element */
153 | .output {
154 | color: var(--color-text);
155 | font-family: var(--font-fira-code);
156 | line-height: 24px;
157 | overflow: hidden;
158 | }
159 |
160 | /* Style the typing animation */
161 | .typing {
162 | animation: type 480ms linear;
163 | color: var(--color-text);
164 | overflow: hidden;
165 | word-wrap: break-word;
166 | }
167 |
168 | /* Define keyframes for typing animation */
169 | @keyframes type {
170 | 0% {
171 | overflow: hidden;
172 | white-space: nowrap;
173 | width: 0%;
174 | }
175 | 1% {
176 | white-space: nowrap;
177 | width: 1%;
178 | }
179 | 50% {
180 | white-space: nowrap;
181 | width: 50%;
182 | }
183 | 95% {
184 | white-space: nowrap;
185 | width: 95%;
186 | }
187 | 97% {
188 | white-space: initial;
189 | width: 97%;
190 | word-wrap: break-word;
191 | }
192 | 100% {
193 | white-space: initial;
194 | width: 100%;
195 | word-wrap: break-word;
196 | }
197 | }
198 |
199 | /* Style for map */
200 | #map {
201 | height: 340px;
202 | width: 97%;
203 | border-radius: 4px;
204 | margin: 0.5rem auto;
205 | }
206 |
--------------------------------------------------------------------------------
/Script2.js:
--------------------------------------------------------------------------------
1 | // Get Current Location
2 | var Latitude;
3 | var Longitude;
4 |
5 | // Show current location on leaflet map
6 | function showMap() {
7 | var div = document.createElement('div');
8 | div.innerHTML = `
9 |
10 |
11 | root@df: ~$
12 |
13 |
`;
14 | output.appendChild(div);
15 |
16 | const map = L.map('map').setView([Latitude, Longitude], 12.5);
17 | L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
18 | L.marker([Latitude, Longitude]).addTo(map)
19 | .openPopup();
20 |
21 | var newInput = div.querySelector('.command').focus();
22 | screen.scrollTop = output.scrollHeight;
23 | };
24 |
25 |
26 | // Function to run a command
27 | function runCommand() {
28 | // Create a new div element and append
29 | var div = document.createElement("div");
30 | div.classList.add("typing");
31 | div.innerHTML = `
32 |
33 | root@df: ~$
34 |
35 |
`;
36 | output.appendChild(div);
37 | // Set focus on the new input element
38 | var newInput = div.querySelector(".command").focus();
39 |
40 | // Current location using geolocation api
41 | if (navigator.geolocation) {
42 | navigator.geolocation.getCurrentPosition(position => {
43 | Latitude = position.coords.latitude;
44 | Longitude = position.coords.longitude;
45 | }, error => {
46 | console.error("Error getting location using Geolocation API: ", error);
47 | });
48 | };
49 |
50 |
51 | // Add event listener for keydown event on the output element
52 | output.addEventListener("keydown", function (e) {
53 | // Check if Enter key is pressed
54 | if (e.target.classList.contains("command") && e.key === "Enter") {
55 | // Get the command text from the input and convert it to lowercase
56 | var commandText = e.target.value.toLowerCase();
57 |
58 | // Create a new div element
59 | var div = document.createElement("div");
60 | div.classList.add("typing");
61 | // Append the div to the output element
62 | output.appendChild(div);
63 | // Disable the input and remove the 'command' class
64 | e.target.disabled = true;
65 | e.target.classList.remove("command");
66 |
67 | // Check the commandText for different commands and set the inner HTML of the div accordingly
68 | if (commandText === "help") {
69 | div.innerHTML = `
70 | Available commands:
71 |
72 | help - shows all available commands.
73 | df - Provides information about digital fingerprinting.
74 | pip install df - Displays your digital fingerprint.
75 | location - Shows your current location on a map.
76 | clear - Clears the terminal screen.
77 |
78 |
79 | root@df: ~$
80 |
81 |
`;
82 | } else if (commandText === "df") {
83 | div.innerHTML = `
84 | Digital Fingerprint:
85 | This website demonstrates the power of web browsers and the concept of browser fingerprinting. When you visit any website, they has the ability to collect and store various information about you, such as your location, browser details, browsing habits, online activities, and device information, which can be a threat to your privacy. To create awareness and educate users about these risks I have created this website, which provides a visual representation of the data that can be collected by websites. Through this information, I want to encourage you to exercise caution when visiting unknown or unsafe websites. Rest assured, I do not collect or store any of your data on the my server.
86 |
87 | root@df: ~$
88 |
89 |
`;
90 | } else if (commandText === "pip install df") {
91 | div.innerHTML = `
92 |
93 | Data fetching 0% ...
94 |
95 |
96 |
97 | `;
98 | runPrint();
99 | } else if (commandText === 'location') {
100 | showMap();
101 | } else if (commandText === "clear") {
102 | output.innerHTML = "";
103 |
104 | output.innerHTML = `
105 |
106 | root@df: ~$
107 |
108 |
`;
109 | } else {
110 | // If the command is invalid, display an error message
111 | div.innerHTML = `
112 | Invalid command:
113 | Type 'help' for list of commands.
114 |
115 |
116 | root@df: ~$
117 |
118 |
`;
119 | }
120 | // Set focus on the new input element
121 | var newInput = div.querySelector(".command").focus();
122 | // Scroll to the bottom of the output element
123 | screen.scrollTop = output.scrollHeight;
124 | }
125 | });
126 | // Scroll to the bottom of the output element
127 | screen.scrollTop = output.scrollHeight;
128 | }
129 |
130 |
131 | // Browser title change on tab change
132 | let docTitle = document.title;
133 | window.addEventListener("blur", () => {
134 | document.title = "Come back :(";
135 | });
136 | window.addEventListener("focus", () => {
137 | document.title = docTitle;
138 | });
139 |
--------------------------------------------------------------------------------
/Script1.js:
--------------------------------------------------------------------------------
1 | // target elements
2 | const commandLine = document.querySelector(".command-line");
3 | const screen = document.querySelector(".screen");
4 | const output = document.querySelector(".output");
5 |
6 | // install and loading
7 | output.innerHTML += `
8 | root@df: ~$
9 |
10 |
11 |
12 | Data fetching 0% ...
13 |
14 |
15 |
16 | `;
17 |
18 | function runPrint() {
19 | //----- Output Data -----
20 | let i = 0;
21 | const intervalId = setInterval(() => {
22 | i += 10;
23 | if (i <= 100) {
24 | document.getElementById("progress-bar").style.width = `${i}%`;
25 | document.getElementById("loading-value").innerText = `${i}%`;
26 | } else {
27 | clearInterval(intervalId);
28 | document.getElementById("fetching-data").innerText = "Data fetching done";
29 |
30 | // Add results to the 'output' element
31 | // an array of strings containing HTML div elements
32 | const newDivs = [
33 | `
34 | Device name: ${deviceName}
35 | `,
36 | `
37 | Device vendor: ${deviceVendor}
38 | `,
39 | `
40 | Device type: ${deviceType}
41 | `,
42 | `
43 | Device's orientation: ${orientation}
44 | `,
45 | `
46 | Screen size: ${ScreenSize}
47 | `,
48 | `
49 | Viewport size: ${viewportSize}
50 | `,
51 | `
52 | Device pixel ratio: ${devicePixelRatio}
53 | `,
54 | `
55 | Color depth: ${colorDepth}
56 | `,
57 | `
58 | Ram: ${Ram}
59 | `,
60 | `
61 | Number of logical processors: ${numCores}
62 | `,
63 | `
64 | Device OS: ${Os}
65 | `,
66 | `
67 | OS version: ${OSversion}
68 | `,
69 | `
70 | User prefers: ${UserPrefers}
71 | `,
72 | `
73 | Touch supports: ${touchSupports}
74 | `,
75 | `
76 | Battery level: ${BatteryLevel}
77 | `,
78 | `
79 | Charging status: ${ChargingStatus}
80 | `,
81 | `
82 | Available sensors: ${sensorsWithSpace}
83 | `,
84 | `
85 | Network Type: ${networkType}
86 | `,
87 | `
88 | Network Name: ${networkName}
89 | `,
90 | `
91 | Online status: ${onlineStatus}
92 | `,
93 | `
94 | Internet connection speed: ${ics}
95 | `,
96 | `
97 | ISP name: ${IPS}
98 | `,
99 | `
100 | Autonomous system number: ${ASN}
101 | `,
102 | `
103 | Round-trip time (RTT): ${Rtt}
104 | `,
105 | `
106 | Data saver mode: ${dataSaver}
107 | `,
108 | `
109 | Maximum available bandwidth: ${maximumBandwidth}
110 | `,
111 | `
112 | Ip address: ${Ip}
113 | `,
114 | `
115 | Ip version: ${ipVersion}
116 | `,
117 | `
118 | Latitude: ${Latitude}
119 | `,
120 | `
121 | Longitude: ${Longitude}
122 | `,
123 | `
124 | City: ${City}
125 | `,
126 | `
127 | Region/State: ${Region}
128 | `,
129 | `
130 | Region/State code: ${Regioncode}
131 | `,
132 | `
133 | Country: ${Country}
134 | `,
135 | `
136 | Country code: ${Countrycode}
137 | `,
138 | `
139 | Capital of the country: ${countryCapital}
140 | `,
141 | `
142 | Country calling code: ${CountryCallingCode}
143 | `,
144 | `
145 | Currency: ${Currency}
146 | `,
147 | `
148 | Languages spoken: ${Languages}
149 | `,
150 | `
151 | URL: ${siteURL}
152 | `,
153 | `
154 | Host name: ${hostName}
155 | `,
156 | `
157 | Page load time: ${PageLoadTime}
158 | `,
159 | `
160 | Referrer information: ${referrer}
161 | `,
162 | `
163 | Referrer source: ${referrerSource}
164 | `,
165 | `
166 | Do Not Track: ${dntEnabled}
167 | `,
168 | `
169 | GPU manufacturer: ${vendor}
170 | `,
171 | `
172 | GPU model: ${renderer}
173 | `,
174 | `
175 | WebGL vendor: ${WebGLVendor}
176 | `,
177 | `
178 | WebGL renderer: ${WebGLRenderer}
179 | `,
180 | `
181 | WebGL version: ${WebGLVersion}
182 | `,
183 | `
184 | VR display support: ${vrDisplaySupport}
185 | `,
186 | `
187 | Speech recognition support: ${speechRecognitionSupport}
188 | `,
189 | `
190 | Virtual keyboard support: ${virtualKeyboardSupport}
191 | `,
192 | `
193 | Supported audio formats: ${SupportedAudioFormats}
194 | `,
195 | `
196 | Supported video formats: ${supportedVideoFormats}
197 | `,
198 | `
199 | Browser name: ${BrowserName}
200 | `,
201 | `
202 | Browser version: ${BrowserVersion}
203 | `,
204 | `
205 | Browser engine: ${BrowserEngine}
206 | `,
207 | `
208 | Browser vendor: ${browserVendor}
209 | `,
210 | `
211 | Browser language: ${BrowserLanguage}
212 | `,
213 | `
214 | Browser's maximum touch points: ${maxTouchPoints}
215 | `,
216 | `
217 | Ad block enabled: ${Adblock}
218 | `,
219 | `
220 | Cookie Enabled: ${cookieEnabled}
221 | `,
222 | `
223 | Character encoding: ${acceptCharset}
224 | `,
225 | `
226 | Font Families: ${allFontFamilies}
227 | `,
228 | `
229 | Font Style: ${fontStyle}
230 | `,
231 | `
232 | Memory used by javascript: ${Memoryused}
233 | `,
234 | `
235 | Total javascript heap: ${Memorytotal}
236 | `,
237 | `
238 | Plugin name: ${PluginName}
239 | `,
240 | `
241 | Plugin filename: ${PluginFilename}
242 | `,
243 | `
244 | Visit on site: ${visit}
245 | `,
246 | `
247 | Fingers use to touch the screen: ${fingersTouch}
248 | `,
249 | `
250 | Time: ${currentTime}
251 | `,
252 | `
253 | Timezone: ${timezone}
254 | `,
255 | `
256 | Frame rate: ${frameRate}
257 | `,
258 | `
259 | Clicked on: ${Clickedelement}
260 | `,
261 | `
262 | Mouse X: ${MouseX}
263 | `,
264 | `
265 | Mouse Y: ${MouseY}
266 | `,
267 | `
268 | Input Text: null
269 | `,
270 | `
271 | Input Activity: null
272 | `,
273 | ];
274 |
275 | // This code adds the results to the 'output' element one by one, with a typing effect.
276 | let index = 0;
277 | const intervalIdd = setInterval(() => {
278 | if (index < newDivs.length) {
279 | const div = document.createElement("div");
280 | div.innerHTML = newDivs[index];
281 | div.classList.add("typing");
282 | output.appendChild(div);
283 | index++;
284 | screen.scrollTop = output.scrollHeight;
285 | } else {
286 | clearInterval(intervalIdd);
287 | runCommand();
288 | }
289 | }, 550);
290 | }
291 | }, 300);
292 | }
293 |
294 | runPrint();
295 |
--------------------------------------------------------------------------------
/Script.js:
--------------------------------------------------------------------------------
1 | // Data Collect
2 | //--------------------------------------
3 |
4 | const userAgent = navigator.userAgent;
5 | // Get user's Device Model Name
6 |
7 | var deviceName = 'Detecting...';
8 |
9 | if (navigator.userAgentData) {
10 | navigator.userAgentData.getHighEntropyValues(["model"]).then(data => {
11 | deviceName = data.model || "unknown";
12 | });
13 | } else if (userAgent.includes("Android")) {
14 | // User is using an Android device
15 | const match = userAgent.match(/Android [\d.]+;.*?([a-zA-Z0-9\s]+Build)/);
16 | if (match) {
17 | deviceName = match[1].replace(' Build', '');
18 | }
19 | } else if (userAgent.includes("iPhone") || userAgent.includes("iPad")) {
20 | // User is using an iOS device
21 | const match = userAgent.match(/\((iPhone|iPad).*?; ([a-zA-Z0-9\s]+)\)/);
22 | if (match) {
23 | deviceName = match[2];
24 | }
25 | } else if (userAgent.includes("Macintosh") || userAgent.includes("Windows")) {
26 | // User is using a laptop
27 | if (userAgent.includes("Macintosh")) {
28 | const match = userAgent.match(/\(Macintosh.*?; ([a-zA-Z0-9\s]+)\)/);
29 | if (match) {
30 | deviceName = match[1];
31 | }
32 | } else if (userAgent.includes("Windows")) {
33 | const match = userAgent.match(/Windows NT.*?; ([a-zA-Z0-9\s]+)/);
34 | if (match) {
35 | deviceName = match[1];
36 | }
37 | }
38 | } else {
39 | deviceName = 'unknown';
40 | }
41 |
42 |
43 |
44 | // Get Device vendor name
45 | let deviceVendor;
46 | if (userAgent.match(/iPad/i) || userAgent.match(/iPhone/i)) {
47 | deviceVendor = "Apple";
48 | } else if (userAgent.match(/Macintosh/i)) {
49 | deviceVendor = "Apple (Macintosh)";
50 | } else if (userAgent.match(/Android/i)) {
51 | deviceVendor = "Android";
52 | } else if (userAgent.match(/Windows Phone/i)) {
53 | deviceVendor = "Microsoft";
54 | } else if (userAgent.match(/Windows/i)) {
55 | deviceVendor = "Microsoft (Windows)";
56 | } else if (userAgent.match(/BlackBerry/i)) {
57 | deviceVendor = "BlackBerry";
58 | } else if (userAgent.match(/Linux/i)) {
59 | deviceVendor = "Linux";
60 | } else {
61 | deviceVendor = "Unknown";
62 | }
63 |
64 |
65 | // Get Network information
66 | if ('connection' in navigator) {
67 | const connection = navigator.connection;
68 | networkType = `${connection.type}`;
69 | networkName = `${connection.effectiveType}`;
70 | ics = `${connection.downlink} Mbps`;
71 | Rtt = `${connection.rtt} ms`;
72 | dataSaver = `${connection.saveData}`;
73 | maximumBandwidth = `${connection.downlinkMax} Mbps`;
74 | } else {
75 | networkType = networkName = ics = Rtt = dataSaver = maximumBandwidth = 'Network information not supported';
76 | }
77 |
78 |
79 | // Get Referrer information
80 | const referrer = document.referrer;
81 | if (referrer === '') {
82 | referrerSource = 'User typed in or bookmarked the URL';
83 | } else if (referrer.includes('google.com')) {
84 | referrerSource = 'User came from a Google search';
85 | } else if (referrer.includes('facebook.com')) {
86 | referrerSource = 'User came from a Facebook link';
87 | } else {
88 | referrerSource = 'User came from some other website';
89 | }
90 |
91 |
92 | // Get Battery information
93 | navigator.getBattery().then(function(battery) {
94 | // Get the battery level
95 | BatteryLevel = battery.level * 100 + '%';
96 | // Get the charging status
97 | ChargingStatus = 'Device is ' + (battery.charging ? 'charging' : 'not charging');
98 | });
99 |
100 |
101 | // Get Ram
102 | if ('deviceMemory' in navigator) {
103 | Ram = navigator.deviceMemory + 'GB';
104 | } else {
105 | Ram = 'undefined';
106 | }
107 |
108 |
109 | // Get use fingers to touch screen
110 | var fingersTouch = 0;
111 |
112 |
113 |
114 |
115 | // Get Browser plugins
116 | if ('plugins' in navigator) {
117 | const plugins = navigator.plugins;
118 | let pluginNames = [];
119 | let pluginFilenames = [];
120 | for (let i = 0; i < plugins.length; i++) {
121 | pluginNames.push(plugins[i].name);
122 | pluginFilenames.push(plugins[i].filename);
123 | }
124 | var PluginName = pluginNames.join(', ');
125 | var PluginFilename = pluginFilenames.join(', ');
126 | } else {
127 | PluginName = `plugin not found`;
128 | PluginFilename = `plugin not found`;
129 | }
130 |
131 | // Get Browser History
132 | if (window.history) {
133 | siteURL = window.location.href;
134 | }
135 |
136 | // Get mouseX and mouseY value
137 | var MouseX = 0;
138 | var MouseY = 0;
139 | document.addEventListener('mousemove', function(event) {
140 | MouseX = event.clientX;
141 | MouseY = event.clientY;
142 | // Update the values in the output element
143 | var mouseXOutput = document.getElementById('mouseXValue');
144 | var mouseYOutput = document.getElementById('mouseYValue');
145 | if (mouseXOutput && mouseYOutput) {
146 | mouseXOutput.innerText = MouseX;
147 | mouseYOutput.innerText = MouseY;
148 | }
149 | });
150 |
151 |
152 | // Graphics Capabilities
153 | // Get the number of logical processors
154 | const numCores = navigator.hardwareConcurrency;
155 |
156 |
157 | // Get the frame rate
158 | let frameCount = 0;
159 | let startTime = 0;
160 | let frameRate;
161 |
162 | function monitorFrameRate() {
163 | frameCount++;
164 | const currentTime = performance.now();
165 | const elapsedTime = currentTime - startTime;
166 | if (elapsedTime >= 1000) {
167 | frameRate = Math.round(frameCount / (elapsedTime / 1000));
168 | frameCount = 0;
169 | startTime = currentTime;
170 | }
171 | const frameCountElement = document.getElementById('frame-count');
172 | if (frameCountElement) {
173 | frameCountElement.innerText = frameRate;
174 | }
175 |
176 | requestAnimationFrame(monitorFrameRate);
177 | }
178 | requestAnimationFrame(monitorFrameRate);
179 |
180 |
181 | // Get Installed fonts
182 | // Wait for the document to load before accessing fonts
183 | document.addEventListener('DOMContentLoaded', () => {
184 | // Access the fonts object
185 | const fonts = document.fonts;
186 | const fontFamilies = new Set();
187 | for (const font of fonts.values()) {
188 | fontFamilies.add(font.family);
189 | fontStyle = `${font.style}`;
190 | }
191 | allFontFamilies = Array.from(fontFamilies).join(', ');
192 | });
193 |
194 |
195 | // Get the name of elements clicked
196 | var Clickedelement;
197 | document.addEventListener('click', function(event) {
198 | Clickedelement = event.target.tagName;
199 | const ClickedElement = document.getElementById('Clicked-element');
200 | if (ClickedElement) {
201 | ClickedElement.innerText = Clickedelement;
202 | }
203 | });
204 |
205 |
206 | // Get Memory usage
207 | var Memoryused;
208 | var Memorytotal;
209 | if (window.performance && window.performance.memory) {
210 | var memory = window.performance.memory;
211 | var memoryUsed = memory.usedJSHeapSize / 1048576; // convert bytes to MB
212 | var memoryTotal = memory.totalJSHeapSize / 1048576; // convert bytes to MB
213 | Memoryused = memoryUsed.toFixed(2) + 'MB';
214 | Memorytotal = memoryTotal.toFixed(2) + 'MB';
215 | } else {
216 | Memoryused = 'N/A';
217 | Memorytotal = 'N/A';
218 | }
219 |
220 |
221 | // Get Timing taken to load Page:
222 | var PageLoadTime;
223 | window.addEventListener('load', function() {
224 | var loadTime = performance.timing.loadEventEnd - performance.timing.navigationStart;
225 | PageLoadTime = loadTime + ' ms';
226 | });
227 |
228 |
229 | // Get user location and more data
230 | fetch('https://ipapi.co/json/')
231 | .then(response => response.json())
232 | .then(data => {
233 | latitude = data.latitude;
234 | longitude = data.longitude;
235 | Region = data.region;
236 | City = data.city;
237 | Country = data.country_name;
238 | IPS = data.org;
239 | Ip = data.ip; // IP
240 | ipVersion = data.version;
241 | Regioncode = data.region_code; // state
242 | Countrycode = data.country_code;
243 | countryCapital = data.country_capital;
244 | CountryCallingCode = data.country_calling_code;
245 | Currency = data.currency_name;
246 | Languages = data.languages;
247 | ASN = data.asn;
248 | })
249 | .catch(error => {
250 | console.error('Error fetching IP data:', error);
251 | Latitude = 'N/A';
252 | Longitude = 'N/A';
253 | Region = 'N/A';
254 | City = 'N/A';
255 | Country = 'N/A';
256 | IPS = 'N/A';
257 | Ip = 'N/A';
258 | ipVersion = 'N/A';
259 | Regioncode = 'N/A';
260 | Countrycode = 'N/A';
261 | countryCapital = 'N/A';
262 | CountryCallingCode = 'N/A';
263 | Currency = 'N/A';
264 | Languages = 'N/A';
265 | ASN = 'N/A';
266 | });
267 |
268 |
269 | // Get OS version
270 | const getUserAgentOS = () => {
271 | const userAgent = navigator.userAgent;
272 | const osVersion = (userAgent.match(/(iPhone|iPad|iPod|Android|Windows|Macintosh)\s([0-9._]+)/) || [])[2];
273 | return osVersion || "Unknown";
274 | };
275 | const OSversion = getUserAgentOS();
276 |
277 |
278 | // Get dark mode or light mode
279 | const prefersDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
280 | if (prefersDarkMode) {
281 | UserPrefers = 'dark mode';
282 | } else {
283 | UserPrefers = 'white mode';
284 | }
285 |
286 |
287 | // Get browser name
288 | if (userAgent.indexOf("Firefox") > -1) {
289 | BrowserName = 'Firefox';
290 | } else if (userAgent.indexOf("Chrome") > -1) {
291 | BrowserName = 'Chrome';
292 | } else if (userAgent.indexOf("Safari") > -1) {
293 | BrowserName = 'Safari';
294 | } else if (userAgent.indexOf('msie') !== -1 || userAgent.indexOf('trident') !== -1) {
295 | BrowserName = 'Internet Explorer';
296 | } else if (userAgent.indexOf("Opera") > -1) {
297 | BrowserName = 'Opera';
298 | } else if (userAgent.indexOf("Edge") > -1) {
299 | BrowserName = 'Edge';
300 | } else {
301 | BrowserName = 'unknown';
302 | }
303 |
304 |
305 | // Get current time
306 | var currentTime;
307 |
308 | function updateTime() {
309 | var date = new Date();
310 | var hours = date.getHours();
311 | var ampm = hours >= 12 ? 'PM' : 'AM';
312 | hours = hours % 12;
313 | hours = hours ? hours : 12;
314 | var minutes = date.getMinutes();
315 | var seconds = date.getSeconds();
316 | currentTime = hours + ':' + (minutes < 10 ? '0' + minutes : minutes) + ':' + (seconds < 10 ? '0' + seconds : seconds) + ' ' + ampm;
317 |
318 | // Update the time in the DOM
319 | const currentTimeElement = document.getElementById('current-Time');
320 | if (currentTimeElement) {
321 | currentTimeElement.innerText = currentTime;
322 | }
323 | }
324 | // UpdateTime
325 | updateTime();
326 | setInterval(updateTime, 1000);
327 |
328 |
329 | // Get os name
330 | const osName = navigator.platform;
331 | Os = `${osName}`;
332 |
333 |
334 | // Get browser language
335 | BrowserLanguage = `${navigator.language}`;
336 |
337 |
338 | // Get mobile, tablet or desktop
339 | let deviceType = '';
340 | if (/mobile|android/i.test(userAgent)) {
341 | deviceType = 'Mobile';
342 | } else if (/tablet|ipad/i.test(userAgent)) {
343 | deviceType = 'Tablet';
344 | } else {
345 | deviceType = 'Desktop';
346 | }
347 |
348 |
349 | // Get Screen Size
350 | const screenWidth = window.screen.width;
351 | const screenHeight = window.screen.height;
352 | ScreenSize = `${screenHeight}x${screenWidth}`;
353 |
354 | // Get Viewport Size
355 | const viewportWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
356 | const viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
357 | const viewportSize = `${viewportHeight}x${viewportWidth}`;
358 |
359 |
360 | // Get Browser version
361 | const regex = /(?:MSIE|Edge|Opera|Firefox|Chrome|Safari)[\/\s](\d+\.\d+)/;
362 | const match = userAgent.match(regex);
363 | const browserVersion = match ? match[1] : "unknown";
364 | BrowserVersion = `${browserVersion}`;
365 |
366 |
367 | // Get Browser engine
368 | let browserEngine;
369 | if (userAgent.indexOf("Trident") != -1) {
370 | browserEngine = "Trident";
371 | } else if (userAgent.indexOf("Edge") != -1) {
372 | browserEngine = "EdgeHTML";
373 | } else if (userAgent.indexOf("AppleWebKit") != -1) {
374 | browserEngine = "WebKit";
375 | } else if (userAgent.indexOf("Gecko") != -1 && userAgent.indexOf("like Gecko") == -1) {
376 | browserEngine = "Gecko";
377 | } else {
378 | browserEngine = "Unknown";
379 | }
380 | BrowserEngine = `${browserEngine}`;
381 |
382 |
383 | // Get Browser vendor
384 | let browserVendor = window.navigator.vendor;
385 |
386 | // Get Device pixal ratio
387 | const devicePixelRatio = window.devicePixelRatio;
388 |
389 | // Get Colour depth
390 | const colorDepth = window.screen.colorDepth;
391 |
392 | // Get cookie enabled
393 | const cookieEnabled = window.navigator.cookieEnabled;
394 |
395 | // Ge internet check
396 | if (window.navigator.onLine) {
397 | onlineStatus = "Connected to the internet";
398 | } else {
399 | onlineStatus = "Not Connected to the any internet";
400 | }
401 |
402 | // Get Do Not Track
403 | function isDntEnabled() {
404 | var dntEnabled = false;
405 | if ('doNotTrack' in window.navigator && (window.navigator.doNotTrack === '1' || window.navigator.doNotTrack === 'yes')) {
406 | dntEnabled = true;
407 | } else if ('doNotTrack' in window && (window.doNotTrack === '1' || window.doNotTrack === 'yes')) {
408 | dntEnabled = true;
409 | } else if ('msDoNotTrack' in window.navigator && window.navigator.msDoNotTrack === '1') {
410 | dntEnabled = true;
411 | } else if ('doNotTrack' in navigator && (navigator.doNotTrack === '1' || navigator.doNotTrack === 'yes')) {
412 | dntEnabled = true;
413 | }
414 | return dntEnabled;
415 | }
416 | var dntEnabled = isDntEnabled();
417 |
418 |
419 | // Get browser's maximum touch points:
420 | const maxTouchPoints = navigator.maxTouchPoints;
421 |
422 |
423 | // Get user's device supports touch
424 | function isTouchDevice() {
425 | return (('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0));
426 | }
427 | if (isTouchDevice()) {
428 | touchSupports = 'This device supports touch';
429 | } else {
430 | touchSupports = 'This device does not support touch';
431 | }
432 |
433 |
434 | // Get VR display support:
435 | const vrDisplaySupport = !!navigator.getVRDisplays;
436 |
437 | // Get speech recognition support
438 | const speechRecognitionSupport = !!window.SpeechRecognition || !!window.webkitSpeechRecognition;
439 |
440 | // Get virtual keyboard support:
441 | const virtualKeyboardSupport = 'visualViewport' in window && 'scrollIntoView' in document.createElement('input');
442 |
443 | // Get device's orientation:
444 | let orientation = window.screen.orientation.type;
445 |
446 |
447 | // Get GPU information:
448 | let gl = document.createElement('canvas').getContext('webgl');
449 | let gpuInfo = gl.getExtension('WEBGL_debug_renderer_info');
450 | let renderer = gl.getParameter(gpuInfo.UNMASKED_RENDERER_WEBGL);
451 | let vendor = gl.getParameter(gpuInfo.UNMASKED_VENDOR_WEBGL);
452 | let WebGLVendor = gl.getParameter(gl.VENDOR);
453 | let WebGLRenderer = gl.getParameter(gl.RENDERER);
454 | let WebGLVersion = gl.getParameter(gl.VERSION);
455 |
456 |
457 | // Get ad blocker check
458 | var adBlockEnabled = false;
459 | var testAd = document.createElement('div');
460 | testAd.innerHTML = ' ';
461 | testAd.className = 'adsbox';
462 | document.body.appendChild(testAd);
463 | window.setTimeout(function() {
464 | if (testAd.offsetHeight === 0) {
465 | adBlockEnabled = true;
466 | }
467 | testAd.remove();
468 | Adblock = adBlockEnabled;
469 | }, 100);
470 |
471 |
472 | // Get Audio formate support:
473 | const audioFormats = ['audio/mpeg', 'audio/mp4', 'audio/ogg', 'audio/wav', 'audio/aac', 'audio/flac', 'audio/alac', 'audio/wma'];
474 | const audioElement = document.createElement('audio');
475 | const supportedAFormats = audioFormats.filter(format => {
476 | const canPlay = audioElement.canPlayType(format);
477 | return canPlay !== '' && canPlay !== 'no';
478 | });
479 | const SupportedAudioFormats = `${supportedAFormats.join(', ')}`;
480 |
481 |
482 | // Get Video format support:
483 | const videoFormats = ['video/mp4', 'video/3gp', 'video/webm', 'video/mkv', 'video/mpeg', 'video/wmv', 'video/m4v', 'video/ogg', 'video/mov', 'video/avi', 'video/flv'];
484 | const videoElement = document.createElement('video');
485 | const supportedVFormats = videoFormats.filter(format => {
486 | const canVPlay = videoElement.canPlayType(format);
487 | return canVPlay !== '' && canVPlay !== 'no';
488 | });
489 | const supportedVideoFormats = supportedVFormats.join(', ');
490 |
491 |
492 | // Get Host name
493 | var hostName = window.location.hostname;
494 |
495 | // Get character encoding :
496 | var acceptCharset = document.characterSet || document.charset;
497 |
498 |
499 | // Get all available sensors:
500 | let sensors = [];
501 | if (typeof(DeviceMotionEvent) !== 'undefined') {
502 | sensors.push('accelerometer');
503 | }
504 | if (typeof(DeviceOrientationEvent) !== 'undefined') {
505 | sensors.push('gyroscope');
506 | }
507 | if (typeof(AmbientLightSensor) !== 'undefined') {
508 | sensors.push('ambient light sensor');
509 | }
510 | if (typeof(AmbientTemperatureSensor) !== 'undefined') {
511 | sensors.push('ambient temperature sensor');
512 | }
513 | if (typeof(ProximitySensor) !== 'undefined') {
514 | sensors.push('proximity sensor');
515 | }
516 | if (typeof(Magnetometer) !== 'undefined') {
517 | sensors.push('magnetometer');
518 | }
519 | if (typeof(AbsoluteOrientationSensor) !== 'undefined') {
520 | sensors.push('absolute orientation sensor');
521 | }
522 | if (typeof(Geolocation) !== 'undefined') {
523 | sensors.push('geolocation');
524 | }
525 | let sensorsWithSpace = sensors.join(', ');
526 |
527 |
528 | // Get timezome
529 | var currenttime = new Date();
530 | const timezone = currenttime.toString().match(/\(([^)]+)\)/)[1];
531 |
532 |
533 | // Get Last visit on site working
534 | var visit;
535 | var visitTimes = JSON.parse(localStorage.getItem("visitTimes")) || [];
536 | visitTimes.push(currenttime.toLocaleString());
537 | localStorage.setItem("visitTimes", JSON.stringify(visitTimes));
538 | var lastVisit = visitTimes.length > 1 ? visitTimes[visitTimes.length - 2] : undefined;
539 | if (lastVisit !== undefined) {
540 | visit = "last visit- " + lastVisit;
541 | } else {
542 | visit = "first visit";
543 | }
544 |
545 |
546 | // Get input Activity
547 | function inputData(event) {
548 | let typedText = event.data;
549 | let inputActivity = event.inputType;
550 |
551 | const typeText = document.getElementById('typed-Text');
552 | if (typeText) {
553 | typeText.innerText = typedText;
554 | }
555 |
556 | const inputactivity = document.getElementById('input-Activity');
557 | if (inputactivity) {
558 | inputactivity.innerText = inputActivity;
559 | }
560 | };
561 |
--------------------------------------------------------------------------------