Configuring the widget

Boxoffice is split into two parts, the server/backend app that has the admin dashboard + API, and the frontend javascript ticketing widget that's embeddable on websites.

Embedding the widget

You need a DOM element with the id boxoffice-widget in your page. This where you widget will be loaded. You can have a loading indicator/placeholder inside the element (which will be replaced once the widget loads)

<div id="boxoffice-widget"><p class="text-center regular col-sm-8 col-sm-offset-2 col-xs-12">Loading...</p></div>

Then add this init code in your page. (This assumes you have jQuery version 2.2 or above and font-awesome available).

$(document).ready(function() {
  var boxofficeUrl = "https://boxoffice.hasgeek.com";

  $.get({
    url: boxofficeUrl + "/api/1/boxoffice.js",   
    crossDomain: true,
    timeout: 8000,
    retries: 5,
    retryInterval: 8000,
    success: function (data) {
      var boxofficeScript = document.createElement('script');
      boxofficeScript.innerHTML = data.script;
      document.getElementsByTagName('body')[0].appendChild(boxofficeScript);
      window.Boxoffice.init({
        org: '', // Organisation to show
        itemCollection: '', // ItemCollection ID to show
        paymentDesc: '' // Description for payments widget
      });
    },
    error: function (response) {
      var ajaxLoad = this;
      ajaxLoad.retries -= 1;
      var errorMsg;
      if (response.readyState === 4) {
        errorMsg = "Server error, please try again later.";
        $('#boxoffice-widget p').html(errorMsg);
      } else if (response.readyState === 0) {
        if (ajaxLoad.retries < 0) {
          if(!navigator.onLine) {
            errorMsg = "Unable to connect. There is no network!";
            $('#boxoffice-widget p').html(errorMsg);
          } else {
            errorMsg = "Unable to connect. If you are behind a firewall or using any script blocking extension (like Privacy Badger). Please ensure your browser can load boxoffice.hasgeek.com, api.razorpay.com and checkout.razorpay.com .";
            $('#boxoffice-widget p').html(errorMsg);
          }
        } else {
          setTimeout(function() {
            $.get(ajaxLoad);
          }, ajaxLoad.retryInterval);
        }
      }
    }
  });
});