@lblod/ember-rdfa-editor-lblod-plugins 0.4.1 → 1.0.0-alpha.1

package/addon/components/template-variable-plugin/template-variable-card.ts

@@ -0,0 +1,227 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { getOwner } from '@ember/application';
+import { task } from 'ember-concurrency';
+
+import {
+  CodeListOption,
+  fetchCodeListOptions,
+} from '../../utils/variable-plugins/fetch-data';
+import { MULTI_SELECT_CODELIST_TYPE, ZONAL_URI } from '../../constants';
+import { ProseController } from '@lblod/ember-rdfa-editor/core/prosemirror';
+import { ProseStore } from '@lblod/ember-rdfa-editor/utils/datastore/prose-store';
+import { insertHtml } from '@lblod/ember-rdfa-editor/commands/insert-html-command';
+import { unwrap } from '@lblod/ember-rdfa-editor/utils/option';
+import { getAppliedMarks } from '@lblod/ember-rdfa-editor/plugins/datastore';
+
+type Args = {
+  controller: ProseController;
+};
+export default class EditorPluginsTemplateVariableCardComponent extends Component<Args> {
+  @tracked variableOptions: CodeListOption[] = [];
+  @tracked selectedVariable?: CodeListOption | CodeListOption[];
+  @tracked showCard = false;
+  @tracked multiSelect = false;
+  mappingUri?: string;
+  zonalLocationCodelistUri: string;
+  endpoint: string;
+  nonZonalLocationCodelistUri: string;
+
+  constructor(parent: unknown, args: Args) {
+    super(parent, args);
+    const config = getOwner(this)?.resolveRegistration(
+      'config:environment'
+    ) as {
+      templateVariablePlugin: {
+        zonalLocationCodelistUri: string;
+        endpoint: string;
+        nonZonalLocationCodelistUri: string;
+      };
+    };
+    const pluginConfig = config.templateVariablePlugin;
+    this.zonalLocationCodelistUri = pluginConfig.zonalLocationCodelistUri;
+    this.endpoint = pluginConfig.endpoint;
+    this.nonZonalLocationCodelistUri = pluginConfig.nonZonalLocationCodelistUri;
+  }
+
+  get controller() {
+    return this.args.controller;
+  }
+
+  @action
+  insert() {
+    const { selection } = this.controller.state;
+    if (!this.mappingUri || !this.selectedVariable) {
+      return;
+    }
+    this.controller.datastore;
+    const limitedDatastore = this.controller.datastore.limitToRange(
+      this.controller.state,
+      selection.from,
+      selection.to
+    );
+    const insertRange = [
+      ...limitedDatastore
+        .match(`>${this.mappingUri}`, 'ext:content')
+        .asObjectNodeMapping()
+        .nodes(),
+    ][0];
+    if (!insertRange) {
+      return;
+    }
+    const marks = getAppliedMarks(insertRange);
+    let htmlToInsert: string;
+    if (Array.isArray(this.selectedVariable)) {
+      htmlToInsert = this.selectedVariable
+        .map((variable) => variable.value)
+        .join(', ');
+    } else {
+      htmlToInsert = unwrap(this.selectedVariable.value);
+    }
+    htmlToInsert = this.wrapVariableInHighlight(htmlToInsert);
+    if (insertRange) {
+      this.controller.doCommand(
+        insertHtml(htmlToInsert, insertRange.from, insertRange.to, marks)
+      );
+    }
+  }
+
+  wrapVariableInHighlight(text: string) {
+    return text.replace(
+      /\$\{(.+?)\}/g,
+      '<span class="mark-highlight-manual">${$1}</span>'
+    );
+  }
+
+  @action
+  selectionChanged() {
+    this.showCard = false;
+    this.selectedVariable = undefined;
+    const { selection } = this.controller.state;
+    const { from, to } = selection;
+    const fullDatastore = this.controller.datastore;
+    const limitedDatastore = this.controller.datastore.limitToRange(
+      this.controller.state,
+      from,
+      to
+    );
+    const mapping = limitedDatastore
+      .match(null, 'a', 'ext:Mapping')
+      .asQuadResultSet()
+      .single();
+    if (mapping) {
+      const mappingUri = mapping.subject.value;
+      this.mappingUri = mappingUri;
+      const mappingTypeTriple = fullDatastore
+        .match(`>${mappingUri}`, 'dct:type')
+        .asQuadResultSet()
+        .single();
+      if (mappingTypeTriple) {
+        const mappingType = mappingTypeTriple.object.value;
+        if (mappingType === 'codelist') {
+          const codelistTriple = fullDatastore
+            .match(`>${mappingUri}`, 'ext:codelist')
+            .asQuadResultSet()
+            .single();
+          if (codelistTriple) {
+            const codelistSource = this.getCodelistSource(
+              fullDatastore,
+              mappingUri
+            );
+            this.showCard = true;
+            const codelistUri = codelistTriple.object.value;
+            void this.fetchCodeListOptions.perform(codelistSource, codelistUri);
+          }
+        } else if (mappingType === 'location') {
+          const codelistSource = this.getCodelistSource(
+            fullDatastore,
+            mappingUri
+          );
+          const measureTriple = limitedDatastore
+            .match(
+              null,
+              'a',
+              '>https://data.vlaanderen.be/ns/mobiliteit#Mobiliteitsmaatregel'
+            )
+            .asQuadResultSet()
+            .single();
+          if (!measureTriple) {
+            return;
+          }
+          const measureUri = measureTriple.subject.value;
+          const zonalityTriple = fullDatastore
+            .match(`>${measureUri}`, 'ext:zonality')
+            .asQuadResultSet()
+            .single();
+          if (!zonalityTriple) {
+            return;
+          }
+          const zonalityUri = zonalityTriple.object.value;
+          if (zonalityUri === ZONAL_URI) {
+            void this.fetchCodeListOptions.perform(
+              codelistSource,
+              this.zonalLocationCodelistUri,
+              true
+            );
+          } else {
+            void this.fetchCodeListOptions.perform(
+              codelistSource,
+              this.nonZonalLocationCodelistUri,
+              true
+            );
+          }
+          this.showCard = true;
+        }
+      }
+    }
+  }
+
+  getCodelistSource(fullDatastore: ProseStore, mappingUri: string): string {
+    const codelistSourceTriple = fullDatastore
+      .match(`>${mappingUri}`, 'dct:source')
+      .asQuadResultSet()
+      .single();
+
+    if (codelistSourceTriple) {
+      return codelistSourceTriple.object.value;
+    } else {
+      return this.endpoint;
+    }
+  }
+
+  @action
+  updateVariable(variable: CodeListOption | CodeListOption[]) {
+    this.selectedVariable = variable;
+  }
+
+  fetchCodeListOptions = task(
+    async (endpoint: string, codelistUri: string, isLocation?: boolean) => {
+      const { type, options } = await fetchCodeListOptions(
+        endpoint,
+        codelistUri
+      );
+      if (isLocation) {
+        this.variableOptions = options.map((option) => ({
+          label: option.label,
+          value: this.wrapInLocation(unwrap(option.value)),
+        }));
+      } else {
+        this.variableOptions = options;
+      }
+      if (type === MULTI_SELECT_CODELIST_TYPE) {
+        this.multiSelect = true;
+      } else {
+        this.multiSelect = false;
+      }
+    }
+  );
+
+  wrapInLocation(value: string) {
+    return `
+      <span property="https://data.vlaanderen.be/ns/mobiliteit#plaatsbepaling">
+        ${value}
+      </span>
+    `;
+  }
+}

