From f3436fe98b00568328d84c8ccc70009025e6d94f Mon Sep 17 00:00:00 2001 From: Flurb Date: Tue, 25 Jan 2022 00:18:19 +0100 Subject: [PATCH 1/6] Added first version nsdoc plugin --- src/Setting.ts | 28 +++++++++++++++++++++++--- src/editors/ied/ldevice-container.ts | 4 ++-- src/editors/ied/ln-container.ts | 19 ++++++++++++++--- src/validators/templates/foundation.ts | 2 +- 4 files changed, 44 insertions(+), 9 deletions(-) diff --git a/src/Setting.ts b/src/Setting.ts index f686892194..f2a7f4ef1f 100644 --- a/src/Setting.ts +++ b/src/Setting.ts @@ -16,14 +16,36 @@ import { ifImplemented, LitElementConstructor, Mixin } from './foundation.js'; import { Language, languages, loader } from './translations/loader.js'; import './WizardDivider.js'; +import { iec6185074 } from './validators/templates/foundation.js'; -function NsdocSettings() { +/** + * Get NSDoc information + * @returns + */ +async function Nsdoc() { + const nsd74 = await iec6185074; + const nsdoc74 = Settings().getSetting('IEC 61850-7-4'); + const parsedNsdoc74 = new DOMParser().parseFromString(nsdoc74!, 'application/xml') + return { - + getLNClassTitle(lnClass: string): string | null | undefined { + const titleID = nsd74.querySelector(`NS > LNClasses > LNClass[name="${lnClass}"]`)?.getAttribute('titleID'); + const ourDocument = parsedNsdoc74.querySelector(`NSDoc > Doc[id="${titleID}"]`); + return ourDocument?.textContent; + }, + + /** + * Get the LNClass for a specific LN class name. + * @param name - The name of the LN class. + * @returns The LN class element. + */ + getLNClass(name: string): Element | null { + return nsd74.querySelector(`NS > LNClasses > LNClass[name="${name}"]`); + } } } -export const nsdocSettings = NsdocSettings(); +export const nsdoc = Nsdoc(); export type SettingsRecord = { language: Language; diff --git a/src/editors/ied/ldevice-container.ts b/src/editors/ied/ldevice-container.ts index e3207ee139..05955880fc 100644 --- a/src/editors/ied/ldevice-container.ts +++ b/src/editors/ied/ldevice-container.ts @@ -48,8 +48,8 @@ export class LDeviceContainer extends LitElement { > ` : nothing}
- ${this.toggleButton?.on ? lnElements.map(server => html` html` `) : nothing}
diff --git a/src/editors/ied/ln-container.ts b/src/editors/ied/ln-container.ts index 67e5c1832a..d59af288c1 100644 --- a/src/editors/ied/ln-container.ts +++ b/src/editors/ied/ln-container.ts @@ -14,22 +14,35 @@ import './do-container.js'; import { getInstanceAttribute, getNameAttribute } from '../../foundation.js'; import { translate } from 'lit-translate'; import { IconButtonToggle } from '@material/mwc-icon-button-toggle'; +import { nsdoc } from '../../Setting.js'; +import { until } from 'lit-html/directives/until'; /** [[`IED`]] plugin subeditor for editing `LN` and `LN0` element. */ @customElement('ln-container') export class LNContainer extends LitElement { @property({ attribute: false }) element!: Element; + + /** + * The LNClass element for this LN(0) + * found in the nsd file. + */ + @property({ attribute: false }) + lnClassElement!: Element @query('#toggleButton') toggleButton!: IconButtonToggle | undefined; - private header(): TemplateResult { + private async header(): Promise { const prefix = this.element.getAttribute('prefix'); const lnClass = this.element.getAttribute('lnClass'); const inst = getInstanceAttribute(this.element); + const logicalNodeName = await nsdoc.then(settings => { + return settings.getLNClassTitle(lnClass!); + }); + return html`${prefix != null ? html`${prefix} — ` : nothing} - ${lnClass} + ${logicalNodeName ? logicalNodeName : lnClass} ${inst ? html` — ${inst}` : nothing}`; } @@ -59,7 +72,7 @@ export class LNContainer extends LitElement { render(): TemplateResult { const doElements = this.getDOElements(); - return html` + return html` ${doElements.length > 0 ? html` response.text()) .then(str => new DOMParser().parseFromString(str, 'application/xml')); -const iec6185072 = fetch('public/xml/IEC_61850-7-2_2007B3.nsd') +export const iec6185072 = fetch('public/xml/IEC_61850-7-2_2007B3.nsd') .then(response => response.text()) .then(str => new DOMParser().parseFromString(str, 'application/xml')); From 8d1d34f4118c74418c755efb19d6b2c9c7408aa3 Mon Sep 17 00:00:00 2001 From: Flurb Date: Tue, 25 Jan 2022 00:52:43 +0100 Subject: [PATCH 2/6] Added plugin --- src/Setting.ts | 20 +++++++++++--------- src/editors/ied/ldevice-container.ts | 2 ++ src/editors/ied/ln-container.ts | 8 ++------ 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/src/Setting.ts b/src/Setting.ts index f2a7f4ef1f..996589a74e 100644 --- a/src/Setting.ts +++ b/src/Setting.ts @@ -24,16 +24,9 @@ import { iec6185074 } from './validators/templates/foundation.js'; */ async function Nsdoc() { const nsd74 = await iec6185074; - const nsdoc74 = Settings().getSetting('IEC 61850-7-4'); - const parsedNsdoc74 = new DOMParser().parseFromString(nsdoc74!, 'application/xml') + const parsedNsdoc74 = new DOMParser().parseFromString(Settings().getSetting('IEC 61850-7-4')!, 'application/xml') return { - getLNClassTitle(lnClass: string): string | null | undefined { - const titleID = nsd74.querySelector(`NS > LNClasses > LNClass[name="${lnClass}"]`)?.getAttribute('titleID'); - const ourDocument = parsedNsdoc74.querySelector(`NSDoc > Doc[id="${titleID}"]`); - return ourDocument?.textContent; - }, - /** * Get the LNClass for a specific LN class name. * @param name - The name of the LN class. @@ -41,11 +34,20 @@ async function Nsdoc() { */ getLNClass(name: string): Element | null { return nsd74.querySelector(`NS > LNClasses > LNClass[name="${name}"]`); + }, + + /** + * Get the documentation for a specific ID. + * @param id - The id to search for. + * @returns The documentation for the specific ID. + */ + getDocumentation(id: string): Element | null { + return parsedNsdoc74.querySelector(`NSDoc > Doc[id="${id}"]`); } } } -export const nsdoc = Nsdoc(); +export const nsdoc = await Nsdoc(); export type SettingsRecord = { language: Language; diff --git a/src/editors/ied/ldevice-container.ts b/src/editors/ied/ldevice-container.ts index 05955880fc..e5b803b197 100644 --- a/src/editors/ied/ldevice-container.ts +++ b/src/editors/ied/ldevice-container.ts @@ -14,6 +14,7 @@ import { nothing } from 'lit-html'; import { getDescriptionAttribute, getInstanceAttribute, getNameAttribute } from '../../foundation.js'; import { IconButtonToggle } from '@material/mwc-icon-button-toggle'; import { translate } from 'lit-translate'; +import { nsdoc } from '../../Setting.js'; /** [[`IED`]] plugin subeditor for editing `LDevice` element. */ @customElement('ldevice-container') @@ -50,6 +51,7 @@ export class LDeviceContainer extends LitElement {
${this.toggleButton?.on ? lnElements.map(ln => html` `) : nothing}
diff --git a/src/editors/ied/ln-container.ts b/src/editors/ied/ln-container.ts index d59af288c1..7e7b4c5093 100644 --- a/src/editors/ied/ln-container.ts +++ b/src/editors/ied/ln-container.ts @@ -34,15 +34,11 @@ export class LNContainer extends LitElement { private async header(): Promise { const prefix = this.element.getAttribute('prefix'); - const lnClass = this.element.getAttribute('lnClass'); const inst = getInstanceAttribute(this.element); - const logicalNodeName = await nsdoc.then(settings => { - return settings.getLNClassTitle(lnClass!); - }); - return html`${prefix != null ? html`${prefix} — ` : nothing} - ${logicalNodeName ? logicalNodeName : lnClass} + ${this.lnClassElement ? + nsdoc.getDocumentation(this.lnClassElement.getAttribute('titleID')!)?.textContent : this.element.getAttribute('lnClass')} ${inst ? html` — ${inst}` : nothing}`; } From 43c6d0211bb67eb027b64b615789d3f33a959294 Mon Sep 17 00:00:00 2001 From: Flurb Date: Tue, 25 Jan 2022 00:57:03 +0100 Subject: [PATCH 3/6] Refactoring --- src/Setting.ts | 8 ++++---- src/editors/ied/ldevice-container.ts | 2 +- src/editors/ied/ln-container.ts | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/Setting.ts b/src/Setting.ts index 996589a74e..072f507316 100644 --- a/src/Setting.ts +++ b/src/Setting.ts @@ -28,20 +28,20 @@ async function Nsdoc() { return { /** - * Get the LNClass for a specific LN class name. + * Get the LNClass for a specific LN class name found in the IEC 61850-7-4 nsdoc file. * @param name - The name of the LN class. * @returns The LN class element. */ - getLNClass(name: string): Element | null { + get74NsdLNClass(name: string): Element | null { return nsd74.querySelector(`NS > LNClasses > LNClass[name="${name}"]`); }, /** - * Get the documentation for a specific ID. + * Get the documentation for a specific ID found in the IEC 61850-7-4 nsdoc file. * @param id - The id to search for. * @returns The documentation for the specific ID. */ - getDocumentation(id: string): Element | null { + get74NsdocDocumentation(id: string): Element | null { return parsedNsdoc74.querySelector(`NSDoc > Doc[id="${id}"]`); } } diff --git a/src/editors/ied/ldevice-container.ts b/src/editors/ied/ldevice-container.ts index e5b803b197..b5e26b8d3e 100644 --- a/src/editors/ied/ldevice-container.ts +++ b/src/editors/ied/ldevice-container.ts @@ -51,7 +51,7 @@ export class LDeviceContainer extends LitElement {
${this.toggleButton?.on ? lnElements.map(ln => html` `) : nothing}
diff --git a/src/editors/ied/ln-container.ts b/src/editors/ied/ln-container.ts index 7e7b4c5093..75fdcf7849 100644 --- a/src/editors/ied/ln-container.ts +++ b/src/editors/ied/ln-container.ts @@ -38,7 +38,7 @@ export class LNContainer extends LitElement { return html`${prefix != null ? html`${prefix} — ` : nothing} ${this.lnClassElement ? - nsdoc.getDocumentation(this.lnClassElement.getAttribute('titleID')!)?.textContent : this.element.getAttribute('lnClass')} + nsdoc.get74NsdocDocumentation(this.lnClassElement.getAttribute('titleID')!)?.textContent : this.element.getAttribute('lnClass')} ${inst ? html` — ${inst}` : nothing}`; } From d38adc03165db13978c40880f39dd665d25237be Mon Sep 17 00:00:00 2001 From: Flurb Date: Tue, 25 Jan 2022 12:01:48 +0100 Subject: [PATCH 4/6] Refactoring with Jakob --- src/Plugging.ts | 2 + src/Setting.ts | 152 ++++---- src/editors/IED.ts | 6 + src/editors/ied/access-point-container.ts | 5 + src/editors/ied/ied-container.ts | 5 + src/editors/ied/ldevice-container.ts | 7 +- src/editors/ied/ln-container.ts | 14 +- src/editors/ied/server-container.ts | 5 + src/open-scd.ts | 2 +- src/themes.ts | 8 +- src/zeroline-pane.ts | 4 +- .../__snapshots__/open-scd.test.snap.js | 360 +++++++++--------- test/unit/Setting.test.ts | 17 +- 13 files changed, 295 insertions(+), 292 deletions(-) diff --git a/src/Plugging.ts b/src/Plugging.ts index 608c5b8f00..f867674cbf 100644 --- a/src/Plugging.ts +++ b/src/Plugging.ts @@ -26,6 +26,7 @@ import { TextField } from '@material/mwc-textfield'; import { ifImplemented, LitElementConstructor, Mixin } from './foundation.js'; import { EditingElement } from './Editing.js'; import { officialPlugins } from '../public/js/plugins.js'; +import { loadNsdocs } from './Setting.js'; type PluginKind = 'editor' | 'menu' | 'validator'; const menuPosition = ['top', 'middle', 'bottom'] as const; @@ -208,6 +209,7 @@ export function Plugging EditingElement>( .docName=${this.docName} .docId=${this.docId} .pluginId=${plugin.src} + .nsdocs=${loadNsdocs()} >`; }, }; diff --git a/src/Setting.ts b/src/Setting.ts index 072f507316..9ddad80a9f 100644 --- a/src/Setting.ts +++ b/src/Setting.ts @@ -16,40 +16,29 @@ import { ifImplemented, LitElementConstructor, Mixin } from './foundation.js'; import { Language, languages, loader } from './translations/loader.js'; import './WizardDivider.js'; -import { iec6185074 } from './validators/templates/foundation.js'; +import { WizardDialog } from './wizard-dialog.js'; -/** - * Get NSDoc information - * @returns - */ -async function Nsdoc() { - const nsd74 = await iec6185074; - const parsedNsdoc74 = new DOMParser().parseFromString(Settings().getSetting('IEC 61850-7-4')!, 'application/xml') - - return { - /** - * Get the LNClass for a specific LN class name found in the IEC 61850-7-4 nsdoc file. - * @param name - The name of the LN class. - * @returns The LN class element. - */ - get74NsdLNClass(name: string): Element | null { - return nsd74.querySelector(`NS > LNClasses > LNClass[name="${name}"]`); - }, +export interface Nsdocs { + nsdoc72?: XMLDocument; + nsdoc73?: XMLDocument; + nsdoc74?: XMLDocument; + nsdoc81?: XMLDocument; +} - /** - * Get the documentation for a specific ID found in the IEC 61850-7-4 nsdoc file. - * @param id - The id to search for. - * @returns The documentation for the specific ID. - */ - get74NsdocDocumentation(id: string): Element | null { - return parsedNsdoc74.querySelector(`NSDoc > Doc[id="${id}"]`); - } +export function loadNsdocs(): Nsdocs { + return { + nsdoc72: localStorage.getItem('IEC 61850-7-2') ? new DOMParser().parseFromString(localStorage.getItem('IEC 61850-7-2')!, 'application/xml') : undefined, + nsdoc73: localStorage.getItem('IEC 61850-7-3') ? new DOMParser().parseFromString(localStorage.getItem('IEC 61850-7-3')!, 'application/xml') : undefined, + nsdoc74: localStorage.getItem('IEC 61850-7-4') ? new DOMParser().parseFromString(localStorage.getItem('IEC 61850-7-4')!, 'application/xml') : undefined, + nsdoc81: localStorage.getItem('IEC 61850-8-1') ? new DOMParser().parseFromString(localStorage.getItem('IEC 61850-8-1')!, 'application/xml') : undefined } } -export const nsdoc = await Nsdoc(); +export function getDataDescription(element: Element, options?: {attribute: string, enum: string}):{label: string, description:string} { + return {label: '', description: ''}; +} -export type SettingsRecord = { +export type Settings = { language: Language; theme: 'light' | 'dark'; mode: 'safe' | 'pro'; @@ -59,11 +48,26 @@ export type SettingsRecord = { 'IEC 61850-7-4': string | undefined; 'IEC 61850-8-1': string | undefined; }; +export const defaults: Settings = { + language: 'en', + theme: 'light', + mode: 'safe', + showieds: 'off', + 'IEC 61850-7-2': undefined, + 'IEC 61850-7-3': undefined, + 'IEC 61850-7-4': undefined, + 'IEC 61850-8-1': undefined +}; -export function Settings() { - return { - /** Current [[`CompasSettings`]] in `localStorage`, default to [[`defaults`]]. */ - get settings(): SettingsRecord { +/** Mixin that saves [[`Settings`]] to `localStorage`, reflecting them in the + * `settings` property, setting them through `setSetting(setting, value)`. */ +export type SettingElement = Mixin; + +export function Setting(Base: TBase) { + class SettingElement extends Base { + /** Current [[`Settings`]] in `localStorage`, default to [[`defaults`]]. */ + @property() + get settings(): Settings { return { language: this.getSetting('language'), theme: this.getSetting('theme'), @@ -74,49 +78,6 @@ export function Settings() { 'IEC 61850-7-4': this.getSetting('IEC 61850-7-4'), 'IEC 61850-8-1': this.getSetting('IEC 61850-8-1') }; - }, - - get defaultSettings(): SettingsRecord { - return { - language: 'en', - theme: 'light', - mode: 'safe', - showieds: 'off', - 'IEC 61850-7-2': undefined, - 'IEC 61850-7-3': undefined, - 'IEC 61850-7-4': undefined, - 'IEC 61850-8-1': undefined - } - }, - - /** Update the `value` of `setting`, storing to `localStorage`. */ - setSetting(setting: T, value: SettingsRecord[T]): void { - localStorage.setItem(setting, (value)); - }, - - /** Update the `value` of `setting`, storing to `localStorage`. */ - removeSetting(setting: T): void { - localStorage.removeItem(setting); - }, - - getSetting(setting: T): SettingsRecord[T] { - return ( - localStorage.getItem(setting) ?? this.defaultSettings[setting] - ); - } - } -} - -/** Mixin that saves [[`Settings`]] to `localStorage`, reflecting them in the - * `settings` property, setting them through `setSetting(setting, value)`. */ -export type SettingElement = Mixin; - -export function Setting(Base: TBase) { - class SettingElement extends Base { - /** Current [[`Settings`]] in `localStorage`, default to [[`defaults`]]. */ - @property() - get settings(): SettingsRecord { - return Settings().settings; } @query('#settings') @@ -133,6 +94,30 @@ export function Setting(Base: TBase) { @query('#nsdoc-file') private nsdocFileUI!: HTMLInputElement; + private getSetting(setting: T): Settings[T] { + return ( + localStorage.getItem(setting) ?? defaults[setting] + ); + } + + /** Update the `value` of `setting`, storing to `localStorage`. */ + setSetting(setting: T, value: Settings[T]): void { + localStorage.setItem(setting, (value)); + this.shadowRoot + ?.querySelector('wizard-dialog') + ?.requestUpdate(); + this.requestUpdate(); + } + + /** Remove the `setting` in `localStorage`. */ + removeSetting(setting: T): void { + localStorage.removeItem(setting); + this.shadowRoot + ?.querySelector('wizard-dialog') + ?.requestUpdate(); + this.requestUpdate(); + } + private onClosing(ae: CustomEvent<{ action: string } | null>): void { if (ae.detail?.action === 'reset') { Object.keys(this.settings).forEach(item => @@ -140,10 +125,10 @@ export function Setting(Base: TBase) { ); this.requestUpdate('settings'); } else if (ae.detail?.action === 'save') { - Settings().setSetting('language', this.languageUI.value); - Settings().setSetting('theme', this.darkThemeUI.checked ? 'dark' : 'light'); - Settings().setSetting('mode', this.modeUI.checked ? 'pro' : 'safe'); - Settings().setSetting('showieds', this.showiedsUI.checked ? 'on' : 'off'); + this.setSetting('language', this.languageUI.value); + this.setSetting('theme', this.darkThemeUI.checked ? 'dark' : 'light'); + this.setSetting('mode', this.modeUI.checked ? 'pro' : 'safe'); + this.setSetting('showieds', this.showiedsUI.checked ? 'on' : 'off'); this.requestUpdate('settings'); } } @@ -178,7 +163,7 @@ export function Setting(Base: TBase) { const id = this.parseToXmlObject(text).querySelector('NSDoc')?.getAttribute('id'); if (!id) return; - Settings().setSetting(id as keyof SettingsRecord, text); + this.setSetting(id as keyof Settings, text); }) this.nsdocFileUI.value = ''; @@ -190,7 +175,7 @@ export function Setting(Base: TBase) { * @param key - The key of the nsdoc file in the settings. * @returns a .nsdoc item for the Settings wizard */ - private renderNsdocItem(key: T): TemplateResult { + private renderNsdocItem(key: T): TemplateResult { const nsdSetting = this.settings[key]; let nsdVersion: string | undefined | null; let nsdRevision: string | undefined | null; @@ -209,10 +194,7 @@ export function Setting(Base: TBase) { html``} ${nsdSetting ? html`done` : html`close`} - ${nsdSetting ? html` { - Settings().removeSetting(key); - this.requestUpdate(); - }}>delete` : + ${nsdSetting ? html` {this.removeSetting(key)}}>delete` : html``} `; } diff --git a/src/editors/IED.ts b/src/editors/IED.ts index 927f662105..66390b9956 100644 --- a/src/editors/IED.ts +++ b/src/editors/IED.ts @@ -11,6 +11,7 @@ import { translate } from 'lit-translate'; import { Select } from '@material/mwc-select'; import { SingleSelectedEvent } from '@material/mwc-list/mwc-list-foundation'; import { compareNames, getDescriptionAttribute, getNameAttribute } from '../foundation.js'; +import { Nsdocs } from '../Setting.js'; /** An editor [[`plugin`]] for editing the `IED` section. */ export default class IedPlugin extends LitElement { @@ -18,6 +19,10 @@ export default class IedPlugin extends LitElement { @property() doc!: XMLDocument; + /** All the nsdoc files that are being uploaded via the settings. */ + @property() + nsdocs!: Nsdocs; + /** Query holding the current selected IEDs. */ @state() currentSelectedIEDs = ':root > IED'; @@ -60,6 +65,7 @@ export default class IedPlugin extends LitElement { ${Array.from(this.doc?.querySelectorAll(this.currentSelectedIEDs)).map( ied => html`` )}` : html`

diff --git a/src/editors/ied/access-point-container.ts b/src/editors/ied/access-point-container.ts index cf4c323820..7068d4a5e6 100644 --- a/src/editors/ied/access-point-container.ts +++ b/src/editors/ied/access-point-container.ts @@ -11,6 +11,7 @@ import '../../action-pane.js'; import './server-container.js' import { nothing } from 'lit-html'; import { getDescriptionAttribute, getNameAttribute } from '../../foundation.js'; +import { Nsdocs } from '../../Setting.js'; /** [[`IED`]] plugin subeditor for editing `AccessPoint` element. */ @customElement('access-point-container') @@ -18,6 +19,9 @@ export class AccessPointContainer extends LitElement { @property({ attribute: false }) element!: Element; + @property() + nsdocs!: Nsdocs; + private header(): TemplateResult { const name = getNameAttribute(this.element); const desc = getDescriptionAttribute(this.element); @@ -30,6 +34,7 @@ export class AccessPointContainer extends LitElement { ${Array.from(this.element.querySelectorAll(':scope > Server')).map( server => html``)} `; } diff --git a/src/editors/ied/ied-container.ts b/src/editors/ied/ied-container.ts index eb2e24f857..de5b27086b 100644 --- a/src/editors/ied/ied-container.ts +++ b/src/editors/ied/ied-container.ts @@ -10,6 +10,7 @@ import { nothing } from 'lit-html'; import '../../action-pane.js'; import { getDescriptionAttribute, getNameAttribute } from '../../foundation.js'; +import { Nsdocs } from '../../Setting.js'; import './access-point-container.js'; /** [[`IED`]] plugin subeditor for editing `IED` element. */ @@ -19,6 +20,9 @@ export class IedContainer extends LitElement { @property({ attribute: false }) element!: Element; + @property() + nsdocs!: Nsdocs; + private header(): TemplateResult { const name = getNameAttribute(this.element); const desc = getDescriptionAttribute(this.element); @@ -31,6 +35,7 @@ export class IedContainer extends LitElement { ${Array.from(this.element.querySelectorAll(':scope > AccessPoint')).map( ap => html``)} `; } diff --git a/src/editors/ied/ldevice-container.ts b/src/editors/ied/ldevice-container.ts index b5e26b8d3e..ac78b0444a 100644 --- a/src/editors/ied/ldevice-container.ts +++ b/src/editors/ied/ldevice-container.ts @@ -14,13 +14,16 @@ import { nothing } from 'lit-html'; import { getDescriptionAttribute, getInstanceAttribute, getNameAttribute } from '../../foundation.js'; import { IconButtonToggle } from '@material/mwc-icon-button-toggle'; import { translate } from 'lit-translate'; -import { nsdoc } from '../../Setting.js'; +import { Nsdocs } from '../../Setting.js'; /** [[`IED`]] plugin subeditor for editing `LDevice` element. */ @customElement('ldevice-container') export class LDeviceContainer extends LitElement { @property({ attribute: false }) element!: Element; + + @property() + nsdocs!: Nsdocs; @query('#toggleButton') toggleButton!: IconButtonToggle | undefined; @@ -51,7 +54,7 @@ export class LDeviceContainer extends LitElement {
${this.toggleButton?.on ? lnElements.map(ln => html` `) : nothing}
diff --git a/src/editors/ied/ln-container.ts b/src/editors/ied/ln-container.ts index 75fdcf7849..22a256a1c6 100644 --- a/src/editors/ied/ln-container.ts +++ b/src/editors/ied/ln-container.ts @@ -14,7 +14,7 @@ import './do-container.js'; import { getInstanceAttribute, getNameAttribute } from '../../foundation.js'; import { translate } from 'lit-translate'; import { IconButtonToggle } from '@material/mwc-icon-button-toggle'; -import { nsdoc } from '../../Setting.js'; +import { Nsdocs } from '../../Setting.js'; import { until } from 'lit-html/directives/until'; /** [[`IED`]] plugin subeditor for editing `LN` and `LN0` element. */ @@ -23,22 +23,18 @@ export class LNContainer extends LitElement { @property({ attribute: false }) element!: Element; - /** - * The LNClass element for this LN(0) - * found in the nsd file. - */ - @property({ attribute: false }) - lnClassElement!: Element + @property() + nsdocs!: Nsdocs; @query('#toggleButton') toggleButton!: IconButtonToggle | undefined; private async header(): Promise { const prefix = this.element.getAttribute('prefix'); + const lnClass = this.element.getAttribute('lnClass') const inst = getInstanceAttribute(this.element); return html`${prefix != null ? html`${prefix} — ` : nothing} - ${this.lnClassElement ? - nsdoc.get74NsdocDocumentation(this.lnClassElement.getAttribute('titleID')!)?.textContent : this.element.getAttribute('lnClass')} + ${lnClass} ${inst ? html` — ${inst}` : nothing}`; } diff --git a/src/editors/ied/server-container.ts b/src/editors/ied/server-container.ts index 18107c9057..568a9df678 100644 --- a/src/editors/ied/server-container.ts +++ b/src/editors/ied/server-container.ts @@ -8,6 +8,7 @@ import { } from 'lit-element'; import '../../action-pane.js'; +import { Nsdocs } from '../../Setting.js'; import './ldevice-container.js'; /** [[`IED`]] plugin subeditor for editing `Server` element. */ @@ -16,6 +17,9 @@ export class ServerContainer extends LitElement { @property({ attribute: false }) element!: Element; + @property() + nsdocs!: Nsdocs; + private header(): string { return 'Server'; } @@ -25,6 +29,7 @@ export class ServerContainer extends LitElement { ${Array.from(this.element.querySelectorAll(':scope > LDevice')).map( server => html``)} `; } diff --git a/src/open-scd.ts b/src/open-scd.ts index 170cc002bf..5379781cfb 100644 --- a/src/open-scd.ts +++ b/src/open-scd.ts @@ -24,7 +24,7 @@ import { Wizarding } from './Wizarding.js'; * Open Substation Configuration Designer. */ @customElement('open-scd') export class OpenSCD extends Hosting( - Setting(Wizarding(Waiting(Plugging(Editing(Logging(LitElement)))))) + Plugging(Setting(Wizarding(Waiting(Editing(Logging(LitElement)))))) ) { private currentSrc = ''; /** The current file's URL. `blob:` URLs are *revoked after parsing*! */ diff --git a/src/themes.ts b/src/themes.ts index ce214bbea6..74b8127118 100644 --- a/src/themes.ts +++ b/src/themes.ts @@ -1,7 +1,7 @@ import { html, TemplateResult } from 'lit-element'; -import { SettingsRecord } from './Setting.js'; +import { Settings } from './Setting.js'; -export function getTheme(theme: SettingsRecord['theme']): TemplateResult { +export function getTheme(theme: Settings['theme']): TemplateResult { document.body.style.cssText = bodyStyles[theme]; return html` ${themes[theme]} @@ -61,12 +61,12 @@ export function getTheme(theme: SettingsRecord['theme']): TemplateResult { `; } -const bodyStyles: Record = { +const bodyStyles: Record = { dark: 'background: #073642', light: 'background: #eee8d5', }; -const themes: Record = { +const themes: Record = { light: html`