Source Code for Module pyjamas.ui.decoratorpanel

  1  from pyjamas import DOM 
  2  from pyjamas.ui.SimplePanel import SimplePanel 
  3  from pyjamas.ui.TabPanel import TabPanel 
  4  from pyjamas.ui.TabBar import TabBar 
  5   
  6  """ 
  7     
  8    A {@link SimplePanel} that wraps its contents in stylized boxes, which can be 
  9    used to add rounded corners to a {@link Widget}. 
 10     
 11    Wrapping a {@link Widget} in a "9-box" allows users to specify images in each 
 12    of the corners and along the four borders. This method allows the content 
 13    within the {@link DecoratorPanel} to resize without disrupting the look of 
 14    the border. In addition, rounded corners can generally be combined into a 
 15    single image file, which reduces the number of downloaded files at startup. 
 16    This class also simplifies the process of using AlphaImageLoaders to support 
 17    8-bit transparencies (anti-aliasing and shadows) in ie6, which does not 
 18    support them normally. 
 19     
 20     
 21    CSS Style Rules 
 22   
 23    .gwt-DecoratorPanel { the panel } 
 24    .gwt-DecoratorPanel .top { the top row } 
 25    .gwt-DecoratorPanel .topLeft { the top left cell } 
 26    .gwt-DecoratorPanel .topLeftInner { the inner element of the cell } 
 27    .gwt-DecoratorPanel .topCenter { the top center cell } 
 28    .gwt-DecoratorPanel .topCenterInner { the inner element of the cell } 
 29    .gwt-DecoratorPanel .topRight { the top right cell } 
 30    .gwt-DecoratorPanel .topRightInner { the inner element of the cell } 
 31    .gwt-DecoratorPanel .middle { the middle row } 
 32    .gwt-DecoratorPanel .middleLeft { the middle left cell } 
 33    .gwt-DecoratorPanel .middleLeftInner { the inner element of the cell } 
 34    .gwt-DecoratorPanel .middleCenter { the middle center cell } 
 35    .gwt-DecoratorPanel .middleCenterInner { the inner element of the cell } 
 36    .gwt-DecoratorPanel .middleRight { the middle right cell } 
 37    .gwt-DecoratorPanel .middleRightInner { the inner element of the cell } 
 38    .gwt-DecoratorPanel .bottom { the bottom row } 
 39    .gwt-DecoratorPanel .bottomLeft { the bottom left cell } 
 40    .gwt-DecoratorPanel .bottomLeftInner { the inner element of the cell } 
 41    .gwt-DecoratorPanel .bottomCenter { the bottom center cell } 
 42    .gwt-DecoratorPanel .bottomCenterInner { the inner element of the cell } 
 43    .gwt-DecoratorPanel .bottomRight { the bottom right cell } 
 44    .gwt-DecoratorPanel .bottomRightInner { the inner element of the cell } 
 45   
 46  """ 
 47 -class DecoratorPanel(SimplePanel): 
 48      #The default style name. 
 49      DEFAULT_STYLENAME = "gwt-DecoratorPanel" 
 50   
 51      #The default styles applied to each row. 
 52      DEFAULT_ROW_STYLENAMES = [ "top", "middle", "bottom" ] 
 53   
 54 -    def __init__(self, rowStyles=None, containerIndex=1, **kwargs): 
 55          """ Creates a new panel using the specified style names to 
 56              apply to each row.  Each row will contain three cells 
 57              (Left, Center, and Right). The Center cell in the 
 58              containerIndex row will contain the {@link Widget}. 
 59               
 60              @param rowStyles an array of style names to apply to each row 
 61              @param containerIndex the index of the container row 
 62          """ 
 63         
 64          if rowStyles is None: 
 65              rowStyles = self.DEFAULT_ROW_STYLENAMES 
 66   
 67          # Add a tbody 
 68          self.table = DOM.createTable() 
 69          self.tbody = DOM.createTBody() 
 70          DOM.appendChild(self.table, self.tbody) 
 71          DOM.setAttribute(self.table, "cellSpacing", "0") 
 72          DOM.setAttribute(self.table, "cellPadding", "0") 
 73   
 74          # Add each row 
 75          for i in range(len(rowStyles)):  
 76              row = self.createTR(rowStyles[i]) 
 77              DOM.appendChild(self.tbody, row) 
 78              if i == containerIndex: 
 79                  self.containerElem = DOM.getFirstChild(DOM.getChild(row, 1)) 
 80   
 81          if not kwargs.has_key('StyleName'): kwargs['StyleName']=self.DEFAULT_STYLENAME 
 82          SimplePanel.__init__(self, self.table, **kwargs) 
 83   
 84 -    def createTR(self, styleName) : 
 85          """ Create a new row with a specific style name. The row 
 86              will contain three cells (Left, Center, and Right), each 
 87              prefixed with the specified style name. 
 88            
 89              This method allows Widgets to reuse the code on a DOM 
 90              level, without creating a DecoratorPanel Widget. 
 91            
 92              @param styleName the style name 
 93              @return the new row {@link Element} 
 94          """ 
 95          trElem = DOM.createTR() 
 96          self.setStyleName(trElem, styleName) 
 97          DOM.appendChild(trElem, self.createTD(styleName + "Left")) 
 98          DOM.appendChild(trElem, self.createTD(styleName + "Center")) 
 99          DOM.appendChild(trElem, self.createTD(styleName + "Right")) 
