Chromium Edge WebGadget

Developed or developing a new product in PureBasic? Tell the world about it.
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Chromium Edge WebGadget

Post by JHPJHP »

-----------------------------------------------------------------------------------

Download Chromium Edge WebGadget from My PureBasic Stuff

-----------------------------------------------------------------------------------

Announcements
PureBasic Interface to OpenCV
PureBasic Interface to WinDivert
PureBasic Interface to WinRAR
PureBasic Interface to 7-Zip
PureBasic Interface to ImDisk
Windows Services & Other Stuff
Invading Space Aliens
Death Star vs Asteroids
GIF Toolkit
LSB Image Steganography
Spider Web Drawing
Deform Image: MLS
Video Snipping Tool
Chromium Edge WebGadget
IAccessible Interface
Stitch Images: SIFT
OldSkool Fire Effect
Image Waves: LUT
YouTube Player & Downloader
MP4 Player & Downloader
Large Image Viewer
Barcode Generator
Google Translate Service
Embed JS into PureBasic
Geolocation: Google Maps
Book & Viewer & Magnify
Video for Windows: VfW
Alternate Console
Network Share Management

-----------------------------------------------------------------------------------

This is NOT a replacement for the following projects.
- Webview2 control - Chromium browser for Purebasic (Windows) ~Justin
- PB.Ex WebGadget (Windows) (WebKit) ~RSBasic

-----------------------------------------------------------------------------------

Using similar "old school" coding techniques that helped to create OpenCV Gadgets assisted with creating Chromium Edge WebGadgets.

With very little code the Chromium Edge browser can be embedded into a PureBasic window, and used as a gadget in a variety of ways; here are just a few.
1. In its most basic form the browser can be used to view internet websites.
2. Custom webpages can be viewed using platforms only available to the latest browsers (HTML5, JavaScript, CSS3 animations, etc.).
3. With some additional PureBasic code and basic JavaScript knowledge, events from the browser can be passed to PureBasic.
4. Passing events from PureBasic to the browser is possible, but takes a bit more work...
-- the following techniques were used to create the example CE_WebGadget_1
a) Setup a CloudFlare Worker script to bypass the CORS restriction.
b) Wrote some PHP script to receive HTTP requests, updating a text based file with an event code.
c) Wrote some JavaScript routines to retrieve the event code and pass it back to PureBasic.
Last edited by JHPJHP on Sat Oct 16, 2021 8:56 pm, edited 33 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

The following image shows two Chromium Edge WebGadget's embedded into a PureBasic window.
The top gadget is an interactive marquee animation. The bottom gadget is a display-only ticker animation.
The list on the left shows the captured events.
The PureBasic gadgets on the right communicate with the top gadget.

Image
Last edited by JHPJHP on Thu Apr 29, 2021 7:23 pm, edited 2 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Updated:
- added 2 examples
- optimized event handling
- some design improvements

Examples (see first post for additional details)
1. CE_WebGadget_1.pb: Interactive, Capture PureBasic and JavaScript Events
2. CE_WebGadget_2.pb: Interactive, Capture JavaScript Events
3. CE_WebGadget_3.pb: Display Only

Each of the examples use an optional *DataSection to display the webpage; the compiled executable requires no dependencies.
The code was written so that the original HTML file can be copied to the sources folder and it will take precedent, allowing for easy edits.
The original HTML files can be found in the sources\html folder.

*DataSection created using Bin2Data ~ts-soft

NOTE:
This was only tested on my personal computer in a static environment.
Numerous settings have been enabled so as not to interfere with regular browsing, but I take no responsibility for any adverse effects.

NB*: As with any of my PureBasic Scripts & Programs, feedback will only help to improve functionality, but I don't expect any.
Last edited by JHPJHP on Wed Apr 28, 2021 11:25 pm, edited 3 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
zikitrake
Enthusiast
Enthusiast
Posts: 758
Joined: Thu Mar 25, 2004 2:15 pm
Location: Spain
Contact:

Re: Chromium Edge WebGadget

Post by zikitrake »

:shock: This would be perfect for a project I have in mind.
Is it currently possible to use assign a proxy and/or change user agent?

I currently work with the great library made by @RSBasic, but this would simplify my work a lot (I think :) ).

Thanks in advance, @JHPJHP
User avatar
HwyStar
User
User
Posts: 99
Joined: Mon Apr 05, 2010 7:13 pm
Location: Reno, Nevada

Re: Chromium Edge WebGadget

Post by HwyStar »

I will have a look at that JHP! I just finished a flight/weather info window to be used by flight simulators, and it used many calls to the default browser. It would be much nicer to control the size of the window and where it is placed, to view the generated web pages.

You may want to edit the fonts on your posts. With proSilver Dark Edition theme selected, I cannot read your colored fonts at all. Dark on Dark is no-Bueno.

Thanks!
User avatar
Kiffi
Addict
Addict
Posts: 1206
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: Chromium Edge WebGadget

Post by Kiffi »

@JHPJHP: Can you post a simple example code so we can see how to program your Edge WebGadget?

Thanks in advance ... Peter
Hygge
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Hi zikitrake,

This is not what you think... it's an "old school" hack to embed third party windows.

But, to answer your question, yes, it currently possible to assign a proxy and change the user agent.

--------------------

Hi HwyStar,

Take a look, post your comments; if anything it will help clarify this projects possibilities and short-falls.
I see what you mean about the fonts; something I might address later, thank you.

--------------------

Hi Kiffi,

Sure, I posted a temporary link to each of your private message boxes.
The download includes the basic display-only example; see previous posts for more information.

--------------------

