changeset 184:97d5e9de1106

browser side: contacts panel switch: - contact panel is now on the left of main tab panel (instead of being part of the first tab) - there is a new button on the left of "Contacts" title to (un)hide the panel
author Goffi <goffi@goffi.org>
date Sun, 03 Mar 2013 03:04:04 +0100
parents a50ce9c06e0e
children 40adfd4ee4d7
files browser_side/panels.py public/libervia.css
diffstat 2 files changed, 58 insertions(+), 10 deletions(-) [+]
line wrap: on
line diff
--- a/browser_side/panels.py	Sun Mar 03 00:24:08 2013 +0100
+++ b/browser_side/panels.py	Sun Mar 03 03:04:04 2013 +0100
@@ -850,10 +850,11 @@
 
 class WidgetsPanel(ScrollPanelWrapper):
     
-    def __init__(self, host):
+    def __init__(self, host, locked = False):
         ScrollPanelWrapper.__init__(self)
         self.setSize('100%', '100%')
         self.host = host
+        self.locked = locked #if True: tab will not be removed when there are no more widgets inside
         self.flextable = FlexTable()
         self.flextable.setSize('100%','100%')
         self.setWidget(self.flextable)
@@ -865,6 +866,9 @@
         DOM.setStyleAttribute(td_elt, "height", "1px") #needed so the cell adapt to the size of the border (specially in webkit)
         self._max_cols = 1 #give the maximum number of columns i a raw
 
+    def isLocked(self):
+        return self.locked
+
     def changeWidget(self, row, col, wid):
         """Change the widget in the given location, add row or columns when necessary"""
         print "changing widget:", wid, row, col
@@ -952,7 +956,7 @@
 
         blank_page = not [wid for wid in self.flextable if isinstance(wid, LiberviaWidget)] # do we still have widgets on the page ?
 
-        if blank_page and not isinstance(self.getParent(), MainDiscussionPanel):
+        if blank_page and not self.isLocked():
             #we now notice the MainTabPanel that the WidgetsPanel is empty and need to be removed
             while current is not None:
                 if isinstance(current, MainTabPanel):
@@ -980,19 +984,24 @@
         cellFormatter = self.flextable.getFlexCellFormatter()
         return cellFormatter.setRowSpan(row, col, value)
 
-class MainDiscussionPanel(HorizontalPanel):
+class ContactTabPanel(HorizontalPanel):
+    """ TabPanel with a contacts list which can be hidden """
     
-    def __init__(self, host):
+    def __init__(self, host, locked = False):
         self.host=host
         HorizontalPanel.__init__(self)
-        self._left = self.host.contact_panel
+        self._left = VerticalPanel()
+        contacts_switch = Button('<<', self._contactsSwitch)
+        contacts_switch.addStyleName('contactsSwitch')
+        self._left.add(contacts_switch)
+        self._left.add(self.host.contact_panel)
         self._right = WidgetsPanel(host)
         self._right.setWidth('100%')
         self._right.setHeight('100%')
         self.add(self._left)
         self.add(self._right)
         self.setCellWidth(self._right, "100%")
-    
+
     def addWidget(self, wid):
         """Add a widget to the WidgetsPanel"""
         print "main addWidget", wid
@@ -1016,8 +1025,9 @@
             tab_bar_h = 0
         else:
             tab_bar_h = _elts.item(0).offsetHeight
-        ideal_height = Window.getClientHeight() - tab_panel_elt.offsetTop - tab_bar_h - 5
-        self.setWidth("%s%s" % (width-5, "px"));
+        ideal_height = Window.getClientHeight() - DOM.getAbsoluteTop(tab_panel_elt) - tab_bar_h - 5
+        ideal_width = width - self.host.contact_panel.getElement().offsetWidth - 5
+        self.setWidth("%s%s" % (ideal_width, "px"));
         self.setHeight("%s%s" % (ideal_height, "px"));
 
     def add(self, widget, tabText=None, asHTML=False):
@@ -1040,12 +1050,26 @@
         self.host=host
         AbsolutePanel.__init__(self)
 
+        #menu
         menu = Menu(host)
+
+        #unibox
         unibox_panel = UniBoxPanel(host)
         self.host.setUniBox(unibox_panel.unibox)
+        
+        #status bar
         status = host.status_panel
+        
+        #contacts
+        _contacts = VerticalPanel()
+        contacts_switch = Button('<<', self._contactsSwitch)
+        contacts_switch.addStyleName('contactsSwitch')
+        _contacts.add(contacts_switch)
+        _contacts.add(self.host.contact_panel)
+
+        #tabs
         self.tab_panel = MainTabPanel(host)
-        self.discuss_panel = MainDiscussionPanel(self.host)
+        self.discuss_panel = WidgetsPanel(self.host, locked=True)
         self.tab_panel.add(self.discuss_panel, "Discussions")
         self.tab_panel.selectTab(0)
 
@@ -1055,11 +1079,22 @@
         header.add(status)
         header.setStyleName('header')
         self.add(header)
-        self.add(self.tab_panel)
+
+        _hpanel = HorizontalPanel()
+        _hpanel.add(_contacts)
+        _hpanel.add(self.tab_panel)
+        self.add(_hpanel)
         
         self.setWidth("100%")
         Window.addWindowResizeListener(self)
 
+    def _contactsSwitch(self, btn):
+        """ (Un)hide contacts panel """
+        cpanel = self.host.contact_panel
+        cpanel.setVisible(not cpanel.getVisible())
+        btn.setText("<<" if cpanel.getVisible() else ">>")
+        self.host.resize()
+
     def onWindowResized(self, width, height):
         _elts = doc().getElementsByClassName('gwt-TabBar')
         if not _elts.length:
--- a/public/libervia.css	Sun Mar 03 00:24:08 2013 +0100
+++ b/public/libervia.css	Sun Mar 03 03:04:04 2013 +0100
@@ -388,6 +388,18 @@
     width: 200px;
     height: 30px; 
 }
+
+.contactsSwitch {
+    /* Button used to switch contacts panel */
+    background: none;
+    border: 0;
+    font-size: xx-small;
+    margin-left: -4px;
+    margin-top: 10px;
+    position: absolute;
+    z-index: 50;
+}
+
 .groupList {
     width: 100%;    
 }
@@ -985,6 +997,7 @@
   z-index: 10;
   position: fixed;
   bottom: 0;
+  left: 0;
 }
 
 .gwt-TabBar .gwt-TabBarFirst {