diff --git a/src/CategoryOverpass.js b/src/CategoryOverpass.js
index 7bb52d12..d92d4a4b 100644
--- a/src/CategoryOverpass.js
+++ b/src/CategoryOverpass.js
@@ -11,8 +11,7 @@ var tabs = require('modulekit-tabs')
var markers = require('./markers')
var maki = require('./maki')
var qs = require('sheet-router/qs')
-var editLink = require('./editLink')
-const objectDisplay = require('./objectDisplay')
+const ObjectDisplay = require('./ObjectDisplay')
const showMore = require('./showMore')
@@ -54,13 +53,6 @@ var defaultValues = {
preferredZoom: 16
},
layouts: {
- popup:
- '
' +
- '{{ object.popupBody|default(object.body) }}
',
list: listTemplate.replace(/template/g, 'list')
},
queryOptions: {
@@ -108,6 +100,7 @@ function CategoryOverpass (options, data, repository) {
data.styleNoBindPopup = [ 'selected' ]
data.stylesNoAutoShow = [ 'selected' ]
data.updateAssets = this.updateAssets.bind(this)
+ data.layouts.popup = () => null
this.layer = new OverpassLayer(data)
@@ -132,11 +125,6 @@ function CategoryOverpass (options, data, repository) {
return
}
- this.updatePopupContent(ob, ob.popup)
-
- // Move close button into the content, to make its position depending whether a scrollbar is visible or not
- ob.popup._contentNode.insertBefore(ob.popup._closeButton, ob.popup._contentNode.firstChild)
-
this.emit('update', object, ob)
}.bind(this))
this.layer.on('add', (ob, data) => this.emit('add', ob, data))
@@ -535,26 +523,9 @@ CategoryOverpass.prototype.notifyPopupOpen = function (object, popup) {
popup._contentNode.style = ''
}
- this.updatePopupContent(object, popup)
this.currentSelected = this.layer.show(object.id, layerOptions, function () {})
-}
-
-CategoryOverpass.prototype.notifyPopupClose = function (object, popup) {
- if (this.currentSelected) {
- this.currentSelected.hide()
- this.currentSelected = null
- }
-
- if (this.currentDetails) {
- this.currentDetails.hide()
- this.currentDetails = null
- }
-}
-
-CategoryOverpass.prototype.updatePopupContent = function (object, popup) {
- let id_with_sublayer = (object.sublayer_id === 'main' ? '' : object.sublayer_id + ':') + object.id
- objectDisplay({
+ this.currentPopupDisplay = new ObjectDisplay({
feature: object,
category: this,
dom: popup._contentNode,
@@ -563,49 +534,25 @@ CategoryOverpass.prototype.updatePopupContent = function (object, popup) {
console.log('popup done')
})
- /*
- if (this.popupBodyTemplate) {
- let popupBody = popup._contentNode.querySelector('#popupBody')
- if (!popupBody) {
- popupBody = document.createElement('div')
- popupBody.className = 'popupBody'
- popupBody.id = 'popupBody'
- popup._contentNode.appendChild(popupBody)
- }
-
- let html = this.popupBodyTemplate.render(object.twigData)
- if (popupBody.currentHTML !== html) {
- popupBody.innerHTML = html
- this.updateAssets(popup._contentNode)
- }
+ // Move close button into the content, to make its position depending whether a scrollbar is visible or not
+ popup._contentNode.insertBefore(popup._closeButton, popup._contentNode.firstChild)
+}
- popupBody.currentHTML = html
+CategoryOverpass.prototype.notifyPopupClose = function (object, popup) {
+ if (this.currentSelected) {
+ this.currentSelected.hide()
+ this.currentSelected = null
}
- let hasBody = false
- Array.from(popup._contentNode.querySelectorAll('.popupBody')).forEach(div => {
- if (!div.innerHTML.match(/^\s*(\s*<\/ul>|)\s*$/)) {
- hasBody = true
- }
- })
- if (hasBody) {
- popup._contentNode.classList.add('hasBody')
- } else {
- popup._contentNode.classList.remove('hasBody')
- }
- */
-
- var footer = popup._contentNode.getElementsByClassName('popup-footer')
- if (!footer.length) {
- footer = document.createElement('ul')
- popup._contentNode.appendChild(footer)
- footer.className = 'popup-footer'
- footer.setAttribute('data-order', 1000)
+ if (this.currentDetails) {
+ this.currentDetails.hide()
+ this.currentDetails = null
}
- var footerContent = '- ' + lang('show details') + '
'
- footerContent += '- ' + editLink(object) + '
'
- footer.innerHTML = footerContent
+ if (this.currentPopupDisplay) {
+ this.currentPopupDisplay.close()
+ delete this.currentPopupDisplay
+ }
}
CategoryOverpass.prototype.renderTemplate = function (object, templateId, callback) {
diff --git a/src/ObjectDisplay.js b/src/ObjectDisplay.js
index 3cc5b4cf..dafdbeae 100644
--- a/src/ObjectDisplay.js
+++ b/src/ObjectDisplay.js
@@ -1,6 +1,7 @@
const exportAll = require('./exportAll')
const tagsDisplay = require('./tagsDisplay').display
const displayBlock = require('./displayBlock')
+const editLink = require('./editLink')
module.exports = class ObjectDisplay {
constructor ({feature, category, dom, displayId, fallbackIds}, callback) {
@@ -54,7 +55,6 @@ module.exports = class ObjectDisplay {
})
category.on('update', this.updateListener = () => {
- console.log('update')
category.renderTemplate(feature, this.displayId + 'Body', (err, result) => {
body.innerHTML = result
feature.sublayer.updateAssets(body, feature)
@@ -105,6 +105,15 @@ module.exports = class ObjectDisplay {
order: 11
})
+ let id_with_sublayer = (feature.sublayer_id === 'main' ? '' : feature.sublayer_id + ':') + feature.id
+ let footerContent = '- ' + lang('show details') + '
'
+ footerContent += '- ' + editLink(feature) + '
'
+ displayBlock({
+ dom,
+ content: '',
+ order: 1000
+ })
+
call_hooks_callback('show-' + this.displayId, feature, category, dom, err => {
if (err.length) {
return callback(err.join(', '))