libervia-web: browser_side/panels.py comparison

comparison browser_side/panels.py @ 34:ed935f763cc8

browser side: misc css/layout fixes - new ScrollPanelWrapper class, to try to handle correctly ScrollPanels in tables - removed   from EmptyPanel, because all td must appear empty, to use the absolute trick in ScrollPanelWrapper - when an empty panel is changed to a normal panel, cells widths are recalculated

author	Goffi <goffi@goffi.org>
date	Mon, 16 May 2011 03:10:11 +0200
parents	e70521e6d803
children	d43d6e4b9dc8

comparison

equal deleted inserted replaced

-:e70521e6d803
+:ed935f763cc8
 import pyjd # this is dummy in pyjs
 from pyjamas.ui.SimplePanel import SimplePanel
 from pyjamas.ui.FlowPanel import FlowPanel
 from pyjamas.ui.AbsolutePanel import AbsolutePanel
 from pyjamas.ui.VerticalPanel import VerticalPanel
+from pyjamas.ui.DockPanel import DockPanel
 from pyjamas.ui.HorizontalPanel import HorizontalPanel
 from pyjamas.ui.ScrollPanel import ScrollPanel
 from pyjamas.ui.TabPanel import TabPanel
 from pyjamas.ui.HTMLPanel import HTMLPanel
 from pyjamas.ui.PopupPanel import PopupPanel
 _new_panel = MicroblogPanel(self.host, accept_all=True)
 self.host.mpanels.remove(self)
 self.host.mpanels.append(_new_panel)
 grid = self.getParent()
 row_idx, cell_idx = self._getCellAndRow(grid, event)
-self.removeFromParent()
 if self.host.selected == self:
 self.host.select(None)
+self.removeFromParent()
 grid.setWidget(row_idx, cell_idx, _new_panel)
+_panels = list(grid) #this suppose that we only use 1 row, need to be changed in the futur
+_unempty_panels = filter(lambda wid:not isinstance(wid,EmptyPanel),list(grid))
+_width = 90/float(len(_unempty_panels) or 1)
+#now we resize all the cell of the column
+for panel in _unempty_panels:
+td_elt = panel.getElement().parentNode
+DOM.setStyleAttribute(td_elt, "width", "%s%%" % _width)
 #FIXME: delete object ? Check the right way with pyjamas
+class ScrollPanelWrapper(SimplePanel):
+"""Scroll Panel like component, wich use the full available space
+to work around percent size issue, it use some of the ideas found
+here: http://code.google.com/p/google-web-toolkit/issues/detail?id=316
+specially in code given at comment #46, thanks to Stefan Bachert"""
+def __init__(self, *args, **kwargs):
+SimplePanel.__init__(self)
+self.spanel = ScrollPanel(*args, **kwargs)
+SimplePanel.setWidget(self, self.spanel)
+DOM.setStyleAttribute(self.getElement(), "position", "relative")
+DOM.setStyleAttribute(self.getElement(), "top", "0px")
+DOM.setStyleAttribute(self.getElement(), "left", "0px")
+DOM.setStyleAttribute(self.getElement(), "width", "100%")
+DOM.setStyleAttribute(self.getElement(), "height", "100%")
+DOM.setStyleAttribute(self.spanel.getElement(), "position", "absolute")
+DOM.setStyleAttribute(self.spanel.getElement(), "width", "100%")
+DOM.setStyleAttribute(self.spanel.getElement(), "height", "100%")
+def setWidget(self, widget):
+self.spanel.setWidget(widget)
+def setScrollPosition(self, position):
+self.spanel.setScrollPosition(position)
+def scrollToBottom(self):
+self.setScrollPosition(self.spanel.getElement().scrollHeight)
 class EmptyPanel(DropCell, SimplePanel):
 """Empty dropable panel"""
 def __init__(self, host):
 SimplePanel.__init__(self)
 self.host = host
-_panel = HTMLPanel("&nbsp;")
+_panel = HTMLPanel("")
 self.add(_panel)
-self.setHeight('50%')
+self.setHeight('100%')
 DropCell.__init__(self)
 class UniBoxPanel(SimplePanel):
 """Panel containing the UniBox"""
 "body": body}
 )
 panel.setStyleName('microblogEntry')
 self.add(panel)
-class MicroblogPanel(DropCell, ScrollPanel):
+class MicroblogPanel(DropCell, ScrollPanelWrapper):
 def __init__(self,host, title='&nbsp;', accept_all=False):
 """Panel used to show microblog
 @param title: title of the panel
 @param accept_all: if true, show every message, without filtering jids"""
