@opencor/opencor 0.20250826.0 → 0.20250827.0

package/src/components/dialogs/BaseDialog.vue

@@ -1,58 +0,0 @@
-<template>
-  <Dialog :modal="true" appendTo="self" :pt:mask:style="{ position: 'absolute' }" @show="onShow" @hide="onHide">
-    <template v-for="(_event, slot) of $slots" #[slot]="scope">
-      <slot :name="slot" v-bind="scope" />
-    </template>
-  </Dialog>
-</template>
-
-<script setup lang="ts">
-import * as vue from 'vue'
-
-import { enableDisableMainMenu } from '../../common/common'
-
-let dialogElement: HTMLElement | null = null
-let containerElement: HTMLElement | null | undefined = null
-let mutationObserver: MutationObserver | null = null
-
-function checkDialogPosition() {
-  if (dialogElement instanceof HTMLElement && containerElement instanceof HTMLElement) {
-    const dialogRect = dialogElement.getBoundingClientRect()
-    const containerRect = containerElement.getBoundingClientRect()
-
-    dialogElement.style.top = `${String(Math.max(Math.min(dialogRect.top, containerRect.bottom - dialogRect.height), containerRect.top))}px`
-    dialogElement.style.left = `${String(Math.max(Math.min(dialogRect.left, containerRect.right - dialogRect.width), containerRect.left))}px`
-  }
-}
-
-function onShow() {
-  enableDisableMainMenu(false)
-
-  void vue.nextTick().then(() => {
-    dialogElement = document.querySelector('.p-dialog')
-    containerElement = dialogElement?.closest('[data-pc-section="mask"]')
-
-    if (dialogElement !== null && containerElement !== null) {
-      mutationObserver = new MutationObserver(() => {
-        checkDialogPosition()
-      })
-
-      mutationObserver.observe(dialogElement, { attributes: true, attributeFilter: ['style'] })
-
-      checkDialogPosition()
-    }
-  })
-}
-
-function onHide() {
-  enableDisableMainMenu(true)
-
-  void vue.nextTick().then(() => {
-    if (mutationObserver !== null) {
-      mutationObserver.disconnect()
-
-      mutationObserver = null
-    }
-  })
-}
-</script>

package/src/components/dialogs/OpenRemoteDialog.vue

@@ -1,37 +0,0 @@
-<template>
-  <BaseDialog header="Open Remote..." style="width: 39rem">
-    <div class="items-center mt-2 mb-4">
-      <FloatLabel variant="on">
-        <InputText autofocus fluid v-model="url" @keyup.enter="emitOpenRemote()" />
-        <label>URL</label>
-      </FloatLabel>
-    </div>
-    <template #footer>
-      <Button label="Open" :disabled="url === ''" @click="emitOpenRemote()" />
-      <Button label="Cancel" severity="secondary" @click="emitClose()" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-import * as vue from 'vue'
-
-const emit = defineEmits(['openRemote', 'close'])
-const url = vue.ref<string>('')
-
-function emitOpenRemote(): void {
-  if (url.value === '') {
-    return
-  }
-
-  emit('openRemote', url.value)
-
-  emitClose()
-}
-
-function emitClose(): void {
-  url.value = ''
-
-  emit('close')
-}
-</script>

package/src/components/dialogs/ResetAllDialog.vue

@@ -1,13 +0,0 @@
-<template>
-  <BaseDialog header="Reset All...">
-    <div class="mt-2 mb-4">You are about to reset all of your settings. Do you want to proceed?</div>
-    <template #footer>
-      <Button autofocus label="Yes" severity="danger" @click="$emit('resetAll')" />
-      <Button label="No" severity="secondary" @click="$emit('close')" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-defineEmits(['resetAll', 'close'])
-</script>

package/src/components/dialogs/SettingsDialog.vue

@@ -1,42 +0,0 @@
-<template>
-  <BaseDialog header="Settings..." @hide="initialiseDialog">
-    <div class="flex gap-2 items-center">
-      <Checkbox inputId="checkForUpdatesAtStartup" :binary="true" v-model="checkForUpdatesAtStartup" />
-      <label for="checkForUpdatesAtStartup">Check for updates at startup</label>
-    </div>
-    <template #footer>
-      <Button autofocus label="OK" @click="onOk" />
-      <Button label="Cancel" severity="secondary" @click="$emit('close')" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-import * as vue from 'vue'
-
-import { settings } from '../../common/settings'
-
-const emit = defineEmits(['close'])
-
-const checkForUpdatesAtStartup = vue.ref(settings.general.checkForUpdatesAtStartup)
-
-function initialiseDialog() {
-  // Note: we can come here as a result of hiding the dialog and this in case the dialog gets opened multiple times. We
-  //       could do this when showing the dialog, but it might result in the UI flashing (e.g., a checkbox was checked
-  //       and then it gets unchecked), hence we do it when hiding the dialog.
-
-  checkForUpdatesAtStartup.value = settings.general.checkForUpdatesAtStartup
-}
-
-settings.onInitialised(() => {
-  initialiseDialog()
-})
-
-function onOk() {
-  settings.general.checkForUpdatesAtStartup = checkForUpdatesAtStartup.value
-
-  settings.save()
-
-  emit('close')
-}
-</script>

