https://virtualcareontario.ca/media/riot_tags/popup_9Ay5nw22_wQhb9wd_gcxcLjh_PrvWZcn.tag

1<ads-popup>
2  <div if={ isPopupVisible } class="popup-overlay">
3    <div class="popup-container">
4      <h2 class="popup-title"> <raw content={title} /> </h2>
5      <p class="popup-description"> <raw content={description} /> </p>
6
7      <div class="popup-language-link">
8        <a href="#" onclick={ handleLanguageToggle }>
9          { isFrench
10            ? "If you don't speak French, click here to switch back to English"
11            : "Si vous êtes francophone, veuillez cliquer ici" }
12        </a>
13      </div>
14
15      <div class="popup-actions">
16        <button class="btn btn_primary" onclick={ closePopup }>
17          { isFrench ? "D'accord" : "Okay" }
18        </button>
19      </div>
20    </div>
21  </div>
22
23  <script>
24    const controller = this;
25    const COOKIE_NAME = "popupDismissed";
26    const COOKIE_EXPIRY_DAYS = 7;
27
28    const currentUrl = new URL(window.location.href);
29
30    controller.isFrench = currentLanguage === "fr";
31    controller.isPopupVisible = !getCookie(COOKIE_NAME);
32
33    controller.title = controller.isFrench
34      ? "Bienvenue à la Clinique de soins virtuels de la région de l'Est (CSVRE – Région de l'Est) !"
35      : "Welcome to the East Region Virtual Care Clinic (ERVCC - East Region)!";
36
37    controller.description = controller.isFrench
38      ? "Merci de votre visite. Veuillez suivre les instructions pour remplir le formulaire d'admission de la CSVRE afin que nous puissions mieux comprendre vos besoins en matière de soins. Ce formulaire est obligatoire pour prendre rendez-vous à notre clinique.<br>Si vous <b>n'avez pas de médecin de famille ou d'infirmière praticienne actuellement</b>, nous vous encourageons à vous <b>inscrire</b> à <a href='https://www.ontario.ca/page/find-family-doctor-or-nurse-practitioner' target='_blank' rel='noopener noreferrer'>Accès Soins</a> <b>ou appelez le 1-888-684-1999</b> un programme gratuit du ministère de la Santé et des Soins de longue durée de l'Ontario (MSSLD) qui aide les personnes sans médecin de famille à en trouver un dans leur communauté.<br>Vous devez être sur la liste <b>d'attente de Accès Soins</b> pour être placé en ligne pour un fournisseur de soins primaires."
39      : "Thank you for visiting. Please follow the prompts to complete the <b>ERVCC Intake Form</b> so we can better understand your care needs. Completing the Intake Form is required to schedule an appointment with our clinic.<br>If you <b>do not currently have a family doctor or nurse practitioner</b>, we encourage you to <b>register with</b> <a href='https://www.ontario.ca/page/find-family-doctor-or-nurse-practitioner' target='_blank' rel='noopener noreferrer'>Health Care Connect</a> <b>or call 1-888-684-1999</b> — a free program from the Ontario Ministry of Health and Long-Term Care (MOHLTC) that helps people without a primary care provider find one in their community.<br>You <b>must be on the Health Care Connect wait list</b> to be placed in line for a Primary Care Provider.";
40
41    this.on('mount', () => {
42      setTimeout(() => {
43        controller.isPopupVisible = true;
44        controller.update();
45      }, 1000);
46    });
47
48    controller.closePopup = () => {
49      controller.isPopupVisible = false;
50      setCookie(COOKIE_NAME, "true", COOKIE_EXPIRY_DAYS);
51      controller.update();
52    };
53
54    controller.handleLanguageToggle = (e) => {
55      e.preventDefault();
56
57      const currentLang = getCookie("cortico_lang");
58
59      if (currentLang === "fr") {
60        // Switch to English by deleting the cookie
61        deleteCookie("cortico_lang");
62      } else {
63        // Switch to French
64        setCookie("cortico_lang", "fr", 7);
65      }
66
67      deleteCookie(COOKIE_NAME);
68      window.location.reload();
69    };
70
71    function setCookie(name, value, days) {
72      const date = new Date();
73      date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
74      document.cookie = `${name}=${value}; expires=${date.toUTCString()}; path=/`;
75    }
76
77    function getCookie(name) {
78      const cookies = document.cookie.split('; ');
79      for (let cookie of cookies) {
80        let [cookieName, cookieValue] = cookie.split('=');
81        if (cookieName === name) {
82          return cookieValue;
83        }
84      }
85      return null;
86    }
87
88    function deleteCookie(name) {
89      document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
90    }
91  </script>
92
93  <style>
94    .popup-overlay {
95      position: fixed;
96      top: 0;
97      left: 0;
98      width: 100%;
99      height: 100%;
100      background: rgba(0, 0, 0, 0.5);
101      display: flex;
102      justify-content: center;
103      align-items: center;
104      z-index: 9999;
105    }
106
107    .popup-container {
108      background: white;
109      padding: 20px;
110      border-radius: 8px;
111      width: 100%;
112      max-width: 500px;
113      text-align: center;
114      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
115    }
116
117    .popup-title {
118      font-size: 1.2em;
119      margin-bottom: 10px;
120      color: #333;
121    }
122
123    .popup-description {
124      font-size: 1em;
125      margin-bottom: 20px;
126      color: #555;
127    }
128
129    .popup-actions {
130      display: flex;
131      justify-content: center;
132    }
133
134    .popup-actions button {
135      width: 150px;
136    }
137
138    .popup-language-link {
139      margin: 1em;
140    }
141
142    ads-popup a {
143      text-decoration: underline;
144      font-size: 0.95em;
145    }
146  </style>
147</ads-popup>