Added SCL Auto Alignment Menu.

Signed-off-by: Dennis Labordus <[email protected]>

Author: Dennis Labordus

.github/workflows/build-project.yml

@@ -4,7 +4,6 @@ on:
   push:
     branches:
       - '**'
-      - '!main'
   pull_request:
     branches:
       - 'main'

__snapshots__/compas-auto-alignment.md

@@ -0,0 +1,74 @@
+# `compas-auto-alignment`
+
+## `document with substations`
+
+####   `looks like the latest snapshot`
+
+```html
+<section tabindex="0">
+  <mwc-list
+    multi=""
+    required=""
+  >
+    <mwc-check-list-item
+      aria-disabled="false"
+      graphic="control"
+      left=""
+      mwc-list-item=""
+      tabindex="0"
+      value="_af9a4ae3-ba2e-4c34-8e47-5af894ee20f4"
+    >
+      _af9a4ae3-ba2e-4c34-8e47-5af894ee20f4
+                      (Substation 1)
+    </mwc-check-list-item>
+    <mwc-check-list-item
+      aria-disabled="false"
+      graphic="control"
+      left=""
+      mwc-list-item=""
+      tabindex="-1"
+      value="_974565b1-ac55-4901-9f48-afc7ef5486df"
+    >
+      _974565b1-ac55-4901-9f48-afc7ef5486df
+                      (Sub3)
+    </mwc-check-list-item>
+    <mwc-check-list-item
+      aria-disabled="false"
+      graphic="control"
+      left=""
+      mwc-list-item=""
+      tabindex="-1"
+      value="_d6056127-34f1-43a9-b029-23fddb913bd5"
+    >
+      _d6056127-34f1-43a9-b029-23fddb913bd5
+                      (Sub4)
+    </mwc-check-list-item>
+    <mwc-check-list-item
+      aria-disabled="false"
+      graphic="control"
+      left=""
+      mwc-list-item=""
+      tabindex="-1"
+      value="_b3e5b4de-b74d-43b4-8db9-784302a12acf"
+    >
+      _b3e5b4de-b74d-43b4-8db9-784302a12acf
+                      (Sub5)
+    </mwc-check-list-item>
+  </mwc-list>
+</section>
+
+```
+
+## `document without substations`
+
+####   `looks like the latest snapshot`
+
+```html
+<section tabindex="0">
+  <span style="color: var(--base1)">
+    [compas.autoAlignment.missing]
+  </span>
+</section>
+
+```
+

__snapshots__/compas-settings.md

@@ -19,6 +19,14 @@
   value="/compas-cim-mapping"
 >
 </mwc-textfield>
+<mwc-textfield
+  dialoginitialfocus=""
+  id="sclAutoAlignmentServiceUrl"
+  label="[compas.settings.sclAutoAlignmentServiceUrl]"
+  required=""
+  value="/compas-scl-auto-alignment"
+>
+</mwc-textfield>
 <mwc-button style="--mdc-theme-primary: var(--mdc-theme-error)">
   [reset]
 </mwc-button>

__snapshots__/open-scd.md

@@ -270,6 +270,24 @@
       <mwc-linear-progress indeterminate="">
       </mwc-linear-progress>
     </mwc-list-item>
+    <mwc-list-item
+      aria-disabled="true"
+      class="middle"
+      disabled=""
+      graphic="icon"
+      iconid="dashboard"
+      mwc-list-item=""
+      tabindex="-1"
+    >
+      <mwc-icon slot="graphic">
+        dashboard
+      </mwc-icon>
+      <span>
+        Auto Align SLD
+      </span>
+      <mwc-linear-progress indeterminate="">
+      </mwc-linear-progress>
+    </mwc-list-item>
     <li
       divider=""
       padded=""
@@ -860,6 +878,22 @@
       </mwc-icon>
       Update Substation
     </mwc-check-list-item>
+    <mwc-check-list-item
+      aria-disabled="false"
+      class="official"
+      graphic="control"
+      hasmeta=""
+      left=""
+      mwc-list-item=""
+      selected=""
+      tabindex="-1"
+      value="/src/menu/CompasAutoAlignment.js"
+    >
+      <mwc-icon slot="meta">
+        dashboard
+      </mwc-icon>
+      Auto Align SLD
+    </mwc-check-list-item>
     <li
       divider=""
       inset=""

public/js/plugins.js

@@ -112,6 +112,15 @@ export const officialPlugins = [
     requireDoc: true,
     position: 'middle'
   },
