Use Appointments app integration 🇬🇧

SergeyMosin / Appointments is an app for Nextcloud to manage appointments.

Variables

• <PROVIDED_EMBEDDABLE_URL> is the provided embeddable url from Appointment app in Nextcloud.
• <PATH_TO_NEXTCLOUD_DIRECTORY> is the path to Nextcloud on the server, something like /var/www/html/nextcloud
• <Nextcloud_username> is the username of the user who create the appointment (it must be lowercase).
• <MY_DESTINATION_DOMMAIN.COM> the domain URL of the destination page.
• <PAGE_PATH> is the path to the page which contains the iframe, if it’s the main page remove it.

In the destination page source code

Insert the iframe tag in the destination page.

<iframe id="myAppointmentFrame" title="Appointment form" frameborder="0" style="height: 100rem; width: 100%;" src=
"<PROVIDED_EMBEDDABLE_URL>" name="myAppointmentFrame"></iframe>

If id is changed, it must be changed in the script.

On the server

Set allowed Frame Ancestor Domain.

sudo -u www-data php /<PATH_TO_NEXTCLOUD_DIRECTORY>/occ config:app:set appointments "emb_afad_<Nextcloud_username>" --value "https://<MY_DESTINATION_DOMMAIN.COM>"

Set base URL for the destination page URL.

sudo -u www-data php /<PATH_TO_NEXTCLOUD_DIRECTORY>/occ config:app:set appointments "emb_cncf_<Nextcloud_username>" --value "https://<MY_DESTINATION_DOMMAIN.COM>/<PAGE_PATH>/?apphash="

If apphash is renamed, it must be changed in the script.

In the destination page source code

Insert the script tag in head tag of the destination page source code.

<script type="text/javascript" async="async">

var urlRDV = window.location.href.includes('<PAGE_PATH>');

if (urlRDV) {
  window.addEventListener('DOMContentLoaded', function() {
    var src = "<PROVIDED_EMBEDDABLE_URL>";
    var appointmentParam = "apphash"

    function getUrlVars() {
      var vars = {};
      var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
      });
      return vars;
    };

    var params = getUrlVars();
    var apphash = params[appointmentParam];
    var paramsConcat = Object.entries(params).reduce(function (prev, curr) {
      if (curr[0] === appointmentParam) {
        return prev;
      }
      prev = prev.concat("&",curr[0].toString(),"=",curr[1].toString());
      return prev;
    }, "");

    if (apphash) {
      src = src.slice(0, -4).concat('cncf?d=').concat(apphash,paramsConcat);
     }

    var myIframe = document.getElementById('myAppointmentFrame');
    myIframe.src=src;
  })();
}

</script>