Использование удивительной библиотеки moment.js :
function humanizeDuration(input, units ) {
// units is a string with possible values of y, M, w, d, h, m, s, ms
var duration = moment().startOf('day').add(units, input),
format = "";
if(duration.hour() > 0){ format += "H [hours] "; }
if(duration.minute() > 0){ format += "m [minutes] "; }
format += " s [seconds]";
return duration.format(format);
}
Это позволяет указать любую продолжительность - часы, минуты, секунды, мельницы и возвращает читаемый человеком версия.
Для этого вы можете использовать @Push
и <f:websocket>
. Ниже приведен пример запуска, который обновляет таблицу данных при событии, запущенном бэкэндом.
<h:dataTable id="notifications" value="#{bean.notifications}" var="notification">
<h:column>#{notification.message}</h:column>
</h:dataTable>
<h:form>
<f:websocket channel="push">
<f:ajax event="updateNotifications" render=":notifications" />
</f:websocket>
</h:form>
@Named @ApplicationScoped
public class Bean {
private List<Notification> notifications;
@Inject
private NotificationService service;
@Inject @Push
private PushContext push;
@PostConstruct
public void load() {
notifications = service.list();
}
public void onNewNotification(@Observes Notification newNotification) {
notifications.add(0, newNotification);
push.send("updateNotifications");
}
public List<Notification> getNotifications() {
return notifications;
}
}
@Stateless
public class NotificationService {
@Inject
private EntityManager entityManager;
@Inject
private BeanManager beanManager;
public void create(String message) {
Notification newNotification = new Notification();
newNotification.setMessage(message);
entityManager.persist(newNotification);
beanManager.fireEvent(newNotification);
}
public List<Notification> list() {
return entityManager
.createNamedQuery("Notification.list", Notification.class)
.getResultList();
}
}
Если вы еще не находитесь в JSF 2.3, вам нужно перейти в сторонние библиотеки JSF.
<o:socket>
(JSR356 WebSocket + CDI) <p:socket>
(Атмосфера) Отмечено, что <o:socket>
является основой для JSF 2.3 <f:websocket>
]. Итак, если вы нашли много общего, то это правильно.
PrimeFaces использует Атмосфера под капюшонами (что неудобно для настройки без Maven). Атмосфера поддерживает websockets с возвратом SSE и длительным опросом. ICEfaces основан на древней методике длинного опроса . Все они не реализуют собственный API-интерфейс JSR356 WebSocket, который был позже представлен в Java EE 7.
OmniFaces использует собственный API-интерфейс JSR356 WebSocket (поддерживается на всех серверах Java EE 7 и Tomcat 7.0.27+). Поэтому он также очень прост в настройке и использовании (один JAR, один параметр контекста, один тег и одна аннотация). Для этого требуется только CDI (не сложно установить на Tomcat ), но он позволяет вам даже нажать от артефакта не-JSF (например, @WebServlet
). В целях безопасности и безопасности JSF, он поддерживает только односторонний push (от сервера к клиенту), а не наоборот. Для этого вы можете использовать JSF ajax обычным способом. JSF 2.3 <f:websocket>
в значительной степени основан на OmniFaces <o:socket>
, поэтому вы найдете много сходства в своих API-интерфейсах ( JSF - OmniFaces ).
Кроме того, вы можете использовать опрос вместо нажатия. Практически каждая библиотека компонентов JSF, поддерживающая ajax, имеет компонент <xxx:poll>
, такой как PrimeFaces с <p:poll>
. Это позволяет отправлять exery X секунд запрос ajax на сервер и обновлять контент, когда это необходимо.
Вы можете посмотреть Seam (см. в этой статье для обсуждения использования Seam с JSF и AJAX).
Когда я использовал Судя по всему, в последний раз это было довольно медленно. Возможно, вы захотите создать свой собственный компонент JSF, который генерирует JavaScript (например, используя jQuery, как описано в в этой статье ).
Простейшим для вас может быть введение компонента «poll» библиотеки ajax4jsf: https://ajax4jsf.dev.java.net/nonav/documentation/ajax-documentation/entire.html#d0e1955
Это не потребует реконфигурации приложения и больших изменений на странице JSF (добавление компонента a4j: poll добавлено)
Он работал очень хорошо в нескольких моих проектах.
Если вам нужны полнофункциональные обновления Comet (обратная Ajax) и т. д., то стоит посмотреть на библиотеку DWR .