+  {
+    name: 'Auto Align SLD',
+    src: '/src/menu/CompasAutoAlignment.js',
+    icon: 'dashboard',
+    default: true,
+    kind: 'menu',
+    requireDoc: true,
+    position: 'middle'
+  },
   {
     name: 'CoMPAS Settings',
     src: '/src/menu/CompasSettings.js',

src/compas-services/CompasSclAutoAlignmentService.ts

@@ -0,0 +1,34 @@
+import {CompasSettings} from "../compas/CompasSettings.js";
+import {extractSclFromResponse, handleError, handleResponse, parseXml} from "./foundation.js";
+
+export const SAA_NAMESPACE = 'https://www.lfenergy.org/compas/SclAutoAlignmentService/v1';
+
+export function CompasSclAutoAlignmentService() {
+  function getCompasSettings() {
+    return CompasSettings().compasSettings;
+  }
+
+  return {
+    updateSCL(doc: Document, substationNames: string[]): Promise<Document> {
+      const saaUrl = getCompasSettings().sclAutoAlignmentServiceUrl + '/auto/alignment/v1';
+      return fetch(saaUrl, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/xml'
+        },
+        body: `<?xml version="1.0" encoding="UTF-8"?>
+               <saa:SclAutoAlignRequest xmlns:saa="${SAA_NAMESPACE}">
+                 ${substationNames.map(substationName => {
+                    return `
+                        <saa:SubstationName>${substationName}</saa:SubstationName>
+                    `;
+                 })}
+                 <saa:SclData><![CDATA[${new XMLSerializer().serializeToString(doc.documentElement)}]]></saa:SclData>
+               </saa:SclAutoAlignRequest>`
+      }).catch(handleError)
+        .then(handleResponse)
+        .then(parseXml)
+        .then(extractSclFromResponse);
+    },
+  }
+}

src/compas/CompasAutoAlignment.ts

@@ -0,0 +1,82 @@
+import {customElement, html, LitElement, property, TemplateResult} from "lit-element";
+import {get, translate} from "lit-translate";
+
+import {newLogEvent, newOpenDocEvent, newWizardEvent} from "../foundation.js";
+import {getOpenScdElement} from "./foundation.js";
+
+import {CompasSclAutoAlignmentService} from "../compas-services/CompasSclAutoAlignmentService.js";
+import {createLogEvent} from "../compas-services/foundation.js";
+
+@customElement('compas-auto-alignment')
+export default class CompasAutoAlignmentElement extends LitElement {
+  @property({type: Document})
+  doc!: XMLDocument;
+  @property({type: String})
+  docName!: string;
+  @property({type: String})
+  docId?: string;
+
+  getSelectedValues() : string[] {
+    const selectedItems: string[] = [];
+    this.shadowRoot!.querySelectorAll('mwc-check-list-item').forEach((item, key) => {
+      if (item.selected) {
+        selectedItems[key] = item.value;
+      }
+    });
+    return selectedItems;
+  }
+
+  valid(): boolean {
+    return this.getSelectedValues().length > 0;
+  }
+
+  async execute(): Promise<void> {
+    if (this.valid()) {
+      await CompasSclAutoAlignmentService().updateSCL(this.doc, this.getSelectedValues())
+        .then(sclDocument => {
+          const openScd = getOpenScdElement();
+          openScd.dispatchEvent(newLogEvent({kind: 'reset'}));
+          openScd.dispatchEvent(newOpenDocEvent(sclDocument, this.docName, {detail: {docId: this.docId}}));
+
+          openScd.dispatchEvent(
+            newLogEvent({
+              kind: 'info',
+              title: get('compas.autoAlignment.success')
+            }));
+
+          // Close the Save Dialog.
+          this.dispatchEvent(newWizardEvent());
+        })
+        .catch(createLogEvent);
+
+      // Close the Save Dialog.
+      this.dispatchEvent(newWizardEvent());
+    }
+  }
+
+  render(): TemplateResult {
+    return html `
+      ${this.doc?.querySelector(':root > Substation')
+        ? html`
+          <section tabindex="0">
+            <mwc-list multi required>
+              ${Array.from(this.doc.querySelectorAll(':root > Substation') ?? [])
+              .map(substation =>
+                  html`
+                    <mwc-check-list-item left value="${substation.getAttribute('name')}">
+                      ${substation.getAttribute('name')}
+                      ${substation.hasAttribute('desc') ? html `(${substation.getAttribute('desc')})`: html ``}
+                    </mwc-check-list-item>
+                  `
+              )}
+            </mwc-list>
+          </section>
+        `
+        : html`
+          <section tabindex="0">
+            <span style="color: var(--base1)">${translate('compas.autoAlignment.missing')}</span>
+          </section>
+        `}
+    `;
+  }
+}

src/compas/CompasSave.ts

@@ -17,7 +17,7 @@ import './CompasChangeSetRadiogroup.js';
 import './CompasSclTypeRadiogroup.js';
 
 @customElement('compas-save')
