Dimensional Data

TMS Analytics & Physics library is a set of classes that provide functionality for building powerful math applications with Delphi. In the new version 3.2 of the library, we introduced special FNC math components. The components bring new possibilities to develop and tune your math application in design-time with standard IDE tools. In this article, we’ll consider the base concepts of the FNC math components and provide information on how to work with functions, derivatives, and integrals. All FNC math components are nonvisual. Each component implements some math concept and provides properties to manipulate and tune it in design- and run-time. Let’s consider the following components: TFNCProvider – creates math environment; allows introducing variables and parameters for function evaluations, symbolic derivatives, and integrals. TFNCFunction1D – introduces a symbolic function of one variable; allows evaluating the function for the specified variable value. TFNCDerivative1D – introduces a symbolic derivative of a math expression; allows evaluating the derivative for the specified variable value. TFNCIntegral1D – introduces a symbolic integral of a math expression; allows evaluating the integral for the specified variable value. To begin any FNC math application we first need to put a TFNCProvider component on the form. The component has two published properties: Variables (TVariableCollection) – a collection of variables that can be used as arguments of functions. Parameters (TParameterCollection) – a collection of parameters that can be used in the math environment to build functions, derivatives, integrals, and other math expressions. When you put a TFNCProvider on the form in design-time, it automatically creates a default variable ‘x’ for your math application. You can change the name of the variable or add/delete variables at design- and run-time. For the simplest math application, the default environment with one variable ‘x’ is enough. So, let’s go forward and consider the next FNC component TFNCFunction1D and its properties: Provider (TFNCProvider) – a math environment for the function. Variable (TVariableProperty) – a variable specifying the argument of the function. Formula (TFormulaProperty) – a formula specifying the math expression of the function. Placing a TFNCFunction1D on the form, it assigns the default value ‘x’ to the Variable property. We need to set up the Provider property and the expression for the Formula property, say ‘5*sin(6*x)’ in the Object Inspector. The resulting properties are shown in the picture below:  The function is ready to use. What can we do with it? The first idea is to draw the function and see what it looks like. We have the TFNCFunction1DPlotter component especially developed for this purpose: TFNCFunction1DPlotter – a binding for an FNC function component and an FNC Chart; allows drawing any FNC function on the chart. The component has several published properties that we can use to tune it and show a function on the FNC Chart: Provider (TFNCProvider) – a math environment for the component. Min (TValueProperty) – the minimal value of the variable range to plot the function. Max (TValueProperty) – the maximal value of the variable range to plot the function. PointCount (Integer) – number of points to plot the function. AFunction (TFNCBaseFunction1D) – a FNC function to plot. AssignLegend (Boolean) – if true, assigns the function’s expression to the serie’s legend. Chart (TTMSFNCChart) – an FNC chart to draw the function. First, we need to assign the appropriate Provider property. The Min […]

Let’s come straight to the point. Writing unit tests is a chore and having unit tests is a blessing. We all want to have the blessing, so with integrated unit testing in TMS WEB Core, we tried to minimize the chore. For unit testing to cover real usage scenarios, it is necessary to run the unit tests on the ‘operating system’ where the web application will run, that is the web browser. After all, all TMS WEB Core apps, and thus your code, will run in the browser, will involve dealing with the browser DOM and browser APIs, it is only logical that a TMS WEB Core unit test runs as a web app in the browser. It also means having the ability to deal with a typical web app world phenomenon and that is asynchronous behavior.  Introducing unit testing now integrated from TMS WEB Core v1.9.5.0. To start a new unit test project, create this from the Delphi IDE wizard and it creates a test project with one unit containing one test class with one test method. It allows you to fully focus on writing the test classes with their test methods. In the project manager, it looks like: and the code generated is: Notice in the code the attribute [TestFixture] on the test classes and the attribute [Test] on the test methods. A class can obviously contain as much test methods as you want and you can register as much test classes as you want with a call to TTMSWEBUnitTestingRunner.RegisterClass(). For the feedback when running the test application, use the Assert class.  When running this application, the test application in the browser behaves in the following way: Asynchronous behavior in the browser Now, how can we deal with typical asynchronous behavior in the browser and still test it properly? Well, for any asynchronous behavior in the browser, decorate the test method using it with the [Async] attribute. Then you can use the await() function to wait for the asynchronous response of the call.  This sample code demonstrates this: TMyTestClassUnit1 = class(TObject) published   //This is an async test method   [Test] [async]   procedure TestAsync; end; procedure TMyTestClassUnit1.TestAsync; var   wr: TWebHttpRequest;   res: TJSXMLHttpRequest;   js: TJSONObject; begin   wr := TWebHttpRequest.Create(nil);   wr.URL := ‘https://download.tmssoftware.com/tmsweb/1.json’;   res := await(TJSXMLHttpRequest, wr.Perform);   js := TJSONObject(TJSONObject.ParseJSONValue(res.responseText));   // response value for userId should be ‘1’   Assert.AreEqual(js.GetJSONValue(‘userId’),’1′); end; Testing JavaScript directly When you use external JavaScript libraries that you also want to involve in a test, there are several ways you can do this. You might have an Object Pascal wrapper class for JavaScript objects that you use in your test method but it could be as simple as calling the JavaScript directly from an ASM code block (a block with embedded JavaScript code within your Object Pascal code).  This is a very simple example of directly calling the JavaScript window prompt function to get a user input: procedure TMyTestClassUnit2.TestIntToStr; var   s: string; begin   asm     s = window.prompt(‘Please give your name’);   end;   Assert.AreEqual(‘Bruno’, s); end; The result in the browser when running this test becomes: A video introduction Follow unit testing step by step as our colleague Holger Flick explains in this YouTube video: Get started Go to the next level of […]