package/addon/{constants.js → constants.ts}

@@ -1,12 +1,24 @@
-export const TABLE_OF_CONTENTS_DEFAULT_CONFIG = [
+export type TableOfContentsConfig = {
+  sectionPredicate: string[];
+  value:
+    | string
+    | {
+        predicate: string;
+      };
+}[];
+
+export const TABLE_OF_CONTENTS_DEFAULT_CONFIG: TableOfContentsConfig = [
   {
-    sectionPredicate: 'https://say.data.gift/ns/hasPart',
+    sectionPredicate: ['https://say.data.gift/ns/hasPart', 'say:hasPart'],
     value: {
       predicate: 'https://say.data.gift/ns/heading',
     },
   },
   {
-    sectionPredicate: 'https://say.data.gift/ns/hasParagraph',
+    sectionPredicate: [
+      'https://say.data.gift/ns/hasParagraph',
+      'say:hasParagraph',
+    ],
     value: '§',
   },
 ];

package/addon/ember-nodes/table-of-contents.ts

@@ -0,0 +1,53 @@
+import { optionMapOr } from '@lblod/ember-rdfa-editor/utils/option';
+import {
+  createEmberNodeSpec,
+  createEmberNodeView,
+  EmberNodeConfig,
+} from '@lblod/ember-rdfa-editor/utils/ember-node';
+import {
+  TableOfContentsConfig,
+  TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+} from '../constants';
+
+export const emberNodeConfig: EmberNodeConfig = {
+  name: 'table-of-contents',
+  componentPath: 'table-of-contents-plugin/ember-nodes/table-of-contents',
+  inline: false,
+  group: 'tableOfContents',
+  atom: true,
+  attrs: {
+    config: {
+      default: TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+      serialize: (node) => {
+        return JSON.stringify(node.attrs['config']);
+      },
+    },
+  },
+  parseDOM: [
+    {
+      tag: 'div',
+      getAttrs(element: HTMLElement) {
+        if (
+          element.dataset['emberNode'] === 'table-of-contents' ||
+          // Ensure backwards compatibility
+          element.dataset['inlineComponent'] ===
+            'inline-components/table-of-contents' ||
+          (element.classList.contains('inline-component') &&
+            element.classList.contains('inline-components/table-of-contents'))
+        ) {
+          return {
+            config: optionMapOr(
+              TABLE_OF_CONTENTS_DEFAULT_CONFIG,
+              JSON.parse,
+              element.getAttribute('config')
+            ) as TableOfContentsConfig,
+          };
+        }
+        return false;
+      },
+    },
+  ],
+};
+
+export const tableOfContents = createEmberNodeSpec(emberNodeConfig);
+export const tableOfContentsView = createEmberNodeView(emberNodeConfig);

package/addon/helpers/{limit-text.js → limit-text.ts}

@@ -1,7 +1,7 @@
 import { helper } from '@ember/component/helper';
 
-export default helper(function limitText([string]) {
-  if (string.length > 140) {
+export default helper(function limitText([string]: string[]) {
+  if (string && string.length > 140) {
     return string.slice(0, 140) + '...';
   } else {
     return string;

package/addon/initializers/plugin-initializer.js

@@ -1,75 +0,0 @@
-import BesluitTypePlugin from '../plugins/besluit-type-plugin';
-import CitatenPlugin from '../plugins/citaten-plugin';
-import StandardTemplatePlugin from '../plugins/standard-template-plugin';
-import GenerateTemplatePlugin from '../plugins/generate-template-plugin';
-import RoadSignRegulationPlugin from '../plugins/roadsign-regulation-plugin';
-import TableOfContentsPlugin from '../plugins/table-of-contents-plugin';
-import RdfaDatePlugin from '../plugins/rdfa-date-plugin';
-import ImportSnippetPlugin from '../plugins/import-snippet-plugin';
-import TemplateVariablePlugin from '../plugins/template-variable-plugin';
-import InsertVariablePlugin from '../plugins/insert-variable-plugin';
-
-function pluginFactory(plugin) {
-  return {
-    create: (initializers) => {
-      const pluginInstance = new plugin();
-      Object.assign(pluginInstance, initializers);
-      return pluginInstance;
-    },
-  };
-}
-
-export function initialize(application) {
-  application.register('plugin:citaten', pluginFactory(CitatenPlugin), {
-    singleton: false,
-  });
-  application.register(
-    'plugin:standard-template',
-    pluginFactory(StandardTemplatePlugin),
-    { singleton: false }
-  );
-  application.register(
-    'plugin:besluit-type',
-    pluginFactory(BesluitTypePlugin),
-    { singleton: false }
-  );
-  application.register(
-    'plugin:table-of-contents',
-    pluginFactory(TableOfContentsPlugin),
-    { singleton: false }
-  );
-  application.register(
-    'plugin:generate-template',
-    pluginFactory(GenerateTemplatePlugin),
-    { singleton: false }
-  );
-  application.register(
-    'plugin:roadsign-regulation',
-    pluginFactory(RoadSignRegulationPlugin),
-    { singleton: false }
-  );
-  application.register('plugin:rdfa-date', pluginFactory(RdfaDatePlugin), {
-    singleton: false,
-  });
-  application.register(
-    'plugin:import-snippet',
-    pluginFactory(ImportSnippetPlugin),
-    {
-      singleton: false,
-    }
-  );
-  application.register(
-    'plugin:template-variable',
-    pluginFactory(TemplateVariablePlugin),
-    { singleton: false }
-  );
-  application.register(
-    'plugin:insert-variable',
-    pluginFactory(InsertVariablePlugin),
-    { singleton: false }
-  );
-}
-
-export default {
-  initialize,
-};

package/addon/models/instruction.ts

@@ -0,0 +1,18 @@
+import { unwrap } from '@lblod/ember-rdfa-editor/utils/option';
+import { IBindings } from 'fetch-sparql-endpoint';
+
+export default class Instruction {
+  constructor(
+    readonly name: string,
+    readonly template: string,
+    readonly annotatedTemplate: string
+  ) {}
+
+  static fromBinding(binding: IBindings) {
+    return new Instruction(
+      unwrap(binding['name']?.value),
+      unwrap(binding['template']?.value),
+      unwrap(binding['annotatedTemplate']?.value)
+    );
+  }
+}

package/addon/models/measure.ts

@@ -0,0 +1,38 @@
+import { tracked } from '@glimmer/tracking';
+import { unwrap } from '@lblod/ember-rdfa-editor/utils/option';
+import { IBindings } from 'fetch-sparql-endpoint';
+import Sign from './sign';
+
+export default class Measure {
+  @tracked signs: Sign[] = [];
+  classifications = new Set();
+
+  constructor(
+    readonly uri: string,
+    readonly label: string,
+    readonly template: string,
+    readonly annotatedTemplate: string,
+    readonly zonality: string,
+    readonly temporal: string | false,
+    signs: Sign[] = []
+  ) {
+    this.signs = signs;
+  }
+
+  static fromBinding(binding: IBindings) {
+    const uri = unwrap(binding['uri']?.value);
+    const label = unwrap(binding['label']?.value);
+    const template = unwrap(binding['basicTemplate']?.value);
+    const temporal = binding['temporal']?.value ?? false;
+    const annotatedTemplate = unwrap(binding['annotatedTemplate']?.value);
+    const zonality = unwrap(binding['zonality']?.value);
+    return new Measure(
+      uri,
+      label,
+      template,
+      annotatedTemplate,
+      zonality,
+      temporal
+    );
+  }
+}

package/addon/models/sign.ts

@@ -0,0 +1,36 @@
+import { unwrap } from '@lblod/ember-rdfa-editor/utils/option';
+import { IBindings } from 'fetch-sparql-endpoint';
+
+export default class Sign {
+  constructor(
+    readonly code: string,
+    readonly image: string,
+    readonly classifications: string[] = [],
+    readonly uri: string,
+    readonly order: string,
+    readonly zonality: string
+  ) {}
+  static fromBinding(binding: IBindings) {
+    const code = unwrap(binding['code']?.value);
+    const image = Sign.processImage(
+      unwrap(binding['image']?.value),
+      unwrap(binding['imageBaseUrl']?.value)
+    );
+
+    const uri = unwrap(binding['uri']?.value);
+    const order = unwrap(binding['order']?.value);
+
+    const classifications = binding['classifications']?.value.split('|') ?? [];
+    const zonality = unwrap(binding['zonality']?.value);
+    return new Sign(code, image, classifications, uri, order, zonality);
+  }
+
+  static processImage(url: string, imageBaseUrl: string) {
+    const isAbsoluteRegex = new RegExp('^(?:[a-z]+:)?//', 'i');
+    if (isAbsoluteRegex.test(url)) {
+      return url;
+    } else {
+      return `${imageBaseUrl}${url}`;
+    }
+  }
+}

package/addon/models/template.ts

@@ -0,0 +1,14 @@
+import Model, { attr } from '@ember-data/model';
+declare module 'ember-data/types/registries/model' {
+  export default interface ModelRegistry {
+    template: TemplateModel;
+  }
+}
+export default class TemplateModel extends Model {
+  @attr declare title: string;
+  @attr('string-set', { defaultValue: () => [] }) declare matches: string[];
+  @attr declare body: string;
+  @attr('string-set', { defaultValue: () => [] }) declare contexts: string[];
+  @attr('string-set', { defaultValue: () => [] })
+  declare disabledInContexts: string[];
+}

package/addon/plugins/article-structure-plugin.ts

@@ -0,0 +1,55 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+import IntlService from 'ember-intl/services/intl';
+import optionsWithDefaults from '../utils/article-structure-plugin/options-with-defaults';
+
+export type StructureSpec = {
+  uriBase: string;
+  title: string;
+  type: string;
+  numberPredicate: string;
+  numbering?: string;
+  numberingFunction?: (num: number) => string;
+  heading?: string;
+  translation: string;
+  moveUp: string;
+  moveDown: string;
+  insertPredicate?: {
+    long: string;
+    short: string;
+  };
+  shaclConstraint: string;
+  template: (uri: string, intlService: IntlService) => string;
+};
+
+export type ArticleStructurePluginOptions = {
+  structures: StructureSpec[];
+};
+
+export type ResolvedArticleStructurePluginOptions = {
+  structures: StructureSpec[];
+  structureTypes: string[];
+};
+
+export const articleStructureInsertWidget: (
+  options?: ArticleStructurePluginOptions
+) => WidgetSpec = (options) => {
+  return {
+    componentName: 'article-structure-plugin/article-structure-card',
+    desiredLocation: 'insertSidebar',
+    widgetArgs: {
+      options: optionsWithDefaults(options),
+    },
+  };
+};
+
+export const articleStructureContextWidget: (
+  options?: ArticleStructurePluginOptions
+) => WidgetSpec = (options) => {
+  return {
+    componentName: 'article-structure-plugin/structure-card',
+    desiredLocation: 'sidebar',
+    widgetArgs: {
+      options: optionsWithDefaults(options),
+    },
+  };
+};

package/addon/plugins/besluit-plugin.ts

@@ -0,0 +1,27 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor';
+import { VariableType } from '@lblod/ember-rdfa-editor-lblod-plugins/utils/variable-plugins/default-variable-types';
+
+export interface DecisionOptions {
+  publisher?: string;
+  variableTypes?: (VariableType | string)[];
+  defaultEndpoint?: string;
+}
+
+export function besluitPluginCardWidget(): WidgetSpec {
+  return {
+    componentName: 'besluit-plugin/besluit-plugin-card',
+    desiredLocation: 'insertSidebar',
+  };
+}
+
+export function besluitContextCardWidget(
+  options: DecisionOptions = {}
+): WidgetSpec {
+  return {
+    componentName: 'besluit-plugin/besluit-context-card',
+    desiredLocation: 'sidebar',
+    widgetArgs: {
+      options,
+    },
+  };
+}

package/addon/plugins/besluit-type-plugin.ts

@@ -0,0 +1,6 @@
+import { WidgetSpec } from '@lblod/ember-rdfa-editor/core/prosemirror';
+
+export const besluitTypeWidget: WidgetSpec = {
+  componentName: 'besluit-type-plugin/toolbar-dropdown',
+  desiredLocation: 'toolbarRight',
+};