-export class CompasSaveElement extends CompasExistsIn(LitElement) {
+export default class CompasSaveElement extends CompasExistsIn(LitElement) {
   @property({type: Document})
   doc!: XMLDocument;
 

src/compas/CompasSettings.ts

@@ -8,6 +8,7 @@ import {getOpenScdElement} from "./foundation.js";
 export type CompasSettingsRecord = {
   sclDataServiceUrl: string;
   cimMappingServiceUrl: string;
+  sclAutoAlignmentServiceUrl: string;
 };
 
 export function CompasSettings() {
@@ -17,13 +18,15 @@ export function CompasSettings() {
       return {
         sclDataServiceUrl: this.getCompasSetting('sclDataServiceUrl'),
         cimMappingServiceUrl: this.getCompasSetting('cimMappingServiceUrl'),
+        sclAutoAlignmentServiceUrl: this.getCompasSetting('sclAutoAlignmentServiceUrl'),
       };
     },
 
     get defaultSettings(): CompasSettingsRecord {
       return {
         sclDataServiceUrl: '/compas-scl-data-service',
-        cimMappingServiceUrl: '/compas-cim-mapping'
+        cimMappingServiceUrl: '/compas-cim-mapping',
+        sclAutoAlignmentServiceUrl: '/compas-scl-auto-alignment'
       }
     },
 
@@ -55,9 +58,14 @@ export class CompasSettingsElement extends LitElement {
     return <TextFieldBase>this.shadowRoot!.querySelector('mwc-textfield[id="cimMappingServiceUrl"]');
   }
 
+  getSclAutoAlignmentServiceUrlField(): TextFieldBase {
+    return <TextFieldBase>this.shadowRoot!.querySelector('mwc-textfield[id="sclAutoAlignmentServiceUrl"]');
+  }
+
   valid(): boolean {
     return this.getSclDataServiceUrlField().checkValidity()
-      && this.getCimMappingServiceUrlField().checkValidity();
+      && this.getCimMappingServiceUrlField().checkValidity()
+      && this.getSclAutoAlignmentServiceUrlField().checkValidity();
   }
 
   save(): boolean {
@@ -68,6 +76,7 @@ export class CompasSettingsElement extends LitElement {
     // Update settings from TextField.
     CompasSettings().setCompasSetting('sclDataServiceUrl', this.getSclDataServiceUrlField().value);
     CompasSettings().setCompasSetting('cimMappingServiceUrl', this.getCimMappingServiceUrlField().value);
+    CompasSettings().setCompasSetting('sclAutoAlignmentServiceUrl', this.getSclAutoAlignmentServiceUrlField().value);
     return true;
   }
 
@@ -94,6 +103,10 @@ export class CompasSettingsElement extends LitElement {
                      label="${translate('compas.settings.cimMappingServiceUrl')}"
                      value="${this.compasSettings.cimMappingServiceUrl}" required>
       </mwc-textfield>
+      <mwc-textfield dialogInitialFocus id="sclAutoAlignmentServiceUrl"
+                     label="${translate('compas.settings.sclAutoAlignmentServiceUrl')}"
+                     value="${this.compasSettings.sclAutoAlignmentServiceUrl}" required>
+      </mwc-textfield>
 
       <mwc-button style="--mdc-theme-primary: var(--mdc-theme-error)"
                   @click=${() => {

src/menu/CompasAutoAlignment.ts

@@ -0,0 +1,50 @@
+import {html, LitElement} from 'lit-element';
+import {get} from "lit-translate";
+
+import {newPendingStateEvent, newWizardEvent, Wizard, WizardInput} from '../foundation.js';
+
+import CompasAutoAlignmentElement from "../compas/CompasAutoAlignment.js";
+import {getOpenScdElement} from "../compas/foundation.js";
+
+import "../compas/CompasAutoAlignment.js";
+
+export default class CompasAutoAlignmentMenuPlugin extends LitElement {
+  doc!: XMLDocument;
+  docName!: string;
+  docId?: string;
+
+  private autoAlignmentCompasWizard(): Wizard {
+    function execute() {
+      return function (inputs: WizardInput[], wizard: Element) {
+        const compasAutoAlignmentElement = <CompasAutoAlignmentElement>wizard.shadowRoot!.querySelector('compas-auto-alignment')
+        if (!compasAutoAlignmentElement.valid()) {
+          return [];
+        }
+
+        getOpenScdElement().dispatchEvent(newPendingStateEvent(compasAutoAlignmentElement.execute()));
+        return [];
+      };
+    }
+
+    return [
+      {
+        title: get('compas.autoAlignment.title'),
+        primary: {
+          icon: 'dashboard',
+          label: get('compas.autoAlignment.button'),
+          action: execute(),
+        },
+        content: [
+          html `
+            <compas-auto-alignment .doc="${this.doc}" .docName="${this.docName}" .docId="${this.docId}">
+            </compas-auto-alignment>
+          `,
+        ],
+      },
+    ];
+  }
+
+  async run(): Promise<void> {
+    this.dispatchEvent(newWizardEvent(this.autoAlignmentCompasWizard()));
+  }
+}