Let’s celebrate this holiday season and end the year on a positive note. During December 2021 only, TMS is doing an extra effort and offers everyone special upgrade prices. Upgrade your licenses to TMS ALL-ACCESS bundle today, before 2022 price adaptions! Get full access with:  Easy plan: All current and new products for 1 price! Easy renewal: Yearly renewal only for 495 EUR! Easy install: all products accessible via TMS Subscription Manager tool Easy support: Full online support center access to all areas Easy up-to-date: Early access to product betas Easy learning: Access to TMS WEB Academy Act now! If you would like to continue to benefit from our priority support services and development on new and existing components, we have special upgrade offers for you! Contact sales@tmssoftware.com for the best discount upgrade offer for TMS ALL-ACCESS, depending on your currently purchased products. Take advantage of upgrade discounts now and be safe against future price adaptions!Please note this offer is valid until December 31, 2021!

Introducing Google Places and polyline symbols support in TMS FNC Maps v2.4. Google Places AutoComplete The AutoComplete function provides suggestions based on a partial keyword search, usually provided by the end user. The results can be updated and displayed on the fly while the user is typing.The following example uses the TTMSFNCEdit component, available separately in TMS FNC UI Pack, to display the AutoComplete results in a dropdown panel. Thanks to the powerful combination of the TTMSFNCEdit and the synchronous GetAutoCompletSync call from TTMSFNCPlaces this can be achieved with a single line of code: procedure TForm1.TMSFNCEdit1LookupNeedData(Sender: TObject; Value: string; List: TStrings; var ItemIndex: Integer); begin List.Assign(TMSFNCPlaces1.GetAutoCompleteSync(Value)); end; Note: The AutoComplete functionality from Azure, Bing, Here and GeoApify is supported as well. Places Search The TTMSFNCGooglePlaces nearby search allows to search for specific places near a given location.This example displays a subset of the pharmacies found in the center of New York city. This is how the code looks: procedure TForm1.Button1Click(Sender: TObject); var c: TTMSFNCMapsCoordinateRec; begin c.Latitude := 40.7127753; c.Longitude := -74.0059728; TMSFNCGooglePlaces1.SearchNearby(c, ‘pharmacy’); end; procedure TForm1.TMSFNCGooglePlaces1SearchNearby(Sender: TObject; const ARequest: TTMSFNCPlacesRequest; const ARequestResult: TTMSFNCCloudBaseRequestResult); var I: Integer; begin for I := 0 to ARequest.Items.Count – 1 do begin m := TMSFNCGoogleMaps1.AddMarker(ARequest.Items[I].Coordinate.ToRec); m.AddOverlayView(ARequest.Items[I].Description); m.IconURL := ARequest.Items[I].Icon; m.DefaultIconSize := False; m.IconWidth := 32; m.IconHeight := 32; end; end; Polyline Symbols Another often requested feature was to have an option to add a direction indicator to a polyline. Polyline symbols provide a fully customizable way to achieve this. Here are a few examples that demonstrate how polyline symbols can be used in combination with Google Maps. This example shows a red closed arrow repeated every 50 pixels on a blue polyline. var ar: TTMSFNCMapsCoordinateRecArray; p: TTMSFNCGoogleMapsPolyline; ps: TTMSFNCGoogleMapsPolylineSymbol; begin TMSFNCGoogleMaps1.BeginUpdate; SetLength(ar, 3); ar[0].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude – 0.1; ar[0].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude – 0.1; ar[1].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude + 0.1; ar[1].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude + 0.1; ar[2].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude – 0.1; ar[2].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude + 0.1; p := TMSFNCGoogleMaps1.AddPolyline(ar); p.StrokeColor := gcBlue; ps := p.Symbols.Add; ps.Path := spForwardClosedArrow; ps.StrokeColor := gcRed; ps.RepeatSymbol := 50; TMSFNCGoogleMaps1.EndUpdate; end; This example shows how to use multiple symbols simultaneously including a symbol defined with a custom SVG path. var ar: TTMSFNCMapsCoordinateRecArray; p: TTMSFNCGoogleMapsPolyline; ps: TTMSFNCGoogleMapsPolylineSymbol; begin TMSFNCGoogleMaps1.BeginUpdate; SetLength(ar, 3); ar[0].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude – 0.1; ar[0].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude – 0.1; ar[1].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude + 0.1; ar[1].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude + 0.1; ar[2].Latitude := TMSFNCGoogleMaps1.Options.DefaultLatitude – 0.1; ar[2].Longitude := TMSFNCGoogleMaps1.Options.DefaultLongitude + 0.1; p := TMSFNCGoogleMaps1.AddPolyline(ar); p.StrokeColor := gcBlue; ps := p.Symbols.Add; ps.Path := spCustom; ps.CustomPath := ‘M -2,-2 2,2 M 2,-2 -2,2’; ps.Scale := 3; ps.Offset := 50; ps.RepeatSymbol := 50; ps.StrokeOpacity := 0.5; ps := p.Symbols.Add; ps.Path := spCircle; ps.Offset := 0; ps.RepeatSymbol := 100; ps.RepeatSymbolUnits := unPercentage; ps.Scale := 10; ps.StrokeWidth := 2; ps.StrokeColor := gcRed; ps.FillColor := gcRed; ps.FillOpacity := 1; TMSFNCGoogleMaps1.EndUpdate; end; Note: Polyline symbols are currently only available for the Google Maps mapping service. Available Now The TMS FNC Maps v2.4 update is available now for Delphi & Visual Studio Code (with TMS WEB Core). You can download the latest version and start using the new features right away!

