Skip to content

Latest commit

 

History

History
160 lines (127 loc) · 5.35 KB

electron.md

File metadata and controls

160 lines (127 loc) · 5.35 KB
Raw

Electron development

We learned a lot from Vuika 2019 book
("Electron Projects: Build over 9 cross-platform desktop applications from scratch").

There is also a interesting and inspiring (e.g. tabs) open-source-project of a Electron based PDF Viewer.

IPC

There is a hard distinction between the main process and the browser process. If the browser wants to tell anything to the main process it sends an according signal, let's call it click-button

<script>
    const {ipcRenderer} = require('electron');
    function clickButton() {
        console.log("firing click-button signal");
        ipcRenderer.send('click-button', null, true)
    }
</script>
<button onclick="clickButton()" id="new-window">Open File</button>

and the main process picks it up via

ipcMain.on('click-button', (event, arg) => {
    console.log("click-button received ", event, arg);
    }
})

If the main process, e.g. the menu, wants to tell anything to the browser it also sends a signal, e.g.

    const window=BrowserWindow.getFocusedWindow();
    window.webContents.send('eventForBrowser', null, true)

and in the browser's script the event can be picked up like this

    ipcRenderer.on('eventForBrowser', (event, data) => {
        console.log("received event for browser", event, data)
    })

To send signals from Vue3 to the main process you can define a function in app/preload.js e.g. like

sendMySig: () => {
    ipcRenderer.send('myX');
}

and in app/main.js you can subscribe like this:

ipcMain.on("myX", async () => {
    console.log("Whoaaa")
});

When you then fire window.api.sendMySig(); in Vue your app/main.js ipcMain will pick it up.

XSLT/Saxon

Quba uses saxon-js as XSLT processor to apply some available XSLT style sheets which were previously converted to .sef.json files using the xslt3 utility.

npm install --global xslt3
xslt3 -xsl:cii-xr.xsl -export:cii-xr.sef.json -t
xslt3 -xsl:xrechnung-html.uni.xsl -export:xrechnung-html.uni.sef.json -t

In MS Windows this only works using cmd.exe, the parameter notation for Powershell might be somewhat different.

Since xrechnung-viewer.css and xrechnung-viewer.js are required via the XSLT file this will bypass the usual javascript loading routines, which is not an issue for a development version but a severe issue in a deployed version where those files would have to be read from the ASAR file. The current workaround is copy/pasting the contents of those files into the xrechung-html.xsl XSL file to generate a self sufficient xrechung-html.sef.json.

Since the input XML can be UN/CEFACT CII or UBL, the XRechnung visualization conversion is a two-step process,

  • from the input XML to an intermediate XR format using cii-xr.sef.json and
  • from this XR format to HTML using xrechnung-html.sef.json

of course if the root note is detected to be UBL the first step will be using ubl-xr.sef.json.

Have a look at the saxon documentaion for further info.

XSLT Parameters

As documented If the xslt-file says in the header

<xsl:param name="stringsVar" as="xs:string*"/>
<xsl:param name="arrayVar" as="array(*)"/>
<xsl:param name="my:mapVar" xmlns:my="my.uri" as="map(*)"/>

one can use
<xsl:value-of select="$stringsVar"/> in the content and pass the parameters from Javascript as stylesheetParams, e.g.

return SaxonJS.transform(
{
stylesheetFileName: path.join(
__dirname,
"xslt",
"xrechnung-html." + currentLanguage + ".sef.json"
),
stylesheetParams: {
"stringsVar": ["er", "I'm excited"],
"Q{}arrayVar": [[1, 2, 3]],
"Q{my.uri}mapVar": {"a": [1, 2]}
},
sourceText: xrXML,
destination: "serialized",
},
"async"
)

We're using this for the translation vars, displaying the IDs and few conditionals like not showing payment details for orders.

Codelists

Codelists are lists of attribute values, like for countries, currencies, units or tax exemption codes. The codelists for UBL and CII are the same and they are maintained by the CEF (not to be confused with CEFACT, which is a UN body).

Apparently the OpenXRechnungToolbox has downloaded them and made them available as patch on Kosit's XRechnung Visualization. Quba is using this patch so that instead of 15 times a "H87" of a product can be resolved into the more unterstandable 15 times a "piece" of a product: unit-wise apart from "Piece" H87 or C61 "one", there are thousands of unit codes also covering e.g. sixpack, hours, kilogram, metres, square metres, litres or cubic foot.

Vue

We do internationalization with i18next, see also . How to work with vue in conjunction with PDF is explained here