package/src/components/dialogs/UpdateAvailableDialog.vue

@@ -1,16 +0,0 @@
-<template>
-  <BaseDialog header="Check For Updates...">
-    <div class="mt-2 mb-4">Version {{ version }} is available. Do you want to download it and install it?</div>
-    <template #footer>
-      <Button autofocus label="Yes" @click="$emit('downloadAndInstall')" />
-      <Button label="No" severity="secondary" @click="$emit('close')" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-defineEmits(['downloadAndInstall', 'close'])
-defineProps<{
-  version: string
-}>()
-</script>

package/src/components/dialogs/UpdateDownloadProgressDialog.vue

@@ -1,11 +0,0 @@
-<template>
-  <BaseDialog header="Downloading Update..." :closable="false" :closeOnEscape="false" style="width: 39rem">
-    <ProgressBar class="no-animation" :showValue="false" :value="percent" />
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-defineProps<{
-  percent: number
-}>()
-</script>

package/src/components/dialogs/UpdateErrorDialog.vue

@@ -1,18 +0,0 @@
-<template>
-  <BaseDialog :header="title">
-    <div class="mt-2 mb-4">
-      {{ issue }}
-    </div>
-    <template #footer>
-      <Button autofocus label="OK" @click="$emit('close')" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-defineEmits(['close'])
-defineProps<{
-  title: string
-  issue: string
-}>()
-</script>

package/src/components/dialogs/UpdateNotAvailableDialog.vue

@@ -1,12 +0,0 @@
-<template>
-  <BaseDialog header="Check For Updates...">
-    <div class="mt-2 mb-4">No updates are available at this time.</div>
-    <template #footer>
-      <Button autofocus label="OK" @click="$emit('close')" />
-    </template>
-  </BaseDialog>
-</template>
-
-<script setup lang="ts">
-defineEmits(['close'])
-</script>

package/src/components/propertyEditors/GraphsPropertyEditor.vue

@@ -1,3 +0,0 @@
-<template>
-  <PropertyEditor name="Graphs" :hasUnits="false" :properties="[]" />
-</template>

package/src/components/propertyEditors/ParametersPropertyEditor.vue

@@ -1,3 +0,0 @@
-<template>
-  <PropertyEditor name="Parameters" :properties="[]" />
-</template>

package/src/components/propertyEditors/PropertyEditor.vue

@@ -1,60 +0,0 @@
-<template>
-  <Fieldset :legend="name">
-    <DataTable
-      editMode="cell"
-      resizableColumns
-      showGridlines
-      size="small"
-      :value="properties"
-      @cell-edit-complete="onCellEditComplete"
-    >
-      <Column field="property" header="Property" :style="columnWidth" />
-      <Column field="value" header="Value" :style="columnWidth">
-        <template #body="{ data, field }">
-          {{ data[field as string] }}
-        </template>
-        <template #editor="{ data, field }">
-          <InputNumber fluid :maxFractionDigits="15" v-model="data[field]" size="small" />
-        </template>
-      </Column>
-      <Column v-if="hasUnits" field="unit" header="Unit" :style="columnWidth" />
-    </DataTable>
-  </Fieldset>
-</template>
-
-<script setup lang="ts">
-import { type DataTableCellEditCompleteEvent } from 'primevue/datatable'
-
-const props = withDefaults(
-  defineProps<{
-    name: string
-    hasUnits?: boolean
-    properties: {
-      property: string
-      value: number
-      unit?: string
-    }[]
-  }>(),
-  {
-    hasUnits: true
-  }
-)
-const columnWidth = `width: calc(100% / ${props.hasUnits ? '3' : '2'})`
-const emit = defineEmits(['propertyUpdated'])
-
-function onCellEditComplete(event: DataTableCellEditCompleteEvent): void {
-  const { data, newValue, field } = event
-
-  data[field] = newValue
-
-  emit('propertyUpdated', event.index, event.newValue)
-}
-</script>
-
-<style scoped>
-:deep(.p-inputnumber-input) {
-  padding: 0 2px !important;
-  margin: 0 !important;
-  line-height: 1.2px !important;
-}
-</style>

