2018-06-18 10:04:08 +02:00
|
|
|
import { Injectable } from '@angular/core'
|
2018-06-15 16:52:15 +02:00
|
|
|
|
|
|
|
@Injectable()
|
|
|
|
export class ScreenService {
|
|
|
|
private windowInnerWidth: number
|
2018-06-18 10:04:08 +02:00
|
|
|
private lastFunctionCallTime: number
|
|
|
|
private cacheForMs = 500
|
2018-06-15 16:52:15 +02:00
|
|
|
|
2018-06-18 10:04:08 +02:00
|
|
|
constructor () {
|
|
|
|
this.refreshWindowInnerWidth()
|
2018-06-15 16:52:15 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
isInSmallView () {
|
2018-09-05 11:20:44 +02:00
|
|
|
return this.getWindowInnerWidth() < 800
|
2018-06-15 16:52:15 +02:00
|
|
|
}
|
|
|
|
|
2020-03-07 13:50:26 +01:00
|
|
|
isInMediumView () {
|
|
|
|
return this.getWindowInnerWidth() < 1100
|
|
|
|
}
|
|
|
|
|
2018-06-15 16:52:15 +02:00
|
|
|
isInMobileView () {
|
2018-06-18 10:04:08 +02:00
|
|
|
return this.getWindowInnerWidth() < 500
|
|
|
|
}
|
|
|
|
|
2019-04-05 14:16:48 +02:00
|
|
|
isInTouchScreen () {
|
|
|
|
return 'ontouchstart' in window || navigator.msMaxTouchPoints
|
|
|
|
}
|
|
|
|
|
2019-08-22 13:59:54 +02:00
|
|
|
getNumberOfAvailableMiniatures () {
|
|
|
|
const screenWidth = this.getWindowInnerWidth()
|
|
|
|
|
|
|
|
let numberOfVideos = 1
|
|
|
|
|
|
|
|
if (screenWidth > 1850) numberOfVideos = 6
|
|
|
|
else if (screenWidth > 1600) numberOfVideos = 5
|
|
|
|
else if (screenWidth > 1370) numberOfVideos = 4
|
|
|
|
else if (screenWidth > 1100) numberOfVideos = 3
|
|
|
|
else if (screenWidth > 850) numberOfVideos = 2
|
|
|
|
|
|
|
|
return numberOfVideos
|
|
|
|
}
|
|
|
|
|
2018-06-18 10:04:08 +02:00
|
|
|
// Cache window inner width, because it's an expensive call
|
2019-08-22 13:59:54 +02:00
|
|
|
getWindowInnerWidth () {
|
2018-06-18 10:04:08 +02:00
|
|
|
if (this.cacheWindowInnerWidthExpired()) this.refreshWindowInnerWidth()
|
|
|
|
|
|
|
|
return this.windowInnerWidth
|
|
|
|
}
|
|
|
|
|
|
|
|
private refreshWindowInnerWidth () {
|
|
|
|
this.lastFunctionCallTime = new Date().getTime()
|
|
|
|
|
|
|
|
this.windowInnerWidth = window.innerWidth
|
|
|
|
}
|
|
|
|
|
|
|
|
private cacheWindowInnerWidthExpired () {
|
2019-04-05 10:52:27 +02:00
|
|
|
if (!this.lastFunctionCallTime) return true
|
|
|
|
|
2018-06-18 10:04:08 +02:00
|
|
|
return new Date().getTime() > (this.lastFunctionCallTime + this.cacheForMs)
|
2018-06-15 16:52:15 +02:00
|
|
|
}
|
|
|
|
}
|