filo_caspar/app/main/module.js

81 lines
2.3 KiB
JavaScript

const defaults = require('../shared/defaults')
const socket = require('../shared/socket')
// https://stackoverflow.com/questions/4817029/whats-the-best-way-to-detect-a-touch-screen-device-using-javascript/4819886#4819886
// LOL
function is_touch_device() {
var prefixes = ' -webkit- -moz- -o- -ms- '.split(' ')
var mq = function(query) {
return window.matchMedia(query).matches
}
if (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) {
return true
}
// include the 'heartz' as a way to have a non matching MQ to help terminate the join
// https://git.io/vznFH
var query = ['(', prefixes.join('touch-enabled),('), 'heartz', ')'].join('')
return mq(query)
}
module.exports = function Module(module) {
return defaults(module, {
init: function() {},
oninit: function(vnode) {
this._listeners = []
this.init(vnode)
},
_listeners: null,
_socketOn: function(cb) {
socket.on('connect', () => cb())
if (socket.connected) {
cb()
}
},
_initDragula: function(control, cb) {
let dragContainer = document.getElementById('dragcontainer')
let out = dragula([control.dom], {
mirrorContainer: dragContainer,
invalid: el => el.className !== 'graphic-preset-reorder'
&& el.className !== 'graphic-preset',
})
out.on('dragend', () => {
if (is_touch_device()) {
document.body.style.cssText = ''
window.scroll(0, document.body.data)
}
})
out.on('drag', () => {
if (is_touch_device()) {
document.body.data = window.scrollY
document.body.style.cssText = `position: fixed; left: 0; right: 0; overflow: hidden; top: -${window.scrollY}px;`
dragContainer.style.marginTop = `${document.body.data}px`
}
})
out.on('drop', (a, b, c, d) => {
cb(a, d)
})
},
on: function(name, cb) {
this._listeners.push([name, cb])
socket.on(name, cb)
},
remove: function() {},
onremove: function() {
this.remove()
if (!this._listeners) return
for (let i = 0; i < this._listeners.length; i++) {
socket.removeListener(this._listeners[0], this._listeners[1])
}
},
})
}