You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by pm...@apache.org on 2008/02/09 21:37:07 UTC

svn commit: r620194 - in /myfaces/tomahawk/trunk/core/src/main: java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css

Author: pmahoney
Date: Sat Feb  9 12:37:07 2008
New Revision: 620194

URL: http://svn.apache.org/viewvc?rev=620194&view=rev
Log:
TOMAHAWK-1197: Use DIVs for day cell layout. Only render entry table if there are entries

Modified:
    myfaces/tomahawk/trunk/core/src/main/java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java
    myfaces/tomahawk/trunk/core/src/main/resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css

Modified: myfaces/tomahawk/trunk/core/src/main/java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java
URL: http://svn.apache.org/viewvc/myfaces/tomahawk/trunk/core/src/main/java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java?rev=620194&r1=620193&r2=620194&view=diff
==============================================================================
--- myfaces/tomahawk/trunk/core/src/main/java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java (original)
+++ myfaces/tomahawk/trunk/core/src/main/java/org/apache/myfaces/custom/schedule/AbstractCompactScheduleRenderer.java Sat Feb  9 12:37:07 2008
@@ -162,23 +162,17 @@
         writer.writeAttribute(HTML.STYLE_ATTR, styleBuffer.toString()
                                                + " width: " + cellWidth + "%;", null);
 
-        writer.startElement(HTML.TABLE_ELEM, schedule);
+        writer.startElement(HTML.DIV_ELEM, schedule);
 
         writer.writeAttribute(HTML.CLASS_ATTR, getStyleClass(schedule, "day"),
                               null);
-        writer.writeAttribute(HTML.STYLE_ATTR, styleBuffer.toString()
-                                               + " width: 100%;", null);
-
-        writer.writeAttribute(HTML.CELLPADDING_ATTR, "0", null);
-        writer.writeAttribute(HTML.CELLSPACING_ATTR, "0", null);
 
         // day header
-        writer.startElement(HTML.TR_ELEM, schedule);
-        writer.startElement(HTML.TH_ELEM, schedule);
+        writer.startElement(HTML.DIV_ELEM, schedule);
         writer.writeAttribute(HTML.CLASS_ATTR,
                               getStyleClass(schedule, "header"), null);
         writer.writeAttribute(HTML.STYLE_ATTR,
-                              "height: 18px; width: 100%; overflow: hidden", null);
+                              "height: 18px; overflow: hidden", null);
 
         writer.startElement(HTML.ANCHOR_ELEM, schedule);
         writer.writeAttribute(HTML.ID_ATTR, dayHeaderId, null);
@@ -199,31 +193,16 @@
         writer.writeText(getDateString(context, schedule, day.getDate()), null);
 
         writer.endElement(HTML.ANCHOR_ELEM);
-        writer.endElement(HTML.TH_ELEM);
-        writer.endElement(HTML.TR_ELEM);
+        writer.endElement(HTML.DIV_ELEM);
 
         // day content
-        writer.startElement(HTML.TR_ELEM, schedule);
-        writer.startElement(HTML.TD_ELEM, schedule);
+        writer.startElement(HTML.DIV_ELEM, schedule);
 
         writer.writeAttribute(HTML.CLASS_ATTR, getStyleClass(schedule,
                                                              "content"), null);
 
         // determine the height of the day content in pixels
-        StringBuffer contentStyleBuffer = new StringBuffer();
-        contentStyleBuffer.append(myContentHeight);
-        contentStyleBuffer.append(" width: 100%;");
-        writer.writeAttribute(HTML.STYLE_ATTR, contentStyleBuffer.toString(),
-                              null);
-
-        writer.startElement(HTML.DIV_ELEM, schedule);
-        writer.writeAttribute(HTML.CLASS_ATTR, 
-        		getStyleClass(schedule, "contentview"), null);
-        writer
-                .writeAttribute(
-                        HTML.STYLE_ATTR,
-                        "width: 100%; height: 100%; overflow: auto; vertical-align: top;",
-                        null);
+        writer.writeAttribute(HTML.STYLE_ATTR, myContentHeight + " overflow: auto; vertical-align: top;", null);
 
         //this extra div is required, because when a scrollbar is visible and
         //it is clicked, the fireScheduleTimeClicked() method is fired.
@@ -248,17 +227,11 @@
                     null);
         }
 
-        writer.startElement(HTML.TABLE_ELEM, schedule);
-        writer.writeAttribute(HTML.STYLE_ATTR, "width: 100%;", null);
-
         writeEntries(context, schedule, day, writer);
 
-        writer.endElement(HTML.TABLE_ELEM);
         writer.endElement(HTML.DIV_ELEM);
         writer.endElement(HTML.DIV_ELEM);
