web advent calendar

A dynamic php based advent calendar which can be easily configured via a json-config file

Configuration

There are two different and identical configuration files. One is the "calendar_prod.json" which is loaded by default and the other is the "calendar_dev.json" which is only loaded in development mode

Enable development-mode:

Add the following switch at the end of the URL of the web application to activate the deverlopmend mode

/index.php?dev=1

The application now reads the config file "calendar_dev.json" and unlocks all doors because the values unlockDate in this file are in the past.

Configuration parameter

Set configuration parameters for the calendar:

...
"config": {
    "calendarWidth": "472",
    "calendarHeight": "827",
    "useModal": "true",
    "showExtras": "true",
    "enableSnow": "true"
  },
...

Modify entries for the individual days

...
"entries": [
    {
      "unlockDate": "2020-12-19",
      "doorWidth": "118",
      "doorHeight": "118",
      "positionTop": "0",
      "positionLeft": "0",
      "doorImageLeft": "images/19.png",
      "backgroundImage": "images/background1x1.png",
      "url": "adv19"
    },
    ...
]
...

Browser support

Unfortunately, older versions of Internet Explorer do not support CSS3 that well. The example calendar uses a fallback where the calendar doors are just hidden on hover.