changeset 654:40c72f3b7638 frontends_multi_profiles

browser_side: MainPanel is now based on a DockPanel, which allows to use less tables and also to remove some "window resized" listeners
author souliane <souliane@mailoo.org>
date Fri, 27 Feb 2015 02:39:43 +0100
parents e1d067378ad3
children 048401e5c506
files src/browser/libervia_main.py src/browser/public/libervia.css src/browser/sat_browser/contact_list.py src/browser/sat_browser/libervia_widget.py src/browser/sat_browser/main_panel.py src/browser/sat_browser/menu.py
diffstat 6 files changed, 58 insertions(+), 128 deletions(-) [+]
line wrap: on
line diff
--- a/src/browser/libervia_main.py	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/libervia_main.py	Fri Feb 27 02:39:43 2015 +0100
@@ -81,7 +81,6 @@
         self.bridge_signals = json.BridgeSignals(self)
         QuickApp.__init__(self, json.BridgeCall)
         self.uni_box = None # FIXME: to be removed
-        self.status_panel = HTML('<br />')
         self.panel = main_panel.MainPanel(self)
         self.tab_panel = self.panel.tab_panel
         self.tab_panel.addTabListener(self)
@@ -307,9 +306,8 @@
             del self._register_box  # don't work if self._register_box is None
 
         # display the real presence status panel
-        self.panel.header.remove(self.status_panel)
-        self.status_panel = main_panel.PresenceStatusPanel(self)
-        self.panel.header.add(self.status_panel)
+        self.presence_status_panel = main_panel.PresenceStatusPanel(self)
+        self.panel.addPresenceStatusPanel(self.presence_status_panel)
 
         self.bridge_signals.call('getSignals', self.bridge_signals.signalHandler)
 
--- a/src/browser/public/libervia.css	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/public/libervia.css	Fri Feb 27 02:39:43 2015 +0100
@@ -137,10 +137,13 @@
 .header {
     background-color: #eee;
     border-bottom: 1px solid #ddd;
+    width: 100%;
+    height: 64px;
 }
 
