You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
215 lines
4.8 KiB
215 lines
4.8 KiB
/* global lang, ui_lang, options, alert */
|
|
/* eslint camelcase: 0 */
|
|
var OpenStreetBrowserLoader = require('./OpenStreetBrowserLoader')
|
|
var tabs = require('modulekit-tabs')
|
|
const ee = require('event-emitter')
|
|
|
|
function CategoryBase (options, data, repository) {
|
|
if (typeof options === 'string') {
|
|
this.id = options
|
|
this.options = {}
|
|
} else {
|
|
this.id = options.id
|
|
this.options = options
|
|
}
|
|
this.repository = repository
|
|
this.parentCategory = null
|
|
this.childrenLoadingCount = 0
|
|
this.data = data
|
|
this.isOpen = false
|
|
this.dom = document.createElement('div')
|
|
this.dom.className = 'category category-' + data.type
|
|
var name
|
|
var a
|
|
|
|
this.domHeader = document.createElement('header')
|
|
this.dom.appendChild(this.domHeader)
|
|
|
|
if ('name' in this.data) {
|
|
if (typeof this.data.name === 'object') {
|
|
name = lang(this.data.name)
|
|
} else {
|
|
name = this.data.name
|
|
}
|
|
} else if (('name:' + ui_lang) in this.data) {
|
|
name = this.data['name:' + ui_lang]
|
|
} else {
|
|
name = lang('category:' + this.id)
|
|
}
|
|
|
|
a = document.createElement('a')
|
|
a.appendChild(document.createTextNode(name))
|
|
a.href = '#'
|
|
a.onclick = this.toggle.bind(this)
|
|
this.domHeader.appendChild(a)
|
|
|
|
if (this.options.repositoryId && this.options.repositoryId !== 'default') {
|
|
a = document.createElement('span')
|
|
a.className = 'repoId'
|
|
a.appendChild(document.createTextNode(this.options.repositoryId))
|
|
this.domHeader.appendChild(a)
|
|
}
|
|
|
|
if (this.shallShowReload()) {
|
|
a = document.createElement('a')
|
|
a.appendChild(document.createTextNode('⟳'))
|
|
a.title = lang('reload')
|
|
a.className = 'reload'
|
|
a.onclick = function () {
|
|
var id = this.id
|
|
var isOpen = this.isOpen
|
|
|
|
this.reload(function (err, category) {
|
|
if (err) {
|
|
alert('Error reloading category ' + id + ': ' + err)
|
|
}
|
|
|
|
if (isOpen) {
|
|
category.open()
|
|
}
|
|
})
|
|
}.bind(this)
|
|
this.domHeader.appendChild(a)
|
|
}
|
|
|
|
this.tools = new tabs.Tabs(this.dom)
|
|
this.tools.node.classList.add('tools')
|
|
|
|
this.domContent = document.createElement('div')
|
|
this.domContent.className = 'content'
|
|
this.dom.appendChild(this.domContent)
|
|
}
|
|
|
|
CategoryBase.prototype.load = function (callback) {
|
|
callback()
|
|
}
|
|
|
|
CategoryBase.prototype.shallShowReload = function () {
|
|
return options.debug
|
|
}
|
|
|
|
CategoryBase.prototype.setMap = function (map) {
|
|
this.map = map
|
|
}
|
|
|
|
CategoryBase.prototype.setParent = function (parent) {
|
|
this.parentCategory = parent
|
|
|
|
if (this.isOpen) {
|
|
this.parentCategory.open()
|
|
}
|
|
}
|
|
|
|
CategoryBase.prototype.setParentDom = function (parentDom) {
|
|
this.parentDom = parentDom
|
|
if (typeof this.parentDom !== 'string') {
|
|
this.parentDom.appendChild(this.dom)
|
|
|
|
if (this.isOpen) {
|
|
this.parentDom.parentNode.classList.add('open')
|
|
}
|
|
}
|
|
}
|
|
|
|
CategoryBase.prototype.open = function () {
|
|
if (this.isOpen) {
|
|
return
|
|
}
|
|
|
|
if (this.parentCategory) {
|
|
this.parentCategory.open()
|
|
}
|
|
|
|
if (typeof this.parentDom === 'string') {
|
|
var d = document.getElementById(this.parentDom)
|
|
if (d) {
|
|
this.parentDom = d
|
|
this.parentDom.appendChild(this.dom)
|
|
}
|
|
}
|
|
|
|
this.dom.classList.add('open')
|
|
|
|
this.isOpen = true
|
|
|
|
call_hooks('categoryOpen', this)
|
|
this.emit('open')
|
|
}
|
|
|
|
CategoryBase.prototype.close = function () {
|
|
if (!this.isOpen) {
|
|
return
|
|
}
|
|
|
|
this.dom.classList.remove('open')
|
|
|
|
this.isOpen = false
|
|
|
|
call_hooks('categoryClose', this)
|
|
this.emit('close')
|
|
}
|
|
|
|
CategoryBase.prototype.toggle = function () {
|
|
if (this.isOpen) {
|
|
this.close()
|
|
} else {
|
|
this.open()
|
|
}
|
|
|
|
return false
|
|
}
|
|
|
|
CategoryBase.prototype.reload = function (callback) {
|
|
var parentCategory = this.parentCategory
|
|
var parentDom = this.parentDom
|
|
|
|
OpenStreetBrowserLoader.forget(this.id)
|
|
|
|
OpenStreetBrowserLoader.getCategory(this.id, { force: true }, function (err, category) {
|
|
if (err) {
|
|
return callback(err)
|
|
}
|
|
|
|
category.setParent(parentCategory)
|
|
category.setParentDom(parentDom)
|
|
|
|
callback(null, category)
|
|
})
|
|
}
|
|
|
|
CategoryBase.prototype.remove = function () {
|
|
this.close()
|
|
|
|
if (this.parentDom) {
|
|
this.parentDom.removeChild(this.dom)
|
|
}
|
|
}
|
|
|
|
CategoryBase.prototype.recalc = function () {
|
|
}
|
|
|
|
CategoryBase.prototype.notifyChildLoadStart = function (category) {
|
|
if (this.childrenLoadingCount === 0 && this.parentCategory) {
|
|
this.parentCategory.notifyChildLoadStart(this)
|
|
} else {
|
|
document.body.classList.add('loading')
|
|
}
|
|
this.childrenLoadingCount++
|
|
}
|
|
|
|
CategoryBase.prototype.notifyChildLoadEnd = function (category) {
|
|
this.childrenLoadingCount--
|
|
if (this.childrenLoadingCount === 0 && this.parentCategory) {
|
|
this.parentCategory.notifyChildLoadEnd(this)
|
|
} else {
|
|
document.body.classList.remove('loading')
|
|
}
|
|
}
|
|
|
|
CategoryBase.prototype.allMapFeatures = function (callback) {
|
|
callback(null, [])
|
|
}
|
|
|
|
ee(CategoryBase.prototype)
|
|
|
|
module.exports = CategoryBase
|