Chromium WebGadget v4

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

Re: Chromium WebGadget

Post by JHPJHP »

Updated (CrWG Builder):
- added Home screen
- added Startup screen
- improved Options screen
- added zoom and tooltip
- added progress bar
- various other improvements

Zoom and Tooltip
Not only does it zoom the page, but also controls the size of the PureBasic window.

NOTE: This is still a work in progress, but the example is now demonstrated from a PureBasic window.

Modern UI
CrWG Builder is being written using the Bootstrap Framework, hosted in a (PureBasic) Chromium WebGadget, with communications initiated from the DevTools Protocol, processed through the WebSockets API.
Last edited by JHPJHP on Tue Mar 07, 2023 3:19 am, edited 1 time in total.
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

Is it possible to disable these translation popup, right click popup and disable the user to open the devtools?

screenshot : https://prnt.sc/Gi1XnX2AWDSn
screenshot1 : https://prnt.sc/NF733XBP07Qc
screenshot2 : https://prnt.sc/F6f9LiVFj3vn
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Hi skinkairewalker,

Please download the latest version. Let me know if it resolves your concerns.
JHPJHP wrote:When time permits I’m available to help with questions about the framework, and even provide additional examples and shortcuts to assist with development. That said, if you post a question and I take the time to respond, please have the curtesy to reply with an acknowledgment.
--------------------------------

CrWG Builder is a work in progress. The application when finished should help users create their own Chromium WebGadget applications. In addition, demonstrate another method for creating a modern UI; please note, at least a basic understanding of web-design is required.
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

JHPJHP wrote: Mon Feb 27, 2023 5:27 pm Hi skinkairewalker,

Please download the latest version. Let me know if it resolves your concerns.
JHPJHP wrote:When time permits I’m available to help with questions about the framework, and even provide additional examples and shortcuts to assist with development. That said, if you post a question and I take the time to respond, please have the curtesy to reply with an acknowledgment.
--------------------------------

CrWG Builder is a work in progress. The application when finished should help users create their own Chromium WebGadget applications. In addition, demonstrate another method for creating a modern UI; please note, at least a basic understanding of web-design is required.
hi, sorry to bother you again, I would like to prevent users from right-clicking and being able to view the source code of the page easily ... in the examples inside: CrWG Framework\Bootstrap Modern UI when running to access the browser's DevTools just right click and inspect the element...
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Hi skinkairewalker,

It's not a bother asking a question, it's great to see interest in something I've written, even if it's just passing interest.
But previously you've asked questions and I posted answers, but you neglected to provide any feedback or at the minimum a thank you.

The three images you posted had to do with the CrWG Builder application, so changes were only applied to that example.
If you confirm the following changes were effective, I'll apply them to the other Bootstrap Modern UI examples.

NOTE: The things you requested (and more) were accomplished using CSS and JavaScript...

The following might be overkill but should provide a direction for your own application.

1. Suppress Translate Window
-- not knowing what would work I incorporated various solutions
---- <html lang="en" translate="no"> [ HTML Tag ]
---- <meta name="google" value="notranslate"> [ Head - Meta Tag ]
---- <body class="notranslate"> [ Body Tag ]
---- #gtx-trans { display: none; } [ CSS ]

2. Prevent Context Menu [ JavaScript ]
document.addEventListener("contextmenu", event => event.preventDefault());

3. Prevent Drag Image [ Body Tag ]
<body ondragstart="return false;">

4. Disable Element Selection [ CSS ]
* {
-webkit-touch-callout:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}


NB* The Translate window should already have been suppressed via the CLS file: --disable-features=Translate.
Last edited by JHPJHP on Wed Mar 01, 2023 4:27 pm, edited 7 times in total.
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

Sorry, I just forgot to say thank you!!
amazing work, congrats!
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

How do I redirect to another page that I load manually, without javascript or html redirecting automatically?
in the same way below?

Code: Select all

crwg_data\FilenameCLS = #PB_Compiler_Filename
  crwg_data\GadgetNumber = #Cr_WebGadget
  crwg_data\SourceURL = "editor.html"
  crwg_data\DataSource = *HTML
  crwg_data\DataLength = MemorySize(*HTML)
  Cr_WebGadget_Init(crwg_data)
  SendData.SEND_DATA
  
  
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Hi skinkairewalker,

There are two methods for redirecting to another webpage.

NOTE: The examples included with the framework demonstrate the following solutions.

DevTools Method
(internet webpage)

Code: Select all

SendData\EventID = 20300
SendData\Method = "Page.navigate"
SendData\Params = #DQUOTE$ + "url" + #DQUOTE$ + ":" + #DQUOTE$ + "https://www.google.ca" + #DQUOTE$
Cr_WebSocket_Send(Connection, @SendData)
or
(local HTML file)

Code: Select all

SendData\EventID = 20300
SendData\Method = "Page.navigate"
SendData\Params = #DQUOTE$ + "url" + #DQUOTE$ + ":" + #DQUOTE$ + "C:/CrWG Framework/webpage.html" + #DQUOTE$
Cr_WebSocket_Send(Connection, @SendData)
IAccessible Method
(only used when DevTools is not required but page navigation is still needed)

Code: Select all

crwg_data\SourceURL = "https://www.google.ca"
Cr_WebGadget_Update(crwg_data, "Refresh")
or
(ReadFile is just one method for "loading" a DataSource)

Code: Select all

If ReadFile(0, "C:\CrWG Framework\webpage.html")
  While Not Eof(0)
    HTML$ + ReadString(0) + #LF$
  Wend
  *HTML = UTF8(HTML$)
  CloseFile(0)
