Добавлено (2026-04-29, 12:56)
---------------------------------------------
// ОТРИСОВЫВАЕМ ИНТЕРВАЛЫ С ДОКУМЕНТИРОВАНИЕМ
mergedGeology.forEach((geo, index) => {
const top = geo.from * scale + topReserve;
const height = (geo.to - geo.from) * scale;

if (height > 0) {
const convertedStratigraphy = convertStratigraphyText(geo.stratigraphy || 'Не указано');
const decodedStratigraphy = decodeStratigraphyForDisplay(convertedStratigraphy);

// ОСНОВНОЙ КОНТЕЙНЕР
const geologyElement = document.createElement('div');
geologyElement.className = 'geology-interval documented';
geologyElement.setAttribute('data-interval-index', index);
geologyElement.setAttribute('data-from', geo.from);
geologyElement.setAttribute('data-to', geo.to);
geologyElement.style.cssText = `
position: absolute;
top: ${top}px;
left: 100px;
width: ${columnWidth}px;
height: ${height}px;
background: transparent;
z-index: 20;
pointer-events: none;
`;

// ВИЗУАЛЬНЫЙ ЭЛЕМЕНТ
const visualElement = document.createElement('div');

// ИСПРАВЛЕННЫЙ ВЫЗОВ - передаем объект с оригинальной стратиграфией
const backgroundColor = getStratigraphyBackground({
stratigraphy: geo.stratigraphy,
originalStratigraphy: geo.originalStratigraphy
});

visualElement.style.cssText = `
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: ${backgroundColor};
border-left: 2px solid rgba(0,0,0,0.5);
border-right: 2px solid rgba(0,0,0,0.5);
z-index: 21;
pointer-events: none;
`;

// ГРАНИЦЫ МЕЖДУ ИНТЕРВАЛАМИ
if (index > 0) {
const topBorder = document.createElement('div');
topBorder.style.cssText = `
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1px;
background: #000000;
z-index: 24;
pointer-events: none;
`;
visualElement.appendChild(topBorder);
}

const bottomBorder = document.createElement('div');
bottomBorder.style.cssText = `
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background: #000000;
z-index: 24;
pointer-events: none;
`;
visualElement.appendChild(bottomBorder);

// ГЕОЛОГИЧЕСКИЙ КРАП
if (geo.lithology && geo.lithology !== 'Не указано' && geo.lcode) {
const patternOverlay = document.createElement('div');
const patternSize = getPatternSize();
const fileName = window.LITHOLOGY_PATTERNS && window.LITHOLOGY_PATTERNS[geo.lcode];

if (fileName) {
const patternUrl = `litology/${fileName}`;

patternOverlay.style.cssText = `
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url("${patternUrl}");
background-repeat: repeat;
background-size: ${patternSize.width}px ${patternSize.height}px;
background-position: 0 0;
opacity: 0.7;
z-index: 22;
pointer-events: none;
`;

const preloadImage = new Image();
preloadImage.src = patternUrl;

visualElement.appendChild(patternOverlay);
}
}

// ИНДЕКС СТРАТИГРАФИИ - УЛУЧШЕННЫЙ ВИД
if (decodedStratigraphy && decodedStratigraphy !== 'Не указано' && height > 10) {
const stratigraphyLabel = document.createElement('div');

// ИСПРАВЛЕННЫЙ ВЫЗОВ - для текста тоже используем правильный цвет фона
const bgColor = getStratigraphyBackground({
stratigraphy: geo.stratigraphy,
originalStratigraphy: geo.originalStratigraphy
});
const isDarkBackground = isColorDark(bgColor);
const textColor = isDarkBackground ? '#ffffff' : '#000000';

stratigraphyLabel.style.cssText = `
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: ${textColor};
font-size: ${Math.min(11, height / 2)}px;
font-weight: 800;
white-space: nowrap;
background: ${bgColor};
padding: 3px 6px;
border-radius: 0px;
pointer-events: none;
z-index: 23;
max-width: ${columnWidth - 4}px;
overflow: hidden;
text-overflow: ellipsis;
text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
text-align: center;
font-family: 'GeoindexA', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
border: none;
box-shadow: none;
letter-spacing: 0.5px;
`;
stratigraphyLabel.textContent = decodedStratigraphy;
visualElement.appendChild(stratigraphyLabel);
}

// КЛИКАБЕЛЬНЫЙ ОВЕРЛЕЙ (только для интервалов с документированием)
const clickableOverlay = document.createElement('div');
clickableOverlay.className = 'geology-clickable-overlay';
clickableOverlay.setAttribute('data-interval-index', index);
clickableOverlay.style.cssText = `
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;
z-index: 35;
cursor: pointer;
transition: all 0.3s ease;
`;

// Обработчики событий
clickableOverlay.addEventListener('click', function(e) {
e.stopPropagation();
e.preventDefault();
if (window.currentSelectedInterval) {
window.currentSelectedInterval.style.boxShadow = '';
window.currentSelectedInterval.style.background = 'transparent';
window.currentSelectedInterval.style.border = 'none';
}
this.style.boxShadow = '0 0 0 2px #e74c3c, inset 0 0 0 1px rgba(231, 76, 60, 0.3)';
this.style.background = 'rgba(231, 76, 60, 0.1)';
this.style.border = '1px dashed #e74c3c';
window.currentSelectedInterval = this;
const intervalIndex = parseInt(this.getAttribute('data-interval-index'));
highlightCard(intervalIndex);
});

clickableOverlay.addEventListener('mouseenter', function() {
if (this !== window.currentSelectedInterval) {
this.style.background = 'rgba(231, 76, 60, 0.05)';
this.style.border = '1px dashed #e74c3c';
}
});

clickableOverlay.addEventListener('mouseleave', function() {
if (this !== window.currentSelectedInterval) {
this.style.background = 'transparent';
this.style.border = 'none';
}
});