diff --git a/frontend/src/components/main.js b/frontend/src/components/main.js index 31f7f8b..04fabb5 100644 --- a/frontend/src/components/main.js +++ b/frontend/src/components/main.js @@ -43,10 +43,10 @@ const getUserAgent = () => ({ }); const getLanguage = () => ({ - key: 'userAgent', - title: 'User agent', - value: navigator.userAgent, - issues: checkNavigatorProperties('userAgent'), + key: 'language', + title: 'Language', + value: navigator.language, + issues: checkNavigatorProperties('language'), }); const getLanguages = () => ({ @@ -92,10 +92,10 @@ const getVendor = () => ({ }); const getAppVersion = () => ({ - key: 'vendor', - title: 'Vendor', - value: navigator.vendor, - issues: checkNavigatorProperties('vendor'), + key: 'appVersion', + title: 'App Version', + value: navigator.appVersion, + issues: checkNavigatorProperties('appVersion'), }); const getProductSub = () => ({ @@ -105,6 +105,62 @@ const getProductSub = () => ({ issues: checkNavigatorProperties('productSub'), }); +const getWidth = () => ({ + key: 'width', + title: 'Width', + value: window.screen.width, + issues: checkScreenProperties('width'), +}); + +const getOuterWidth = () => ({ + key: 'outerWidth', + title: 'Outer width', + value: window.outerWidth, + issues: '', +}); + +const getAvailWidth = () => ({ + key: 'availWidth', + title: 'Avail width', + value: window.screen.availWidth, + issues: checkScreenProperties('availWidth'), +}); + +const getHeight = () => ({ + key: 'height', + title: 'Height', + value: window.screen.height, + issues: checkScreenProperties('height'), +}); + +const getOuterHeight = () => ({ + key: 'outerHeight', + title: 'Outer height', + value: window.outerHeight, + issues: '', +}); + +const getAvailHeight = () => ({ + key: 'availHeight', + title: 'Avail height', + value: window.screen.availHeight, + issues: checkScreenProperties('availHeight'), +}); + +const getPixelDepth = () => ({ + key: 'pixelDepth', + title: 'Pixel depth', + value: window.screen.pixelDepth, + issues: checkScreenProperties('pixelDepth'), +}); + +const getColorDepth = () => ({ + key: 'colorDepth', + title: 'Color depth', + value: window.screen.colorDepth, + issues: checkScreenProperties('colorDepth'), +}); + const getNavigator = () => [ getDeviceMemory(), getHardwareConcurrency(), @@ -122,6 +178,17 @@ const getNavigator = () => [ getProductSub(), ]; +const getScreen = () => [ + getWidth(), + getAvailWidth(), + getOuterWidth(), + getHeight(), + getAvailHeight(), + getOuterHeight(), + getPixelDepth(), + getColorDepth(), +]; + // sorts plugins object into comma separated list const sortPlugins = (data) => { const { length } = data; @@ -156,58 +223,6 @@ const checkNavigatorProperties = (key) => { return list.toString().split(',').join('
'); }; -const getScreen = () => { - const data = [ - { - key: 'width', - title: 'Width', - value: window.screen.width, - issues: checkScreenProperties('width'), - }, - // { - // key: 'outerWidth', - // title: 'Outer width', - // value: window.outerWidth, - // }, - { - key: 'availWidth', - title: 'Avail width', - value: window.screen.availWidth, - issues: checkScreenProperties('availWidth'), - }, - { - key: 'height', - title: 'Height', - value: window.screen.height, - issues: checkScreenProperties('height'), - }, - // { - // key: 'outerHeight', - // title: 'Outer height', - // value: window.outerHeight, - // }, - { - key: 'availHeight', - title: 'Avail height', - value: window.screen.availHeight, - issues: checkScreenProperties('availHeight'), - }, - { - key: 'pixelDepth', - title: 'Pixel depth', - value: window.screen.pixelDepth, - issues: checkScreenProperties('pixelDepth'), - }, - { - key: 'colorDepth', - title: 'Color depth', - value: window.screen.colorDepth, - issues: checkScreenProperties('colorDepth'), - }, - ]; - return data; -}; - const checkScreenProperties = (key) => { const list = []; if (Object.getOwnPropertyDescriptor(window.screen, key) !== undefined) {