JS Panel for XojoWeb Open Source

Targets Web
1

After many requests I decided to release my Wrapper of the JSPanel library under MIT license. I fixed up the code and implemented new features. I hope it will help someone and I hope I can help to better understand how WebSDK 2.0 works.

The main features are:

  • Using WebContainers to design your own dialog boxes.
  • Adds features not found in Xojo such as : Maximize, Minimize, Resize.
  • Creating hint messages.
  • Create dialog boxes with custom buttons (e.g., Yes or No).
  • Create progress dialogs that remain visible until the indicated routine is completed.
  • Create progress dialogs with messages that can be updated during the execution of a WebThread.
  • Ability to create Master and Slave panels.
  • Ability to create a dialog box containing HTML code.

Find everything on my github repository: https://github.com/attyskater/JSPanel-Xojo

Screenshot1
Screenshot1491Ă—931 15 KB

Screenshot2
Screenshot3
Screenshot4
Screenshot41040Ă—583 40.8 KB

Screenshot5
Screenshot5654Ă—515 25.2 KB

Screenshot6
Screenshot7
Screenshot7467Ă—931 33.7 KB

If anyone needs to change the colors of the various buttons etc find the code in the PreparingSession event in the Session.

20 Likes
2

Thanks for sharing this @Attilio_Punzi. :slight_smile:

3 Likes
3

Attillio, thank you very much for making it available, it comes at a very good timing for me as I needed to replace defunct code from Xojo2028 to display alerst, the example behind Hint button in posted example is exactly what I need for Xojo2023r3 - thanks again.

1 Like
4

Hello, Sir. Again, thank you for sharing this tool with the rest of Xojo users.

I just would like to report a bug and at the same time a solution to it.

There’s a quirk if resizing first triggers from the sides but works fine if it starts at the bottom as illustrated in this video.

I look at your code and the the first line of the FireResize method of AttyWebContainer says:

if self.OldWidth > 0 AND self.Oldheight > 0 then

I just changed “AND” to “OR”.

Hope this helps anyone who encounters the same. Thank you!

5

Is there a way I can set the minimum width and height of the container for resizing?

6

Hi, I’m so happy you enjoyed my tool!

Thanks for your report, I am busy with work at this time, but I will try to solve the problem.

1 Like
7

Updated to version 2.1.0:
-Fix resize bug
-Add minResizeHeight and minResizeWidth properties

5 Likes
8

Wow!

Thank you very much!

9

Hello, Sir.

I want to report another bug. If you attach a WebTimer in an instance of AttyWebContainer, an error “cannot be cast to webuicontrol” fires from the FireResize event along the

for each c as WebUIControl in Controls

next

statement block. This is because WebTimer is a WebControl and not a WebUIControl.

I’m sorry I don’t know how to fix this except to avoid the use of a timer. I would if I could.

Thanks a lot.

10

Try changing:

for

For Each d As WebControl In Controls
  If d IsA WebUIControl Then
    Var c As WebUIControl = WebUIControl(d)
...
End If
Next

may be a better way.

2 Likes
11

This works! Thank you very much!

2 Likes
12

FYI: That’s fixed for the next Xojo release.
https://tracker.xojo.com/xojoinc/xojo/-/issues/75768

2 Likes
13

Hi, Sir Attilio.

In the “Parent” example, you can drag the child outside its parent. Is it possible to limit this?

14

Hi!
I added the syncMargins and onparentresize properties to handle the behavior of nested dialogs. You can find the new version on github.

If set to true syncMargins on the child synchronizes the margins limit with those of the parent.

I hope I was helpful!

2 Likes
15

Thank you! Thank you! Thank you!

16

I just would like to report that if a parent is maximized and its child is also maximized, normalizing the parent leaves the child still in maximized state. Thanks!

1 Like