Delphi IDE  Compile  XCOPY  Run on 15€ SBC Yes, that is exactly what we can do with Miletus technology in TMS WEB Core!  Create a new Miletus application from the Delphi IDE, Use a RAD component based approach with Object Pascal code to develop an app Compile for the Raspberry Pi build configuration XCOPY the single executable generated to the Raspberry Pi  Run the executable on the Raspberry Pi While we did all initial developments of Miletus on a +/- 35€ Raspberry Pi 4, we finally could put our hands on the brand new sub 15€ and much smaller Raspberry Pi Zero 2 and validate that the Miletus apps were still running on it. The good news is that it does! See in this video how we run the app with FNC gauge & chart controls and interfacing to a Bosch sensor (BME280) for air pressure, temperature and humidity: You can download the full source code of this Miletus app here. Want to learn more? Check out this blog with a video that shows step by step how you create the Miletus app for Raspberry Pi from the Delphi IDE. Get started! Miletus technology is part of TMS WEB Core and is included. Download the fully functional trial version of TMS WEB Core for Delphi or TMS WEB Core for Visual Studio Code and get started. And yes, you read that well, you can also use the free Visual Studio Code IDE used by millions with TMS WEB Core to create not only web apps but also cross platform Miletus apps.

It’s well over 2 years ago that we took the wraps of TMS WEB Core and meanwhile a lot has been written and said about TMS WEB Core. We had numerous blog posts, webinars and of course the book written by our colleague Holger Flick. So much content is spread in several places and users keep asking questions that were covered somewhere but aren’t easy to find. That is what inspired us to bring a reader’s digest blog post of worthwhile information for developers wanting to get started with TMS WEB Core. And for sure, with the upcoming XMas holiday season, it is an excellent time to sit down and explore the wonderful world of TMS WEB Core. What server do I need for TMS WEB Core web applications? A TMS WEB Core web application consists of JavaScript code that was transpiled from Object Pascal and HTML, CSS, image resources and maybe some other JavaScript libraries. As such, any web server that can server HTML pages will do. Evidently, this is IIS, Apache, embed in WordPress… we even have customers who deployed a TMS WEB Core web client application on an Arduino web server hat. TMS WEB Core comes with a debug web server, that is a small HTTP server that will immediately show your application running in the browser after compiling. This small web server (built using our own TMS Sparkle product) is just intended for debugging purposes and is in no way meant to use to deploy a TMS WEB Core app.  Can I compile any Delphi code with TMS WEB Core? No! While TMS WEB Core offers via the pas2js transpiler and its RTL a wide coverage of the Delphi language as well as the RTL, it is not 100% at the same level for various reasons. For example, pointers cannot be used. In a browser, the concept pointer doesn’t exist, hence, it is impossible to work with pointers in TMS WEB Core code. Another example that isn’t supported yet, is inline variables. This is a newer Delphi language feature not yet widely used nor requested. But be assured that most is supported, including generics, anonymous methods, RTTI, … How do I access databases? Typically, you will want to have a central hosted database where the data used by the users of your web application will be managed. A mechanism is needed to ensure your database is not wide open to just anyone with a browser. The common pattern to handle this, is by creating a REST API server that offers access to your database. There are many ways to create such REST API server. The good news is that TMS WEB Core is open to use any such REST API server. For somewhat more out of the box convenience, we have TMS XData that includes not only the REST API server part but also web client helper classes.  Can I access device hardware in the web application? It is amazing how the browser technology has evolved and offers access to a myriad of hardware on your machine or devices. This includes the camera, microphone, GPS, USB port, motion sensor, compass, Bluetooth connectivity, audio output … And yes, TMS WEB Core includes components for easy access to these devices. Can I use existing JavaScript libraries? Given the wealth […]

