diff --git a/src/ObjectDisplay.js b/src/ObjectDisplay.js
index 528f3c91..fe4e4356 100644
--- a/src/ObjectDisplay.js
+++ b/src/ObjectDisplay.js
@@ -19,6 +19,7 @@ module.exports = class ObjectDisplay {
let header = document.createElement('div')
header.className = 'header'
+ header.setAttribute('data-order', -1000)
dom.appendChild(header)
div = document.createElement('div')
@@ -34,32 +35,38 @@ module.exports = class ObjectDisplay {
header.appendChild(div)
feature.sublayer.updateAssets(div, feature)
- div = document.createElement('div')
- div.className = 'body'
- dom.appendChild(div)
-
- const updateBody = (div) => {
- div.innerHTML = getProperty(feature.data, 'body', this.displayId, fallbackIds)
- feature.sublayer.updateAssets(div, feature)
- }
-
- feature.object.on('update', updateBody.bind(this, div))
- updateBody(div)
-
let body = document.createElement('div')
body.className = 'body'
- dom.appendChild(body)
- category.renderTemplate(feature, this.displayId + 'Body', (err, result) => {
- body.innerHTML = result
- feature.sublayer.updateAssets(body, feature)
+
+ let bodyCategory = document.createElement('div')
+ body.appendChild(bodyCategory)
+ let bodyTemplate = document.createElement('div')
+ body.appendChild(bodyTemplate)
+
+ let bodyBlock = displayBlock({
+ dom,
+ content: body,
+ order: 0
})
- category.on('update', this.updateListener = () => {
+ this.updateListener = () => {
+ bodyCategory.innerHTML = getProperty(feature.data, 'body', this.displayId, fallbackIds)
+ feature.sublayer.updateAssets(bodyCategory, feature)
+
category.renderTemplate(feature, this.displayId + 'Body', (err, result) => {
- body.innerHTML = result
- feature.sublayer.updateAssets(body, feature)
+ bodyTemplate.innerHTML = result
+ feature.sublayer.updateAssets(bodyTemplate, feature)
+
+ if (bodyTemplate.innerHTML.match(/^\s*(
\s*<\/ul>|)\s*$/) && bodyCategory.innerHTML.match(/^\s*(\s*<\/ul>|)\s*$/)) {
+ bodyBlock.classList.add('empty')
+ } else {
+ bodyBlock.classList.remove('empty')
+ }
})
- })
+ }
+
+ category.on('update', this.updateListener)
+ this.updateListener()
if (['details'].includes(this.displayId)) {
displayBlock({
@@ -115,7 +122,7 @@ module.exports = class ObjectDisplay {
footerContent += '- ' + editLink(feature) + '
'
displayBlock({
dom,
- content: '',
+ content: '',
order: 1000
})
}
diff --git a/src/displayBlock.js b/src/displayBlock.js
index c7ecd83d..32859462 100644
--- a/src/displayBlock.js
+++ b/src/displayBlock.js
@@ -23,6 +23,8 @@ module.exports = function displayBlock ({dom, content, title, order}) {
dom.appendChild(block)
reorder(dom)
+
+ return block
}
function reorder (dom) {
diff --git a/src/image.js b/src/image.js
index 7167846a..01cfba63 100644
--- a/src/image.js
+++ b/src/image.js
@@ -73,14 +73,14 @@ function show (img, options, div) {
}
register_hook('show-details', function (data, category, dom, callback) {
- displayImages(data, category, dom, callback, null)
+ displayImages(data, category, dom, callback, 'details')
})
register_hook('show-popup', function (data, category, dom, callback) {
- displayImages(data, category, dom, callback, 1)
+ displayImages(data, category, dom, callback, 'popup')
})
-function displayImages(data, category, dom, callback, count) {
+function displayImages(data, category, dom, callback, displayId) {
var div = document.createElement('div')
div.className = 'images'
var imageWrapper
@@ -98,17 +98,18 @@ function displayImages(data, category, dom, callback, count) {
currentLoader.next({
counter: data.detailsImageCounter,
wrap: true
- }, function (err, img) {
- if (!img) {
+ }, function (err, data) {
+ if (!data) {
return callback(err)
}
- displayBlock({
+ const block = displayBlock({
dom,
content: div,
- title: lang('images'),
- order: 2
+ title: displayId === 'popup' ? null : lang('images'),
+ order: displayId === 'popup' ? -1 : 2
})
+ block.classList.add('empty')
imageWrapper = document.createElement('div')
imageWrapper.className = 'imageWrapper'
@@ -118,10 +119,16 @@ function displayImages(data, category, dom, callback, count) {
size: Math.max(imageWrapper.offsetWidth, imageWrapper.offsetHeight)
}
- showTimer = window.setInterval(showNext, 5000)
+ let img = show(data, options, imageWrapper)
+ if (img) {
+ img.onload = () => {
+ block.classList.remove('empty')
+ dom.classList.add('hasImage')
+ }
+ }
- show(img, options, imageWrapper)
- if (count !== 1) {
+ if (displayId === 'details') {
+ showTimer = window.setInterval(showNext, 5000)
loadNext()
}
})
@@ -130,12 +137,12 @@ function displayImages(data, category, dom, callback, count) {
currentLoader.next({
counter: data.detailsImageCounter,
wrap: true
- }, function (err, img) {
+ }, function (err, data) {
if (err) {
return console.log("Can't load next image", err)
}
- show(img, options, nextImageWrapper)
+ show(data, options, nextImageWrapper)
})
}