-Small layout fix to ReservationApplication.

-CalendarPanel stylename additions.
-IDateFieldCalendar styles and IPopupCalendar styles.

svn changeset:2551/svn branch:trunk

diff --git a/src/com/itmill/toolkit/demo/reservation/ReservationApplication.java b/src/com/itmill/toolkit/demo/reservation/ReservationApplication.java
index 5e6f57abd3f7afe23ab423e7e6ee7a133fd37477..afae30d84334feb28fb981b4e92a229250af0bd1 100644 (file)
--- a/src/com/itmill/toolkit/demo/reservation/ReservationApplication.java
+++ b/src/com/itmill/toolkit/demo/reservation/ReservationApplication.java
@@ -30,18 +30,25 @@ public class ReservationApplication extends Application {
        ResourceSelectorPanel resourcePanel;\r
 \r
        private CalendarField reservedFrom;\r
+\r
        private static final long DEFAULT_GAP_MILLIS = 3600000; // (almost) one\r
+\r
        // hour\r
        private long currentGapMillis = DEFAULT_GAP_MILLIS; // current length of\r
+\r
        // reservation\r
        private CalendarField reservedTo;\r
 \r
        private Label resourceName;\r
+\r
        private Label statusLabel;\r
+\r
        private TextField description;\r
+\r
        private Button reservationButton;\r
 \r
        private Table allTable;\r
+\r
        private CalendarField allCalendar;\r
 \r
        private GoogleMap map;\r
@@ -116,7 +123,7 @@ public class ReservationApplication extends Application {
                arrowLabel.setContentMode(Label.CONTENT_XHTML);\r
                arrowLabel.setStyle("arrow");\r
                reservationPanel.addComponent(arrowLabel);\r
-               \r
+\r
                Calendar to = Calendar.getInstance();\r
                to.setTime(from.getTime());\r
                to.add(Calendar.MILLISECOND, (int) DEFAULT_GAP_MILLIS);\r
@@ -164,8 +171,9 @@ public class ReservationApplication extends Application {
                        }\r
                });\r
 \r
-               OrderedLayout allLayout = new OrderedLayout(\r
-                               OrderedLayout.ORIENTATION_HORIZONTAL);\r
+               Panel allLayout = new Panel(new OrderedLayout(\r
+                               OrderedLayout.ORIENTATION_HORIZONTAL));\r
+               allLayout.addStyleName(Panel.STYLE_LIGHT);\r
                allCalendar = new CalendarField();\r
                initCalendarFieldPropertyIds(allCalendar);\r
                allLayout.addComponent(allCalendar);\r
@@ -235,9 +243,10 @@ public class ReservationApplication extends Application {
                                        SampleDB.Reservation.PROPERTY_ID_RESERVED_TO,\r
                                        SampleDB.Resource.PROPERTY_ID_NAME,\r
                                        SampleDB.Resource.PROPERTY_ID_DESCRIPTION,\r
-                                       SampleDB.Reservation.PROPERTY_ID_DESCRIPTION});\r
-                       allTable.setColumnHeaders(new String[] {"From","To","Resource","Description","Message"});\r
-                       }\r
+                                       SampleDB.Reservation.PROPERTY_ID_DESCRIPTION });\r
+                       allTable.setColumnHeaders(new String[] { "From", "To", "Resource",\r
+                                       "Description", "Message" });\r
+               }\r
                allCalendar.setContainerDataSource(allReservations);\r
        }\r
 \r

diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/CalendarPanel.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/CalendarPanel.java
index ea8df2924dc84219ee6fa2503084c6b660a3d01b..0fc60e25dc0b08c655fe879f0897aaba68b5612a 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/CalendarPanel.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/CalendarPanel.java
@@ -24,13 +24,17 @@ public class CalendarPanel extends FlexTable implements MouseListener,
        private IDateField datefield;\r
 \r
        private IEventButton prevYear;\r
+\r
        private IEventButton nextYear;\r
+\r
        private IEventButton prevMonth;\r
+\r
        private IEventButton nextMonth;\r
 \r
        private Time time;\r
 \r
        private Date minDate = null;\r