-.menuContainer {
-    margin: 0 32px 0 20px;   
+.mainPanel {
+    width: 100%;
+    height: 100%;
 }
 
 .mainMenuBar {
@@ -148,7 +151,6 @@
     background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222));
     background: -webkit-linear-gradient(top, #444444, #222222);
     background: linear-gradient(to bottom, #444444, #222222);
-    width: 100%;
     height: 28px;
     padding: 5px 5px 0 5px;    
     border: 1px solid #ddd;
@@ -157,6 +159,10 @@
     -webkit-box-shadow: 0px 1px 4px #000;
     box-shadow: 0px 1px 4px #000;
     display: inline-block;
+    position: absolute;
+    left: 20px;
+    right: 20px;
+    width: auto;
 }
 
 .mainMenuBar .gwt-MenuItem {
@@ -422,14 +428,7 @@
 
 div.contactList {
     width: 100%;
-   /* We want the contact panel to not use all the available height when displayed
-      in the unibox panel (grey part), because the dialogs panels (white part) should
-      still be visible. The setting max-height: fit-content would be appropriate here
-      but it doesn't work with firefox 24.0. TODO: check if the current setting works
-      with other browsers... the panel should of course not be displayed on 100px
-      but exactly fit the contacts box.
-     */
-    max-height: 100px;
+    margin-top: 9px;
 }
 
 .contactTitle {
@@ -447,6 +446,7 @@
     border: 0;
     padding: 0;
     font-size: large;
+    margin-top: 9px;
 }
 
 .groupPanel {
@@ -610,10 +610,9 @@
     height:45px;
 }
 
-.statusPanel {
+.presenceStatusPanel {
     margin: auto;
     text-align: center;
-    width: 100%;
     padding: 5px 0px;
     text-shadow: 0 -1px 1px rgba(255,255,255,0.25);
     font-size: 1.2em;
@@ -1132,9 +1131,6 @@
 
 /* Tab panel */
 
-.liberviaTabPanel {
-}
-
 .gwt-TabPanel {
 }
 
@@ -1148,13 +1144,6 @@
     border-bottom: 3px solid #a01c1c;  
 }
 
-.mainTabPanel .gwt-TabBar {
-    z-index: 10;
-    position: fixed;
-    bottom: 0;
-    left: 0;
-}
-
 .gwt-TabBar .gwt-TabBarFirst {
     height: 100%;
 }
@@ -1162,12 +1151,13 @@
 .gwt-TabBar .gwt-TabBarRest {
 }
 
-.liberviaTabPanel .gwt-TabBar {;
+.mainPanel .gwt-TabBar {
+    z-index: 10;
 }
 
-.liberviaTabPanel .gwt-TabBar .gwt-TabBarItem {
-    cursor: pointer;
-    margin-right: 5px;
+.liberviaTabPanel {
+    width: 100%;
+    height: 100%;
 }
 
 .liberviaTabPanel .gwt-TabBarItem div {
@@ -1185,6 +1175,8 @@
     padding: 4px 15px 4px 15px;
     border-radius: 1em 1em 0 0;
     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+    cursor: pointer;
+    margin-right: 5px;
 }
 
 .liberviaTabPanel .gwt-TabBarItem-selected {
@@ -1198,6 +1190,7 @@
     padding: 4px 15px 4px 15px;
     border-radius: 1em 1em 0 0;
     text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+    cursor: default;
 }
 
 .liberviaTabPanel div.gwt-TabBarItem:hover {
@@ -1213,10 +1206,6 @@
     text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); 
 }
 
-.liberviaTabPanel .gwt-TabBar .gwt-TabBarItem-selected {
-    cursor: default;
-}
-
 .globalLeftArea {
     margin-top: 9px;
 }
--- a/src/browser/sat_browser/contact_list.py	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/sat_browser/contact_list.py	Fri Feb 27 02:39:43 2015 +0100
@@ -236,18 +236,10 @@
             self._contacts_panel.setState(jid_, "messageWaiting", True)
 
     def onWindowResized(self, width, height):
-        contact_panel_elt = self.getElement()
-        # FIXME: still needed ?
-        # classname = 'widgetsPanel' if isinstance(self.getParent().getParent(), panels.UniBoxPanel) else 'gwt-TabBar'
-        classname = 'gwt-TabBar'
-        _elts = doc().getElementsByClassName(classname)
-        if not _elts.length:
-            log.error("no element of class %s found, it should exist !" % classname)
-            tab_bar_h = height
-        else:
-            tab_bar_h = DOM.getAbsoluteTop(_elts.item(0)) or height  # getAbsoluteTop can be 0 if tabBar is hidden
-
-        ideal_height = tab_bar_h - DOM.getAbsoluteTop(contact_panel_elt) - 5
+        tab_bar = self.host.panel.tab_panel.getTabBar()
+        ideal_height = height - DOM.getAbsoluteTop(self.getElement()) - 5
+        if tab_bar.getVisible():
+            ideal_height -= DOM.getOffsetHeight(tab_bar.getElement())
         self.scroll_panel.setHeight("%s%s" % (ideal_height, "px"))
 
     # def updateContact(self, jid_s, attributes, groups):
--- a/src/browser/sat_browser/libervia_widget.py	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/sat_browser/libervia_widget.py	Fri Feb 27 02:39:43 2015 +0100
@@ -746,12 +746,10 @@
     """The panel managing the tabs"""
 
     def __init__(self, host):
-        TabPanel.__init__(self)
+        TabPanel.__init__(self, FloatingTab=True)
         ClickHandler.__init__(self)
         self.host = host
         self.setStyleName('liberviaTabPanel')
-        self.addStyleName('mainTabPanel')
-        Window.addWindowResizeListener(self)
 
         self.tabBar.addTab(u'✚', True)
 
@@ -776,19 +774,6 @@
         """
         return self.deck.visibleWidget
 
-    def onWindowResized(self, width, height):
-        tab_panel_elt = self.getElement()
-        _elts = doc().getElementsByClassName('gwt-TabBar')
-        if not _elts.length:
-            log.error("no TabBar found, it should exist !")
-            tab_bar_h = 0
-        else:
-            tab_bar_h = _elts.item(0).offsetHeight
-        ideal_height = height - DOM.getAbsoluteTop(tab_panel_elt) - tab_bar_h - 5
-        ideal_width = width - DOM.getAbsoluteLeft(tab_panel_elt) - 5
-        self.setWidth("%s%s" % (ideal_width, "px"))
-        self.setHeight("%s%s" % (ideal_height, "px"))
-
     def addTab(self, widget, label, select=False):
         """Create a new tab for the given widget.
 
--- a/src/browser/sat_browser/main_panel.py	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/sat_browser/main_panel.py	Fri Feb 27 02:39:43 2015 +0100
@@ -26,14 +26,14 @@
 from sat.core.i18n import _
 from sat_frontends.tools.strings import addURLToText
 
-from pyjamas.ui.AbsolutePanel import AbsolutePanel
+from pyjamas.ui.DockPanel import DockPanel
 from pyjamas.ui.HorizontalPanel import HorizontalPanel
+from pyjamas.ui.VerticalPanel import VerticalPanel
 from pyjamas.ui.Button import Button
 from pyjamas.ui.HTML import HTML
 from pyjamas.ui.ClickListener import ClickHandler
 from pyjamas.Timer import Timer
-from pyjamas import Window
-from __pyjamas__ import doc
+from pyjamas.ui import HasVerticalAlignment
 
 
 import base_menu
@@ -128,10 +128,10 @@
 
     def __init__(self, host, status=''):
         self.host = host
-        modifiedCb = lambda content: self.host.bridge.call('setStatus', None, self.host.status_panel.presence, content['text']) or True
+        modifiedCb = lambda content: self.host.bridge.call('setStatus', None, self.host.presence_status_panel.presence, content['text']) or True
         editor_widget.HTMLTextEditor.__init__(self, {'text': status}, modifiedCb, options={'no_xhtml': True, 'listen_focus': True, 'listen_click': True})
         self.edit(False)
-        self.setStyleName('statusPanel')
+        self.setStyleName('marginAuto')
 
     @property
     def status(self):
@@ -153,7 +153,7 @@
     def setDisplayContent(self):
         status = self._original_content['text']
         try:
-            presence = self.host.status_panel.presence
+            presence = self.host.presence_status_panel.presence
         except AttributeError:  # during initialization
             presence = None
         if not status:
@@ -199,7 +199,7 @@
         panel.add(self.status_panel)
         panel.setCellVerticalAlignment(self.menu, 'baseline')
         panel.setCellVerticalAlignment(self.status_panel, 'baseline')
-        panel.setStyleName("marginAuto")
+        panel.setStyleName("presenceStatusPanel")
         self.add(panel)
 
         self.status_panel.edit(False)
@@ -231,48 +231,41 @@
 ### Panels managing the main area ###
 
 
-class MainPanel(AbsolutePanel):
+class MainPanel(DockPanel):
     """The panel which take the whole screen"""
 
     def __init__(self, host):
         self.host = host
-        AbsolutePanel.__init__(self)
-
-        # menu
-        self.menu = menu.MainMenuPanel(host)
+        DockPanel.__init__(self, StyleName="mainPanel liberviaTabPanel")
 
-        # # unibox
-        # self.unibox_panel = UniBoxPanel(host)
-        # self.unibox_panel.setVisible(False)
-
+        # menu and status panel
+        self.header = VerticalPanel(StyleName="header")
+        self.menu = menu.MainMenuBar(host)
+        self.header.add(self.menu)
+ 
         # contacts
-        self._contacts = HorizontalPanel()
-        self._contacts.addStyleName('globalLeftArea')
         self.contacts_switch = Button(u'«', self._contactsSwitch)
         self.contacts_switch.addStyleName('contactsSwitch')
-        self._contacts.add(self.contacts_switch)
 
-        # tabs
+        # tab panel
         self.tab_panel = libervia_widget.MainTabPanel(host)
         self.tab_panel.addWidgetsTab(_(u"Discussions"), select=True, locked=True)
-
-        self.header = AbsolutePanel()
-        self.header.add(self.menu)
-        # self.header.add(self.unibox_panel)
-        self.header.add(self.host.status_panel)
-        self.header.setStyleName('header')
-        self.add(self.header)
-
-        self._hpanel = HorizontalPanel()
-        self._hpanel.add(self._contacts)
-        self._hpanel.add(self.tab_panel)
-        self.add(self._hpanel)
-
-        self.setWidth("100%")
-        Window.addWindowResizeListener(self)
+ 
+        # XXX: widget's addition order is important!
+        self.add(self.header, DockPanel.NORTH)
+        self.add(self.tab_panel, DockPanel.CENTER)
+        self.setCellWidth(self.tab_panel, '100%')
+        self.setCellHeight(self.tab_panel, '100%')
+        self.add(self.tab_panel.getTabBar(), DockPanel.SOUTH)
+        self.add(self.contacts_switch, DockPanel.WEST)
 
     def addContactList(self, contact_list):
-        self._contacts.add(contact_list)
+        self.add(contact_list, DockPanel.WEST)
+
+    def addPresenceStatusPanel(self, panel):
+        self.header.add(panel)
+        self.header.setCellHeight(panel, '100%')
+        self.header.setCellVerticalAlignment(panel, HasVerticalAlignment.ALIGN_BOTTOM)
 
     def _contactsSwitch(self, btn=None):
         """ (Un)hide contacts panel """
@@ -294,15 +287,6 @@
             self._contacts.removeFromParent()
         parent.insert(self._contacts, 0)
 
-    def onWindowResized(self, width, height):
-        _elts = doc().getElementsByClassName('gwt-TabBar')
-        if not _elts.length:
-            tab_bar_h = 0
-        else:
-            tab_bar_h = _elts.item(0).offsetHeight
-        ideal_height = Window.getClientHeight() - tab_bar_h
-        self.setHeight("%s%s" % (ideal_height, "px"))
-
     def refresh(self):
         """Refresh the main panel"""
         self.unibox_panel.refresh()
--- a/src/browser/sat_browser/menu.py	Fri Feb 27 01:45:34 2015 +0100
+++ b/src/browser/sat_browser/menu.py	Fri Feb 27 02:39:43 2015 +0100
@@ -55,22 +55,6 @@
     def getCategoryHTML(cls, menu_name_i18n, type_):
         return cls.ITEM_TPL % (type_, menu_name_i18n)
 
-
-class MainMenuPanel(SimplePanel):
-    """Container for the main menu bar"""
-
-    def __init__(self, host):
-        self.host = host
-        SimplePanel.__init__(self)
-        self.setStyleName('menuContainer')
-        self.menu_bar = MainMenuBar(self.host)
-
-    def addMenuItem(self, *args):
-        self.menu_bar.addMenuItem(*args)
-
-    def addCategory(self, *args):
-        self.menu_bar.addCategory(*args)
-
     def createMenus(self):
         self.addMenuItem("General", [_("General"), _("Web widget")], 'home', MenuCmd(self, "onWebWidget"))
         self.addMenuItem("General", [_("General"), _("Disconnect")], 'home', MenuCmd(self, "onDisconnect"))
@@ -81,12 +65,12 @@
         self.addMenuItem("Games", [_("Games"), _("Xiangqi")], 'games', MenuCmd(self, "onXiangqiGame"))
 
         # additional menus
-        self.menu_bar.addCachedMenus(C.MENU_GLOBAL)
+        self.addCachedMenus(C.MENU_GLOBAL)
 
         # menu items that should be displayed after the automatically added ones
         self.addMenuItem("Contacts", [_("Contacts"), _("Manage groups")], 'social', MenuCmd(self, "onManageContactGroups"))
 
-        self.menu_bar.addSeparator()
+        self.addSeparator()
 
         self.addMenuItem("Help", [_("Help"), _("Social contract")], 'help', MenuCmd(self, "onSocialContract"))
         self.addMenuItem("Help", [_("Help"), _("About")], 'help', MenuCmd(self, "onAbout"))
@@ -96,8 +80,6 @@
         # XXX: temporary, will change when a full profile will be managed in SàT
         self.addMenuItem("Settings", [_("Settings"), _("Upload avatar")], 'settings', MenuCmd(self, "onAvatarUpload"))
 
-        self.add(self.menu_bar)
-
     # General menu
     def onWebWidget(self):
         web_widget = self.host.displayWidget(widget.WebWidget, C.WEB_PANEL_DEFAULT_URL)