Intro Recently we covered a blog post related to high DPI in combination with SVG in RAD Studio Alexandria. Adding SVG to your application makes you not have to worry for what the future brings in terms of look and feel. The scalable vector graphics will always be crisp independent of the screen resolution or size of the image. Today we are going a step further yet again and want to introduce a couple of QOL changes.  SVG support is available when installing one of the following 2 products. After starting the IDE, SVG is already available. This is not only registered for our products, but also available in default VCL controls. We start by adding VCL.TMSFNCTypes or AdvTypes unit (depending on the installed product). The unit will register the SVG type at runtime. At designtime, the package already registers SVG support. In the latest version of both products, we have added a way to change the tint color, setting the overal fill, stroke and opacity as well as the ability to turn an SVG to a grayscale version. TintColor Adding an SVG image to one of your controls, directly via TPicture or via a TVirtualImageList in combination with TTMSFNCSVGImageCollection enables access to the properties. After loading an SVG via the Data property of the TTMSFNCSVGImageCollection you are able to set one of the new properties. Changing the TintColor will affect the overal appearance, the SVG engine will try to blend the TintColor with the image, creating a different appearance. Original SVG TintColor = gcDarkOrange GrayScale Enabling the property GrayScale, will transform the SVG and convert all colors to grayscale versions. Customizing Opacity, Fill and Stroke The CustomOpacity, CustomFillColor and CustomStrokeColor properties are focused on changing the whole appearance of the SVG. Currently, the CustomFillColor and CustomStrokeColor are designed to be applied on monochrome colors such as complete white or black SVG icons.  CustomOpacity = 0.4 In Code  Each property can be accessed when converting the TGraphic sub-property of a TPicture to TTMSFNCSVGBitmap (or TAdvSVGBitmap). The code to do this is shown below, and based on adding a TPicture on a TImage. (Image1.Picture.Graphic as TTMSFNCSVGBitmap).SVG.GrayScale := True;             Original SVG                                GrayScale    The same applies to all the other properties. Below is a sample changing the opacity in combination with a custom fill color. (Image1.Picture.Graphic as TTMSFNCSVGBitmap).SVG.CustomFillColor := gcRed; (Image1.Picture.Graphic as TTMSFNCSVGBitmap).SVG.CustomOpacity := 0.8;             Original SVG                          Custom Fill/Opacity    Want to know more? More information on SVG, the supported SVG features as well as the enhancements we made to our SVG engine are available in the following blog posts.