+\r
        private Date maxDate = null;\r
 \r
        private CalendarEntrySource entrySource;\r
@@ -85,7 +89,7 @@ public class CalendarPanel extends FlexTable implements MouseListener,
        }\r
 \r
        private void buildCalendarHeader(boolean forceRedraw, boolean needsMonth) {\r
-               // Can't draw a calendar without a date :)\r
+               // Can't draw a calendar without a date\r
                if (datefield.getCurrentDate() == null)\r
                        datefield.setCurrentDate(new Date());\r
 \r
@@ -93,8 +97,10 @@ public class CalendarPanel extends FlexTable implements MouseListener,
                        if (prevMonth == null) { // Only do once\r
                                prevYear = new IEventButton();\r
                                prevYear.setHTML("«");\r
+                               prevYear.setStyleName("i-button-prevyear");\r
                                nextYear = new IEventButton();\r
                                nextYear.setHTML("»");\r
+                               nextYear.setStyleName("i-button-nextyear");\r
                                prevYear.addMouseListener(this);\r
                                nextYear.addMouseListener(this);\r
                                prevYear.addClickListener(this);\r
@@ -105,8 +111,10 @@ public class CalendarPanel extends FlexTable implements MouseListener,
                                if (needsMonth) {\r
                                        prevMonth = new IEventButton();\r
                                        prevMonth.setHTML("‹");\r
+                                       prevMonth.setStyleName("i-button-prevmonth");\r
                                        nextMonth = new IEventButton();\r
                                        nextMonth.setHTML("›");\r
+                                       nextMonth.setStyleName("i-button-nextmonth");\r
                                        prevMonth.addMouseListener(this);\r
                                        nextMonth.addMouseListener(this);\r
                                        prevMonth.addClickListener(this);\r
@@ -116,6 +124,8 @@ public class CalendarPanel extends FlexTable implements MouseListener,
                                }\r
 \r
                                getFlexCellFormatter().setColSpan(0, 2, 3);\r
+                               getRowFormatter().addStyleName(0,\r
+                                               datefield.CLASSNAME + "-calendarpanel-header");\r
                        } else if (!needsMonth) {\r
                                // Remove month traverse buttons\r
                                prevMonth.removeClickListener(this);\r
@@ -364,19 +374,23 @@ public class CalendarPanel extends FlexTable implements MouseListener,
                        if (text.equals(" "))\r
                                return;\r
 \r
-                       Integer day = new Integer(text);\r
-\r
-                       Date newDate = new Date(cal.datefield.getCurrentDate().getTime());\r
-                       newDate.setDate(day.intValue());\r
-                       if (!isEnabledDate(newDate)) {\r
+                       try {\r
+                               Integer day = new Integer(text);\r
+                               Date newDate = new Date(cal.datefield.getCurrentDate().getTime());\r
+                               newDate.setDate(day.intValue());\r
+                               if (!isEnabledDate(newDate)) {\r
+                                       return;\r
+                               }\r
+                               cal.datefield.getCurrentDate().setTime(newDate.getTime());\r
+                               cal.datefield.getClient().updateVariable(cal.datefield.getId(),\r
+                                               "day", cal.datefield.getCurrentDate().getDate(),\r
+                                               cal.datefield.isImmediate());\r
+\r
+                               updateCalendar();\r
+                       } catch(NumberFormatException e) {\r
+                               // Not a number, ignore and stop here\r
                                return;\r
                        }\r
-                       cal.datefield.getCurrentDate().setTime(newDate.getTime());\r
-                       cal.datefield.getClient().updateVariable(cal.datefield.getId(),\r
-                                       "day", cal.datefield.getCurrentDate().getDate(),\r
-                                       cal.datefield.isImmediate());\r
-\r
-                       updateCalendar();\r
                }\r
 \r
        }\r

diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateFieldCalendar.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateFieldCalendar.java
index 276170f990d6df8f97e0f0311c5ffef6fffc6954..2d5540298d66beffb7bf7dbd88488f3d946ecdc3 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateFieldCalendar.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IDateFieldCalendar.java
@@ -9,7 +9,6 @@ public class IDateFieldCalendar extends IDateField {
 \r
        public IDateFieldCalendar() {\r
                super();\r
-               setStyleName(CLASSNAME + "-calendar");\r
                date = new CalendarPanel(this);\r
                add(date);\r
        }\r

diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java
index 8234cd5906c88d9279a64fff7211628ba891429f..63d8d4ff66337935d354f75784037aba23d50413 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPanel.java
@@ -70,8 +70,10 @@ public class IPanel extends SimplePanel implements Paintable,
                                && !uidl.getStringAttribute("caption").equals("")) {
                        DOM.setInnerText(captionNode, uidl.getStringAttribute("caption"));
                        hasCaption = true;
-               } else
+               } else {
                        DOM.setInnerText(captionNode, "");
+                       DOM.setElementProperty(captionNode, "className", CLASSNAME + "-nocaption");
+               }
 
                // Add proper stylenames for all elements
                if (uidl.hasAttribute("style")) {

diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java
index 8f9e6ecb1ad59bb833b8dd19efd48f86ce2295dc..9e9a27e2b4fc8df72123c2c0e747ead72e9d8cac 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IPopupCalendar.java
@@ -28,7 +28,7 @@ public class IPopupCalendar extends ITextualDate implements Paintable,
 \r
                calendar = new CalendarPanel(this);\r
                popup = new PopupPanel(true);\r
-               popup.setStyleName(IDateField.CLASSNAME + "-calendar");\r
+               popup.setStyleName(IDateField.CLASSNAME + "-popup");\r
                popup.setWidget(calendar);\r
                popup.addPopupListener(this);\r
        }\r
