Backend Poller

index.js

import { Application } from "backbone.marionette";

import { IndexView } from "./view";
import { UpdateModel } from "./model";

const App = Application.extend({
  channelName: "global",

  region: "#app-root",

  onStart() {
    this.showView(new IndexView({ model: new UpdateModel() }));
  }
});

model.js

import { Model } from "backbone";

export const UpdateModel = Model.extend({
  url: "/application/version/",
  defaults: {
    version: "0.0.0"
  }
});

view.js

import _ from "lodash";
import root from "window-or-global";
import { View } from "backbone.marionette";
import Poller from "backbone-poller";

/**
 * The View that updates your App.
 */
const UpdaterView = View.extend({
  className: "alert alert-info",
  template: _.template(
    'A new update is available. <a class="alert-link" href="">Update Now</a>'
  ),

  ui: {
    refresh: ".alert-link"
  },

  triggers: {
    "click @ui.refresh": "reload:app"
  }
});

export const IndexView = View.extend({
  regions: {
    main: "#main",
    notification: "#notification",
    updater: "#updater"
  },

  childViewEvents: {
    "reload:app": "reload"
  },

  modelEvents: {
    "change:version": "showUpdate"
  },

  initialize() {
    const THIRTY_MINUTES = 1000 * 60 * 30;
    this.poller = Poller.get(this.model, { delay: THIRTY_MINUTES });
  },

  /**
   * Start polling for updates.
   */
  onRender() {
    this.poller.start();
  },

  /**
   * Show the update view when a new version is available.
   */
  showUpdate() {
    this.poller.stop();
    this.showChildView("updater", new UpdaterView());
  },

  /**
   * Reload the main app.
   */
  reload() {
    root.location.reload();
  }
});