388 lines
12 KiB
JavaScript
388 lines
12 KiB
JavaScript
(function () {
|
|
var selectedAgency = null;
|
|
var agencies = [];
|
|
var isSearching = false;
|
|
var isApplying = false;
|
|
|
|
function $(id) {
|
|
return document.getElementById(id);
|
|
}
|
|
|
|
function t(key, fallback) {
|
|
return window.HyAppI18n && window.HyAppI18n.t
|
|
? window.HyAppI18n.t(key, fallback)
|
|
: fallback || key;
|
|
}
|
|
|
|
function setStatus(key, kind) {
|
|
var node = $('joinAgencyStatus');
|
|
if (!node) return;
|
|
if (!key) {
|
|
node.hidden = true;
|
|
node.textContent = '';
|
|
node.className = 'join-agency-status';
|
|
return;
|
|
}
|
|
node.hidden = false;
|
|
node.className = 'join-agency-status' + (kind ? ' is-' + kind : '');
|
|
node.textContent = t(key);
|
|
}
|
|
|
|
function setStatusMessage(message, kind) {
|
|
var node = $('joinAgencyStatus');
|
|
if (!node) return;
|
|
if (!message) {
|
|
setStatus('');
|
|
return;
|
|
}
|
|
node.hidden = false;
|
|
node.className = 'join-agency-status' + (kind ? ' is-' + kind : '');
|
|
node.textContent = message;
|
|
}
|
|
|
|
function setSearching(searching) {
|
|
isSearching = searching;
|
|
var input = $('agencySearchInput');
|
|
var button = $('agencySearchButton');
|
|
if (input) input.disabled = searching;
|
|
if (button) {
|
|
button.disabled = searching;
|
|
button.textContent = searching
|
|
? t('host_center.searching', 'Searching...')
|
|
: t('host_center.search', 'Search');
|
|
}
|
|
}
|
|
|
|
function setConfirmApplying(applying) {
|
|
isApplying = applying;
|
|
var submit = $('joinConfirmSubmitButton');
|
|
var cancel = $('joinConfirmCancelButton');
|
|
var backdrop = $('joinConfirmBackdrop');
|
|
if (submit) {
|
|
submit.disabled = applying || !selectedAgency;
|
|
submit.textContent = applying
|
|
? t('host_center.applying', 'Submitting...')
|
|
: t('host_center.join', 'Join');
|
|
}
|
|
if (cancel) cancel.disabled = applying;
|
|
if (backdrop) backdrop.disabled = applying;
|
|
document
|
|
.querySelectorAll('.agency-list-join')
|
|
.forEach(function (button) {
|
|
button.disabled = applying;
|
|
});
|
|
}
|
|
|
|
function agencyID(agency) {
|
|
return String((agency && (agency.agency_id || agency.agencyId)) || '');
|
|
}
|
|
|
|
function agencyName(agency) {
|
|
return String((agency && agency.name) || '');
|
|
}
|
|
|
|
function agencyAvatar(agency) {
|
|
return String(
|
|
(agency &&
|
|
(agency.avatar || agency.owner_avatar || agency.ownerAvatar)) ||
|
|
''
|
|
);
|
|
}
|
|
|
|
function agencyHostCount(agency) {
|
|
var value =
|
|
agency &&
|
|
(agency.host_count ||
|
|
agency.hostCount ||
|
|
agency.active_host_count ||
|
|
agency.activeHostCount);
|
|
var count = Number(value || 0);
|
|
return Number.isFinite(count) && count > 0 ? count : 0;
|
|
}
|
|
|
|
function profileAvatar(profile) {
|
|
return String(
|
|
(profile &&
|
|
(profile.avatar ||
|
|
profile.user_avatar ||
|
|
profile.userAvatar ||
|
|
profile.avatar_url ||
|
|
profile.avatarUrl ||
|
|
profile.profile_avatar ||
|
|
profile.profileAvatar)) ||
|
|
''
|
|
);
|
|
}
|
|
|
|
function profileInitial(name) {
|
|
return String(name || '')
|
|
.trim()
|
|
.charAt(0)
|
|
.toUpperCase();
|
|
}
|
|
|
|
function renderProfileAvatar(profile, name) {
|
|
var avatar = $('profileAvatar');
|
|
var fallback = $('profileAvatarFallback');
|
|
if (!avatar || !fallback) return;
|
|
fallback.textContent = profileInitial(name) || 'N';
|
|
|
|
var src = profileAvatar(profile);
|
|
if (!src) {
|
|
avatar.hidden = true;
|
|
avatar.removeAttribute('src');
|
|
fallback.hidden = false;
|
|
return;
|
|
}
|
|
|
|
avatar.onerror = function () {
|
|
avatar.hidden = true;
|
|
avatar.removeAttribute('src');
|
|
fallback.hidden = false;
|
|
};
|
|
avatar.onload = function () {
|
|
avatar.hidden = false;
|
|
fallback.hidden = true;
|
|
};
|
|
fallback.hidden = true;
|
|
avatar.hidden = false;
|
|
avatar.src = src;
|
|
}
|
|
|
|
function hostCountText(count) {
|
|
if (count === 1) return t('host_center.host_count_one', '1 host');
|
|
return t('host_center.host_count_many', '{count} hosts').replace(
|
|
'{count}',
|
|
String(count)
|
|
);
|
|
}
|
|
|
|
function appendFallbackAvatar(avatar, name) {
|
|
var span = document.createElement('span');
|
|
span.textContent = name.trim().charAt(0).toUpperCase() || 'A';
|
|
avatar.appendChild(span);
|
|
}
|
|
|
|
function createAgencyAvatar(agency) {
|
|
var avatar = document.createElement('div');
|
|
var name = agencyName(agency) || t('host_center.agency', 'Agency');
|
|
avatar.className = 'agency-list-avatar';
|
|
if (!agencyAvatar(agency)) {
|
|
appendFallbackAvatar(avatar, name);
|
|
return avatar;
|
|
}
|
|
var img = document.createElement('img');
|
|
img.src = agencyAvatar(agency);
|
|
img.alt = '';
|
|
img.addEventListener('error', function () {
|
|
avatar.textContent = '';
|
|
appendFallbackAvatar(avatar, name);
|
|
});
|
|
avatar.appendChild(img);
|
|
return avatar;
|
|
}
|
|
|
|
function createAgencyRow(agency) {
|
|
var row = document.createElement('div');
|
|
var name = agencyName(agency) || t('host_center.agency', 'Agency');
|
|
row.className = 'agency-list-item';
|
|
|
|
var copy = document.createElement('div');
|
|
copy.className = 'agency-list-copy';
|
|
|
|
var title = document.createElement('div');
|
|
title.className = 'agency-list-name';
|
|
title.textContent = name;
|
|
|
|
var meta = document.createElement('div');
|
|
meta.className = 'agency-list-meta';
|
|
meta.textContent = hostCountText(agencyHostCount(agency));
|
|
|
|
var join = document.createElement('button');
|
|
join.className = 'agency-list-join';
|
|
join.type = 'button';
|
|
join.textContent = t('host_center.join', 'Join');
|
|
join.disabled = isApplying;
|
|
join.addEventListener('click', function () {
|
|
openJoinConfirm(agency);
|
|
});
|
|
|
|
copy.appendChild(title);
|
|
copy.appendChild(meta);
|
|
row.appendChild(createAgencyAvatar(agency));
|
|
row.appendChild(copy);
|
|
row.appendChild(join);
|
|
return row;
|
|
}
|
|
|
|
function renderAgencyList(items) {
|
|
var list = $('agencyList');
|
|
if (!list) return;
|
|
list.textContent = '';
|
|
agencies = items || [];
|
|
if (!agencies.length) {
|
|
var empty = document.createElement('div');
|
|
empty.className = 'agency-list-empty';
|
|
empty.id = 'agencyListEmpty';
|
|
empty.textContent = t(
|
|
'host_center.no_agency',
|
|
'No agency found in your country.'
|
|
);
|
|
list.appendChild(empty);
|
|
return;
|
|
}
|
|
agencies.forEach(function (agency) {
|
|
list.appendChild(createAgencyRow(agency));
|
|
});
|
|
}
|
|
|
|
function updateConfirmMessage() {
|
|
var message = $('joinConfirmMessage');
|
|
if (!message) return;
|
|
var name =
|
|
agencyName(selectedAgency) || t('host_center.agency', 'Agency');
|
|
message.textContent = t(
|
|
'host_center.join_confirm_message',
|
|
'Are you sure you want to join {agency}?'
|
|
).replace('{agency}', name);
|
|
}
|
|
|
|
function openJoinConfirm(agency) {
|
|
selectedAgency = agency || null;
|
|
var modal = $('joinConfirmModal');
|
|
if (!modal || !selectedAgency) return;
|
|
updateConfirmMessage();
|
|
modal.hidden = false;
|
|
modal.setAttribute('aria-hidden', 'false');
|
|
document.body.classList.add('daily-modal-open');
|
|
setConfirmApplying(false);
|
|
}
|
|
|
|
function closeJoinConfirm(force) {
|
|
if (isApplying && !force) return;
|
|
var modal = $('joinConfirmModal');
|
|
if (!modal) return;
|
|
modal.hidden = true;
|
|
modal.setAttribute('aria-hidden', 'true');
|
|
document.body.classList.remove('daily-modal-open');
|
|
selectedAgency = null;
|
|
setConfirmApplying(false);
|
|
}
|
|
|
|
function searchAgency(event) {
|
|
if (event) event.preventDefault();
|
|
if (!window.HyAppAPI || !window.HyAppAPI.host) return;
|
|
var input = $('agencySearchInput');
|
|
var shortID = input ? input.value.trim() : '';
|
|
setStatus('host_center.loading_agencies');
|
|
setSearching(true);
|
|
window.HyAppAPI.host
|
|
.searchAgencies(shortID, 100)
|
|
.then(function (data) {
|
|
var items = (data && (data.items || data.agencies)) || [];
|
|
setStatus('');
|
|
renderAgencyList(items);
|
|
})
|
|
.catch(function () {
|
|
renderAgencyList([]);
|
|
setStatus('host_center.search_failed', 'error');
|
|
})
|
|
.finally(function () {
|
|
setSearching(false);
|
|
});
|
|
}
|
|
|
|
function applyAgency() {
|
|
if (!selectedAgency || !window.HyAppAPI || !window.HyAppAPI.host)
|
|
return;
|
|
setStatus('host_center.applying');
|
|
setConfirmApplying(true);
|
|
window.HyAppAPI.host
|
|
.applyToAgency({
|
|
agency_id: agencyID(selectedAgency),
|
|
command_id:
|
|
'host_apply_' +
|
|
Date.now() +
|
|
'_' +
|
|
Math.random().toString(16).slice(2),
|
|
})
|
|
.then(function () {
|
|
closeJoinConfirm(true);
|
|
setStatus('host_center.apply_success', 'success');
|
|
})
|
|
.catch(function (error) {
|
|
if (error && error.status === 409) {
|
|
setStatus('');
|
|
return;
|
|
}
|
|
setStatusMessage(
|
|
(error && error.message) ||
|
|
t(
|
|
'host_center.apply_failed',
|
|
'Application failed. Try again later.'
|
|
),
|
|
'error'
|
|
);
|
|
})
|
|
.finally(function () {
|
|
setConfirmApplying(false);
|
|
});
|
|
}
|
|
|
|
function renderUser(current) {
|
|
var user = current && current.user;
|
|
var profile = user && (user.profile || user.user || user);
|
|
if (!profile) return;
|
|
var name = profile.username || profile.name || profile.nickname || '';
|
|
var uid =
|
|
profile.display_user_id ||
|
|
profile.displayUserId ||
|
|
profile.user_id ||
|
|
profile.userId ||
|
|
'';
|
|
if (name && $('profileName')) {
|
|
$('profileName').removeAttribute('data-i18n');
|
|
$('profileName').textContent = name;
|
|
}
|
|
if (uid && $('profileUID')) {
|
|
$('profileUID').removeAttribute('data-i18n');
|
|
$('profileUID').textContent = 'UID: ' + uid;
|
|
}
|
|
renderProfileAvatar(profile, name);
|
|
}
|
|
|
|
function init() {
|
|
if (window.HyAppParams) {
|
|
window.HyAppParams.parse();
|
|
window.HyAppParams.loadUser()
|
|
.then(renderUser)
|
|
.catch(function () {});
|
|
}
|
|
var form = $('joinAgencyForm');
|
|
if (form) form.addEventListener('submit', searchAgency);
|
|
var submit = $('joinConfirmSubmitButton');
|
|
if (submit) submit.addEventListener('click', applyAgency);
|
|
var cancel = $('joinConfirmCancelButton');
|
|
if (cancel) cancel.addEventListener('click', closeJoinConfirm);
|
|
var backdrop = $('joinConfirmBackdrop');
|
|
if (backdrop) backdrop.addEventListener('click', closeJoinConfirm);
|
|
var backButton = $('backButton');
|
|
if (backButton) {
|
|
backButton.addEventListener('click', function () {
|
|
if (window.HyAppBridge) window.HyAppBridge.back();
|
|
});
|
|
}
|
|
searchAgency();
|
|
}
|
|
|
|
window.addEventListener('hyapp:i18n-ready', function () {
|
|
var searching = isSearching;
|
|
setSearching(searching);
|
|
if (!searching) renderAgencyList(agencies);
|
|
if (selectedAgency) updateConfirmMessage();
|
|
setConfirmApplying(isApplying);
|
|
});
|
|
|
|
document.addEventListener('DOMContentLoaded', init);
|
|
})();
|