100          return trElem 
101   
102 -    def createTD(self, styleName) : 
103          """ Create a new table cell with a specific style name. 
104            
105              @param styleName the style name 
106              @return the new cell {@link Element} 
107          """ 
108          tdElem = DOM.createTD() 
109          inner = DOM.createDiv() 
110          DOM.appendChild(tdElem, inner) 
111          self.setStyleName(tdElem, styleName) 
112          self.setStyleName(inner, styleName + "Inner") 
113          return tdElem 
114   
115 -    def getCellElement(self, row, cell) : 
116        """   Get a specific Element from the panel. 
117          
118          @param row the row index 
119          @param cell the cell index 
120          @return the Element at the given row and cell 
121        """ 
122        tr = DOM.getChild(self.tbody, row) 
123        td = DOM.getChild(tr, cell) 
124        return DOM.getFirstChild(td) 
125   
126 -    def getContainerElement(self): 
127          return self.containerElem 
128   
129 -class DecoratedTabBar(TabBar): 
130   
131      TAB_ROW_STYLES = ["tabTop", "tabMiddle"] 
132   
133      STYLENAME_DEFAULT = "gwt-DecoratedTabBar" 
134   
135 -    def __init__(self, **kwargs): 
136          """ Creates an empty {@link DecoratedTabBar}. 
137          """ 
138          TabBar.__init__(self, **kwargs) 
139   
140 -    def createTabTextWrapper(self): 
141          return DecoratorPanel(self.TAB_ROW_STYLES, 1) 
142   
143 -class DecoratedTabPanel(TabPanel): 
144      DEFAULT_STYLENAME = "gwt-DecoratedTabPanel" 
145   
146 -    def __init__(self, **kwargs): 
147          if not kwargs.has_key('StyleName'): kwargs['StyleName']=self.DEFAULT_STYLENAME 
148          TabPanel.__init__(self, DecoratedTabBar(), **kwargs) 
149   
150          self.getTabBar().setStyleName(DecoratedTabBar.STYLENAME_DEFAULT) 
151   
152 -    def createTabTextWrapper(self): 
153          return DecoratorPanel(DecoratedTabBar.TAB_ROW_STYLES, 1) 
154   
155 -class DecoratorTitledPanel(DecoratorPanel): 
156   
157 -    def __init__(self, title, titleStyle=None, imgStyle=None, 
158                               rowStyles=None, 
159                               containerIndex=2, titleIndex=1) : 
160          if rowStyles is None: 
161              rowStyles = ["top", "top2", "middle", "bottom"] 
162   
163          if titleStyle is None: 
164              titleStyle = "title" 
165   
166          DecoratorPanel.__init__(self, rowStyles, containerIndex) 
167   
168          inner = self.getCellElement(titleIndex, 1) 
169          if imgStyle: 
170              img = DOM.createDiv() 
171              DOM.setAttribute(img, "className", imgStyle) 
172              DOM.appendChild(inner, img) 
173          tdiv = DOM.createDiv() 
174          DOM.setAttribute(tdiv, "className", titleStyle) 
175          DOM.setInnerText(tdiv, title) 
176          DOM.appendChild(inner, tdiv) 
177