package/src/components/propertyEditors/SimulationPropertyEditor.vue

@@ -1,45 +0,0 @@
-<template>
-  <PropertyEditor name="Simulation" :properties="properties" @propertyUpdated="onPropertyUpdated" />
-</template>
-
-<script setup lang="ts">
-import * as vue from 'vue'
-
-import * as locApi from '../../libopencor/locApi'
-
-const props = defineProps<{
-  file: locApi.File
-}>()
-
-const uniformTimeCourse = props.file.document().simulation(0) as locApi.SedSimulationUniformTimeCourse
-const voiUnit = props.file.instance().task(0).voiUnit()
-
-const properties = vue.ref([
-  {
-    property: 'Starting point',
-    value: uniformTimeCourse.outputStartTime(),
-    unit: voiUnit
-  },
-  {
-    property: 'Ending point',
-    value: uniformTimeCourse.outputEndTime(),
-    unit: voiUnit
-  },
-  {
-    property: 'Point interval',
-    value:
-      (uniformTimeCourse.outputEndTime() - uniformTimeCourse.outputStartTime()) / uniformTimeCourse.numberOfSteps(),
-    unit: voiUnit
-  }
-])
-
-function onPropertyUpdated(index: number, value: number): void {
-  if (index === 0) {
-    uniformTimeCourse.setOutputStartTime(value)
-  } else if (index === 1) {
-    uniformTimeCourse.setOutputEndTime(value)
-  } else if (index === 2) {
-    uniformTimeCourse.setNumberOfSteps((properties.value[1].value - properties.value[0].value) / value)
-  }
-}
-</script>

package/src/components/propertyEditors/SolversPropertyEditor.vue

@@ -1,3 +0,0 @@
-<template>
-  <PropertyEditor name="Solvers" :properties="[]" />
-</template>

package/src/components/views/IssuesView.vue

@@ -1,50 +0,0 @@
-<template>
-  <Fieldset :class="'ml-4! mr-4! mb-4! ' + (simulationOnly ? 'fieldset-simulation-only' : 'fieldset')" legend="Issues">
-    <ScrollPanel :class="simulationOnly ? 'scroll-panel-simulation-only' : 'scroll-panel'">
-      <div v-for="(issue, index) in issues" :key="`issue_${index}`" :class="`issue ${index > 0 ? 'mt-4!' : ''}`">
-        <Message v-if="issue.type === locApi.EIssueType.ERROR" severity="error" icon="pi pi-times-circle">
-          {{ issue.description }}
-        </Message>
-        <Message v-else severity="warn" icon="pi pi-exclamation-triangle">
-          {{ issue.description }}
-        </Message>
-      </div>
-    </ScrollPanel>
-  </Fieldset>
-</template>
-
-<script setup lang="ts">
-import * as locApi from '../../libopencor/locApi'
-
-defineProps<{
-  issues: locApi.IIssue[]
-  simulationOnly?: boolean
-}>()
-</script>
-
-<style scoped>
-.fieldset,
-.fieldset-simulation-only {
-  overflow: hidden;
-}
-
-.fieldset {
-  height: calc(var(--block-ui-height) - var(--main-menu-height) - var(--file-tablist-height) - 1rem);
-}
-
-.fieldset-simulation-only {
-  height: calc(var(--block-ui-height) - 1rem);
-}
-
-.issue {
-  user-select: text;
-}
-
-.scroll-panel {
-  height: calc(var(--block-ui-height) - var(--main-menu-height) - var(--file-tablist-height) - 4.75rem);
-}
-
-.scroll-panel-simulation-only {
-  height: calc(var(--block-ui-height) - 4.75rem);
-}
-</style>

package/src/components/views/SimulationExperimentUiView.vue

