Multiple page app

[mariorl]

Is there a way to do it?

[dddomodossola]

@mariorl can you explain your requirement? Do you need multiple pages working at the same time? Or do you refer to the possibily to open dialog windows?

[mariorl]

Hi, I'm a scada developer, I noticed that yor library could be easily joined with my experience in python-snap7 to set up a console for monitoring several machines on my plant. I'm considering thow several app instances, once per machine, using different ports.

Oh, dialog windows should be wonderful if they were floating modals and can be moved arronund the main window, like a scada filling, in order to do that i'm sadly considering a javascript framework like jquery, but this is another story... Thanks-Mario.

[dddomodossola]

Wonderful, I'm planning to make a "Remi For Automation HMI" in a near future. I plan to make a visual editor that already embeds interfaces to snap7, ethercat (beckhoff), kuka (kukavarproxy) and so on.

However, as you correctly mentioned, the right way to get multiple windows is running multiple instances on different ports. Floating panels is really simple to implement, a good start point is the example https://github.com/dddomodossola/remi/blob/master/examples/resizable_panes.py .

[mariorl]

That's sound excellent. What technology are you considering for background imaging? Web scadas often use SVG since is the way to get te animation objects always in the same place regardless of brobsew nor display size, and can provide events and allow to dinamically changue color or texts (but form js, as from my experience). For the alarms and events pages a remi table app shoud be enough.

[dddomodossola]

Svg graphics are already supported in remi. You can give it a try in the visual Editor. Few basic svg elements are supported, and however it's trivial to implement the others. Nonetheless you can show complex svg images build with Inkscape or other vectorial editors. I can help you if you find it difficult.

Changing svg elements at Runtime its really simple, when you change an attribute at runtime, remi automatically updates the view.

here is the remi visual editor preview: http://remiguieditor--daviderosa.repl.co/ for a confortable use I suggest you to run it locally.

[MikeTheWatchGuy]

I LIKE those resizable panes. It would be awesome if I could get one of those for each window I create. Then the users can have "desktop" within their browser where windows come and go using those panes. Is it possible to put what would normally go into my window layout to be put into a pane?

[dddomodossola]

@MikeTheWatchGuy yes of course, they are standard containers. In that specific example they inherit the Widget class

class FloatingPanesContainer(gui.Widget)

obviously you can inherit VBox HBox and so on instead.

[MikeTheWatchGuy]

I seemed to have hit a bug in the resizeable_panes.py file. When I overlapped them like this:

I am unable to move them anymore and the console repeats these messages:

C:\Python\Anaconda3\python.exe E:/DownloadsE/resizable_panes.py
remi.server      INFO     Started httpserver http://127.0.0.1:62926/
remi.request     INFO     built UI (path=/)
on pane selection
on pane selection
127.0.0.1 - - [13/Mar/2019 19:24:44] "GET / HTTP/1.1" 200 -
remi.request     ERROR    App's parameter static_file_path must be a Dictionary.
127.0.0.1 - - [13/Mar/2019 19:24:44] "GET /res:style.css HTTP/1.1" 200 -
remi.request     ERROR    App's parameter static_file_path must be a Dictionary.
127.0.0.1 - - [13/Mar/2019 19:24:44] "GET /res:font.woff2 HTTP/1.1" 200 -
remi.server.ws   INFO     connection established: ('127.0.0.1', 62930)
remi.server.ws   INFO     handshake complete
on pane selection
on pane selection
remi.server.ws   ERROR    error parsing websocket
Traceback (most recent call last):
  File "C:\Python\Anaconda3\lib\site-packages\remi\server.py", line 254, in on_message
    callback(**param_dict)
  File "C:\Python\Anaconda3\lib\site-packages\remi\gui.py", line 117, in __call__
    return self.callback(self.event_source_instance, *callback_params)
  File "C:\Python\Anaconda3\lib\site-packages\remi\gui.py", line 108, in __call__
    callback_params =  self.event_method_bound(*args, **kwargs)
  File "E:/DownloadsE/resizable_panes.py", line 155, in on_drag
    self.origin_x = int(x)
ValueError: invalid literal for int() with base 10: '5.5'

[MikeTheWatchGuy]

I don't know if this is at all of help to the Multiple Page App.... In PySimpleGUI you can run multiple windows. Some high level calls that create a window are Pop-ups. They are simple windows that are essentially a print to a window.

Here's a demonstration of one of these in action: https://repl.it/@PySimpleGUI/Popup-Demonstration

I know the source code of that repl is PySimpleGUI and not of use, it's the effect that I'm trying to demonstrate.

Clicking the Show button causes a call to Popup which creates a new window.

      sg.Popup('A popup!', ' You typed ', values['_IN_'])

The way I handle these is that I replace one window with another. I simply set a new "root widget":

app.set_root_widget(master_widget)

My master_widget is a VBox

It took me a while to figure out this scheme would work at displaying multiple windows.

Now I'm eyeballing these panes! Those look like they would be fun to put GUIs into.

[dddomodossola]

@MikeTheWatchGuy bug fixed in the last commit. You simply need to change int() with float() in the example.

@gui.decorate_event
def on_drag(self, emitter, x, y):
    if self.active:
        if self.origin_x == -1:
            self.origin_x = float(x)
            self.origin_y = float(y)
            self.refWidget_origin_x = gui.from_pix(self.refWidget.style['left'])
            self.refWidget_origin_y = gui.from_pix(self.refWidget.style['top'])
        else:
            self.refWidget.style['left'] = gui.to_pix(self.refWidget_origin_x + float(x) - self.origin_x )
            self.refWidget.style['top'] = gui.to_pix(self.refWidget_origin_y + float(y) - self.origin_y)
            self.update_position()
        return ()