+ScrollPanelWrapper.__init__(self)
+DropCell.__init__(self)
 self.host = host
 self.accept_all = accept_all
 title=title.replace('<','&lt;').replace('>','&gt;')
 self.accepted_groups = []
 _class = ['mb_panel_header']
 if title == '&nbsp;':
 _class.append('empty_header')
-ScrollPanel.__init__(self)
 self.vpanel = VerticalPanel()
 self.vpanel.add(HTMLPanel("<div class='%s'>%s</div>" % (','.join(_class),title)))
 self.vpanel.setWidth('100%')
-self.setHeight('50%')
 self.setStyleName('microblogPanel')
-self.add(self.vpanel)
+self.setWidget(self.vpanel)
-DropCell.__init__(self)
 def addEntry(self, text, author=None, timestamp=None):
 """Add an entry to the panel
 @param text: main text of the entry
 @param author: who wrote the entry
 print "addOccupant: nick", nick
 print _occupant
 self.occupants.add(_occupant)
 self.add(_occupant)
+class ChatPanel(DropCell, ClickHandler, SimplePanel):
-class ChatPanel(DropCell, ClickHandler, AbsolutePanel):
 def __init__(self, host, target, type='one2one'):
 """Panel used for conversation (one 2 one or group chat)
 @param host: SatWebFrontend instance
 @param target: entity (JID) with who we have a conversation (contact's jid for one 2 one chat, or MUC room)
 @param type: one2one for simple conversation, group for MUC"""
+SimplePanel.__init__(self)
+DropCell.__init__(self)
+ClickHandler.__init__(self)
+self.vpanel = VerticalPanel()
+self.vpanel.setSize('100%','100%')
 self.host = host
 self.type = type
 self.nick = None
 if not target:
 print "ERROR: Empty target !"
 return
 self.target = target
 title="%s" % target.bare
 title.replace('<','&lt;').replace('>','&gt;')
 _class = ['mb_panel_header']
-AbsolutePanel.__init__(self)
 self.header = HTMLPanel("<div class='%s'>%s</div>" % (','.join(_class),title))
+self.header.setStyleName('chatHeader')
 self.body = AbsolutePanel()
 self.body.setStyleName('chatPanel_body')
-#self.body.setWidth('100%')
-#self.body.setHeight('50%')
 chat_area = HorizontalPanel()
 chat_area.setStyleName('chatArea')
-#chat_area.setHeight('50%')
 if type == 'group':
 self.occupants_list = OccupantsList()
 chat_area.add(self.occupants_list)
 self.body.add(chat_area)
 self.content = AbsolutePanel()
 self.content.setStyleName('chatContent')
-#_scrollp.setHeight('50%')
+self.content_scroll = ScrollPanelWrapper(self.content)
-#_scrollp.setWidth('100%')
+chat_area.add(self.content_scroll)
-chat_area.add(ScrollPanel(self.content, Size=("100%", "100%")))
+chat_area.setCellWidth(self.content_scroll, '100%')
-self.add(self.header)
+self.vpanel.add(self.header)
-self.add(self.body)
+self.vpanel.setCellHeight(self.header, '1%')
-#self.content.setWidth('100%')
+self.vpanel.add(self.body)
-#self.main_panel.setVerticalAlignment(HasAlignment.ALIGN_TOP)
+self.setWidget(self.vpanel)
-#self.body.setVerticalAlignment(HasAlignment.ALIGN_TOP)
-#chat_area.setVerticalAlignment(HasAlignment.ALIGN_TOP)
-#self.setWidth('100%')
-#self.setHeight('50%')
 self.setStyleName('chatPanel')
-DropCell.__init__(self)
-ClickHandler.__init__(self)
 self.addClickListener(self)
 def onClick(self, sender, event):
 self.host.select(self)
 mymess = _jid.resource == self.nick if self.type == "group" else  _jid.bare == self.host.whoami.bare #mymess = True if message comes from local user
 """if msg.startswith('/me '):
 self.printInfo('* %s %s' % (nick, msg[4:]),type='me')
 return"""
 self.content.add(ChatText(timestamp, nick, mymess, msg))
+self.content_scroll.scrollToBottom()
-class MainDiscussionPannel(HorizontalPanel):
+class MainDiscussionPanel(HorizontalPanel):
 def __init__(self, host):
 self.host=host
 HorizontalPanel.__init__(self)
 self._left = self.host.contact_panel
 self._right = Grid(1,3)
 self._right.setWidth('100%')
-self._right.setHeight('50%')
+self._right.setHeight('100%')
 self.add(self._left)
 self.setCellWidth(self._left, "15%")
 self.add(self._right)
 self.setCellWidth(self._right, "85%")
-self.setHeight('50%')
 def changePanel(self, idx, panel):
 self._right.setWidget(0,idx,panel)
+self._right.getCellFormatter().setWidth(0, idx, '5%' if isinstance(panel, EmptyPanel) else '90%')
-class MainTabPannel(TabPanel):
+class MainTabPanel(TabPanel):
 def __init__(self, host):
 TabPanel.__init__(self)
 self.host=host
 TabPanel()
 print ("ERROR: not TabBar found, it should exist !")
 tab_bar_h = 0
 else:
 tab_bar_h = _elts.item(0).offsetHeight
 ideal_height = Window.getClientHeight() - tab_panel_elt.offsetTop - tab_bar_h - 5
-print "ideal_height =",ideal_height
 self.setWidth("%s%s" % (width-5, "px"));
 self.setHeight("%s%s" % (ideal_height, "px"));
 def add(self, widget, tabText=None, asHTML=False):
 TabPanel.add(self, widget, tabText, asHTML)
 if self.getWidgetCount()>1:
 self.tabBar.setVisible(True)
 self.host.resize()
-"""class MainTabPannel(FlowPanel):
-def __init__(self, host):
-FlowPanel.__init__(self)
-self.host=host
-self.tab_panel = TabPanel()
-self.tab_panel.tabBar.setVisible(False)
-self.addStyleName('mainTabPanel')
-FlowPanel.add(self, self.tab_panel)
-self.tab_panel.setWidth('100%')
-self.tab_panel.setHeight('100%')
-Window.addWindowResizeListener(self)
-def onWindowResized(self, width, height):
-print "onWindowResized"
-tab_panel_elt = self.getElement()
-_elts = doc().getElementsByClassName('gwt-TabBar')
-if not _elts.length:
-print ("ERROR: not TabBar found, it should exist !")
-tab_bar_h = 0
-else:
-tab_bar_h = _elts.item(0).offsetHeight
-ideal_height = Window.getClientHeight() - tab_panel_elt.offsetTop - tab_bar_h - 5
-print "ideal_height =",ideal_height
-self.setWidth("%s%s" % (width-5, "px"));
-self.setHeight("%s%s" % (ideal_height, "px"));
-def selectTab(self, idx):
-self.tab_panel.selectTab(idx)
-def add(self, widget, tabText=None, asHTML=False):
-self.tab_panel.add(widget, tabText, asHTML)
-if self.tab_panel.getWidgetCount()>1:
-self.tab_panel.tabBar.setVisible(True)
-self.host.resize()"""
 class MainPanel(AbsolutePanel):
 def __init__(self, host):
 self.host=host
 AbsolutePanel.__init__(self)
 menu = Menu(host)
 unibox_panel = UniBoxPanel(host)
 self.host.setUniBox(unibox_panel.unibox)
 status = host.status_panel
-self.tab_panel = MainTabPannel(host)
+self.tab_panel = MainTabPanel(host)
-#self.tab_panel.setWidth('100%')
+self.discuss_panel = MainDiscussionPanel(self.host)
-#self.tab_panel.setHeight('50%')
-self.discuss_panel = MainDiscussionPannel(self.host)
-self.discuss_panel.setWidth('100%')
-self.discuss_panel.setHeight('50%')
 self.tab_panel.add(self.discuss_panel, "Discussions")
 self.tab_panel.selectTab(0)
 self.add(menu)
 self.add(unibox_panel)
 self.add(status)
 self.add(self.tab_panel)
-#self.tab_panel.onWindowResized(Window.getClientWidth(), Window.getClientHeight())
-"""self.setCellHeight(menu, "5%")
-self.setCellHeight(uni_box, "5%")
-self.setCellVerticalAlignment(uni_box, HasAlignment.ALIGN_CENTER)
-self.setCellHorizontalAlignment(uni_box, HasAlignment.ALIGN_CENTER)
-self.setCellHeight(self.tab_panel, "90%")
-self.setCellWidth(self.tab_panel, "100%")"""
 self.setWidth("100%")
 #self.setHeight("99%")
 Window.addWindowResizeListener(self)
 def onWindowResized(self, width, height):

Mercurial > libervia-web

comparison browser_side/panels.py @ 34:ed935f763cc8