SHOP NOW

Schedule - Configureable

Documentation

Settings

show weekends

show tooltips

show all-day slot (timeGridWeek and timeGridDay)

timeFormat (eg HH:mm:ss)

slotDuration

slotLabelInterval

scrollTime

minTime

maxTime

locale (some examples)

timeZone (some examples)

clientTimeZone

columnHeaderFormat

Event Details

Titles:*
From:
To:
All Day (see #1164):

configureable.xhtml
ScheduleJava8View.java

<style type="text/css">
    .value {
        width: 1000px;
    }
</style>


<h:form>
    <p:growl id="messages" showDetail="true" />

    <p:panel header="Settings">
        <p:panelGrid columns="2" layout="flex" styleClass="ui-noborder" columnClasses="p-col-12 p-xl-6, p-col-12 p-xl-6">
            <p:selectBooleanCheckbox value="#{scheduleJava8View.showWeekends}" itemLabel="show weekends">
                <p:ajax update="schedule" />
            </p:selectBooleanCheckbox>
            <p:selectBooleanCheckbox value="#{scheduleJava8View.tooltip}" itemLabel="show tooltips">
                <p:ajax update="schedule" />
            </p:selectBooleanCheckbox>
            <p:selectBooleanCheckbox value="#{scheduleJava8View.allDaySlot}" itemLabel="show all-day slot (timeGridWeek and timeGridDay)">
                <p:ajax update="schedule" />
            </p:selectBooleanCheckbox>
        </p:panelGrid>

        <p:panelGrid columns="4" layout="flex" styleClass="ui-noborder" columnClasses="p-col-12 p-md-3 p-xl-2, p-col-12 p-md-9 p-xl-4, p-col-12 p-md-3 p-xl-2, p-col-12 p-md-9 p-xl-4">
            <p:outputLabel value="timeFormat (eg HH:mm:ss)" for="timeFormat" />
            <p:inputText id="timeFormat" value="#{scheduleJava8View.timeFormat}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="slotDuration" for="slotDuration" />
            <p:inputText id="slotDuration" value="#{scheduleJava8View.slotDuration}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="slotLabelInterval" for="slotLabelInterval" />
            <p:inputText id="slotLabelInterval" value="#{scheduleJava8View.slotLabelInterval}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="scrollTime" for="scrollTime" />
            <p:inputText id="scrollTime" value="#{scheduleJava8View.scrollTime}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="minTime" for="minTime" />
            <p:inputText id="minTime" value="#{scheduleJava8View.minTime}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="maxTime" for="maxTime" />
            <p:inputText id="maxTime" value="#{scheduleJava8View.maxTime}">
                <p:ajax update="schedule" />
            </p:inputText>

            <p:outputLabel value="locale (some examples)" for="locale" />
            <p:selectOneMenu id="locale" value="#{scheduleJava8View.locale}">
                <f:selectItem itemLabel="Englisch" itemValue="en" />
                <f:selectItem itemLabel="French" itemValue="fr" />
                <f:selectItem itemLabel="German" itemValue="de" />
                <f:selectItem itemLabel="Turkish" itemValue="tr" />

                <p:ajax update="schedule" />
            </p:selectOneMenu>

            <p:outputLabel value="timeZone (some examples)" for="timeZone" />
            <p:selectOneMenu id="timeZone" value="#{scheduleJava8View.timeZone}">
                <f:selectItem itemLabel="ZoneId.systemDefault()" />
                <f:selectItem itemLabel="UTC" itemValue="UTC"  />
                <f:selectItem itemLabel="GMT-5" itemValue="GMT-5" />
                <f:selectItem itemLabel="GMT+13" itemValue="GMT+13" />

                <p:ajax update="schedule" />
            </p:selectOneMenu>

            <p:outputLabel value="clientTimeZone" for="clientTimeZone" />
            <p:selectOneMenu id="clientTimeZone" value="#{scheduleJava8View.clientTimeZone}">
                <f:selectItem itemLabel="local" itemValue="local" />
                <f:selectItem itemLabel="UTC" itemValue="UTC" />
                <f:selectItem itemLabel="America/New_York" itemValue="America/New_York" />
                <f:selectItem itemLabel="Europe/Moscow" itemValue="Europe/Moscow" />

                <p:ajax update="schedule" />
            </p:selectOneMenu>

            <p:outputLabel value="columnHeaderFormat" for="columnHeaderFormat" />
            <p:selectOneMenu id="columnHeaderFormat" value="#{scheduleJava8View.columnHeaderFormat}" autoWidth="false">
                <f:selectItem itemLabel="" itemValue="" />
                <f:selectItem itemLabel="week:'dd DD MMM'" itemValue="week:'dd DD MMM'" />
                <f:selectItem itemLabel="day: 'dd'" itemValue="day: 'dd'" />
                <f:selectItem itemLabel="timeGridWeek: 'DD MM'" itemValue="timeGridWeek: 'DD MM'" />
                <f:selectItem itemLabel="timeGridWeek: { weekday: 'long', month: 'numeric', day: 'numeric', omitCommas: true}" itemValue="timeGridWeek: { weekday: 'long', month: 'numeric', day: 'numeric', omitCommas: true}" />
                <f:selectItem itemLabel="timeGridWeek: 'DD MM', timeGridDay: 'dd'" itemValue="timeGridWeek: 'DD MM', timeGridDay: 'dd'" />
                <f:selectItem itemLabel="listYear: 'dd.MM.yyyy'" itemValue="listYear: 'dd.MM.yyyy'" />

                <p:ajax update="schedule" />
            </p:selectOneMenu>
        </p:panelGrid>
    </p:panel>

    <p></p>

    <h:panelGrid columnClasses="value">
        <p:schedule id="schedule" value="#{scheduleJava8View.eventModel}" widgetVar="myschedule" view="timeGridWeek"
                    locale="#{scheduleJava8View.locale}" timeZone="#{scheduleJava8View.timeZone}" clientTimeZone="#{scheduleJava8View.clientTimeZone}"
                    rightHeaderTemplate="dayGridMonth,timeGridWeek,timeGridDay,listYear"
                    showWeekends="#{scheduleJava8View.showWeekends}" tooltip="#{scheduleJava8View.tooltip}" allDaySlot="#{scheduleJava8View.allDaySlot}"
                    timeFormat="#{scheduleJava8View.timeFormat}" slotDuration="#{scheduleJava8View.slotDuration}"
                    slotLabelInterval="#{scheduleJava8View.slotLabelInterval}" scrollTime="#{scheduleJava8View.scrollTime}"
                    minTime="#{scheduleJava8View.minTime}" maxTime="#{scheduleJava8View.maxTime}"
                    columnHeaderFormat="#{scheduleJava8View.columnHeaderFormat}" initialDate="#{scheduleJava8View.initialDate}">

            <p:ajax event="dateSelect" listener="#{scheduleJava8View.onDateSelect}" update="eventDetails" oncomplete="PF('eventDialog').show();" />
            <p:ajax event="eventSelect" listener="#{scheduleJava8View.onEventSelect}" update="eventDetails" oncomplete="PF('eventDialog').show();" />
            <p:ajax event="eventMove" listener="#{scheduleJava8View.onEventMove}" update="messages" />
            <p:ajax event="eventResize" listener="#{scheduleJava8View.onEventResize}" update="messages" />

        </p:schedule>
    </h:panelGrid>
    
    <p:dialog widgetVar="eventDialog" header="Event Details" showEffect="clip" hideEffect="clip">
        <h:panelGrid id="eventDetails" columns="2">
            <p:outputLabel for="title" value="Titles:" />
            <p:inputText id="title" value="#{scheduleJava8View.event.title}" required="true" />

            <p:outputLabel for="from" value="From:" />
            <p:datePicker id="from" value="#{scheduleJava8View.event.startDate}" pattern="dd/MM/yyyy" showTime="true" appendTo="@(body)"  />

            <p:outputLabel for="to" value="To:" />
            <p:datePicker id="to" value="#{scheduleJava8View.event.endDate}" pattern="dd/MM/yyyy" showTime="true" appendTo="@(body)" />

            <p:outputLabel for="allDay" value="All Day (see #1164):" />
            <h:selectBooleanCheckbox id="allDay" value="#{scheduleJava8View.event.allDay}" />

            <p:commandButton type="reset" value="Reset" />
            <p:commandButton id="addButton" value="Save" action="#{scheduleJava8View.addEvent}" oncomplete="PF('myschedule').update();PF('eventDialog').hide();" />
        </h:panelGrid>
    </p:dialog>    
</h:form>

@Named
@ViewScoped
public class ScheduleJava8View implements Serializable {

	private ScheduleModel eventModel;
	
	private ScheduleModel lazyEventModel;

	private ScheduleEvent event = new DefaultScheduleEvent();

	private boolean showWeekends = true;
	private boolean tooltip = true;
	private boolean allDaySlot = true;

	private String timeFormat;
	private String slotDuration="00:30:00";
	private String slotLabelInterval;
	private String scrollTime="06:00:00";
	private String minTime="04:00:00";
	private String maxTime="20:00:00";
	private String locale="en";
	private String timeZone="";
	private String clientTimeZone="local";
	private String columnHeaderFormat="";

    @PostConstruct
	public void init() {
		eventModel = new DefaultScheduleModel();

		DefaultScheduleEvent event = DefaultScheduleEvent.builder()
				.title("Champions League Match")
				.startDate(previousDay8Pm())
				.endDate(previousDay11Pm())
				.description("Team A vs. Team B")
				.build();
		eventModel.addEvent(event);

		event = DefaultScheduleEvent.builder()
				.title("Birthday Party")
				.startDate(today1Pm())
				.endDate(today6Pm())
				.description("Aragon")
				.overlapAllowed(true)
				.build();
		eventModel.addEvent(event);

		event = DefaultScheduleEvent.builder()
				.title("Breakfast at Tiffanys")
				.startDate(nextDay9Am())
				.endDate(nextDay11Am())
				.description("all you can eat")
				.overlapAllowed(true)
				.build();
		eventModel.addEvent(event);

		event = DefaultScheduleEvent.builder()
				.title("Plant the new garden stuff")
				.startDate(theDayAfter3Pm())
				.endDate(fourDaysLater3pm())
				.description("Trees, flowers, ...")
				.build();
		eventModel.addEvent(event);

		DefaultScheduleEvent scheduleEventAllDay=DefaultScheduleEvent.builder()
				.title("Holidays (AllDay)")
				.startDate(sevenDaysLater0am())
				.endDate(eightDaysLater0am())
				.description("sleep as long as you want")
				.allDay(true)
				.build();
		eventModel.addEvent(scheduleEventAllDay);

		lazyEventModel = new LazyScheduleModel() {
			
			@Override
			public void loadEvents(LocalDateTime start, LocalDateTime end) {
				for (int i=1; i<=5; i++) {
					LocalDateTime random = getRandomDateTime(start);
					addEvent(DefaultScheduleEvent.builder().title("Lazy Event " + i).startDate(random).endDate(random.plusHours(3)).build());
				}
			}
		};
	}
	
	public LocalDateTime getRandomDateTime(LocalDateTime base) {
		LocalDateTime dateTime = base.withMinute(0).withSecond(0).withNano(0);
		return dateTime.plusDays(((int) (Math.random()*30)));
	}
	

	public ScheduleModel getEventModel() {
		return eventModel;
	}
	
	public ScheduleModel getLazyEventModel() {
		return lazyEventModel;
	}

	private LocalDateTime previousDay8Pm() {
    	return LocalDateTime.now().minusDays(1).withHour(20).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime previousDay11Pm() {
		return LocalDateTime.now().minusDays(1).withHour(23).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime today1Pm() {
		return LocalDateTime.now().withHour(13).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime theDayAfter3Pm() {
		return LocalDateTime.now().plusDays(1).withHour(15).withMinute(0).withSecond(0).withNano(0);
	}

	private LocalDateTime today6Pm() {
		return LocalDateTime.now().withHour(18).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime nextDay9Am() {
		return LocalDateTime.now().plusDays(1).withHour(9).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime nextDay11Am() {
		return LocalDateTime.now().plusDays(1).withHour(11).withMinute(0).withSecond(0).withNano(0);
	}
	
	private LocalDateTime fourDaysLater3pm() {
		return LocalDateTime.now().plusDays(4).withHour(15).withMinute(0).withSecond(0).withNano(0);
	}

	private LocalDateTime sevenDaysLater0am() {
		return LocalDateTime.now().plusDays(7).withHour(0).withMinute(0).withSecond(0).withNano(0);
	}

	private LocalDateTime eightDaysLater0am() {
		return LocalDateTime.now().plusDays(7).withHour(0).withMinute(0).withSecond(0).withNano(0);
	}
	
	public LocalDate getInitialDate() {
		return LocalDate.now().plusDays(1);
	}

	public ScheduleEvent getEvent() {
		return event;
	}

	public void setEvent(ScheduleEvent event) {
		this.event = event;
	}
	
	public void addEvent() {
    	if (event.isAllDay()) {
    		//see https://github.com/primefaces/primefaces/issues/1164
    		if (event.getStartDate().toLocalDate().equals(event.getEndDate().toLocalDate())) {
				event.setEndDate(event.getEndDate().plusDays(1));
			}
		}

		if(event.getId() == null)
			eventModel.addEvent(event);
		else
			eventModel.updateEvent(event);
		
		event = new DefaultScheduleEvent();
	}
	
	public void onEventSelect(SelectEvent<ScheduleEvent> selectEvent) {
		event = selectEvent.getObject();
	}
	
	public void onDateSelect(SelectEvent<LocalDateTime> selectEvent) {
		event = DefaultScheduleEvent.builder().startDate(selectEvent.getObject()).endDate(selectEvent.getObject().plusHours(1)).build();
	}
	
	public void onEventMove(ScheduleEntryMoveEvent event) {
		FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Event moved", "Delta:" + event.getDeltaAsDuration());
		
		addMessage(message);
	}
	
	public void onEventResize(ScheduleEntryResizeEvent event) {
		FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Event resized", "Start-Delta:" + event.getDeltaStartAsDuration() + ", End-Delta: " + event.getDeltaEndAsDuration());
		
		addMessage(message);
	}
	
	private void addMessage(FacesMessage message) {
		FacesContext.getCurrentInstance().addMessage(null, message);
	}

	public boolean isShowWeekends() {
		return showWeekends;
	}

	public void setShowWeekends(boolean showWeekends) {
		this.showWeekends = showWeekends;
	}

	public boolean isTooltip() {
		return tooltip;
	}

	public void setTooltip(boolean tooltip) {
		this.tooltip = tooltip;
	}

	public boolean isAllDaySlot() {
		return allDaySlot;
	}

	public void setAllDaySlot(boolean allDaySlot) {
		this.allDaySlot = allDaySlot;
	}

	public String getTimeFormat() {
		return timeFormat;
	}

	public void setTimeFormat(String timeFormat) {
		this.timeFormat = timeFormat;
	}

	public String getSlotDuration() {
		return slotDuration;
	}

	public void setSlotDuration(String slotDuration) {
		this.slotDuration = slotDuration;
	}

	public String getSlotLabelInterval() {
		return slotLabelInterval;
	}

	public void setSlotLabelInterval(String slotLabelInterval) {
		this.slotLabelInterval = slotLabelInterval;
	}

	public String getScrollTime() {
		return scrollTime;
	}

	public void setScrollTime(String scrollTime) {
		this.scrollTime = scrollTime;
	}

	public String getMinTime() {
		return minTime;
	}

	public void setMinTime(String minTime) {
		this.minTime = minTime;
	}

	public String getMaxTime() {
		return maxTime;
	}

	public void setMaxTime(String maxTime) {
		this.maxTime = maxTime;
	}

	public String getLocale() {
		return locale;
	}

	public void setLocale(String locale) {
		this.locale = locale;
	}

	public String getTimeZone() {
		return timeZone;
	}

	public void setTimeZone(String timeZone) {
		this.timeZone = timeZone;
	}

	public String getClientTimeZone() {
		return clientTimeZone;
	}

	public void setClientTimeZone(String clientTimeZone) {
		this.clientTimeZone = clientTimeZone;
	}

	public String getColumnHeaderFormat() {
		return columnHeaderFormat;
	}

	public void setColumnHeaderFormat(String columnHeaderFormat) {
		this.columnHeaderFormat = columnHeaderFormat;
	}
}

FREE THEMES

Built-in component themes created by the PrimeFaces Theme Designer.

Nova-Light

Nova-Dark

Nova-Colored

Luna-Blue

Luna-Amber

Luna-Green

Luna-Pink

Omega

PREMIUM TEMPLATES

Create awesome applications in no time using the premium templates and impress your users.