+/* Reservr styles */\r
+html, body {\r
+ background-color: #E9ECED;\r
+}\r
+#header {\r
+ font-family:"Trebuchet MS",geneva,helvetica,arial,tahoma,verdana,sans-serif;\r
+ padding: 10px;\r
+}\r
+#logo {\r
+ line-height: 33px;\r
+ color:#F14C1A;\r
+ font-size:22px;\r
+ letter-spacing:-0.03em;\r
+}\r
+#slogan {\r
+ color: #464F52;\r
+}\r
+\r
+/* Default widgetset overrides */\r
+textarea.i-textfield {\r
+ font-size: 13px;\r
+ width: 326px;\r
+ height: 110px;\r
+}\r
+button.link {\r
+ text-decoration: none;\r
+}\r
button.important-link {\r
border: 0px;\r
text-align: left;\r
- text-decoration: underline;\r
+ text-decoration: none;\r
background: none;\r
font-weight: bold;\r
}\r
button.selected-link {\r
border: 0px;\r
text-align: left;\r
- text-decoration: underline;\r
+ text-decoration: none;\r
background: #183C6B;\r
font-weight: bold;\r
color: white;\r
}\r
+.i-orderedlayout {\r
+ margin:5px 5px;\r
+}\r
+.i-orderedlayout TD {\r
+ vertical-align: top;\r
+}
\ No newline at end of file
<title>IT Mill Toolkit 5 Demo: Reservr</title>\r
<script type="text/javascript">\r
var itmtk = {\r
- appUri:'Reservr', pathInfo: '/'\r
+ appUri:'/toolkit/Reservr', pathInfo: '/'\r
};\r
</script>\r
<script src="http://maps.google.com/maps?file=api&v=2" type="text/javascript"></script>\r
</head>\r
<body>\r
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>\r
+ <div id="header">\r
+ <img src="ITMILL/themes/reservr/reservr.jpg" align="top"/>\r
+ <span id="logo">Reservr Inc</span>\r
+ <span>» Representational cars on-the-road</span>\r
+ </div>\r
<div id="itmtk-ajax-window"></div> \r
</body>\r
</html>\r
ResourceSelectorPanel resourcePanel;\r
\r
private CalendarField reservedFrom;\r
- private static final long DEFAULT_GAP_MILLIS = 3600000; // one hour\r
+ private static final long DEFAULT_GAP_MILLIS = 3600000; // (almost) one\r
+ // hour\r
private long currentGapMillis = DEFAULT_GAP_MILLIS; // current length of\r
// reservation\r
private CalendarField reservedTo;\r
TabSheet mainTabs = new TabSheet();\r
mainWindow.addComponent(mainTabs);\r
\r
- mainWindow.addComponent(new Button("close", this, "close"));\r
-\r
OrderedLayout reservationTab = new OrderedLayout();\r
mainTabs.addTab(reservationTab, "Make reservation", null);\r
\r
resourceName.setCaption("Choose resource");\r
infoLayout.addComponent(resourceName);\r
description = new TextField();\r
- description.setColumns(55);\r
+ description.setColumns(47);\r
description.setRows(5);\r
infoLayout.addComponent(description);\r
reservationButton = new Button("Make reservation", this,\r
infoLayout.addComponent(statusLabel);\r
\r
map = new GoogleMap();\r
- map.setWidth(360);\r
+ map.setWidth(330);\r
map.setHeight(270);\r
map.setItemMarkerHtmlPropertyId(SampleDB.Resource.PROPERTY_ID_NAME);\r
map.setItemMarkerXPropertyId(SampleDB.Resource.PROPERTY_ID_LOCATIONX);\r
infoLayout.addComponent(map);\r
\r
Calendar from = Calendar.getInstance();\r
- reservedFrom = new CalendarField();\r
+ from.add(Calendar.HOUR, 1);\r
+ from.set(Calendar.MINUTE, 0);\r
+ from.set(Calendar.SECOND, 0);\r
+ from.set(Calendar.MILLISECOND, 0);\r
+ reservedFrom = new CalendarField("From »");\r
reservedFrom.setMinimumDate(from.getTime());\r
reservedFrom.setValue(from.getTime());\r
reservedFrom.setImmediate(true);\r
reservationPanel.addComponent(reservedFrom);\r
\r
Calendar to = Calendar.getInstance();\r
- to.add(Calendar.MILLISECOND, (int) currentGapMillis);\r
- reservedTo = new CalendarField();\r
- reservedTo.setMinimumDate(from.getTime());\r
+ to.setTime(from.getTime());\r
+ to.add(Calendar.MILLISECOND, (int) DEFAULT_GAP_MILLIS);\r
+ reservedTo = new CalendarField("» To");\r
+ reservedTo.setMinimumDate(to.getTime());\r
reservedTo.setValue(to.getTime());\r
reservedTo.setImmediate(true);\r
initCalendarFieldPropertyIds(reservedTo);\r
} else {\r
reservedTo.setEnabled(true);\r
}\r
- reservedTo.setMinimumDate(fd);\r
+ reservedTo.setMinimumDate(new Date(fd.getTime()\r
+ + DEFAULT_GAP_MILLIS));\r
Calendar to = Calendar.getInstance();\r
to.setTime(fd);\r
to.add(Calendar.MILLISECOND, (int) currentGapMillis);\r
initCalendarFieldPropertyIds(allCalendar);\r
allLayout.addComponent(allCalendar);\r
allTable = new Table();\r
+ allTable.setColumnCollapsingAllowed(true);\r
+ allTable.setColumnReorderingAllowed(true);\r
allLayout.addComponent(allTable);\r
mainTabs.addTab(allLayout, "All reservations", null);\r
mainTabs.addListener(new TabSheet.SelectedTabChangeListener() {\r
refreshSelectedResources();\r
Container allReservations = db.getReservations(null);\r
allTable.setContainerDataSource(allReservations);\r
+ if (allReservations != null && allReservations.size() > 0) {\r
+ allTable.setVisibleColumns(new Object[] {\r
+ SampleDB.Reservation.PROPERTY_ID_RESERVED_FROM,\r
+ 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
allCalendar.setContainerDataSource(allReservations);\r
-\r
}\r
\r
private void refreshSelectedResources() {\r
map.setZoomLevel(1);\r
\r
} else {\r
+ // Display active resource name + desc\r
+ String name = (String) resource.getItemProperty(\r
+ SampleDB.Resource.PROPERTY_ID_NAME).getValue();\r
+ String desc = (String) resource.getItemProperty(\r
+ SampleDB.Resource.PROPERTY_ID_DESCRIPTION).getValue();\r
+ resourceName.setCaption(name);\r
+ resourceName.setValue(desc);\r
+ // Put all resources on map (may be many if category was selected)\r
LinkedList srs = resourcePanel.getSelectedResources();\r
for (Iterator it = srs.iterator(); it.hasNext();) {\r
resource = (Item) it.next();\r
- String name = (String) resource.getItemProperty(\r
+ name = (String) resource.getItemProperty(\r
SampleDB.Resource.PROPERTY_ID_NAME).getValue();\r
- String desc = (String) resource.getItemProperty(\r
+ desc = (String) resource.getItemProperty(\r
SampleDB.Resource.PROPERTY_ID_DESCRIPTION).getValue();\r
- resourceName.setCaption(name);\r
- resourceName.setValue(desc);\r
Double x = (Double) resource.getItemProperty(\r
SampleDB.Resource.PROPERTY_ID_LOCATIONX).getValue();\r
Double y = (Double) resource.getItemProperty(\r
}\r
\r
}\r
- map.setZoomLevel((srs.size() == 1 ? 16 : 9));\r
+ map.setZoomLevel((srs.size() == 1 ? 14 : 9));\r
reservationButton.setEnabled(true);\r
}\r
\r
}
public void generateResources() {
- /*
- * map.addMarker("Old Mill", new Point.Double(60.452224f,22.299929f));
- * map.addMarker("ICT", new Point.Double(60.449007f,22.295508f));
- * map.addMarker("DataCity", new Point.Double(60.448329f,22.295165f));
- * map.addMarker("BioCity", new Point.Double(60.449451f,22.293105f));
- * map.addMarker("PharmaCity", new Point.Double(60.44888f,22.292032f));
- * map.addMarker("Intelligate", new Point.Double(60.450403f,22.29495f));
- * map.addMarker("Paviljonki", new Point.Double(60.445408f,22.290831f));
- * map.addMarker("Trivium", new Point.Double(60.44641962165445f,
- * 22.301753170493f)); map.addMarker("Linja-auto asema", new
- * Point.Double(60.457049f,22.267957f));
- */
- /*
- * Object[][] resources = { { "IT Mill Toolkit Manual", "the manual",
- * "Books", new Double(60.452224),new Double(22.299929)}, { "IT Mill
- * Toolkit for Dummies", "the hardcover version", "Books", new
- * Double(60.452224),new Double(22.299929) }, { "Sony", "Old Sony video
- * projector", "AV equipment", new Double(60.449007),new
- * Double(22.295508) }, { "Sanyo", "Brand new hd-ready video projector",
- * "AV equipment", new Double(60.452224),new Double(22.299929) }, {
- * "Room 7", "Conference room in the lobby", "Conference rooms", new
- * Double(60.449451),new Double(22.292032) }, { "Nintendo Wii", "Teh
- * uber fun", "Entertainment", new Double(60.445408),new
- * Double(22.290831) }, { "Playstation", "We don't actually have one",
- * "Entertainment", new Double(60.44641962165445),new
- * Double(22.301753170493) }, { "Luokkahuone", "Classroom right next to
- * IT Mill", "Conference rooms", new Double(60.44888),new
- * Double(22.292032) } };
- */
+
Object[][] resources = {
// Turku
{ "01", "01 Ford Mondeo", "w/ company logo", "Turku",
{ "11", "11 Ford Mustang", "Keys from Acme clerk.",
"Silicon Valley", new Double(37.615853),
new Double(-122.386384) },
- { "12", "12 Ford Mondeo", "Keys from infodesk.",
+ { "12", "12 Ford Fusion", "Keys from infodesk.",
"Silicon Valley", new Double(37.365028),
new Double(-121.922654) },
{ "13", "13 Ford Mustang", "GT Cal Special. Keys from guard.",
"Silicon Valley", new Double(37.403812),
new Double(-121.977425) },
- { "14", "14 Ford Mustang", "GT Cal Special. Keys from guard.",
+ { "14", "14 Ford Focus", "Keys from guard.",
"Silicon Valley", new Double(37.403812),
new Double(-121.977425) },
{ "15", "15 Land Rover", "Keys from infodesk.",
@import "googlemap/css/googlemap.css";\r
\r
+/* Entrycalendar styles */\r
+.i-datefield-entrycalendar-hours {\r
+ height: auto;\r
+ xoverflow: auto;\r
+}\r
+.i-datefield-entrycalendar-hours table {\r
+ width: auto;\r
+}\r
+.i-datefield-entrycalendar-hours table tr {\r
+ height: 1em;\r
+}\r
+.i-datefield-entrycalendar-row-even {\r
+ cursor: pointer;\r
+ background-color: #fefefe;\r
+ height: 1em;\r
+}\r
+.i-datefield-entrycalendar-row-odd {\r
+ cursor: pointer;\r
+ background-color: #eeeeee;\r
+ height: 1em;\r
+}\r
+.i-datefield-entrycalendar-row-selected {\r
+ color: #fff;\r
+ background-color: #1C3E6E;\r
+}\r
+td.i-datefield-entrycalendar-time {\r
+ padding-right: 2px;\r
+ white-space: nowrap;\r
+ float: left;\r
+}\r
+td.i-datefield-entrycalendar-time span {\r
+ width: 55px;\r
+ text-align: right;\r
+ display: block;\r
+}\r
+td.i-datefield-entrycalendar-entry span {\r
+ display: block;\r
+ overflow: hidden;\r
+ padding: 2px;\r
+ color: #fff;\r
+ background-image: url('img/entry-topleft.jpg');\r
+ background-repeat: no-repeat;\r
+ background-position: 0px 0px;\r
+}\r
+.i-datefield-calendarpanel td.i-datefield-entrycalendar-entry {\r
+ background-color: #F24C1A;\r
+ color: #fff;\r
+ background-image: url('img/entry-bg.jpg');\r
+ background-repeat: repeat-x;\r
+ vertical-align: top;\r
+ width: auto;\r
+}\r
+\r
+/* Reservr styles */\r
.i-datefield-entrycalendar-01 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-02 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-03 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-04 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-05 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-06 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-07 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-08 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-09 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-10 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-11 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-12 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-13 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-14 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-15 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-16 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-17 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-18 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-19 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-20 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-21 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-22 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-23 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-24 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-25 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-26 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-27 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-28 {\r
- background-color: red;\r
+ \r
}\r
.i-datefield-entrycalendar-29 {\r
- background-color: red;\r
+ \r
}\r
\r
hourTable.setHTML(i, 0, "<span>" + hstr + "</span>");\r
hourTable.getCellFormatter()\r
.setStyleName(i, 0, CLASSNAME + "-time");\r
- hourTable.getCellFormatter().setWidth(i, 0, "55");\r
-\r
}\r
\r
List entries = this.entrySource.getEntries(date,\r
int hours = 24;\r
if (!entry.isNotime()) {\r
Date d = entry.getStart();\r
+ // TODO consider month&year as well\r
start = (d.getDate() < date.getDate() ? 0 : d.getHours());\r
d = entry.getEnd();\r
hours = (d.getDate() > date.getDate() ? 24 : d.getHours())\r
}\r
Element el = this.hourTable.getFlexCellFormatter().getElement(\r
start, col);\r
- DOM.setElementProperty(el, "title", entry.getDescription());\r
+ \r
+ String tooltip;\r
+ if (DateTimeService.isSameDay(entry.getStart(), entry.getEnd())) {\r
+ tooltip = (start < 10 ? "0" : "") + start + ":00";\r
+ if (this.dts.isTwelveHourClock()) {\r
+ String ampm = (start < 12 ? "am" : "pm");\r
+ tooltip = (start <= 12 ? start : start - 12) + ":00 " + ampm;\r
+ \r
+ }\r
+ tooltip += " (" + hours + "h) ";\r
+ tooltip += entry.getTitle() + "\n ";\r
+ } else {\r
+ tooltip = entry.getStringForDate(entry.getEnd()) + "\n ";\r
+ }\r
+ tooltip += "\"" + entry.getDescription() + "\"";\r
+ DOM.setElementProperty(el, "title", tooltip);\r
\r
currentCol++;\r
}\r
background: #fff;\r
}\r
\r
-\r
-\r
-.i-datefield-entrycalendar-hours {\r
- height: 300px;\r
- overflow: auto;\r
-}\r
-.i-datefield-entrycalendar-hours table {\r
- width: 92%;\r
-}\r
-\r
-.i-datefield-entrycalendar-row-even {\r
- cursor: pointer;\r
- background-color: #fefefe;\r
-}\r
-.i-datefield-entrycalendar-row-odd {\r
- cursor: pointer;\r
- background-color: #eeeeee;\r
-}\r
-.i-datefield-entrycalendar-row-selected {\r
- color: #fff;\r
- background-color: #1C3E6E;\r
-}\r
-td.i-datefield-entrycalendar-time {\r
- padding-right: 2px;\r
- text-align: right;\r
- white-space: nowrap;\r
-}\r
-.i-datefield-entrycalendar-row-selected td span {\r
- color: #fff;\r
-}\r
-.i-datefield-entrycalendar-entry {\r
- background-color: #0074D9;\r
- color: #fff;\r
-}\r
-.i-datefield-entrycalendar-entry span {\r
- display: block;\r
- overflow: hidden;\r
- padding: 2px;\r
-}\r