Thanks to the use of components on a visual form designer, Delphi was a pioneer in no-code long before the term started to be used. As our primary job is to develop components, the way our components are architected is instrumental in getting as close to no-code as possible. Many times it is rather low-code than no-code, but now and then, we can assemble the components in such way that a functional application can be created without writing a line of code. Today we have a look at the newest TMS FNC WX Pack release with the new TTMSFNCWXPDFThumbnailList and TTMSFNCWXPDFToolbar that facilitate to create a functional PDF viewer app for 4 frameworks and a myriad of different operating systems without writing a single line of code. The PDF viewer app The TTMSFNCWXPDFToolbar purpose is to allow navigation in a PDF that is opened to view. It contains buttons for going to the next/previous/last/first page, to open a new PDF file or to rotate pages or zoom in & out pages. The TTMSFNCWXPDFThumbnailList is, as the name implies, an either vertically or horizontally scrolling list of thumbnails of pages in the opened PDF file. It interacts with the TTMSFNCWXPDFViewer component to show the clicked page in the thumbnail list. So, to build this application, following steps are needed: 1) Drop TTMSFNCWXPDFToolbar on the form and set alignment to top 2) Drop TTMSFNCWXPDFThumbnailList on the form and set alignment to left 3) Drop TTMSFNCWXPDFViewer on the form and set alignment to client 4) Assign the TMSFNCWXPDFViewer1 to TTMSFNCWXPDFThumbnailList.Viewer 5) Assign the TMSFNCWXPDFViewer1 to TTMSFNCWXPDFToolbar.Viewer Ok, sorry, there is nothing more to do. Compile and run the app. Click the open file button in the toolbar, select a PDF file from the local file system and it will be loaded. This means, the toolbar will get active and will allow you to browse through the PDF file and the thumbnaillist will be loaded with thumbnails of all pages in the PDF. Click a thumbnail in this list and this page will be displayed in the viewer. Targets Just to avoid confusion, these steps can be performed for a VCL Windows application. But the same steps apply for a FireMonkey application that can target Windows, macOS, Linux, iOS and Android. And it does not stop there, you can do exactly the same after creating a new TMS WEB Core web client application, a TMS WEB Core Miletus cross platform desktop application or a TMS WEB Core PWA, including doing this both from the Delphi IDE or from the Visual Studio Code IDE. And finally, also from the free Lazarus IDE, it can be done from Windows, macOS, Linux. In Delphi, no-code is not a prison The power of Object Pascal component based development is that it isn’t limited to no-code or low-code, it is just a start. Where there are a lot of possibilities to create a lot of useful end-user functionality with little to no-code, Delphi still allows to go “down to the metal” and write code that can use every corner of the operating system (and that includes the web browser as operating system when a web client application is created). The WX components contain numerous properties, event handlers and public methods that allow to further programmatically manipulate the components.  What’s […]

Earlier this year, we introduced support for installing packages in TMS WEB Core for Visual Studio Code. With packages, TMS WEB Core for Visual Studio Code became easily extensible with lots more components for creating web applications. Together with this introduction, we have also make packages for installing the TMS FNC component family in TMS WEB Core for Visual Studio Code. All FNC components can now be installed & used in TMS WEB Core for Visual Studio Code applications. And this applies both to the trial version as for the full source code based registered version.  Today, we are pleased to inform that also the set of free components offered for TMS WEB Core can also be directly used from TMS WEB Core for Visual Studio Code via new package files included in the component distribution. This includes a component to open .XLSX files, generate vCalendar files, handle ZIP file, generate a QR code or to use WebRTC libraries OpenTok or Jitsi. In addition, it includes a package to install the jQWidgets Smart HTML elements component set or the Vaadin mobile UI component set and use it from TMS WEB Core for Visual Studio Code. Learn everything about free components you can now install with packages in this video by Dr. Holger Flick: If you are a TMS WEB Core enthusiast who already developed custom components, have a look at the TMS WEB Core partner program. Join the program, publish your components and get free TMS WEB Core licenses!  

Making your own OCR application has never been easier! Introduced in version 1.1.0.0 of WX pack is the new OCR Helper component, which simplifies the use of the OCR component even further. Creating & loading templates, selecting parts of an image and even getting visual feedback after the OCR process are possible with this component. Basic usage To use the component, you simply drag it on the form, load an image and assign the OCR component. From there, you can start selecting parts of an image on which you want to start the OCR process. If needed you can even save these parts as a template, which you can re-use on other images. This is something you can commonly use on standard document types from where you always want to extract specific content. With the AutoStart option, you can have the OCR process start immediately on every part you select, or you can select multiple parts and start them all at the same time. This will allocate all available OCR workers and enqueue the rest of the parts. Every time a worker is finished and becomes available, the next part will start. Processing these parts will return feedback if enabled. This will highlight the words that do not meet the confidence limits set by the user with optionally 3 different colors for 3 different confidence levels. Learn everything you need to know to get started watching the video below. In this blog article, you can read & see what more the WX component technology offers!