API: web integration and customisation

API: web integration and customisation

Introduction

The term web API refers to several modules which can be integrated to a webpage to display web widgets featuring:

  • The library's real-time occupancy (occupancy rate or waiting time)
  • The establishment's opening hours



Example of an integrated API displaying the library's real-time occupancy
and opening hours (source: CHUV - BiUM)


These web APIs are automatically refreshed every 5 minutes.
Their design is responsive: they are adapted to the elements which integrate them for a comfortable display on any device.


Integration

HTML Tags

These web APIs are composed of two main HTML tags which can be simply and quickly integrated on a webpage :

  • A <script> tag enabling to load the JavaScript code able to run the module.
    • This tag has to be integrated in the website code between the <head> tags.
    • There is a specific <script> tag for each module displayed (occupancy rate, opening hours, waiting time).
  • A display tag which will vary according to the information displayed: occupancy rate, opening hours or waiting time.
    • This tag has to be integrated in the webpage code where the WebAPI will be displayed.

These snippets of HTML code can be retrieved from the API menu in the Affluences admin dashboard, under Administration.


It is possible to integrate these web APIs into a mobile application as soon as the application is able to display a WebView (see existing iOS or Android documentation).


Sample code

Here is how a sample code to display the occupancy rate widget would look like.

  
    
   
  1. <html>
    2. 
   
  2.     <head>
    3. 
   
  3.         <script charset="UTF-8" src="https://webapi.affluences.com/js/webapi_latest.min.js%22></script>
    4. 
   
  4.     </head>
    5. 
   
  5.     <body>
    6. 
   
  6.         <div class="affluences-counter" data-token="TST0T0t0TT0TTT"></div>
    7. 
   
  7.     </body>
    8. 
   
  8.  </html>
    9.

Customisation

WebAPIs can be customised by adding attributes in the <div> tag.
The table below summarises the different available attributes and their possible values.

WebAPI

Attribute

Possible values

Description

Opening hours

data-hide-navigation

true, false

Enables to hide the lateral buttons which would help the user to go from one week to another

days-number

whole numbers ranging from 1 to 7

Enables to display only a certain number of days in the week

lang

eng, deu

Enables to change the language displayed (which is French by default)

Real time occupancy or waiting time

forecasts-count

whole numbers ranging from 1 to 5

Enables to display the forecasts of the following time slots (1 to 5 slots possible) (see below)

greyscale ou grayscale

true, false

Enables to switch to a grayscale display

lang

de, en, es, fr, it

Enables to switch from French (by default) to another language

data-title-override

character string

Enables to change the mention displayed over the widget (by default, the name of the institution in the Affluences Admin dashboard).



Example of a customised waiting time WebAPI
with the forecast-count and data-title-override attributes.

    • Related Articles

    • Integration of existing counting data with Affluences' software connector

      Aim The Affluences tool is designed to be simple, modular and intelligent. Our vision is to provide a single management tool, bringing together data from different systems. The integration of existing systems is part of the Affluence DNA. Many of our ...

    • API Interfacing – LDAP Directory Verification

      Presentation  In order to verify the existence of a user, we can interface with an API that informs us on the validity of the given email address. To do so, we interrogate a web service HTTP(S) in POST with a “X-Token” header, to only authorise our ...

    • Administration

      The Administration tab allows you to easily manage information regarding your institution. Managing information In the Profile information section, you can fill in all the information about your institution: Required information: name of the ...

    • Using booking URLs on your website

      On your website, you can easily redirect your users by giving them the URL of your booking page. Below are some specific examples of how you can display or link to your resources directly on your website. Display a specific resource by filtering on a ...

    • Settings

      Contact information In order to efficiently process requests, Affluences would like to be able to identify the role of the different people in your institution for optimal assistance. This information is confidential and used only for operational ...