webpack-bootstrap-ui-kit/src/js_old/_components/_ui.flyout.js

70 lines
1.3 KiB
JavaScript
Raw Normal View History

2022-05-03 20:50:57 +02:00
'use strict'
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
import $ from 'jquery'
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
import Events from '../_events'
import CookieUI from './_ui.cookie'
2019-11-30 09:29:27 +01:00
const FlyoutUI = (($) => {
2022-05-03 20:50:57 +02:00
const W = window
const D = document
const $Body = $('body')
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
const NAME = 'FlyoutUI'
const COOKIE = `${NAME}-hide`
const TIMEOUT = 2000
2019-11-30 09:29:27 +01:00
class FlyoutUI {
2022-05-03 20:50:57 +02:00
static init () {
console.log(`${NAME}: init`)
const ui = this
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
ui.$modal = $(`.flyout-${NAME}`)
2019-11-30 09:29:27 +01:00
2019-12-04 12:19:04 +01:00
if (!ui.$modal.length) {
2022-05-03 20:50:57 +02:00
return false
2019-12-04 12:19:04 +01:00
}
2022-05-03 20:50:57 +02:00
const $close = ui.$modal.find(`.flyout-${NAME}__close`)
ui.$modal.data(NAME, ui)
2019-11-30 09:29:27 +01:00
2019-12-04 12:19:04 +01:00
if ($close.length) {
2022-05-03 20:50:57 +02:00
$close.on('click', () => {
ui.hide()
})
2019-12-04 12:19:04 +01:00
}
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
const hide = CookieUI.get(COOKIE)
2022-05-03 20:50:57 +02:00
if (!$close.length || !hide || hide !== 'true') {
2019-12-04 12:19:04 +01:00
setTimeout(() => {
2022-05-03 20:50:57 +02:00
ui.show()
}, TIMEOUT)
2019-11-30 09:29:27 +01:00
}
}
2022-05-03 20:50:57 +02:00
static show (callback) {
const ui = this
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
ui.$modal.addClass(`flyout-${NAME}__active`)
2019-11-30 09:29:27 +01:00
}
2022-05-03 20:50:57 +02:00
static hide (callback) {
const ui = this
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
CookieUI.set(COOKIE, 'true', 1)
ui.$modal.removeClass(`flyout-${NAME}__active`)
2019-11-30 09:29:27 +01:00
}
}
2020-09-09 17:40:58 +02:00
$(W).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
2022-05-03 20:50:57 +02:00
FlyoutUI.init()
})
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
W.FlyoutUI = FlyoutUI
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
return FlyoutUI
})($)
2019-11-30 09:29:27 +01:00
2022-05-03 20:50:57 +02:00
export default FlyoutUI