-        writer.endElement(HTML.TD_ELEM);
-        writer.endElement(HTML.TR_ELEM);
-        writer.endElement(HTML.TABLE_ELEM);
+        writer.endElement(HTML.DIV_ELEM);
         writer.endElement(HTML.TD_ELEM);
     }
 
@@ -280,7 +253,7 @@
      *             when the entries could not be drawn
      */
     protected void writeEntries(FacesContext context, HtmlSchedule schedule,
-                                ScheduleDay day, ResponseWriter writer) throws IOException
+            ScheduleDay day, ResponseWriter writer) throws IOException
     {
         final String clientId = schedule.getClientId(context);
         final FormInfo parentFormInfo = RendererUtils.findNestingForm(schedule, context);
@@ -293,71 +266,80 @@
             entrySet.add(entry);
         }
 
-        for (Iterator entryIterator = entrySet.iterator(); entryIterator
-                .hasNext();)
+        if (entrySet.size() > 0)
         {
-            ScheduleEntry entry = (ScheduleEntry) entryIterator.next();
-            writer.startElement(HTML.TR_ELEM, schedule);
-            writer.startElement(HTML.TD_ELEM, schedule);
+        	writer.startElement(HTML.TABLE_ELEM, schedule);
+            writer.writeAttribute(HTML.CELLPADDING_ATTR, "0", null);
+            writer.writeAttribute(HTML.CELLSPACING_ATTR, "0", null);
+            writer.writeAttribute(HTML.STYLE_ATTR, "width: 100%;", null);           
 
-            if (isSelected(schedule, entry))
+            for (Iterator entryIterator = entrySet.iterator(); entryIterator
+            .hasNext();)
             {
-                writer.writeAttribute(HTML.CLASS_ATTR, getStyleClass(schedule,
-                                                                     "selected"), null);
-            }
+                ScheduleEntry entry = (ScheduleEntry) entryIterator.next();
+                writer.startElement(HTML.TR_ELEM, schedule);
+                writer.startElement(HTML.TD_ELEM, schedule);
+
+                if (isSelected(schedule, entry))
+                {
+                    writer.writeAttribute(HTML.CLASS_ATTR, getStyleClass(schedule,
+                            "selected"), null);
+                }
+
+                //compose the CSS style for the entry box
+                StringBuffer entryStyle = new StringBuffer();
+                entryStyle.append("width: 100%;");
+                String entryColor = getEntryRenderer(schedule).getColor(context, schedule, entry, isSelected(schedule, entry));
+                if (isSelected(schedule, entry) && entryColor != null) {
+                    entryStyle.append(" background-color: ");
+                    entryStyle.append(entryColor);
+                    entryStyle.append(";");
+                    entryStyle.append(" border-color: ");
+                    entryStyle.append(entryColor);
+                    entryStyle.append(";");
+                }
+
+                writer.writeAttribute(HTML.STYLE_ATTR, entryStyle.toString(), null);
+
+                // draw the tooltip
+                if (schedule.isTooltip())
+                {
+                    getEntryRenderer(schedule).renderToolTip(context, writer,
+                            schedule, entry, isSelected(schedule, entry));
+                }
+
+                if (!isSelected(schedule, entry) && !schedule.isReadonly())
+                {
+                    writer.startElement(HTML.ANCHOR_ELEM, schedule);
+                    writer.writeAttribute(HTML.HREF_ATTR, "#", null);
+
+                    writer.writeAttribute(
+                            HTML.ONCLICK_ATTR,
+                            "fireEntrySelected('"
+                            + formId + "', '"
+                            + clientId + "', '"
+                            + entry.getId()
+                            + "');",
+                            null);
+                }
+
+                // draw the content
+                getEntryRenderer(schedule).renderContent(context, writer, schedule,
+                        day, entry, true, isSelected(schedule, entry));
+
+                if (!isSelected(schedule, entry) && !schedule.isReadonly())
+                {
+                    writer.endElement(HTML.ANCHOR_ELEM);
+                }
 
-            //compose the CSS style for the entry box
-            StringBuffer entryStyle = new StringBuffer();
-            entryStyle.append("width: 100%;");
-            String entryColor = getEntryRenderer(schedule).getColor(context, schedule, entry, isSelected(schedule, entry));
-            if (isSelected(schedule, entry) && entryColor != null) {
-                entryStyle.append(" background-color: ");
-                entryStyle.append(entryColor);
-                entryStyle.append(";");
-                entryStyle.append(" border-color: ");
-                entryStyle.append(entryColor);
-                entryStyle.append(";");
+                writer.endElement(HTML.TD_ELEM);
+                writer.endElement(HTML.TR_ELEM);
             }
-
-            writer.writeAttribute(HTML.STYLE_ATTR, entryStyle.toString(), null);
-
-            // draw the tooltip
-            if (schedule.isTooltip())
-            {
-                getEntryRenderer(schedule).renderToolTip(context, writer,
-                                                         schedule, entry, isSelected(schedule, entry));
-            }
-
-            if (!isSelected(schedule, entry) && !schedule.isReadonly())
-            {
-                writer.startElement(HTML.ANCHOR_ELEM, schedule);
-                writer.writeAttribute(HTML.HREF_ATTR, "#", null);
-
-                writer.writeAttribute(
-                        HTML.ONCLICK_ATTR,
-                        "fireEntrySelected('"
-                        + formId + "', '"
-                        + clientId + "', '"
-                        + entry.getId()
-                        + "');",
-                        null);
-            }
-
-            // draw the content
-            getEntryRenderer(schedule).renderContent(context, writer, schedule,
-                                                     day, entry, true, isSelected(schedule, entry));
-
-            if (!isSelected(schedule, entry) && !schedule.isReadonly())
-            {
-                writer.endElement(HTML.ANCHOR_ELEM);
-            }
-
-            writer.endElement(HTML.TD_ELEM);
-            writer.endElement(HTML.TR_ELEM);
+            writer.endElement(HTML.TABLE_ELEM);
         }
     }
 
