webui-dev / pascal-webui Goto Github PK

Use any web browser as GUI, with Pascal in the backend and HTML5 in the frontend.

License: MIT License

Pascal 100.00%

browser cross-platform fpc freepascal gui html html5 javascript pascal ui

pascal-webui's Introduction

Pascal-WebUI v2.4.0

WebUI is not a web-server solution or a framework, but it allows you to use any web browser as a GUI, with Pascal in the backend and HTML5 in the frontend. All in a lightweight portable lib.

Features

Fully Independent (No need for any third-party runtimes)
Lightweight (~250 KB for minimal example, ~350 KB for basic app (no LCL) - including WebUI lib) & Small memory footprint
Fast binary communication protocol between WebUI and the browser (Instead of JSON)
Multi-platform & Multi-Browser
Using private profile for safety
Original library written in Pure C

Minimal Example

program minimal;

{$mode objfpc}{$H+}

uses
  webui;

var
  window: size_t;

begin
  window := webui_new_window;

  webui_show(window, '<html>Hello World<script src="/webui.js"></script></html>');
  webui_wait;
end.

More examples

Text editor

This text editor is a lightweight and portable example written in Free Pascal and JavaScript using WebUI as the GUI.

Documentation

Online documentation

Runtime Dependencies Comparison

	WebView	Qt	WebUI
Runtime Dependencies on Windows	WebView2	QtCore, QtGui, QtWidgets	A Web Browser
Runtime Dependencies on Linux	GTK3, WebKitGTK	QtCore, QtGui, QtWidgets	A Web Browser
Runtime Dependencies on macOS	Cocoa, WebKit	QtCore, QtGui, QtWidgets	A Web Browser

Supported Web Browsers

Browser	Windows	macOS	Linux
Mozilla Firefox	✔️	✔️	✔️
Google Chrome	✔️	✔️	✔️
Microsoft Edge	✔️	✔️	✔️
Chromium	✔️	✔️	✔️
Yandex	✔️	✔️	✔️
Brave	✔️	✔️	✔️
Vivaldi	✔️	✔️	✔️
Epic	✔️	✔️	not available
Apple Safari	not available	coming soon	not available
Opera	coming soon	coming soon	coming soon

UI & The Web Technologies

Borislav Stanimirov discusses using HTML5 in the web browser as GUI at the C++ Conference 2019 (YouTube).

Web application UI design is not just about how a product looks but how it works. Using web technologies in your UI makes your product modern and professional, And a well-designed web application will help you make a solid first impression on potential customers. Great web application design also assists you in nurturing leads and increasing conversions. In addition, it makes navigating and using your web app easier for your users.

Why Use Web Browsers?

Today's web browsers have everything a modern UI needs. Web browsers are very sophisticated and optimized. Therefore, using it as a GUI will be an excellent choice. While old legacy GUI lib is complex and outdated, a WebView-based app is still an option. However, a WebView needs a huge SDK to build and many dependencies to run, and it can only provide some features like a real web browser. That is why WebUI uses real web browsers to give you full features of comprehensive web technologies while keeping your software lightweight and portable.

How Does it Work?

Think of WebUI like a WebView controller, but instead of embedding the WebView controller in your program, which makes the final program big in size, and non-portable as it needs the WebView runtimes. Instead, by using WebUI, you use a tiny static/dynamic library to run any installed web browser and use it as GUI, which makes your program small, fast, and portable. All it needs is a web browser.

License

Licensed under the MIT License.

pascal-webui's People

Contributors

Stargazers

Watchers

Forkers

guvacode hariyawan fibodevy kagamma tonystone31 jpluimers ilhamsafiudin bryanchance

pascal-webui's Issues

Delphi not working

I adapted webui.pas for Delphi, generated the JS file and and compiled a console project without error or warning.
Nevertheless nothing happened when running the program - in an Paralles VM with Windows 11 ARM on a Macbook M1 Pro.
Tried same on a PC again nothing happened.

Have no idea where to start searching for the problem.
Maybe you can give me a hint?

Text Editor Example not working under Linux -> index.html not found

Hello,

the editor example is not working under Arch Linux (Qt6). It seems that the file index.html can not be loaded.

According to the section of the webui documentation, the absolute path is necessary for webui_set_root_folder, so I tried that as well. But I get the same result.

If I change lines 23-25 to

// Show the window, preferably in a Chromium based browser
if not webui_show_browser(window, 'ui/index.html', WEBUI_Chromium) then
  webui_show(window, 'ui/index.html');

Then, the page will be loaded, but apparently not its CSS and JS files.

Binding to an Html event and returning element value

Hello,
how can I bind a procedure in Lazarus/Freepascal with an event,
returning element value?

events not working with pascal

hello , thank you for the work u did , i tried the do button click and show message but doesnt work ,please check the below code

program project1; {$mode objfpc}{$H+} uses {$IFDEF UNIX} cthreads, {$ENDIF} Classes,WebUI,Dialogs,Interfaces { you can add units after this }; var window: size_t; procedure EventHandler(e: Pwebui_event_t); begin //writeln('Received callback: ', e^.data); ShowMessage('hello'); end; begin window := webui_new_window; webui_show(window, '1.html'); webui_bind(window, 'myid', @EventHandler); webui_wait; end.

Can you modify it and support delphi?

How to use WebUi as replacement for Microsoft Webview2 ?

You did not try to use webui as a replacement for webview in order to serve an interface that already exists as a separate website?
I have used Microsoft edge webview2 and compare the webui capabilities with it.
So far it seems that something is missing, what do you say?

webui-2.dll

hello,
i get this error when i run it.

how can i get the dll file ?

type no defined

lazarus and free pascal trunk

...
webui.pas(52,12) Error: Identifier not found "ULONG_PTR"
webui.pas(52,21) Error: Error in type definition
webui.pas(58,13) Error: Illegal expression
webui.pas(59,17) Error: Illegal expression
webui.pas(61,19) Error: Illegal expression
webui.pas(62,14) Error: Illegal expression
webui.pas(68,60) Error: Type "size_t" is not completely defined
.....
webui.pas(162,48) Verbose: There were 50 errors compiling module, stopping
Verbose: Compilation aborted
Verbose: /home/nouzi/dev/trunk/fpc/bin/x86_64-linux/ppcx64 returned an error exitcode

webui_interface_set_response

In the this example, we used webui_interface_set_response(), I guess we should use instead webui_return_string().

The function webui_interface_set_response() works fine, but all functions starting with webui_interface_xxx are designed to be used by the wrappers, like Pascal-Wraper.

The best solution is to make the examples use 100% Pascal code style by doing this:

[Pascal Example] -> [webui.pas] -> [WebUILib]
[WebUILib] -> [webui.pas events listener] -> [Pascal Example Callback]

MacOS test on a real machine

Since I dont have any Mac, Im asking for help to check if Pascal WebUI wrapper is working fine there, in real world. I only tested on VirtualBox.

Branch with MacOS support:

https://github.com/webui-dev/pascal-webui/tree/MacOS

I suggest to check if text editor example from examples/Lazarus directory works. Install Lazarus, open text_editor.lpi, compile, run. webui-2.dylib is required and it has to be in the same folder where the compiled executable is.

Any Mac owner can test. WebUI binaries for MacOS are available here: v2.4.0.

Lazarus installation with `fpcupdeluxe`

Download the tool (I used fpcupdeluxe-x86_64-darwin-cocoa.zip):
https://github.com/LongDirtyAnimAlf/fpcupdeluxe/releases/tag/v2.4.0a

Open, click Trunk in the left bottom corner, it will install latest Lazarus + FPC, thats all you need.