Updated loading_widget.

Author: dddomodossola

examples/examples_from_contributors/bootstrap.py

@@ -18,6 +18,17 @@
 
 class MyApp(App):
     def __init__(self, *args):
+        res_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), 'res')
+        #static_file_path can be an array of strings allowing to define
+        #  multiple resource path in where the resources will be placed
+        super(MyApp, self).__init__(*args, static_file_path=res_path)
+
+    def idle(self):
+        #idle loop, you can place here custom code
+        # avoid to use infinite iterations, it would stop gui update
+        pass
+
+    def main(self):
         #custom additional html head tags
         my_html_head = """<title>Bootstrap Test</title>"""
 
@@ -38,18 +49,11 @@ def __init__(self, *args):
             <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
             <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
             """
+        #appending elements to page header
+        self.page.children['head'].add_child('myhtml', my_html_head)
+        self.page.children['head'].add_child('mycss', my_css_head)
+        self.page.children['head'].add_child('myjs', my_js_head)
 
-        res_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), 'res')
-        #static_file_path can be an array of strings allowing to define
-        #  multiple resource path in where the resources will be placed
-        super(MyApp, self).__init__(*args, static_file_path=res_path, html_head=my_html_head, css_head=my_css_head, js_head=my_js_head)
-
-    def idle(self):
-        #idle loop, you can place here custom code
-        # avoid to use infinite iterations, it would stop gui update
-        pass
-
-    def main(self):
         #creating a container VBox type, vertical (you can use also HBox or Widget)
         main_container = gui.VBox(width='500px', height='500px', style={'margin':'0px auto','padding':'10px'})
 
@@ -105,6 +109,6 @@ def main(self):
 
 if __name__ == "__main__":
     # starts the webserver
-    start(MyApp, address='127.0.0.1', port=8085, start_browser=True, username=None, password=None)
+    start(MyApp, debug=True, address='127.0.0.1', port=8085, start_browser=True, username=None, password=None)
 
 

examples/page_internals_app.py

@@ -28,9 +28,13 @@ def main(self):
         main_container = gui.VBox(width=300, height=200, style={'margin':'0px auto'})
         self.page.children['head'].add_child('test', '<meta patate>')
         self.page.children['body'].style['background-color'] = 'lightyellow'
+        self.page.children['body'].onkeydown.connect(self.onkeydown)
         # returning the root widget
         return main_container
 
+    def onkeydown(self, emitter, key, keycode, ctrl, shift, alt):
+        print("keydown: %s"%key)
+
     def onload(self, emitter):
         print(">>>>>>>>> ON PAGE LOADED")
 

examples/template_advanced_app.py

@@ -18,6 +18,20 @@
 
 class MyApp(App):
     def __init__(self, *args):
+        res_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), 'res')
+        #static_file_path can be an array of strings allowing to define
+        #  multiple resource path in where the resources will be placed
+        super(MyApp, self).__init__(*args, static_file_path=res_path)
+
+    def idle(self):
+        """ Idle loop, you can place here custom code,
+             avoid to use infinite iterations, it would stop gui update.
+            This is a Thread safe method where you can update the 
+             gui with information from external Threads.
+        """
+        pass
+
+    def main(self):
         #custom additional html head tags
         my_html_head = """
             """
@@ -31,21 +45,15 @@ def __init__(self, *args):
         my_js_head = """
             <script></script>
             """
+        #appending elements to page header
+        self.page.children['head'].add_child('myhtml', my_html_head)
+        self.page.children['head'].add_child('mycss', my_css_head)
+        self.page.children['head'].add_child('myjs', my_js_head)
+        #eventually set up body attributes/style
+        #self.page.children['body'].style['background-color'] = 'lightyellow'
+        #eventually set up body event listeners
+        #self.page.children['body'].onkeydown.connect(self.onkeydown)
 
-        res_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), 'res')
-        #static_file_path can be an array of strings allowing to define
-        #  multiple resource path in where the resources will be placed
-        super(MyApp, self).__init__(*args, static_file_path=res_path, html_head=my_html_head, css_head=my_css_head, js_head=my_js_head)
-
-    def idle(self):
-        """ Idle loop, you can place here custom code,
-             avoid to use infinite iterations, it would stop gui update.
-            This is a Thread safe method where you can update the 
-             gui with information from external Threads.
-        """
-        pass
-
-    def main(self):
         #creating a container VBox type, vertical (you can use also HBox or Widget)
         main_container = gui.VBox(width=300, height=200, style={'margin':'0px auto'})
 
@@ -54,11 +62,34 @@ def main(self):
 
     def on_close(self):
         """ Overloading App.on_close event allows to perform some 
