gab-social/app/javascript/gabsocial/utils/is_mobile.js

77 lines
2.0 KiB
JavaScript
Raw Normal View History

2020-02-19 23:57:07 +00:00
'use strict'
2019-07-02 08:10:25 +01:00
2020-02-19 23:57:07 +00:00
import detectPassiveEvents from 'detect-passive-events'
2019-07-02 08:10:25 +01:00
2020-02-19 23:57:07 +00:00
const BREAKPOINT_EXTRA_LARGE = 1480
const BREAKPOINT_LARGE = 1280
const BREAKPOINT_MEDIUM = 1160
const BREAKPOINT_SMALL = 1080
const BREAKPOINT_EXTRA_SMALL = 992
2020-03-25 03:08:43 +00:00
const LAYOUT_BREAKPOINT = 630
export function isMobile(width) {
return width <= LAYOUT_BREAKPOINT
}
2020-02-19 23:57:07 +00:00
export function breakpointExtraLarge(width) {
return width > BREAKPOINT_EXTRA_LARGE
}
export function breakpointLarge(width) {
2020-04-09 20:18:14 +01:00
return width < BREAKPOINT_LARGE
2020-02-19 23:57:07 +00:00
}
export function breakpointMedium(width) {
2020-04-09 20:18:14 +01:00
return width < BREAKPOINT_MEDIUM
2020-02-19 23:57:07 +00:00
}
export function breakpointSmall(width) {
2020-04-09 20:18:14 +01:00
return width < BREAKPOINT_SMALL
2020-02-19 23:57:07 +00:00
}
export function breakpointExtraSmall(width) {
return width < BREAKPOINT_EXTRA_SMALL
}
2020-02-28 15:20:47 +00:00
export function getScreenBreakpoint(width) {
if (width > BREAKPOINT_EXTRA_LARGE) {
return 'BREAKPOINT_EXTRA_LARGE'
} else if (width > BREAKPOINT_MEDIUM && width < BREAKPOINT_LARGE) {
return 'BREAKPOINT_LARGE'
} else if (width > BREAKPOINT_SMALL && width < BREAKPOINT_MEDIUM) {
return 'BREAKPOINT_MEDIUM'
} else if (width > BREAKPOINT_EXTRA_SMALL && width < BREAKPOINT_SMALL) {
return 'BREAKPOINT_SMALL'
} else {
return 'BREAKPOINT_EXTRA_SMALL'
}
}
2020-03-25 03:08:43 +00:00
export const getWindowDimension = () => {
const width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
const height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
2020-04-08 02:06:59 +01:00
2020-03-25 03:08:43 +00:00
return { width, height }
2020-02-19 23:57:07 +00:00
}
2019-07-02 08:10:25 +01:00
2020-02-19 23:57:07 +00:00
const iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream
2019-07-02 08:10:25 +01:00
2020-02-19 23:57:07 +00:00
let userTouching = false
2020-04-08 02:06:59 +01:00
const listenerOptions = detectPassiveEvents.hasSupport ? { passive: true } : false
2019-07-02 08:10:25 +01:00
function touchListener() {
2020-02-19 23:57:07 +00:00
userTouching = true
window.removeEventListener('touchstart', touchListener, listenerOptions)
2019-07-02 08:10:25 +01:00
}
2020-02-19 23:57:07 +00:00
window.addEventListener('touchstart', touchListener, listenerOptions)
2019-07-02 08:10:25 +01:00
export function isUserTouching() {
2020-02-19 23:57:07 +00:00
return userTouching
2019-07-02 08:10:25 +01:00
}
export function isIOS() {
2020-02-19 23:57:07 +00:00
return iOS
}