-    private boolean isSelected(HtmlSchedule schedule, ScheduleEntry entry)
+    protected boolean isSelected(HtmlSchedule schedule, ScheduleEntry entry)
     {
         ScheduleEntry selectedEntry = schedule.getModel().getSelectedEntry();
 

Modified: myfaces/tomahawk/trunk/core/src/main/resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css
URL: http://svn.apache.org/viewvc/myfaces/tomahawk/trunk/core/src/main/resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css?rev=620194&r1=620193&r2=620194&view=diff
==============================================================================
--- myfaces/tomahawk/trunk/core/src/main/resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css (original)
+++ myfaces/tomahawk/trunk/core/src/main/resources/org/apache/myfaces/custom/schedule/resource/css/schedule.css Sat Feb  9 12:37:07 2008
@@ -8,10 +8,7 @@
  	border-style: solid;
 	border-width: 1px;
 	border-color: rgb(153,153,153);
-	position: relative;
 	width: 100%;
-	left: 0px;
-    right: 0px;
 }
 
 div.schedule-detailed-default table.background {
@@ -112,9 +109,7 @@
 
 /* PART II: Compact Renderer */
 div.schedule-compact-default {
-	position: relative;
 	width: 100%;
-	left: 0px;
 	background-color: rgb(153,153,153);
 }
 
@@ -123,11 +118,11 @@
 	font-family: Verdana, Arial, Helvetica, Sans-Serif;
 }
 