-             activities before app termination.
-        """
+             activities before app termination. """
         super(MyApp, self).on_close()
 
+    def onload(self, emitter):
+        """ WebPage Event that occurs on webpage loaded """
+        super(MyApp, self).onload(emitter)
+
+    def onerror(self, emitter, message, source, lineno, colno):
+        """ WebPage Event that occurs on webpage errors """
+        super(MyApp, self).onerror(emitter, message, source, lineno, colno)
+
+    def ononline(self, emitter):
+        """ WebPage Event that occurs on webpage goes online after a disconnection """
+        super(MyApp, self).ononline(emitter)
+
+    def onpagehide(self, emitter):
+        """ WebPage Event that occurs on webpage when the user navigates away """
+        super(MyApp, self).onpagehide(emitter)
+
+    def onpageshow(self, emitter):
+        """ WebPage Event that occurs on webpage gets shown """
+        super(MyApp, self).onpageshow(emitter)
+
+    def onresize(self, emitter, width, height):
+        """ WebPage Event that occurs on webpage gets resized """
+        super(MyApp, self).onresize(emitter, width, height)
+
 
 if __name__ == "__main__":
     # starts the webserver
-    start(MyApp, address='0.0.0.0', port=0, start_browser=True, username=None, password=None)
+    start(MyApp, debug=True, address='0.0.0.0', port=0, start_browser=True, username=None, password=None)

remi/gui.py

@@ -296,6 +296,21 @@ def set_identifier(self, new_identifier):
         self.attributes['id'] = new_identifier
         runtimeInstances[new_identifier] = self
 
