Fix the icon toggling.

This commit is contained in:
David Molineus
2017-10-12 12:06:51 +02:00
parent d952e6fc48
commit 03896940ac
4 changed files with 80 additions and 4 deletions

View File

@@ -43,6 +43,7 @@ array_insert(
),
'icon' => 'bundles/netzmachtcontaoleaflet/img/layers.png',
'stylesheet' => 'bundles/netzmachtcontaoleaflet/css/backend.css',
'javascript' => 'bundles/netzmachtcontaoleaflet/js/backend.js'
),
'leaflet_about' => array
(

View File

@@ -111,7 +111,8 @@ $GLOBALS['TL_DCA']['tl_leaflet_layer'] = [
'toggle' => [
'label' => &$GLOBALS['TL_LANG']['tl_leaflet_layer']['toggle'],
'icon' => 'visible.gif',
'attributes' => 'onclick="Backend.getScrollOffset();return AjaxRequest.toggleVisibility(this,%s)"',
'attributes' => 'onclick="Backend.getScrollOffset();
return ContaoLeafletAjaxRequest.toggleVisibility(this,%s)"',
'button_callback' => [
'netzmacht.contao_toolkit.dca.listeners.state_button_callback',
'handleButtonCallback',

View File

@@ -0,0 +1,64 @@
/**
* Contao Open Source CMS
*
* Copyright (c) 2005-2017 Leo Feyer
*
* @license LGPL-3.0+
*/
/**
* Provide methods to handle Ajax requests.
*
* @author Leo Feyer <https://github.com/leofeyer>
*/
var ContaoLeafletAjaxRequest = {
/**
* Toggle the visibility of an element
*
* @param {object} el The DOM element
* @param {string} id The ID of the target element
* @param {string} table The table name
*
* @returns {boolean}
*/
toggleVisibility: function (el, id, table) {
el.blur();
var img = null,
image = $(el).getFirst('img'),
published = (image.get('data-state') == 1),
div = el.getParent('div'),
index, next, icon, icond, pa;
img = div.getParent('li').getFirst('.tl_left img.list-icon');
// Change the icon
if (img !== null && img.nodeName.toLowerCase() == 'img') {
icon = img.get('data-icon');
icond = img.get('data-icon-disabled');
img.src = !published ? icon : icond;
}
// Send request
if (!published) {
image.src = AjaxRequest.themePath + 'icons/visible.svg';
image.set('data-state', 1);
new Request.Contao({'url': window.location.href, 'followRedirects': false}).get({
'tid': id,
'state': 1,
'rt': Contao.request_token
});
} else {
image.src = AjaxRequest.themePath + 'icons/invisible.svg';
image.set('data-state', 0);
new Request.Contao({'url': window.location.href, 'followRedirects': false}).get({
'tid': id,
'state': 0,
'rt': Contao.request_token
});
}
return false;
}
};

View File

@@ -168,12 +168,22 @@ class LayerDcaListener extends AbstractListener
$src = 'iconPLAIN.gif';
}
$activeIcon = $src;
$disabledIcon = preg_replace('/(\.[^\.]+)$/', '_1$1', $src);
if (!$row['active']) {
$src = preg_replace('/(\.[^\.]+)$/', '_1$1', $src);
$src = $disabledIcon;
}
$alt = $this->getFormatter()->formatValue('type', $row['type']);
$icon = Image::getHtml($src, $alt, sprintf('title="%s"', StringUtil::specialchars(strip_tags($alt))));
$alt = $this->getFormatter()->formatValue('type', $row['type']);
$attributes = sprintf(
'class="list-icon" title="%s" data-icon="%s" data-icon-disabled="%s"',
StringUtil::specialchars(strip_tags($alt)),
$activeIcon,
$disabledIcon
);
$icon = Image::getHtml($src, $alt, $attributes);
$label = $this->labelRenderer->render($row, $label, $this->translator);
return $icon . ' ' . $label;