-div.schedule-compact-default table.day {
+div.schedule-compact-default .day {
   background-color: rgb(255,255,255);
 }
 
-div.schedule-compact-default table.day th.header {
+div.schedule-compact-default .day .header {
   background-color: rgb(181,200,207);
   font-size: 10px;
   color: rgb(0,0,0);
@@ -135,10 +130,7 @@
   vertical-align: middle;
 }
 
-div.schedule-compact-default td.content div {
-}
-
-div.schedule-compact-default td.content td {
+div.schedule-compact-default .content td {
   background-color: rgb(255,255,255);
   color: rgb(0,0,0);
   text-align: left;
@@ -158,29 +150,29 @@
   font-size: 11px;
 }
 
-div.schedule-compact-default td.content td.selected {
+div.schedule-compact-default .content td.selected {
   background-color: rgb(153,0,0);
   border-color: rgb(153,0,0);
   color: rgb(255,255,255);
 }
 
-div.schedule-compact-default td.inactive-day td.content {
+div.schedule-compact-default td.inactive-day .content {
   background-color: rgb(221,221,221);
   visibility: visible;
 }
 
-div.schedule-compact-default td.inactive-day td.content td {
+div.schedule-compact-default td.inactive-day .content td {
   background-color: rgb(221,221,221);
   border-color: rgb(221,221,221);
 }
 
-div.schedule-compact-default td.inactive-day td.content td.selected {
+div.schedule-compact-default td.inactive-day .content td.selected {
   background-color: rgb(153,0,0);
   border-color: rgb(153,0,0);
   color: rgb(255,255,255);
 }
 
-div.schedule-compact-default td.inactive-day th.header {
+div.schedule-compact-default td.inactive-day .header {
   background-color: rgb(221,221,221);
   visibility: visible;
 }
@@ -195,10 +187,7 @@
  	border-style: solid;
 	border-width: 1px;
 	border-color: rgb(255,255,255);
-	position: relative;
 	width: 100%;
-	left: 0px;
-    right: 0px;
 }
 
 div.schedule-detailed-evolution table.background {
@@ -299,22 +288,20 @@
 
 /* PART II: Compact Renderer */
 div.schedule-compact-evolution {
-	position: relative;
 	width: 100%;
-	left: 0px;
     background-color: rgb(172,172,172);
 }
 
-div.schedule-compact-evolution table.month th.header {
+div.schedule-compact-evolution table.month .header {
     background-color: rgb(246,246,246);
 	font-family: Verdana, Arial, Helvetica, Sans-Serif;
 }
 
-div.schedule-compact-evolution table.day {
+div.schedule-compact-evolution .day {
   background-color: rgb(255,255,255);
 }
 
-div.schedule-compact-evolution table.day th.header {
+div.schedule-compact-evolution .day .header {
   background-color: rgb(255,255,255);
   font-size: 10px;
   color: rgb(0,0,0);
@@ -325,10 +312,7 @@
   border-bottom-width: 1px;
 }
 
-div.schedule-compact-evolution td.content div {
-}
-
-div.schedule-compact-evolution td.content td {
+div.schedule-compact-evolution .content td {
   background-color: rgb(255,255,255);
   color: rgb(0,0,0);
   text-align: left;
@@ -348,27 +332,27 @@
   font-size: 11px;
 }
 
-div.schedule-compact-evolution td.content td.selected {
+div.schedule-compact-evolution .content td.selected {
   background-color: rgb(190,206,221);
   border-color: rgb(190,206,221);
 }
 
-div.schedule-compact-evolution td.inactive-day td.content {
+div.schedule-compact-evolution td.inactive-day .content {
   background-color: rgb(238,235,231);
   visibility: visible;
 }
 
-div.schedule-compact-evolution td.inactive-day td.content td {
+div.schedule-compact-evolution td.inactive-day .content td {
   background-color: rgb(238,235,231);
   border-color: rgb(238,235,231);
 }
 
-div.schedule-compact-evolution td.inactive-day td.content td.selected {
+div.schedule-compact-evolution td.inactive-day .content td.selected {
   background-color: rgb(190,206,221);
   border-color: rgb(190,206,221);
 }
 
-div.schedule-compact-evolution td.inactive-day th.header {
+div.schedule-compact-evolution td.inactive-day .header {
   background-color: rgb(238,235,231);
   visibility: visible;
 }
@@ -383,10 +367,7 @@
     border-style: solid;
     border-width: 1px;
     border-color: rgb(128,128,128);
-    position: relative;
     width: 100%;
-    left: 0px;
-    right: 0px;
 }
 
 div.schedule-detailed-outlookxp table.background {
@@ -487,22 +468,20 @@
 
 /* PART II: Compact Renderer */
 div.schedule-compact-outlookxp {
-    position: relative;
     width: 100%;
-    left: 0px;
     background-color: rgb(128,128,128);
 }
 
-div.schedule-compact-outlookxp table.month th.header {
+div.schedule-compact-outlookxp table.month .header {
     background-color: rgb(219,216,209);
 	font-family: Verdana, Arial, Helvetica, Sans-Serif;
 }
 
-div.schedule-compact-outlookxp table.day {
+div.schedule-compact-outlookxp .day {
   background-color: rgb(255,255,255);
 }
 
-div.schedule-compact-outlookxp table.day th.header {
+div.schedule-compact-outlookxp .day .header {
   background-color: rgb(219,216,209);
   font-family: Verdana, Arial, Helvetica, Sans-Serif;
   font-size: 10px;
@@ -511,10 +490,7 @@
   vertical-align: middle;
 }
 
-div.schedule-compact-outlookxp td.content div {
-}
-
-div.schedule-compact-outlookxp td.content td {
+div.schedule-compact-outlookxp .content td {
   background-color: rgb(255,255,255);
   color: rgb(0,0,0);
   text-align: left;
@@ -534,30 +510,30 @@
   font-size: 11px;
 }
 
-div.schedule-compact-outlookxp td.content td.selected {
+div.schedule-compact-outlookxp .content td.selected {
   background-color: rgb(1,2,217);
   border-color: rgb(1,2,217);
   color: rgb(255,255,255);
 }
 
-div.schedule-compact-outlookxp td.inactive-day td.content {
+div.schedule-compact-outlookxp td.inactive-day .content {
   background-color: rgb(219,216,209);
   visibility: visible;
 }
 
-div.schedule-compact-outlookxp td.inactive-day td.content td {
+div.schedule-compact-outlookxp td.inactive-day .content td {
   background-color: rgb(219,216,209);
   border-color: rgb(219,216,209);
 }
 
-div.schedule-compact-outlookxp td.inactive-day td.content td.selected {
+div.schedule-compact-outlookxp td.inactive-day .content td.selected {
   background-color: rgb(1,2,217);
   border-color: rgb(1,2,217);
   color: rgb(255,255,255);
 }
 
 
-div.schedule-compact-outlookxp td.inactive-day th.header {
+div.schedule-compact-outlookxp td.inactive-day .header {
   background-color: rgb(219,216,209);
   visibility: visible;
 }