@@ -1,154 +0,0 @@
-<template>
-  <div :class="`flex flex-row h-full ${simulationOnly ? 'div-simulation-only' : 'div-simulation'}`">
-    <IssuesView v-if="issues.length !== 0" class="grow" :issues="issues" :simulationOnly="simulationOnly" />
-    <div v-else class="flex flex-row grow">
-      <div class="ml-4 mr-4 mb-4">
-        <ScrollPanel class="h-full">
-          <Fieldset legend="Input parameters">
-            <InputWidget
-              v-for="(input, index) in (uiJson as any).input"
-              v-model="inputValues[index]"
-              v-show="showInput[index]"
-              :key="`input_${index}`"
-              :name="input.name"
-              :maximumValue="input.maximumValue"
-              :minimumValue="input.minimumValue"
-              :possibleValues="input.possibleValues"
-              :stepValue="input.stepValue"
-              :class="index !== 0 ? 'mt-6' : ''"
-              @change="updateUiAndSimulation"
-            />
-          </Fieldset>
-        </ScrollPanel>
-      </div>
-      <div :id="plotsDivId" class="grow">
-        <GraphPanelWidget
-          v-for="(_plot, index) in (uiJson as any).output.plots"
-          :key="`plot_${index}`"
-          class="graph-panel-widget"
-          :plots="plots.length !== 0 ? plots[index] : []"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import * as mathjs from 'https://cdn.jsdelivr.net/npm/mathjs@14.6.0/+esm'
-import * as vue from 'vue'
-
-import * as locCommon from '../../common/locCommon'
-import * as locApi from '../../libopencor/locApi'
-
-import { type IGraphPanelPlot } from '../widgets/GraphPanelWidget.vue'
-
-const props = defineProps<{
-  file: locApi.File
-  simulationOnly?: boolean
-  uiJson: locApi.IUiJson
-}>()
-
-const math = mathjs.create(mathjs.all ?? {}, {})
-const model = props.file.document().model(0)
-const instance = props.file.instance()
-const instanceTask = instance.task(0)
-const plotsDivId = `plotsDiv_${props.file.path()}`
-const plots = vue.ref<IGraphPanelPlot[][]>([])
-const issues = vue.ref(locApi.uiJsonIssues(props.uiJson))
-const inputValues = vue.ref<number[]>([])
-const showInput = vue.ref<boolean[]>([])
-const idToInfo: Record<string, locCommon.ISimulationDataInfo> = {}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function evaluateValue(value: string): any {
-  let index = -1
-  const parser = math.parser()
-
-  props.uiJson.input.forEach((input: locApi.IUiJsonInput) => {
-    if (input.id !== undefined && input.id !== '') {
-      parser.set(input.id, inputValues.value[++index])
-    }
-  })
-
-  return parser.evaluate(value)
-}
-
-props.uiJson.input.forEach((input: locApi.IUiJsonInput) => {
-  inputValues.value.push(input.defaultValue)
-})
-
-props.uiJson.input.forEach((input: locApi.IUiJsonInput) => {
-  showInput.value.push(evaluateValue(input.visible ?? 'true'))
-})
-
-props.uiJson.output.data.forEach((data: locApi.IUiJsonOutputData) => {
-  idToInfo[data.id] = locCommon.simulationDataInfo(instanceTask, data.name)
-})
-
-vue.onMounted(() => {
-  updateUiAndSimulation()
-
-  // Determine the number of graph panel widgets (needed to set their height).
-
-  const plotsDiv = document.getElementById(plotsDivId)
-
-  plotsDiv?.style.setProperty('--graph-panel-widget-count', String(plotsDiv.children.length))
-})
-
-function updateUiAndSimulation() {
-  // Make sure that there are no issues.
-
-  if (issues.value.length > 0) {
-    return
-  }
-
-  // Show/hide the input widgets.
-
-  props.uiJson.input.forEach((input: locApi.IUiJsonInput, index: number) => {
-    showInput.value[index] = evaluateValue(input.visible ?? 'true')
-  })
-
-  // Update the SED-ML document.
-
-  model.removeAllChanges()
-
-  props.uiJson.parameters.forEach((parameter: locApi.IUiJsonParameter) => {
-    const componentVariableNames = parameter.name.split('/')
-
-    model.addChange(componentVariableNames[0], componentVariableNames[1], String(evaluateValue(parameter.value)))
-  })
-
-  // Run the instance and update the plots.
-
-  instance.run()
-
-  const parser = math.parser()
-
-  props.uiJson.output.data.forEach((data: locApi.IUiJsonOutputData) => {
-    parser.set(data.id, locCommon.simulationData(instanceTask, idToInfo[data.id]))
-  })
-
-  plots.value = props.uiJson.output.plots.map((plot: locApi.IUiJsonOutputPlot) => {
-    return [
-      {
-        x: { data: parser.evaluate(plot.xValue) },
-        y: { data: parser.evaluate(plot.yValue) }
-      }
-    ]
-  })
-}
-</script>
-
-<style scoped>
-.graph-panel-widget {
-  height: calc(100% / var(--graph-panel-widget-count));
-}
-
-.div-simulation-only {
-  height: var(--block-ui-height);
-}
-
-.div-simulation {
-  height: calc(var(--block-ui-height) - var(--main-menu-height) - var(--file-tablist-height));
-}
-</style>