Продолжаем совершенствовать модуль друзей. По мере накопления опыта и расширения функционала проекта было принято решение пересмотреть логику работы скрипта, а также переработать CSS-стили всплывающего окна.

Основной функционал модуля практически не изменился, однако в процессе работы над другими компонентами были выявлены ошибки отображения, связанные с конфликтами стилей. Некоторые CSS-правила сторонних модулей влияли на внешний вид всплывающего окна и нарушали его корректную работу.

В связи с этим было принято решение полностью переработать стили всплывающего окна: сделать их более компактными, независимыми от внешних CSS-конфликтов и визуально приближенными к стилистике социальной сети «ВКонтакте». Это позволило улучшить внешний вид интерфейса, повысить удобство использования и обеспечить более стабильную работу компонента.

Исходный код

Код

<!-- MINI BLOCK ДРУЗЬЯ -->
<div class="vk-old-block">
<div class="vk-old-header">Друзья</div>
<div class="vk-old-footer" id="friends-count">0 друзей</div>

<div class="vk-old-content">
<div class="vk-friends"></div>
</div>

<div class="vk-old-footer" id="friends-footer" title="Показать всех друзей">
Показать всех друзей →
</div>
</div>

<link rel="stylesheet" href="https://bro.usite.pro/css/friends07.css" media="all">

<div id="uc-online-list" style="display:none;">
$ONLINE_USERS_LIST$
</div>

<script>
(function(){
// Максимально надёжное определение USER_ID
let USER_ID = "0";

// Если PHP работает — берём оттуда
const phpId = '<?php echo isset($USER["id"]) ? $USER["id"] : "0"; ?>';
if (phpId && phpId !== '<?php echo' && phpId !== '0') {
USER_ID = phpId;
}
// Запасные варианты uCoz
else {
const macros = ['$USER_ID$', '$UID$', '$USER$'];
for (let m of macros) {
if (m && m !== '$USER_ID$' && m !== '$UID$' && m !== '$USER$' && m.trim() !== '') {
USER_ID = m.trim();
break;
}
}
}

window.UCOZ_FRIENDS_CONFIG = {
USER_ID: USER_ID,
DEFAULT_AVA: '/.s/src/profile/img/profile_photo_thumbnail.png',
LS_FRIENDS: 'friends_' + USER_ID
};

if (USER_ID === "0" || USER_ID === "" || USER_ID.includes('$') || USER_ID.includes('<?php')) {
console.log('%c[VK-Friends] Пользователь не определён — скрипт отключён', 'color:#ff4444');
return;
}

console.log('%c[VK-Friends] USER_ID получен: ' + USER_ID, 'color:#00ff88;font-weight:bold');
})();
</script>

<script src="https://bro.usite.pro/js/parser-bro03.js?v=1"></script>

Мурчанн

1