@@ -44,6 +44,9 @@ public class IPopupCalendar extends ITextualDate implements Paintable,
                if (sender == calendarToggle) {\r
                        calendar.updateCalendar();\r
                        popup.show();\r
+                       // clear previous values\r
+                       popup.setWidth("");\r
+                       popup.setHeight("");\r
                        int w = calendar.getOffsetWidth();\r
                        int h = calendar.getOffsetHeight();\r
                        int t = calendarToggle.getAbsoluteTop();\r

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/datefield.css b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/datefield.css
index 792a996a32d1078bc2f03b1a4d18e60a2b6924ee..bdd2a1de30789d0df22ea0acd003cef7466049a1 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/datefield.css
+++ b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/datefield.css
@@ -1,77 +1,172 @@
 .i-datefield .i-button {\r
        width: 22px;\r
-       height: 20px;\r
+       height: 25px;\r
        padding: 0;\r
        overflow: hidden;\r
        border: none;\r
-       background: transparent url(../icons/16/calendar.png) no-repeat 50% 50%;\r
+       background: transparent url(img/open-button.png) no-repeat right 1px;\r
        text-indent: -90000px;\r
 }\r
+\r
+.i-datefield-popup {\r
+       font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;\r
+       color: #464f52;\r
+       font-size: 12px;\r
+       background: #f6f7f7;\r
+       border: 1px solid #b6bbbc;\r
+       padding: 6px;\r
+}\r
+\r
 .i-datefield-calendarpanel {\r
-       width: 22em;\r
+       width: 19em;\r
+       font-size: 12px;\r
+}\r
+\r
+.i-datefield-popup .i-datefield-calendarpanel {\r
+       width: 16em;\r
 }\r
+\r
 .i-datefield-calendarpanel table {\r
        width: 100%;\r
 }\r
+\r
 .i-datefield-calendarpanel td {\r
+       text-align: right;\r
        width: 14.2%;\r
+       padding: 0;\r
+       margin: 0;\r
+}\r
+\r
+.i-datefield-calendarpanel td span {\r
+       display: block;\r
+}\r
+\r
+.i-datefield-calendarpanel-header {\r
+       height: 30px;\r
+}\r
+\r
+.i-datefield-calendarpanel-header,\r
+.i-datefield-calendarpanel strong {\r
+       font-size: 13px;\r
+}\r
+\r
+.i-datefield-popup .i-datefield-calendarpanel-header,\r
+.i-datefield-popup .i-datefield-calendarpanel strong {\r
+       font-size: 12px;\r
+}\r
+\r
+.i-datefield-calendarpanel-header td {\r
+       text-align: center;\r
+}\r
+\r
+.i-datefield-calendarpanel-month {\r
+       font-weight: bold;\r
        text-align: center;\r
+       text-shadow: #ffffff 2px 2px 0;\r
+}\r
+\r
+/* Year buttons */\r
+.i-datefield-calendarpanel .i-button-prevyear,\r
+.i-datefield-calendarpanel .i-button-nextyear {\r
+       display: block;\r
+       width: 16px;\r
+       height: 16px;\r
+       border: none;\r
        padding: 0;\r
+       background: transparent url(img/prevyear.png) no-repeat;\r
+       text-indent: -90000px;\r
+       margin: 0 auto;\r
 }\r
-.i-datefield-calendarpanel .i-button {\r
-       width: 22px;\r
-       height: 22px;\r
-       font-size: 0.9em;\r
+.i-datefield-calendarpanel .i-button-nextyear {\r
+       background: transparent url(img/nextyear.png) no-repeat;\r
+}\r
+.i-datefield-calendarpanel .i-button-prevyear:hover,\r
+.i-datefield-calendarpanel .i-button-nextyear:hover {\r
+       background-position: left bottom;\r
+}\r
+\r
+/* Month buttons */\r
+.i-datefield-calendarpanel .i-button-prevmonth,\r
+.i-datefield-calendarpanel .i-button-nextmonth {\r
+       display: block;\r
+       width: 11px;\r
+       height: 16px;\r
+       border: none;\r
        padding: 0;\r
-       line-height: 0.9em;\r
+       background: transparent url(img/prevmonth.png) no-repeat;\r
+       text-indent: -90000px;\r
+       margin: 0 auto;\r
 }\r
-.i-datefield-calendarpanel-month {\r
-       font-size: 1em;\r
+.i-datefield-calendarpanel .i-button-nextmonth {\r
+       background: transparent url(img/nextmonth.png) no-repeat;\r
 }\r
-.i-datefield-calendarpanel-day {\r
-       cursor: pointer;\r
-       padding: 0 3px;\r
+.i-datefield-calendarpanel .i-button-prevmonth:hover,\r
+.i-datefield-calendarpanel .i-button-nextmonth:hover {\r
+       background-position: left bottom;\r
 }\r
+\r
+.i-datefield-calendarpanel strong {\r
+       color: #ee5311;\r
+       display: block;\r
+       width: 20px;\r
+}\r
+\r
+.i-datefield-calendarpanel-day,\r
 .i-datefield-calendarpanel-day-today {\r
-       font-weight: bold;\r
-       border: 1px solid #aaa;\r
-       padding: 0 3px;\r
        cursor: pointer;\r
+       padding: 1px 3px;\r
+       width: 14px;\r
+       height: 16px;\r
 }\r
+\r
+.i-datefield-calendarpanel-day-today {\r
+       border: 1px solid #429ce9;\r
+       width: 12px;\r
+       height: 14px\r
+}\r
+\r
 .i-disabled .i-datefield-calendarpanel-day,\r
 .i-disabled .i-datefield-calendarpanel-day-today {\r
        cursor: default;\r
 }\r
-.i-datefield-calendarpanel-day-selected {\r
-       font-weight: bold;\r
-       color: #fff;\r
-       padding: 0 3px;\r
-       background-color: #1C3E6E;\r
-       cursor: default;\r
-}\r
+\r
 .i-datefield-calendarpanel-day-entry {\r
-       color: #0074D9;\r
+       color: #6a98b5;\r
 }\r
+\r
 .i-datefield-calendarpanel-day-disabled {\r
        font-weight: normal;\r
        color: #dddddd;\r
        cursor: default;\r
        opacity: 0.5;\r
 }\r
+\r
 .i-datefield-calendarpanel-day-entry.i-datefield-calendarpanel-day-disabled {\r
-       color: #ABC8E2;\r
+       color: #afd6f8;\r
+}\r
+\r
+.i-datefield-calendarpanel-day-selected {\r
+       font-weight: bold;\r
+       width: 14px;\r
+       height: 16px;\r
+       color: #fff;\r
+       padding: 1px 3px;\r
+       background: transparent url(img/selected-bg.png) no-repeat 50% 50%;\r
+       cursor: default;\r
+       border: none;\r
 }\r
 \r
 .i-datefield-time {\r
        white-space: nowrap;\r
+       font-size: 11px;\r
 }\r
+\r
 .i-datefield-time .i-label {\r
        display: inline;\r
 }\r
 \r
-.i-datefield-calendar {\r
-       border: 1px solid #29528a;\r
-       padding: 5px;\r
-       background: #fff;\r
-}\r
-\r
+.i-datefield-time .i-select {\r
+       font-size: 10px;\r
+       padding: 0;\r
+       margin: 0;\r
+}
\ No newline at end of file

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextmonth.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextmonth.png
new file mode 100644 (file)
index 0000000..3315125
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextmonth.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextyear.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextyear.png
new file mode 100644 (file)
index 0000000..22633fd
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/nextyear.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/open-button.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/open-button.png
new file mode 100644 (file)
index 0000000..548ca12
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/open-button.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevmonth.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevmonth.png
new file mode 100644 (file)
index 0000000..d114632
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevmonth.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevyear.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevyear.png
new file mode 100644 (file)
index 0000000..f174713
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/prevyear.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/selected-bg.png b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/selected-bg.png
new file mode 100644 (file)
index 0000000..799915a
Binary files /dev/null and b/src/com/itmill/toolkit/terminal/gwt/public/default/datefield/img/selected-bg.png differ

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/panel/panel.css b/src/com/itmill/toolkit/terminal/gwt/public/default/panel/panel.css
index e260ab2f5f8872b252206accd241cdc077c66dc4..35dbb01e8965efc861bc955544789c4b053a72d1 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/public/default/panel/panel.css
+++ b/src/com/itmill/toolkit/terminal/gwt/public/default/panel/panel.css
@@ -93,7 +93,8 @@
        padding-top: 14px;\r
 }\r
 \r
-.i-panel-caption-light:before {\r
+.i-panel-caption-light:before,\r
+.i-panel-nocaption-light:before {\r
        display: none;\r
 }\r
 \r

diff --git a/src/com/itmill/toolkit/terminal/gwt/public/default/textfield/textfield.css b/src/com/itmill/toolkit/terminal/gwt/public/default/textfield/textfield.css
index b3d05c3c2436fc2dafe22c267cf4ef59edaee9c5..391a02abe3f1095d30b9a7725d77adc3c800dbef 100644 (file)
--- a/src/com/itmill/toolkit/terminal/gwt/public/default/textfield/textfield.css
+++ b/src/com/itmill/toolkit/terminal/gwt/public/default/textfield/textfield.css
@@ -6,12 +6,12 @@
        border-bottom-color: #d6d6d6;\r
        border-right-color: #d6d6d6;\r
        margin: 0;\r
+       font-size: 13px;\r
+       height: 18px;\r
 }\r
 \r
 .i-textfield-focus {\r
-       border-color: #4376c3;\r
-       border-bottom-color: #6696dd;\r
-       border-right-color: #6696dd;\r
+       border-color: #5daee8;\r
 }\r
 \r
 .i-textfield-error {\r
@@ -22,12 +22,12 @@
        background: transparent;\r
        color: #222;\r
        border: none;\r
-}
-
-.i-richtextarea {
-       border: 1px solid #b6b6b6;
-       overflow: hidden;
-}
-.i-richtextarea iframe {
-       border: 0;
+}\r
+\r
+.i-richtextarea {\r
+       border: 1px solid #b6b6b6;\r
+       overflow: hidden;\r
+}\r
+.i-richtextarea iframe {\r
+       border: 0;\r
 }
\ No newline at end of file