deepcrayon
/
lila
1
0
Fork 0
Code Releases Activity

rewrite watchers widget

refactor-site-js
Thibault Duplessis 2020-09-04 17:20:09 +02:00
parent f6acd7b318
commit 99a7c91541
3 changed files with 35 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
ui/site/src/component/friends-widget.ts → ui/site/src/component/friends.ts
View File

59
ui/site/src/component/watchers-widget.ts
View File

@ -1,29 +1,32 @@
import widget from './widget';
import pubsub from './pubsub';
export default function loadWatchersWidget() {
let watchersData;
widget('watchers', {
_create: function() {
this.list = this.element.find(".list");
this.number = this.element.find(".number");
pubsub.on('socket.in.crowd', data => this.set(data.watchers || data));
watchersData && this.set(watchersData);
},
set: function(data) {
watchersData = data;
if (!data || !data.nb) return this.element.addClass('none');
if (this.number.length) this.number.text(data.nb);
if (data.users) {
const tags = data.users.map(u =>
u ? `<a class="user-link ulpt" href="/@/${u.includes(' ') ? u.split(' ')[1] : u}">${u}</a>` : 'Anonymous'
);
if (data.anons === 1) tags.push('Anonymous');
else if (data.anons) tags.push('Anonymous (' + data.anons + ')');
this.list.html(tags.join(', '));
} else if (!this.number.length) this.list.html(data.nb + ' players in the chat');
this.element.removeClass('none');
}
});
interface Data {
nb: number;
users?: string[];
anons?: number;
watchers?: Data;
}
let watchersData: Data | undefined;
export default function watchers(element: HTMLElement) {
const listEl: HTMLElement | null = element.querySelector('.list');
const numberEl: HTMLElement | null = element.querySelector('.number');
window.lichess.pubsub.on('socket.in.crowd', data => set(data.watchers || data));
const set = (data: Data) => {
watchersData = data;
if (!data || !data.nb) return element.classList.add('none');
if (numberEl) numberEl.textContent = '' + data.nb;
if (data.users && listEl) {
const tags = data.users.map(u =>
u ? `<a class="user-link ulpt" href="/@/${u.includes(' ') ? u.split(' ')[1] : u}">${u}</a>` : 'Anonymous'
);
if (data.anons === 1) tags.push('Anonymous');
else if (data.anons) tags.push('Anonymous (' + data.anons + ')');
listEl.innerHTML = tags.join(', ');
} else if (!numberEl && listEl) listEl.innerHTML = `${data.nb} players in the chat`;
element.classList.remove('none');
}
if (watchersData) set(watchersData);
}

8
ui/site/src/site.ts
View File

@ -16,17 +16,16 @@ import loadInfiniteScroll from "./component/infinite-scroll";
import { storage } from "./component/storage";
import { assetUrl } from "./component/assets";
import serviceWorker from "./component/service-worker";
import loadWatchersWidget from "./component/watchers-widget";
import loadClockWidget from "./component/clock-widget";
import info from "./component/info";
import OnlineFriends from "./component/friends-widget";
import OnlineFriends from "./component/friends";
import watchers from "./component/watchers-widget";
exportLichessGlobals();
window.lichess.info = info;
window.lichess.load.then(() => {
loadWatchersWidget();
loadClockWidget();
moduleLaunchers();
@ -154,7 +153,8 @@ window.lichess.load.then(() => {
pubsub.on('content_loaded', miniBoard.initAll);
pubsub.on('content_loaded', miniGame.initAll);
$('.chat__members').watchers();
const chatMembers = document.querySelector('.chat__members') as HTMLElement | null;
if (chatMembers) watchers(chatMembers);
if (location.hash === '#blind' && !$('body').hasClass('blind-mode'))
$.post('/toggle-blind-mode', {