refactor: extended village profile - use /api/v2
ci/woodpecker/push/test Pipeline was successful
Details
ci/woodpecker/push/test Pipeline was successful
Details
This commit is contained in:
parent
a2fb6425a0
commit
af3fffae43
|
@ -31,7 +31,7 @@ const metadata = {
|
||||||
// ==/UserScript==`,
|
// ==/UserScript==`,
|
||||||
'extended-village-profile': `// ==UserScript==
|
'extended-village-profile': `// ==UserScript==
|
||||||
// @name Extended village profile
|
// @name Extended village profile
|
||||||
// @version 1.0.4
|
// @version 1.1.0
|
||||||
// @description Adds additional info and actions on a village overview.
|
// @description Adds additional info and actions on a village overview.
|
||||||
// @author Dawid Wysokiński - Kichiyaki - contact@twhelp.app
|
// @author Dawid Wysokiński - Kichiyaki - contact@twhelp.app
|
||||||
// @match https://*/game.php?*screen=info_village*
|
// @match https://*/game.php?*screen=info_village*
|
||||||
|
|
|
@ -0,0 +1,132 @@
|
||||||
|
import { createTranslationFunc } from '../utils';
|
||||||
|
|
||||||
|
const t = createTranslationFunc({
|
||||||
|
pl_PL: {
|
||||||
|
Loading: 'Wczytywanie',
|
||||||
|
'Previous page': 'Poprzednia strona',
|
||||||
|
'Next page': 'Następna strona',
|
||||||
|
'Something went wrong while loading the data':
|
||||||
|
'Coś poszło nie tak podczas wczytywania danych',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
export type DialogTableColumn<T> = {
|
||||||
|
header: string;
|
||||||
|
accessor: (row: T, index: number, rows: T[]) => string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type Cursor = {
|
||||||
|
next?: string;
|
||||||
|
self?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type LoadDataResult<T> = {
|
||||||
|
cursor?: Cursor;
|
||||||
|
data: T[];
|
||||||
|
};
|
||||||
|
|
||||||
|
export class DialogTableV2<T> {
|
||||||
|
private readonly prevPageId: string;
|
||||||
|
private readonly nextPageId: string;
|
||||||
|
|
||||||
|
private readonly prevCursors: Cursor[] = [];
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private readonly id: string,
|
||||||
|
private readonly columns: DialogTableColumn<T>[],
|
||||||
|
private readonly limit: number,
|
||||||
|
private readonly loadData: (
|
||||||
|
cursor: string | undefined,
|
||||||
|
limit: number
|
||||||
|
) => Promise<LoadDataResult<T>>
|
||||||
|
) {
|
||||||
|
this.prevPageId = `${this.id}_page_prev`;
|
||||||
|
this.nextPageId = `${this.id}_page_next`;
|
||||||
|
}
|
||||||
|
|
||||||
|
public async render() {
|
||||||
|
await this.renderPage();
|
||||||
|
}
|
||||||
|
|
||||||
|
private async renderPage(pageCursor?: string) {
|
||||||
|
window.Dialog.show(this.id, `<p>${t('Loading')}...</p>`);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const { data, cursor } = await this.loadData(pageCursor, this.limit);
|
||||||
|
|
||||||
|
window.Dialog.show(
|
||||||
|
this.id,
|
||||||
|
`
|
||||||
|
${this.buildPagination(cursor)}
|
||||||
|
${this.buildTable(data)}
|
||||||
|
`
|
||||||
|
);
|
||||||
|
|
||||||
|
this.addEventListeners(cursor);
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
window.Dialog.close();
|
||||||
|
window.UI.ErrorMessage(t('Something went wrong while loading the data'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private buildPagination(cursor?: Cursor): string {
|
||||||
|
return `
|
||||||
|
<div style="display: flex; flex-direction: row; align-items: center; justify-content: center; margin-bottom: 10px">
|
||||||
|
<button title="${t(
|
||||||
|
'Previous page'
|
||||||
|
)}" style="margin-right: 5px" class="btn" id="${this.prevPageId}"${
|
||||||
|
this.prevCursors.length === 0 ? ' disabled' : ''
|
||||||
|
}><</button>
|
||||||
|
<button title="${t('Next page')}" class="btn" id="${
|
||||||
|
this.nextPageId
|
||||||
|
}"${!cursor?.next ? ' disabled' : ''}>></button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
private buildTable(data: T[]) {
|
||||||
|
return `
|
||||||
|
<table style="width: 100%" class="vis">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
${this.columns.map((col) => `<th>${col.header}</th>`).join('')}
|
||||||
|
</tr>
|
||||||
|
${data
|
||||||
|
.map(
|
||||||
|
(r, index) => `
|
||||||
|
<tr>
|
||||||
|
${this.columns
|
||||||
|
.map((col) => `<td>${col.accessor(r, index, data)}</td>`)
|
||||||
|
.join('')}
|
||||||
|
</tr>
|
||||||
|
`
|
||||||
|
)
|
||||||
|
.join('')}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
private addEventListeners(cursor?: Cursor) {
|
||||||
|
document
|
||||||
|
.querySelector('#' + this.prevPageId)
|
||||||
|
?.addEventListener('click', () => {
|
||||||
|
const prev = this.prevCursors.pop();
|
||||||
|
if (!prev) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.renderPage(prev.self);
|
||||||
|
});
|
||||||
|
|
||||||
|
document
|
||||||
|
.querySelector('#' + this.nextPageId)
|
||||||
|
?.addEventListener('click', () => {
|
||||||
|
if (!cursor) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.prevCursors.push(cursor);
|
||||||
|
this.renderPage(cursor.next);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
|
@ -55,7 +55,7 @@ class TWHelpConnector {
|
||||||
private readonly client: TWHelpV2Client;
|
private readonly client: TWHelpV2Client;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private readonly baseUrl: string,
|
readonly baseUrl: string,
|
||||||
private readonly version: string,
|
private readonly version: string,
|
||||||
private readonly server: string
|
private readonly server: string
|
||||||
) {
|
) {
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
import { Ennoblement, ServerConfig, TWHelpClient } from './lib/twhelp';
|
|
||||||
import { createTranslationFunc } from './utils';
|
import { createTranslationFunc } from './utils';
|
||||||
import { DialogTable } from './common/dialog-table';
|
|
||||||
import { calcLoyalty } from './lib/tw';
|
import { calcLoyalty } from './lib/tw';
|
||||||
import { Cache } from './lib/cache';
|
import { Cache } from './lib/cache';
|
||||||
|
import { TWHelpV2Client, Ennoblement, ServerConfig } from './lib/twhelpv2';
|
||||||
|
import { DialogTableV2 } from './common/dialog-table-v2';
|
||||||
|
|
||||||
const t = createTranslationFunc({
|
const t = createTranslationFunc({
|
||||||
pl_PL: {
|
pl_PL: {
|
||||||
|
@ -22,32 +22,42 @@ const t = createTranslationFunc({
|
||||||
|
|
||||||
class TWHelpConnector {
|
class TWHelpConnector {
|
||||||
private static SERVER_CONFIG_CACHE_KEY =
|
private static SERVER_CONFIG_CACHE_KEY =
|
||||||
'extended_village_profile_server_config';
|
'extended_village_profile_server_config_v2';
|
||||||
|
|
||||||
private cache = new Cache(localStorage);
|
private cache = new Cache(localStorage);
|
||||||
|
|
||||||
|
private client: TWHelpV2Client;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private readonly client: TWHelpClient,
|
readonly baseUrl: string,
|
||||||
private readonly version: string,
|
private readonly version: string,
|
||||||
private readonly server: string,
|
private readonly server: string,
|
||||||
private readonly id: number
|
private readonly id: number
|
||||||
) {}
|
) {
|
||||||
|
this.client = new TWHelpV2Client({ BASE: baseUrl });
|
||||||
|
}
|
||||||
|
|
||||||
serverConfig() {
|
serverConfig() {
|
||||||
return this.cache.load(
|
return this.cache.load(
|
||||||
TWHelpConnector.SERVER_CONFIG_CACHE_KEY,
|
TWHelpConnector.SERVER_CONFIG_CACHE_KEY,
|
||||||
3600,
|
3600,
|
||||||
() => {
|
async () => {
|
||||||
return this.client.serverConfig(this.version, this.server);
|
return (
|
||||||
|
await this.client.servers.getServerConfig({
|
||||||
|
versionCode: this.version,
|
||||||
|
serverKey: this.server,
|
||||||
|
})
|
||||||
|
).data;
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
async latestEnnoblement() {
|
async latestEnnoblement() {
|
||||||
const ennoblements = await this.client.villageEnnoblements(
|
const ennoblements = await this.client.ennoblements.listVillageEnnoblements(
|
||||||
this.version,
|
|
||||||
this.server,
|
|
||||||
this.id,
|
|
||||||
{
|
{
|
||||||
|
versionCode: this.version,
|
||||||
|
serverKey: this.server,
|
||||||
|
villageId: this.id,
|
||||||
limit: 1,
|
limit: 1,
|
||||||
sort: ['createdAt:DESC'],
|
sort: ['createdAt:DESC'],
|
||||||
}
|
}
|
||||||
|
@ -55,11 +65,14 @@ class TWHelpConnector {
|
||||||
return ennoblements.data.length > 0 ? ennoblements.data[0] : null;
|
return ennoblements.data.length > 0 ? ennoblements.data[0] : null;
|
||||||
}
|
}
|
||||||
|
|
||||||
villageEnnoblements(page: number, limit: number) {
|
villageEnnoblements(cursor: string | undefined, limit: number) {
|
||||||
return this.client.villageEnnoblements(this.version, this.server, this.id, {
|
return this.client.ennoblements.listVillageEnnoblements({
|
||||||
offset: (page - 1) * limit,
|
cursor,
|
||||||
limit,
|
versionCode: this.version,
|
||||||
sort: ['createdAt:desc'],
|
serverKey: this.server,
|
||||||
|
villageId: this.id,
|
||||||
|
limit: limit,
|
||||||
|
sort: ['createdAt:DESC'],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -138,7 +151,7 @@ class UI {
|
||||||
private async showEnnoblements(e: Event) {
|
private async showEnnoblements(e: Event) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
||||||
await new DialogTable(
|
await new DialogTableV2<Ennoblement>(
|
||||||
DialogId.ENNOBLEMENTS,
|
DialogId.ENNOBLEMENTS,
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
|
@ -182,8 +195,8 @@ class UI {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
30,
|
30,
|
||||||
(page: number, limit: number) => {
|
async (cursor, limit) => {
|
||||||
return this.connector.villageEnnoblements(page, limit);
|
return this.connector.villageEnnoblements(cursor, limit);
|
||||||
}
|
}
|
||||||
).render();
|
).render();
|
||||||
}
|
}
|
||||||
|
@ -191,9 +204,9 @@ class UI {
|
||||||
|
|
||||||
class ExtendedVillageProfile {
|
class ExtendedVillageProfile {
|
||||||
connector: TWHelpConnector;
|
connector: TWHelpConnector;
|
||||||
constructor(client: TWHelpClient) {
|
constructor(apiBaseUrl: string) {
|
||||||
this.connector = new TWHelpConnector(
|
this.connector = new TWHelpConnector(
|
||||||
client,
|
apiBaseUrl,
|
||||||
window.game_data.market,
|
window.game_data.market,
|
||||||
window.game_data.world,
|
window.game_data.world,
|
||||||
this.getVillageId()
|
this.getVillageId()
|
||||||
|
@ -226,9 +239,7 @@ class ExtendedVillageProfile {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
await new ExtendedVillageProfile(
|
await new ExtendedVillageProfile(process.env.TWHELP_API_BASE_URL ?? '')
|
||||||
new TWHelpClient(process.env.TWHELP_API_BASE_URL ?? '')
|
|
||||||
)
|
|
||||||
.run()
|
.run()
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
|
|
Loading…
Reference in New Issue