Blog

All Blog Posts  |  Next Post  |  Previous Post

TMS WEB Core v1.2 tips & tricks part 2 : file access from Electron apps

Bookmarks: 

Wednesday, June 19, 2019

In the previous blog article, we showed how the TWebFilePicker or TWebFileUpload component in TMS WEB Core are the intermediates to get read access to local files and how the Application.Download* methods can be used to write data back to the local file system. These mechanisms are required because the web application runs in the secure browser sandbox.

For Electron apps, which are native desktop executable applications running on Windows, macOS64 or Linux, this is different and via Electron direct local file access is possible. From a TMS WEB Core application we have enabled a couple of easy to use methods to access such local files.

Read and write text files

To make it easy, the TElectronStringList class is available where the TElectronStringList.SaveToFile() / TElectronStringList.LoadFromFile() methods will directly read or write text files on the local device filesystem.

As such, it is possible to load a TWebRichEdit from a local HTML file directly via:

var
  LEsl: TElectronStringList;

begin
  LEsl := TElectronStringList.Create;
  try
    LEsl.LoadFromFile('myappmyhtmlfile.html');
    WebRichEdit1.Lines.Assign(LEsl);
  finally
    LEsl.Free;
  end;
end;
Note that here the file can be directly accessed using a file path. No user consent to access this file is required. We can however still use an operating system file open dialog to pick the file. The open dialog which uses the respective operating system specific dialog on Windows, macOS, Linux allows to browse and select a file. We took care to make the component to enable this as similar as possible as the standard VCL TOpenDialog. After dropping a TElectronOpenDialog on the form the code becomes:
var
  LEsl: TElectronStringList;

begin
  If ElectronOpenDialog1.Execute then
  begin
    LEsl := TElectronStringList.Create;
    try
      LEsl.LoadFromFile(ElectronOpenDialog1.FileName);
      WebRichEdit1.Lines.Assign(LEsl);
    finally
      LEsl.Free;
    end;
  end;
end;
Read and write binary files

While the TElectronStringList offers a great and easy to use way to work with text files, the TElectronBinaryDataStream gives access to any file type on the local file system. Using TElectronBinaryDataStream, the file can be retrieved as string but now additionally the data can be retrieved as base64 string or as JavaScript array buffer.

In this example code snippet, a JPEG image file is read from the local file system and displayed via a TWebImageControl



var
  LEbs: TElectronBinaryDataStream;

begin
  ElectronOpenDialog1.Filters := 'Image files|*.jpg;*.jpeg';
  If ElectronOpenDialog1.Execute then
  begin
    LEbs := TElectronBinaryDataStream.Create;
    try
      LEbs.LoadFromFile(ElectronOpenDialog1.FileName);

      WebImageControl.URL := 'data:image/jpeg;base64,' + LEbs.Base64;
    finally
      LEbs.Free;
    end;
  end;
end;

As you can see, with TMS WEB Core and Electron you can create fully cross-platform desktop applications for Windows, macOS, Linux. You can benefit from the powerful HTML/CSS rendering to create spectacular user interfaces and still have a single code base solution for 3 operating systems. Just like Visual Studio Code, Atom, Skype, WordPress, Slack have Electron based cross platform applications, yours can be too.

Don't miss out and get started today with TMS WEB Core! You can download the trial version, go ahead with the standalone version you purchased or with TMS WEB Core and additional tools that are all included in TMS ALL-ACCESS. Our team looks forward to all your comments, feedback, feature-requests to help steering the development of TMS WEB Core to the next stages!

Bruno Fierens


Bookmarks: 

This blog post has not received any comments yet.



Add a new comment

You will receive a confirmation mail with a link to validate your comment, please use a valid email address.
All fields are required.



All Blog Posts  |  Next Post  |  Previous Post