NOTE:
This is still very experimental as it was only tested on my personal computer in a static environment.
Numerous settings have been enabled so as not to interfere with regular browsing, but I take no responsibility for any adverse effects.
Last edited by JHPJHP on Wed May 05, 2021 4:44 pm, edited 3 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
zikitrake
Enthusiast
Enthusiast
Posts: 758
Joined: Thu Mar 25, 2004 2:15 pm
Location: Spain
Contact:

Re: Chromium Edge WebGadget

Post by zikitrake »

JHPJHP wrote: Tue Apr 20, 2021 5:10 pm Hi zikitrake,

This is not what you think... it's an "old school" hack to embed third party windows. It gets even more hacky when adding functionality...
:D I see. I think It is similar (but crappier) to the procedure I did some time ago to embed chrome (with cromedriver), although it does not work well at the moment.: https://www.purebasic.fr/english/viewto ... 70#p528370, Webdriver_Embedded() procedure

Thanks anyway: Donation Done :D !
Last edited by zikitrake on Tue Apr 20, 2021 7:13 pm, edited 1 time in total.
User avatar
Kiffi
Addict
Addict
Posts: 1206
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: Chromium Edge WebGadget

Post by Kiffi »

@JHPJHP: Donation made. Thank you! :-)
Hygge
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Hi zikitrake,

Thank you for your donation, it was very much appreciated.

I just looked over your code from the link you posted...

I thought the idea to embed a browser into a ContainerGadget was unique (at least within this community), but you definitely used similar techniques years ago; unfortunately I could not get your example to work, it kept crashing.
zikitrake wrote: I think It is similar (but crappier) to the procedure I did some time ago to embed chrome (with cromedriver), although it does not work well at the moment.
:lol: I disagree, if anything they're equally crappy :P but I prefer my version, it works and doesn't require any third-party dependencies.

... one of the issues you might be having with your version is that it's running in the same process as a regular browser session, sharing its database, cache, cookies, etc. This can mostly be avoided by applying the correct switches; see the Procedure Open_CE_WebGadget from any of my three examples. This is just one of the various methods I used to protect the users environment.

In addition, the following link should be of interest: https://peter.sh/experiments/chromium-c ... -switches/

----------------

Hi Kiffi,

Thank you for your donation, it was very much appreciated.

Please note, this project is in a very early stage, I have only been working on it for less then a week.
The current three examples are only meant to demonstrate potential (test environment), not to be mistaken for a complete framework.

NB*: There have been some subtle, but important changes to the code; updates will be frequent, but mostly unreported.
Last edited by JHPJHP on Fri Apr 23, 2021 3:57 pm, edited 1 time in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
zikitrake
Enthusiast
Enthusiast
Posts: 758
Joined: Thu Mar 25, 2004 2:15 pm
Location: Spain
Contact:

Re: Chromium Edge WebGadget

Post by zikitrake »

JHPJHP wrote: Tue Apr 20, 2021 11:39 pm Hi zikitrake...
Thank you for all this information :D . I will keep it in my favorites in case I try to reuse this code in the future :!:
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Updated:
- added 1 example: CE_WebGadget_4.pb
- improved overall functionality
- removed redundant test code

CE_WebGadget_4.pb
This example demonstrates functionality of an updated WebGadget not available in IE.
It took less then 5 minutes to replicate the following example from W3Schools https://www.w3schools.com/html/tryit.as ... yhtml5_sse.

My next steps are to restructure the existing example code, and at some point the event process to JSON.

NOTE: The following two compiler options located in the PB include files are mandatory and need to be set appropriately for new examples.
#PB_Compiler_CEWG_Post
#PB_Compiler_CEWG_Event


Image
Last edited by JHPJHP on Tue May 18, 2021 4:38 pm, edited 9 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
User avatar
Kiffi
Addict
Addict
Posts: 1206
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: Chromium Edge WebGadget

Post by Kiffi »

Thanks for the updates! :)

I haven't tried the new version yet, but the previous version didn't work if there was a space in the path of the code.

Greetings ... Peter
Hygge
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Hi Kiffi,

Thank you for the feedback; the problem you reported should now be fixed.
In addition, the code has been optimized with numerous speed and stability improvements.

NB*: Each of the examples are meant to be used as templates, depending on requirements, for your own projects.
Last edited by JHPJHP on Fri Apr 30, 2021 3:05 pm, edited 2 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
User avatar
JHPJHP
Addict
Addict
Posts: 1853
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium Edge WebGadget

Post by JHPJHP »

Updated:
- restructured code for better usability

The following code example demonstrates how easy it is to create a basic CE_WebGadget.

Code: Select all

IncludeFile "sources\ce_sources.pbi"

Enumeration
  #MainWindow
  #CE_WebGadget
EndEnumeration

#PB_Compiler_CEWG_Post  = #False
#PB_Compiler_CEWG_Event = #False

If OpenWindow(#MainWindow, 0, 0, 800, 600, "Chromium Edge WebGadget", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  CE_WebGadget(#CE_WebGadget, 10, 10, 400, 300, #CE_WebGadget_Flat)
  cewg.CEWG_DATA
  cewg\GadgetNumber = #CE_WebGadget
  cewg\SourceURL = "C:\Users\JHPJHP\CE_WebGadget\webpage.html"
  CE_WebGadget_Init(cewg)
  Repeat : Until WaitWindowEvent() = #PB_Event_CloseWindow
EndIf
Last edited by JHPJHP on Fri Aug 13, 2021 4:12 pm, edited 16 times in total.

STATUS: Mostly Unavailable :: Downloads moved to My PureBasic Stuff; free executables, access key required for source code.
_________________
Post Reply