Screenshot

• This component is supposed to be shown after page load until a given date
• The user can stop this component from being shown by ticking a checkbox
• The information if it should be shown or not is stored in a cookie
• Multiple periods can be specified

Notes

• this component comes with predefined title and body text
• maximal 1 instance is supported

API

The API of ewc-dialog applies to this element as well, because this element derives from ewc-dialog.

Additionally, there are the following attribs:

• configUrl - URL to a raw text file containing a JSON string
• configString - config as a JSON string
  • Note: configString has precedence in case both are given
• titleText - a string. Default: "Your feedback wanted"
• messageHtml - a string containing html markup. Also has a default.

Note: The attribs are applied only initially - changing them at runtime has no effect.

config string example

{
  "cookieName": "eurostat-dashboards-survey",
  "cookiePath": "/eurostat/cache",
  "participationUrl": "https://ec.europa.eu/eusurvey/runner/dashboards_feedback",
  "activationPeriods": [
    {
      "activeFrom": "2024-10-18 10:00",
      "activeUntil": "2024-10-24 14:00",
      "cookieExpiryDate": "2024-10-25"
    },
    {
      "activeFrom": "2024-11-20 10:00",
      "activeUntil": "2024-11-26 14:00",
      "cookieExpiryDate": "2024-11-27"
    },
    {
      "activeFrom": "2024-12-18 10:00",
      "activeUntil": "2024-12-24 14:00",
      "cookieExpiryDate": "2024-12-25"
    }
  ]
}

Note: the user has to make sure the cookie expiry date of one period lies before the start of the next period

Usage with WebPack

package.json

"dependencies": {
  "@ewc-lib/ewc-dialog-feedback": "^SOMEVERSION"
},

main.js

import "@ewc-lib/ewc-dialog-feedback"

index.html

<ewc-dialog-feedback
  configUrl="https://ec.europa.eu/eurostat/cache/dashboard/_configuration/survey-popup-settings.json"
</ewc-dialog-feedback>