+    def innerHTML(self, local_changed_widgets):
+        ret = ''
+        for k in self._render_children_list:
+            s = self.children[k]
+            if isinstance(s, Tag):
+                ret = ret + s.repr(local_changed_widgets)
+            elif isinstance(s, type('')):
+                ret = ret + s
+            elif isinstance(s, type(u'')):
+                ret = ret + s.encode('utf-8')
+            else:
+                ret = ret + repr(s)
+            ret += '\n'
+        return ret
+
     def repr(self, changed_widgets=None):
         """It is used to automatically represent the object to HTML format
         packs all the attributes, children and so on.
@@ -307,23 +322,13 @@ def repr(self, changed_widgets=None):
         if changed_widgets is None:
             changed_widgets = {}
         local_changed_widgets = {}
-        innerHTML = ''
-        for k in self._render_children_list:
-            s = self.children[k]
-            if isinstance(s, Tag):
-                innerHTML = innerHTML + s.repr(local_changed_widgets)
-            elif isinstance(s, type('')):
-                innerHTML = innerHTML + s
-            elif isinstance(s, type(u'')):
-                innerHTML = innerHTML + s.encode('utf-8')
-            else:
-                innerHTML = innerHTML + repr(s)
+        _innerHTML = self.innerHTML(local_changed_widgets)
 
         if self._ischanged() or ( len(local_changed_widgets) > 0 ):
             self._backup_repr = ''.join(('<', self.type, ' ', self._repr_attributes, '>', 
-                                        innerHTML, '</', self.type, '>'))
+                                        _innerHTML, '</', self.type, '>'))
             #faster but unsupported before python3.6
-            #self._backup_repr = f'<{self.type} {self._repr_attributes}>{innerHTML}</{self.type}>'
+            #self._backup_repr = f'<{self.type} {self._repr_attributes}>{_innerHTML}</{self.type}>'
         if self._ischanged():
             # if self changed, no matter about the children because will be updated the entire parent
             # and so local_changed_widgets is not merged
@@ -957,19 +962,7 @@ def repr(self, changed_widgets=None):
             if changed_widgets is None:
                 changed_widgets={}
             local_changed_widgets = {}
-            innerHTML = ''
-            for k in self._render_children_list:
-                s = self.children[k]
-                if isinstance(s, Tag):
-                    innerHTML = innerHTML + s.repr(local_changed_widgets)
-                elif isinstance(s, type('')):
-                    innerHTML = innerHTML + s
-                elif isinstance(s, type(u'')):
-                    innerHTML = innerHTML + s.encode('utf-8')
-                else:
-                    innerHTML = innerHTML + repr(s)
-                innerHTML += '\n' 
-            return ''.join(('<', self.type, '>\n', innerHTML, '\n</', self.type, '>'))
+            return ''.join(('<', self.type, '>\n', self.innerHTML(local_changed_widgets), '\n</', self.type, '>'))
 
 
 class HEAD(Tag):
@@ -1040,8 +1033,7 @@ def __init__(self, title, net_interface_ip, pending_messages_queue_length, webso
                         /*var idRootNodeWidget = received_msg.substr(0,index-1);*/
                         var content = received_msg.substr(index,received_msg.length-index);
 
-                        document.body.innerHTML = '<div id="loading" style="display: none;"><div id="loading-animation"></div></div>';
-                        document.body.innerHTML += decodeURIComponent(content);
+                        document.body.innerHTML = decodeURIComponent(content);
                     }else if( received_msg[0]=='1' ){ /*update_widget*/
                         var focusedElement=-1;
                         var caretStart=-1;
@@ -1248,19 +1240,7 @@ def repr(self, changed_widgets=None):
         if changed_widgets is None:
             changed_widgets={}
         local_changed_widgets = {}
-        innerHTML = ''
-        for k in self._render_children_list:
-            s = self.children[k]
-            if isinstance(s, Tag):
-                innerHTML = innerHTML + s.repr(local_changed_widgets)
-            elif isinstance(s, type('')):
-                innerHTML = innerHTML + s
-            elif isinstance(s, type(u'')):
-                innerHTML = innerHTML + s.encode('utf-8')
-            else:
-                innerHTML = innerHTML + repr(s)
-            innerHTML += '\n' 
-        return ''.join(('<', self.type, '>\n', innerHTML, '\n</', self.type, '>'))
+        return ''.join(('<', self.type, '>\n', self.innerHTML(local_changed_widgets), '\n</', self.type, '>'))
 
 
 class BODY(Widget):
@@ -1274,8 +1254,10 @@ class BODY(Widget):
     def __init__(self, *args, **kwargs):
         super(BODY, self).__init__(*args, _type='body', **kwargs)
         loading_anim = Widget()
+        del loading_anim.style['margin']
         loading_anim.set_identifier("loading-animation")
-        loading_widget = Widget(children=[loading_anim])
+        loading_widget = Widget(children=[loading_anim], style={'display':'none'})
+        del loading_widget.style['margin']
         loading_widget.set_identifier("loading")
 
         self.append(loading_widget)

remi/server.py

@@ -436,7 +436,7 @@ def do_gui_update(self):
 
     def websocket_handshake_done(self, ws_instance_to_update):
         with self.update_lock:
-            msg = "0" + self.root.identifier + ',' + to_websocket(self.root.repr())
+            msg = "0" + self.root.identifier + ',' + to_websocket(self.page.children['body'].innerHTML({}))
             ws_instance_to_update.send_message(msg)
 
     def set_root_widget(self, widget):
@@ -447,7 +447,7 @@ def set_root_widget(self, widget):
         self.root._parent = self
         self.root.enable_refresh()
 
-        msg = "0" + self.root.identifier + ',' + to_websocket(self.root.repr())
+        msg = "0" + self.root.identifier + ',' + to_websocket(self.page.children['body'].innerHTML({}))
         self._send_spontaneous_websocket_message(msg)
 
     def _send_spontaneous_websocket_message(self, message):