web: switch to eslint

This commit is contained in:
Jens Langhammer
2020-12-01 09:15:41 +01:00
parent a312ad2ad1
commit 0231bcf685
25 changed files with 1010 additions and 151 deletions

View File

@ -9,7 +9,7 @@ interface TickValue {
@customElement("pb-admin-logins-chart")
export class AdminLoginsChart extends LitElement {
@property()
url: string = "";
url = "";
chart: any;
@ -43,7 +43,7 @@ export class AdminLoginsChart extends LitElement {
.then((r) => r.json())
.catch((e) => console.error(e))
.then((r) => {
let ctx = (<HTMLCanvasElement>this.shadowRoot?.querySelector("canvas")).getContext(
const ctx = (<HTMLCanvasElement>this.shadowRoot?.querySelector("canvas")).getContext(
"2d"
)!;
this.chart = new Chart(ctx, {

View File

@ -10,10 +10,10 @@ import "codemirror/mode/python/python.js";
@customElement("pb-codemirror")
export class CodeMirrorTextarea extends LitElement {
@property()
readOnly: boolean = false;
readOnly = false;
@property()
mode: string = "yaml";
mode = "yaml";
editor?: CodeMirror.EditorFromTextArea;

View File

@ -7,16 +7,16 @@ interface ComparisonHash {
@customElement("fetch-fill-slot")
export class FetchFillSlot extends LitElement {
@property()
url: string = "";
url = "";
@property()
key: string = "";
key = "";
@property()
value: string = "";
value = "";
comparison(slotName: string) {
let comparisonOperatorsHash = <ComparisonHash>{
const comparisonOperatorsHash = <ComparisonHash>{
"<": function (a: any, b: any) {
return a < b;
},

View File

@ -7,7 +7,7 @@ const LEVEL_ICON_MAP: { [key: string]: string } = {
info: "fas fa-info",
};
let ID = function (prefix: string) {
const ID = function (prefix: string) {
return prefix + Math.random().toString(36).substr(2, 9);
};
@ -20,10 +20,10 @@ interface Message {
@customElement("pb-messages")
export class Messages extends LitElement {
@property()
url: string = "";
url = "";
messageSocket?: WebSocket;
retryDelay: number = 200;
retryDelay = 200;
createRenderRoot() {
return this;
@ -72,7 +72,7 @@ export class Messages extends LitElement {
* This mostly gets messages which were created when the user arrives/leaves the site
* and especially the login flow */
fetchMessages() {
console.debug(`passbook/messages: fetching messages over direct api`);
console.debug("passbook/messages: fetching messages over direct api");
return fetch(this.url)
.then((r) => r.json())
.then((r) => {
@ -93,8 +93,8 @@ export class Messages extends LitElement {
const el = document.createElement("template");
el.innerHTML = `<li id=${id} class="pf-c-alert-group__item">
<div class="pf-c-alert pf-m-${message.levelTag} ${
message.levelTag === "error" ? "pf-m-danger" : ""
}">
message.levelTag === "error" ? "pf-m-danger" : ""
}">
<div class="pf-c-alert__icon">
<i class="${LEVEL_ICON_MAP[message.levelTag]}"></i>
</div>

View File

@ -15,7 +15,7 @@ export class Tabs extends LitElement {
}
render() {
let pages = Array.from(this.querySelectorAll("[slot]")!);
const pages = Array.from(this.querySelectorAll("[slot]")!);
if (!this.currentPage) {
if (pages.length < 1) {
return html`<h1>no tabs defined</h1>`;
@ -25,24 +25,24 @@ export class Tabs extends LitElement {
return html`<div class="pf-c-tabs">
<ul class="pf-c-tabs__list">
${pages.map((page) => {
const slot = page.attributes.getNamedItem("slot")?.value;
return html` <li
const slot = page.attributes.getNamedItem("slot")?.value;
return html` <li
class="pf-c-tabs__item ${slot === this.currentPage
? CURRENT_CLASS
: ""}"
? CURRENT_CLASS
: ""}"
>
<button
class="pf-c-tabs__link"
@click=${() => {
this.currentPage = slot;
}}
this.currentPage = slot;
}}
>
<span class="pf-c-tabs__item-text">
${page.attributes.getNamedItem("tab-title")?.value}
</span>
</button>
</li>`;
})}
})}
</ul>
</div>
<slot name="${this.currentPage}"></slot>`;

View File

@ -6,7 +6,7 @@ import { SpinnerButton } from "./SpinnerButton";
@customElement("pb-action-button")
export class ActionButton extends SpinnerButton {
@property()
url: string = "";
url = "";
callAction() {
if (this.isRunning === true) {

View File

@ -20,7 +20,7 @@ export class ModalButton extends LitElement {
href?: string;
@property()
open: boolean = false;
open = false;
static get styles() {
return [
@ -79,7 +79,7 @@ export class ModalButton extends LitElement {
this.querySelectorAll<HTMLFormElement>("[slot=modal] form").forEach((form) => {
form.addEventListener("submit", (e) => {
e.preventDefault();
let formData = new FormData(form);
const formData = new FormData(form);
fetch(this.href ? this.href : form.action, {
method: form.method,
body: formData,
@ -91,11 +91,11 @@ export class ModalButton extends LitElement {
.then((data) => {
if (data.indexOf("csrfmiddlewaretoken") !== -1) {
this.querySelector("[slot=modal]")!.innerHTML = data;
console.debug(`passbook/modalbutton: re-showing form`);
console.debug("passbook/modalbutton: re-showing form");
this.updateHandlers();
} else {
this.open = false;
console.debug(`passbook/modalbutton: successful submit`);
console.debug("passbook/modalbutton: successful submit");
this.dispatchEvent(
new CustomEvent("hashchange", {
bubbles: true,

View File

@ -70,7 +70,7 @@ export class SpinnerButton extends LitElement {
@click=${() => this.callAction()}
>
${this.isRunning
? html` <span class="pf-c-button__progress">
? html` <span class="pf-c-button__progress">
<span
class="pf-c-spinner pf-m-md"
role="progressbar"
@ -81,7 +81,7 @@ export class SpinnerButton extends LitElement {
<span class="pf-c-spinner__tail-ball"></span>
</span>
</span>`
: ""}
: ""}
<slot></slot>
</button>`;
}

View File

@ -181,15 +181,15 @@ export class Sidebar extends LitElement {
class="pf-c-nav__item ${item.children ? "pf-m-expandable pf-m-expanded" : ""}"
>
${item.path
? html`<a
? html`<a
href="#${item.path}"
class="pf-c-nav__link ${item.path.some((v) => v === this.activePath)
? "pf-m-current"
: ""}"
? "pf-m-current"
: ""}"
>
${item.name}
</a>`
: html`<a class="pf-c-nav__link" aria-expanded="true"
: html`<a class="pf-c-nav__link" aria-expanded="true"
>${item.name}
<span class="pf-c-nav__toggle">
<i class="fas fa-angle-right" aria-hidden="true"></i>

View File

@ -48,8 +48,8 @@ export class SidebarBrand extends LitElement {
<div class="pf-c-brand pb-brand">
<img src="${this.config?.branding_logo}" alt="passbook icon" loading="lazy" />
${this.config?.branding_title
? html`<span>${this.config.branding_title}</span>`
: ""}
? html`<span>${this.config.branding_title}</span>`
: ""}
</div>
</a>`;
}

View File

@ -12,7 +12,7 @@ export abstract class Table<T> extends LitElement {
data?: PBResponse<T>;
@property()
page: number = 1;
page = 1;
static get styles() {
return [COMMON_STYLES];
@ -51,12 +51,12 @@ export abstract class Table<T> extends LitElement {
return;
}
return this.data.results.map((item) => {
const fullRow = [`<tr role="row">`].concat(
const fullRow = ["<tr role=\"row\">"].concat(
this.row(item).map((col) => {
return `<td role="cell">${col}</td>`;
})
);
fullRow.push(`</tr>`);
fullRow.push("</tr>");
return html(<any>fullRow);
});
}
@ -71,8 +71,8 @@ export abstract class Table<T> extends LitElement {
<slot name="create-button"></slot>
<button
@click=${() => {
this.fetch();
}}
this.fetch();
}}
class="pf-c-button pf-m-primary"
>
Refresh
@ -88,8 +88,8 @@ export abstract class Table<T> extends LitElement {
<thead>
<tr role="row">
${this.columns().map(
(col) => html`<th role="columnheader" scope="col">${col}</th>`
)}
(col) => html`<th role="columnheader" scope="col">${col}</th>`
)}
</tr>
</thead>
<tbody role="rowgroup">

View File

@ -13,7 +13,7 @@ export class TablePagination extends LitElement {
previousHandler() {
if (!this.table?.data?.pagination.previous) {
console.debug(`passbook/tables: no previous`);
console.debug("passbook/tables: no previous");
return;
}
this.table.page = this.table?.data?.pagination.previous;
@ -21,7 +21,7 @@ export class TablePagination extends LitElement {
nextHandler() {
if (!this.table?.data?.pagination.next) {
console.debug(`passbook/tables: no next`);
console.debug("passbook/tables: no next");
return;
}
this.table.page = this.table?.data?.pagination.next;
@ -44,8 +44,8 @@ export class TablePagination extends LitElement {
<button
class="pf-c-button pf-m-plain"
@click=${() => {
this.previousHandler();
}}
this.previousHandler();
}}
disabled="${this.table?.data?.pagination.previous ? "true" : "false"}"
aria-label="{% trans 'Go to previous page' %}"
>
@ -56,8 +56,8 @@ export class TablePagination extends LitElement {
<button
class="pf-c-button pf-m-plain"
@click=${() => {
this.nextHandler();
}}
this.nextHandler();
}}
disabled="${this.table?.data?.pagination.next ? "true" : "false"}"
aria-label="{% trans 'Go to next page' %}"
>