Is it possible to have an image on a Calendar event ?

Hi,

I’m pretty new with Vaadin, but so far I really enjoy it.

I’m writing an application where I’d need a calendar to show the hockey games a team plays for a specific month.

As this calendar only displays the games for a single team, there will be only one event by day maximum.

I was wondering if it was possible to add an image to the event to show the team they’re playing against ?

It might be easy to do (or not possible), I’ve not found any example on the web to have an image in the calendar event and I’m pretty new to vaadin so I didn’t figure it yet on my own.

Thanks for your help !

Charles

Hello,

Check this
http://demo.vaadin.com/dashboard/#!/schedule

The source code is here:
https://github.com/vaadin/dashboard-demo

Thanks Michael,

It’s pretty funny that I’ve been looking at this demo many times without noticing the calendar events having images.

This is exactly what I need.

Thanks again for your help.

For those who get here, this is the interesting part of ScheduleView.java in my case.

void createEvents() {
Date startDate = cal.getStartDate();
int k = (startDate.getMonth()) * 30 + startDate.getDate();
if (!created[k]
) {
for (int i = 0; i < 7; i++) {
createEventsForDay(startDate);
startDate.setDate(startDate.getDate() + 1);
}
created[k]
 = true;
}
// Add all movie cover images as classes to CSSInject
String styles = "";
for (Movie m : DataProvider.getMovies()) {
WebBrowser webBrowser = Page.getCurrent().getWebBrowser();
String bg = "url(VAADIN/themes/" + UI.getCurrent().getTheme()
+ "/img/event-title-bg.png), url(" + m.posterUrl + ")";
// IE8 doesn't support multiple background images
if (webBrowser.isIE() && webBrowser.getBrowserMajorVersion() == 8) {
bg = "url(" + m.posterUrl + ")";
}
styles += ".v-calendar-event-" + m.titleSlug().replaceAll("&", "_")
+ " .v-calendar-event-content {background-image:" + bg
+ ";}";
}
Page.getCurrent().getStyles().add(styles);
}
void createEventsForDay(Date day) {
ArrayList<Movie> movies = DataProvider.getMovies();
boolean[] used = new boolean[movies.size()]
;
Date date = new Date(day.getTime());
// Start from noon
date.setHours(11);
date.setMinutes(0);
date.setSeconds(0);
while (date.getHours() < 23) {
// Get "random" movie
int i = -1;
int reallyStupidStuffForCodeThatIDontReallyUnderStandWTFItIsDoing = 0;
do {
i = (int) (Math.random() * movies.size());
if (!used[i]
) {
used[i]
 = true;
break;
}
if (reallyStupidStuffForCodeThatIDontReallyUnderStandWTFItIsDoing++ > used.length) {
break;
}
} while (true);
Movie m = movies.get(i);
Date start = new Date(date.getTime());
Date end = new Date(start.getTime());
// int endHour = (int) (1 + Math.round(Math.random()));
// int endMinutes = (int) (45 + Math.random() * 30);
// end.setHours(end.getHours() + endHour);
end.setMinutes(end.getMinutes() + m.duration);
MovieEvent e = new MovieEvent(start, end, m);
provider.addEvent(e);
date.setDate(end.getDate());
date.setHours(end.getHours());
date.setMinutes((int) (end.getMinutes() + 15 + (Math.random() * 60)));
if (date.getDate() > day.getDate())
break;
}
}