EndIf
*HTML = UTF8(HTML$)
crwg_data\DataSource = *HTML
crwg_data\DataLength = MemorySize(*HTML)
Cr_WebGadget_Update(crwg_data, "Refresh")
...
FreeMemory(*HTML)
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

worked great, thanks a lot for the support! you are the man …
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

I would have one more question, is it possible to run javascript functions within the site using the purebasic side?
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Hi skinkairewalker,

Yes, executing JavaScript from PureBasic is a simple process when using the DevTools Protocol.

Code: Select all

SendData\EventID = 23200
SendData\Method = "Runtime.evaluate"
SendData\Params = "expression":"document.getElementById('button').click();"
Cr_WebSocket_Send(Connection, @SendData)
The above example is the simplest method for executing JavaScript.
More complex versions of the same algorithm, and more complex algorithms are available depending on your requirements.

Again, please see existing examples; DevTools_Basic.pb contains code matching your exact request.
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

thank you very much, amazing tool!
I'm already starting to develop applications with it ...

screenshot : https://prnt.sc/lilYVZEDSMD4

the only thing missing is the tool being cross-platform ... it would be an excellent competitor to nw.js, electron and others .
but anyway, thank you immensely for the work and support
User avatar
skinkairewalker
Enthusiast
Enthusiast
Posts: 627
Joined: Fri Dec 04, 2015 9:26 pm

Re: Chromium WebGadget

Post by skinkairewalker »

JHPJHP wrote: Wed Mar 01, 2023 10:08 pm
NOTE: The examples included with the framework demonstrate the following solutions.

(ReadFile is just one method for "loading" a DataSource)

Code: Select all

If ReadFile(0, "pagefolder\webpage.html")
  While Not Eof(0)
    HTML$ + ReadString(0) + #LF$
  Wend
  *HTML = UTF8(HTML$)
  CloseFile(0)
EndIf
*HTML = UTF8(HTML$)
crwg_data\DataSource = *HTML
crwg_data\DataLength = MemorySize(*HTML)
Cr_WebGadget_Update(crwg_data, "Refresh")
...
FreeMemory(*HTML)
This method is not redirecting (nothing happens when it is triggered within the DevToolsEvent(JSONValue, Connection, PageID.s) function) ... How do I know what error is giving?

my source :

Code: Select all

If JSONArrayValueArgs
                          ElementId$ = GetJSONString(JSONArrayValueArgs)

                          ;MessageRequester("Chromium WebGadget", "ElementID: " + ElementId$, #PB_MessageRequester_Info)
                          
                          If (ElementId$ = "EditProject")
                            
                           ; MessageRequester("","Abrindo o projeto : "+Params$)
                            
                          If ReadFile(0, GetCurrentDirectory()+"editor\manager.html")
                            While Not Eof(0)
                              HTML2$ + ReadString(0) + #LF$
                            Wend
                              CurrentDirectory$ = GetCurrentDirectory()
                              HTML2$ = ReplaceString(HTML2$, "[CurrentDirectory]", CurrentDirectory$)
                              *HTML2 = UTF8(HTML2$)
                              CloseFile(0)

                          EndIf
   
                         crwg_data\FilenameCLS = #PB_Compiler_Filename
                          crwg_data\GadgetNumber = #Cr_WebGadget
                          crwg_data\SourceURL = "manager.html"
                          crwg_data\DataSource = *HTML2
                          crwg_data\DataLength = MemorySize(*HTML2)
                          Cr_WebGadget_Update(crwg_data, "Refresh")
                          
                          FreeMemory(*HTML2)
                          ....
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Hi skinkairewalker,

Sorry, the documentation for Cr_WebGadget_Update is spotty.
Your example won't work as the function requires the IAccessible Interface, and you're mixing code with the DevTools protocol.

When CrWG Builder is finished, the program should assist with using the framework, but until then try the following.

Code: Select all

Procedure UpdateWebpage(HtmlFile.s, Connection)
  If ReadFile(0, HtmlFile)
    While Not Eof(0)
      HTML$ + ReadString(0) + #LF$
    Wend
    HTML$ = ReplaceString(HTML$, "[CurrentDirectory]", GetCurrentDirectory())
    CloseFile(0)
  EndIf
  TempFile$ = GetTemporaryDirectory() + GetFilePart(HtmlFile)
  DeleteFile(TempFile$, #PB_FileSystem_Force)

  If CreateFile(0, TempFile$)
    WriteString(0, HTML$)
    CloseFile(0)
  EndIf
  TempFile$ = ReplaceString(TempFile$, "\", "/")
  SendData.SEND_DATA
  SendData\EventID = 23200
  SendData\Method = "Page.navigate"
  SendData\Params = #DQUOTE$ + "url" + #DQUOTE$ + ":" + #DQUOTE$ + TempFile$ + #DQUOTE$
  ProcedureReturn Cr_WebSocket_Send(Connection, @SendData)
EndProcedure

UpdateWebpage("editor\manager.html", Connection)
Last edited by JHPJHP on Mon Mar 06, 2023 12:18 pm, edited 2 times in total.
JHPJHP
Addict
Addict
Posts: 2129
Joined: Sat Oct 09, 2010 3:47 am
Contact:

Re: Chromium WebGadget

Post by JHPJHP »

Updated:
- improved Procedure Cr_WebGadget_Update
- some minor improvements to the framework and examples

Cr_WebGadget_Update now returns a Boolean (#True) if successful; previously a String was returned. This Procedure should mostly be used when the IAccessible Interface is enabled, but there are a few exceptions.

infratec has confirmed the problem he previously reported has been fixed. In addition, based on his suggestions a couple potential issues with the framework have been addressed.
Locked