Author: vmolotkov Date: 2007-11-27 08:17:54 -0500 (Tue, 27 Nov 2007) New Revision: 4284 Modified: branches/3.1.x/ui/orderingList/src/main/config/component/orderinglist.xml branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx Log: bug: RF-1379 Modified: branches/3.1.x/ui/orderingList/src/main/config/component/orderinglist.xml =================================================================== --- branches/3.1.x/ui/orderingList/src/main/config/component/orderinglist.xml 2007-11-27 13:12:27 UTC (rev 4283) +++ branches/3.1.x/ui/orderingList/src/main/config/component/orderinglist.xml 2007-11-27 13:17:54 UTC (rev 4284) @@ -68,7 +68,6 @@ <description> listWidth </description> - <defaultvalue><![CDATA[200]]></defaultvalue> </property> <property> <name>listHeight</name> @@ -76,7 +75,6 @@ <description> listHeight </description> - <defaultvalue><![CDATA[150]]></defaultvalue> </property> <property> <name>rowClasses</name> Modified: branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java =================================================================== --- branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java 2007-11-27 13:12:27 UTC (rev 4283) +++ branches/3.1.x/ui/orderingList/src/main/java/org/richfaces/renderkit/OrderingListRendererBase.java 2007-11-27 13:17:54 UTC (rev 4284) @@ -162,9 +162,11 @@ UIColumn column = (UIColumn) component; writer.startElement(HTML.td_ELEM, table); - + + if (!iterator.hasNext()) { + cellClassName.insert(7, " ol_endcol "); + } writer.writeAttribute("class", cellClassName.toString(), null); - renderChildren(context, column); writer.endElement(HTML.td_ELEM); Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss 2007-11-27 13:12:27 UTC (rev 4283) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/css/orderingList.xcss 2007-11-27 13:17:54 UTC (rev 4284) @@ -81,12 +81,11 @@ .ol_outputlist{ margin : 0px 8px 8px 8px;} .ol_list_content { - overflow-y : scroll; - overflow-x: auto; - /*width: 300px; - height: 232px;*/ - width: 200px; - height: 150px; + /*overflow-y : scroll; + overflow-x: auto;*/ + overflow: auto; + /*width: 200px; + height: 150px;*/ } .ol_list_header { @@ -113,8 +112,10 @@ .ol_internal_tab .ol_endcol{border-right : 0px;} -.ol_internal_tab td{font-family : Arial; font-size :11px; padding : 2px;} +.ol_internal_tab td{font-family : Arial; font-size :11px; padding : 2px;border-right : 1px solid #FFFFFF; border-left : 1px solid #FFFFFF;} +.ol_internal_tab .ol_endcol{border-right : 0px;} + .ol_internal_tab tr.ol_select{background : #EAF0F8} .ol_internal_tab tr.ol_active { Modified: branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js =================================================================== --- branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js 2007-11-27 13:12:27 UTC (rev 4283) +++ branches/3.1.x/ui/orderingList/src/main/resources/org/richfaces/renderkit/html/scripts/LayoutManager.js 2007-11-27 13:17:54 UTC (rev 4284) @@ -27,19 +27,21 @@ return ; var headerCells = this.headerTable.tHead.rows[0].cells; var width; + var totalWidth = 0; for (var i = 0; i < contentCells.length; i++) { - width = contentCells[i].offsetWidth - LayoutManager.STYLE_CONTENTTD_BORDER - LayoutManager.STYLE_CONTENTTD_PADDING; + var curCell = contentCells[i]; + var headCell = headerCells[i]; + + width = LayoutManager.calculateWidth(curCell, headCell).colWidth; + if (i == contentCells.length - 1) { - width = width + LayoutManager.SCROLL_WIDTH + "px"; - headerCells[i].firstChild.style.width = width; - headerCells[i].style.width = width; - } else { - width = width + "px"; - headerCells[i].firstChild.style.width = width; - headerCells[i].style.width = width; + width = width + (this.contentDiv.offsetWidth - this.contentDiv.clientWidth); } + headCell.firstChild.style.width = width + "px"; + headCell.style.width = width + "px"; + //totalWidth += width; } - this.headerTable.style.width = this.contentTable.offsetWidth + LayoutManager.SCROLL_WIDTH; + //this.headerTable.style.width = this.contentTable.offsetWidth + (this.contentDiv.offsetWidth - this.contentDiv.clientWidth); } } @@ -60,4 +62,44 @@ y += parent.offsetTop; } return {left: x, top: y}; -} \ No newline at end of file +} + +LayoutManager.calculateWidth = function(srcElem, tgtElem) { + var srcElemBorderWidth = LayoutManager.getBorderWidth(srcElem, "lr"); + var srcElemPaddingWidth = LayoutManager.getPaddingWidth(srcElem, "lr"); + var srcElemMarginWidth = LayoutManager.getMarginWidth(srcElem, "lr"); + + var tgtElemBorderWidth = LayoutManager.getBorderWidth(srcElem, "lr"); + var tgtElemPaddingWidth = LayoutManager.getPaddingWidth(srcElem, "lr"); + var tgtElemMarginWidth = LayoutManager.getMarginWidth(srcElem, "lr"); + + var srcWidth = srcElem.offsetWidth - srcElemBorderWidth - srcElemPaddingWidth - srcElemMarginWidth; + return {srcWidth : srcWidth, colWidth : (srcWidth + (srcElemBorderWidth - tgtElemBorderWidth) + + (srcElemPaddingWidth - tgtElemPaddingWidth) + + (srcElemMarginWidth - tgtElemMarginWidth))}; +} + +LayoutManager.getBorderWidth = function(el, side) { + return this.getStyles(el, side, LayoutManager.borders); +} + +LayoutManager.getPaddingWidth = function(el, side) { + return this.getStyles(el, side, LayoutManager.paddings); +} + +LayoutManager.getMarginWidth = function(el, side) { + return this.getStyles(el, side, LayoutManager.margins); +} + +LayoutManager.getStyles = function(el, sides, styles) { + var val = 0; + for(var i = 0, len = sides.length; i < len; i++){ + var w = parseInt(el.getStyle(styles[sides.charAt(i)]), 10); + if(!isNaN(w)) val += w; + } + return val; +} + +LayoutManager.borders = {l: 'border-left-width', r: 'border-right-width', t: 'border-top-width', b: 'border-bottom-width'}, +LayoutManager.paddings = {l: 'padding-left', r: 'padding-right', t: 'padding-top', b: 'padding-bottom'}, +LayoutManager.margins = {l: 'margin-left', r: 'margin-right', t: 'margin-top', b: 'margin-bottom'} Modified: branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx =================================================================== --- branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-11-27 13:12:27 UTC (rev 4283) +++ branches/3.1.x/ui/orderingList/src/main/templates/org/richfaces/htmlOrderingList.jspx 2007-11-27 13:17:54 UTC (rev 4284) @@ -38,12 +38,25 @@ <tr> <td> <div id="#{clientId}headerBox" class="ol_list ol_outputlist"> - <div class="ol_list_header" style="width: #{component.attributes['listWidth']}px;"> + <jsp:scriptlet><![CDATA[ + String contentContainerStyle = ""; + if (component.getAttributes().get("listWidth") != null) { + contentContainerStyle = contentContainerStyle.concat("width:").concat(component.getAttributes().get("listWidth").toString()).concat("px;"); + variables.setVariable("contentContainerStyle", contentContainerStyle); + } + ]]></jsp:scriptlet> + <div class="ol_list_header" style="#{contentContainerStyle}"> <table id="#{clientId}internal_header_tab" class="ol_internal_header_tab rich-ordering-list-items" cellpadding="0" cellspacing="0"> <f:call name="encodeHeader"/> </table> </div> - <div id="#{clientId}contentBox" class="ol_list_content" style="width: #{component.attributes['listWidth']}px; height:#{component.attributes['listHeight']}px;"> + <jsp:scriptlet><![CDATA[ + if (component.getAttributes().get("listHeight") != null) { + contentContainerStyle = contentContainerStyle.concat("height:").concat(component.getAttributes().get("listHeight").toString()).concat("px;"); + variables.setVariable("contentContainerStyle", contentContainerStyle); + } + ]]></jsp:scriptlet> + <div id="#{clientId}contentBox" class="ol_list_content" style="#{contentContainerStyle}"> <table id="#{clientId}internal_tab" class="ol_internal_tab" cellpadding="0" cellspacing="0"> <tbody id="#{clientId}tbody"> <vcp:body>