You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by lo...@apache.org on 2011/07/06 09:27:40 UTC
svn commit: r1143275 - in /myfaces/tobago/trunk/tobago-theme:
tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/
tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html...
Author: lofwyr
Date: Wed Jul 6 07:27:39 2011
New Revision: 1143275
URL: http://svn.apache.org/viewvc?rev=1143275&view=rev
Log:
TOBAGO-1012: Optimizing date picker popup
Modified:
myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/CalendarRenderer.java
myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/DatePickerRenderer.java
myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties
myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css
myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties
myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css
myfaces/tobago/trunk/tobago-theme/tobago-theme-standard/src/main/resources/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/calendar.js
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/CalendarRenderer.java
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/CalendarRenderer.java?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/CalendarRenderer.java (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/CalendarRenderer.java Wed Jul 6 07:27:39 2011
@@ -77,28 +77,16 @@ public class CalendarRenderer extends La
// rendering
TobagoResponseWriter writer = HtmlRendererUtils.getTobagoResponseWriter(facesContext);
- writer.startElement(HtmlElements.TABLE, component);
+ writer.startElement(HtmlElements.DIV, component);
writer.writeIdAttribute(id);
- HtmlRendererUtils.renderDojoDndItem(component, writer, true);
writer.writeClassAttribute(Classes.create(output));
Style style = new Style(facesContext, output);
writer.writeStyleAttribute(style);
- writer.writeAttribute(HtmlAttributes.CELLSPACING, 0);
- writer.writeAttribute(HtmlAttributes.CELLPADDING, 3);
- writer.writeAttribute(HtmlAttributes.SUMMARY, "", false);
-
- writer.startElement(HtmlElements.TR, null);
- writer.writeClassAttribute(Classes.create(output, "headerRow"));
- writer.startElement(HtmlElements.TH, null);
- writer.writeAttribute(HtmlAttributes.COLSPAN, 7);
- writer.startElement(HtmlElements.TABLE, null);
- writer.writeAttribute(HtmlAttributes.SUMMARY, "", false);
- writer.writeClassAttribute(Classes.create(output, "header"));
- writer.startElement(HtmlElements.TR, null);
+ // begin header
+ writer.startElement(HtmlElements.DIV, null);
+ writer.writeClassAttribute(Classes.create(output, "row"));
- writer.startElement(HtmlElements.TD, null);
- writer.writeAttribute(HtmlAttributes.ALIGN, "left", false);
writer.startElement(HtmlElements.IMG, null);
writer.writeClassAttribute(Classes.create(output, "header"));
writer.writeAttribute(HtmlAttributes.ALT, "", false);
@@ -106,10 +94,7 @@ public class CalendarRenderer extends La
ResourceManagerUtils.getImageWithPath(facesContext, "image/calendarFastPrev.gif"), false);
writer.writeAttribute(HtmlAttributes.ONCLICK, "addMonth('" + id + "', -12)", false);
writer.endElement(HtmlElements.IMG);
- writer.endElement(HtmlElements.TD);
- writer.startElement(HtmlElements.TD, null);
- writer.writeAttribute(HtmlAttributes.ALIGN, "left", false);
writer.startElement(HtmlElements.IMG, null);
writer.writeClassAttribute(Classes.create(output, "header"));
writer.writeAttribute(HtmlAttributes.ALT, "", false);
@@ -117,17 +102,13 @@ public class CalendarRenderer extends La
ResourceManagerUtils.getImageWithPath(facesContext, "image/calendarPrev.gif"), false);
writer.writeAttribute(HtmlAttributes.ONCLICK, "addMonth('" + id + "', -1)", false);
writer.endElement(HtmlElements.IMG);
- writer.endElement(HtmlElements.TD);
- writer.startElement(HtmlElements.TH, null);
- writer.writeClassAttribute(Classes.create(output, "headerCenter"));
- writer.writeAttribute(HtmlAttributes.ALIGN, "center", false);
- writer.writeIdAttribute(id + ":title");
+ writer.startElement(HtmlElements.SPAN, null);
+ writer.writeClassAttribute(Classes.create(output, "header"));
+ writer.writeIdAttribute(id + ":title"); // todo: ComponentUtils.SUB_SEPARATOR
writer.writeText(dateFormat.format(calendar.getTime()));
- writer.endElement(HtmlElements.TH);
+ writer.endElement(HtmlElements.SPAN);
- writer.startElement(HtmlElements.TD, null);
- writer.writeAttribute(HtmlAttributes.ALIGN, "right", false);
writer.startElement(HtmlElements.IMG, null);
writer.writeClassAttribute(Classes.create(output, "header"));
writer.writeAttribute(HtmlAttributes.ALT, "", false);
@@ -135,10 +116,7 @@ public class CalendarRenderer extends La
ResourceManagerUtils.getImageWithPath(facesContext, "image/calendarNext.gif"), false);
writer.writeAttribute(HtmlAttributes.ONCLICK, "addMonth('" + id + "', 1)", false);
writer.endElement(HtmlElements.IMG);
- writer.endElement(HtmlElements.TD);
- writer.startElement(HtmlElements.TD, null);
- writer.writeAttribute(HtmlAttributes.ALIGN, "right", false);
writer.startElement(HtmlElements.IMG, null);
writer.writeClassAttribute(Classes.create(output, "header"));
writer.writeAttribute(HtmlAttributes.ALT, "", false);
@@ -146,15 +124,13 @@ public class CalendarRenderer extends La
ResourceManagerUtils.getImageWithPath(facesContext, "image/calendarFastNext.gif"), false);
writer.writeAttribute(HtmlAttributes.ONCLICK, "addMonth('" + id + "', 12)", false);
writer.endElement(HtmlElements.IMG);
- writer.endElement(HtmlElements.TD);
-
- writer.endElement(HtmlElements.TR);
- writer.endElement(HtmlElements.TABLE);
- writer.endElement(HtmlElements.TH);
- writer.endElement(HtmlElements.TR);
+ writer.endElement(HtmlElements.DIV);
+ // end header
- writer.startElement(HtmlElements.TR, null);
+ // begin weeks
+ writer.startElement(HtmlElements.DIV, null);
+ writer.writeClassAttribute(Classes.create(output, "row"));
dateFormat = new SimpleDateFormat("E", locale);
for (int dayIt = 0; dayIt < 7; ++dayIt) {
@@ -162,19 +138,21 @@ public class CalendarRenderer extends La
String dayName = dateFormat.format(date.getCalendar().getTime());
dayName = StringUtils.substring(dayName, 0, 2);
- writer.startElement(HtmlElements.TH, null);
- writer.writeClassAttribute(Classes.create(output, "headerInner"));
+ writer.startElement(HtmlElements.SPAN, null);
+ writer.writeClassAttribute(Classes.create(output, "dayOfWeek"));
writer.writeText(dayName);
- writer.endElement(HtmlElements.TH);
+ writer.endElement(HtmlElements.SPAN);
}
- writer.endElement(HtmlElements.TR);
+ writer.endElement(HtmlElements.DIV);
+ // end weeks
// int weekCount = model.getWeekCount();
for (int week = 0; week < 6; ++week) {
// String style = (week < weekCount) ? "" : "style=\"display: none\"";
- writer.startElement(HtmlElements.TR, null);
+ writer.startElement(HtmlElements.DIV, null);
writer.writeIdAttribute(id + ":" + week);
+ writer.writeClassAttribute(Classes.create(output, "row"));
// writer.writeAttribute(HtmlAttributes.STYLE, style, null);
for (int dayIt = 0; dayIt < 7; ++dayIt) {
@@ -183,7 +161,7 @@ public class CalendarRenderer extends La
String dayDescription = String.valueOf(date.getDay());
String onclick = "selectDay('" + id + "', " + week + " , " + dayIt + ");";
- writer.startElement(HtmlElements.TD, null);
+ writer.startElement(HtmlElements.SPAN, null);
writer.writeAttribute(HtmlAttributes.ONCLICK, onclick, true);
writer.writeIdAttribute(id + ":" + week + ":" + dayIt);
writer.writeClassAttribute(
@@ -191,15 +169,15 @@ public class CalendarRenderer extends La
writer.writeText(dayDescription);
- writer.endElement(HtmlElements.TD);
+ writer.endElement(HtmlElements.SPAN);
// } else {
// % ><td id="< %= id + ":" + week + ":" + day % >">x</td>< %
// }
}
- writer.endElement(HtmlElements.TR);
+ writer.endElement(HtmlElements.DIV);
}
- writer.endElement(HtmlElements.TABLE);
+ writer.endElement(HtmlElements.DIV);
writeInputHidden(writer, "/" + id + "/year", id + ":year", Integer.toString(calendar.get(Calendar.YEAR)));
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/DatePickerRenderer.java
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/DatePickerRenderer.java?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/DatePickerRenderer.java (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/java/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/tag/DatePickerRenderer.java Wed Jul 6 07:27:39 2011
@@ -19,7 +19,6 @@ package org.apache.myfaces.tobago.render
import org.apache.myfaces.tobago.compat.FacesUtils;
import org.apache.myfaces.tobago.component.Attributes;
-import org.apache.myfaces.tobago.util.CreateComponentUtils;
import org.apache.myfaces.tobago.component.Facets;
import org.apache.myfaces.tobago.component.RendererTypes;
import org.apache.myfaces.tobago.component.UIBox;
@@ -39,6 +38,7 @@ import org.apache.myfaces.tobago.interna
import org.apache.myfaces.tobago.layout.Measure;
import org.apache.myfaces.tobago.renderkit.html.StyleClasses;
import org.apache.myfaces.tobago.util.ComponentUtils;
+import org.apache.myfaces.tobago.util.CreateComponentUtils;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
@@ -80,7 +80,7 @@ public class DatePickerRenderer extends
final UIGridLayout layoutOfBox = (UIGridLayout) CreateComponentUtils.createComponent(
facesContext, UIGridLayout.COMPONENT_TYPE, RendererTypes.GRID_LAYOUT, "layout");
box.getFacets().put(Facets.LAYOUT, layoutOfBox);
- layoutOfBox.setRows("*;fixed;fixed");
+ layoutOfBox.setRows("*;auto;auto");
final UICalendar calendar = (UICalendar) CreateComponentUtils.createComponent(
facesContext, UICalendar.COMPONENT_TYPE, RendererTypes.CALENDAR, "calendar");
@@ -93,7 +93,7 @@ public class DatePickerRenderer extends
final UIGridLayout layoutOfTime = (UIGridLayout) CreateComponentUtils.createComponent(
facesContext, UIGridLayout.COMPONENT_TYPE, RendererTypes.GRID_LAYOUT, "timePanelLayout");
timePanel.getFacets().put(Facets.LAYOUT, layoutOfTime);
- layoutOfTime.setColumns("1*;fixed;1*");
+ layoutOfTime.setColumns("1*;auto;1*");
final UIPanel cell1 = (UIPanel) CreateComponentUtils.createComponent(
facesContext, UIPanel.COMPONENT_TYPE, RendererTypes.PANEL, "cell1");
cell1.onComponentPopulated(facesContext, parent);
@@ -117,7 +117,7 @@ public class DatePickerRenderer extends
facesContext, UIGridLayout.COMPONENT_TYPE, RendererTypes.GRID_LAYOUT, "buttonPanelLayout");
buttonPanel.setLayoutManager(layoutOfButtons);
layoutOfButtons.setColumns("*;*");
- layoutOfButtons.setRows("fixed");
+ layoutOfButtons.setRows("auto");
box.getChildren().add(buttonPanel);
box.onComponentPopulated(facesContext, parent);
@@ -150,7 +150,6 @@ public class DatePickerRenderer extends
picker.getChildren().add(image);
}
-
@Override
public void prepareRender(FacesContext facesContext, UIComponent component) throws IOException {
UIDatePicker picker = (UIDatePicker) component;
@@ -159,14 +158,9 @@ public class DatePickerRenderer extends
picker.getAttributes().put(
Attributes.LAYOUT_WIDTH,
getResourceManager().getThemeMeasure(facesContext, picker, "pickerWidth").getPixel());
- if (facesContext instanceof TobagoFacesContext) {
- UIPopup popup = (UIPopup) picker.getFacets().get(Facets.PICKER_POPUP);
- if (popup != null) {
- popup.setWidth(getResourceManager().getThemeMeasure(facesContext, picker, "calendarPopupWidth"));
- popup.setHeight(getResourceManager().getThemeMeasure(facesContext, picker, "calendarPopupHeight"));
- ((TobagoFacesContext) facesContext).getPopups().add(popup);
- }
- }
+
+ ((TobagoFacesContext) facesContext).getPopups().add((UIPopup) picker.getFacets().get(Facets.PICKER_POPUP));
+
super.prepareRender(facesContext, picker);
}
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties Wed Jul 6 07:27:39 2011
@@ -58,13 +58,10 @@ Cell.headerHeight=0
Cell.minimumWidth=0
Cell.minimumHeight=0
-// todo: fixed make min+max obsolete
-Calendar.fixedWidth=208
-Calendar.fixedHeight=210
-Calendar.minimumWidth=208
-Calendar.minimumHeight=210
-Calendar.maximumWidth=208
-Calendar.maximumHeight=210
+Calendar.minimumWidth=168
+Calendar.minimumHeight=180
+Calendar.maximumWidth=168
+Calendar.maximumHeight=180
Column.paddingLeft=2
Column.paddingTop=2
@@ -77,8 +74,6 @@ Column[pure].paddingBottom=-2
ColumnSelector.fixedWidth=24
-DatePicker.calendarPopupWidth=250
-DatePicker.calendarPopupHeight=350
DatePicker.fixedWidth=16
DatePicker.pickerWidth=16
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css Wed Jul 6 07:27:39 2011
@@ -165,38 +165,45 @@ fieldset.tobago-box {
/* calendar ------------------------------------------------------------------- */
-table.tobago-calendar {
- width: 100%;
-}
-
-table.tobago-calendar-header {
- width: 100%;
-}
-
-th.tobago-calendar-headerCenter {
- width: 100%;
-}
-
-th.tobago-calendar-headerInner {
- width: 14%;
+.tobago-calendar-row {
+ white-space: nowrap;
}
img.tobago-calendar-header {
+ width: 15px;
+ height: 15px;
+ padding: 2px;
+ display: inline-block;
cursor: pointer;
}
-td.tobago-calendar-day, td.tobago-calendar-day-markup-disabled, td.tobago-calendar-day-markup-selected {
- width: 14%;
+span.tobago-calendar-header {
+ width: 88px;
+ height: 15px;
+ padding: 2px;
+ display: inline-block;
+ cursor: pointer;
text-align: center;
+ vertical-align: bottom;
+}
+
+.tobago-calendar-day, .tobago-calendar-dayOfWeek {
+ padding: 3px;
+ width: 18px;
+ height: 14px;
+ display: inline-block;
cursor: pointer;
+ text-align: center;
}
-td.tobago-calendar-day-markup-disabled {
+.tobago-calendar-day-markup-disabled {
color: #999999;
}
-td.tobago-calendar-day-markup-selected {
+.tobago-calendar-day-markup-selected {
background-color: #ffffff;
+ padding: 2px;
+ border: 1px;
}
/* date ---------------------------------------------------------------------- */
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties Wed Jul 6 07:27:39 2011
@@ -21,7 +21,6 @@
Tobago.labelWidth=120
Tobago.labelSpace=5
Tobago.fixedHeight=20
-Tobago.CalendarPopupHeight=260
Box.headerHeight=20
Box.componentExtraWidth=0
@@ -53,8 +52,6 @@ Date.css.padding-top=2
Date.css.padding-right=2
Date.css.padding-bottom=2
-DatePicker.calendarPopupWidth=200
-DatePicker.calendarPopupHeight=200
DatePicker.fixedWidth=20
In.minimumHeight=20
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css Wed Jul 6 07:27:39 2011
@@ -123,29 +123,18 @@
/* calendar --------------------------------------------------------------- */
-.tobago-calendar-header {
- text-decoration: underline;
-}
-
.tobago-calendar-day {
font: 12px arial, helvetica, sans-serif;
}
-.tobago-calendar-day-markup-disabled {
- font: 12px arial, helvetica, sans-serif;
- color: #333333;
-}
-
.tobago-calendar-day-markup-selected {
- font: bold 12px arial, helvetica, sans-serif;
+ font-weight: bold;
color: #660000;
border: 1px dotted #660000;
background: #FFFFFF;
- height: 18px;
}
-.tobago-calendar-headerInner {
- font: bold 14px arial, helvetica, sans-serif;
+.tobago-calendar-dayOfWeek {
color: #660000;
}
Modified: myfaces/tobago/trunk/tobago-theme/tobago-theme-standard/src/main/resources/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/calendar.js
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/tobago-theme/tobago-theme-standard/src/main/resources/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/calendar.js?rev=1143275&r1=1143274&r2=1143275&view=diff
==============================================================================
--- myfaces/tobago/trunk/tobago-theme/tobago-theme-standard/src/main/resources/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/calendar.js (original)
+++ myfaces/tobago/trunk/tobago-theme/tobago-theme-standard/src/main/resources/org/apache/myfaces/tobago/renderkit/html/standard/standard/script/calendar.js Wed Jul 6 07:27:39 2011
@@ -177,14 +177,14 @@ function initCalendar(id) {
var monthAfterClick = month;
if (d <= 0) {
d = prevMonthLength + d;
- styleClass = "tobago-calendar-day-markup-disabled";
+ styleClass = "tobago-calendar-day tobago-calendar-day-markup-disabled";
monthAfterClick = month - 1;
} else if (d > monthLength) {
- styleClass = "tobago-calendar-day-markup-disabled";
+ styleClass = "tobago-calendar-day tobago-calendar-day-markup-disabled";
d -= monthLength;
monthAfterClick = month + 1;
} else if (d == day) {
- styleClass = "tobago-calendar-day-markup-selected";
+ styleClass = "tobago-calendar-day tobago-calendar-day-markup-selected";
}
el.className = styleClass;
el.innerHTML = d;