Dismiss announcements with cookies that expire
This commit is contained in:
parent
3a61d4ccc6
commit
352e6d3fc0
|
@ -66,4 +66,3 @@ export const DEFAULT_PAGE_SIZE = 50;
|
|||
|
||||
export const LOCAL_STORAGE_KEY = 'dictionary';
|
||||
export const SETTINGS_KEY = 'settings';
|
||||
export const DISMISSED_ANNOUNCEMENTS_KEY = 'dismissedAnnouncements';
|
||||
|
|
|
@ -1,21 +1,20 @@
|
|||
import { DISMISSED_ANNOUNCEMENTS_KEY } from "../constants";
|
||||
import { fadeOutElement } from "./utilities";
|
||||
import { setCookie, getCookie } from "./StackOverflow/cookie";
|
||||
|
||||
export function getDismissed() {
|
||||
let dismissed = window.localStorage.getItem(DISMISSED_ANNOUNCEMENTS_KEY);
|
||||
if (!dismissed) {
|
||||
dismissed = [];
|
||||
} else {
|
||||
dismissed = JSON.parse(dismissed);
|
||||
}
|
||||
return dismissed;
|
||||
export function isDismissed(announcementId) {
|
||||
let dismissed = getCookie(announcementId);
|
||||
|
||||
return dismissed === 'dismissed';
|
||||
}
|
||||
|
||||
export function dismiss(announcement) {
|
||||
if (announcement.id) {
|
||||
const dismissed = getDismissed();
|
||||
dismissed.push(announcement.id);
|
||||
window.localStorage.setItem(DISMISSED_ANNOUNCEMENTS_KEY, JSON.stringify(dismissed));
|
||||
const expireDate = announcement.dataset.expires;
|
||||
const now = new Date();
|
||||
const expire = new Date(expireDate);
|
||||
const timeDiff = Math.abs(now.getTime() - expire.getTime());
|
||||
const dayDifference = Math.ceil(timeDiff / (1000 * 3600 * 24));
|
||||
setCookie(announcement.id, 'dismissed', dayDifference + 1);
|
||||
}
|
||||
fadeOutElement(announcement)
|
||||
}
|
||||
|
|
|
@ -11,7 +11,7 @@ import { showSearchModal, clearSearchText, checkAllPartsOfSpeechFilters, uncheck
|
|||
import helpFile from '../markdown/help.md';
|
||||
import termsFile from '../markdown/terms.md';
|
||||
import privacyFile from '../markdown/privacy.md';
|
||||
import { dismiss, getDismissed } from './announcements';
|
||||
import { dismiss, isDismissed } from './announcements';
|
||||
import { fadeOutElement } from './utilities';
|
||||
|
||||
export default function setupListeners() {
|
||||
|
@ -39,9 +39,8 @@ export function setupHeaderButtons() {
|
|||
|
||||
function setupAnnouncements() {
|
||||
const announcements = document.querySelectorAll('.announcement');
|
||||
const dismissed = getDismissed();
|
||||
Array.from(announcements).forEach(announcement => {
|
||||
if (announcement.id && dismissed.includes(announcement.id)) {
|
||||
if (announcement.id && isDismissed(announcement.id)) {
|
||||
fadeOutElement(announcement);
|
||||
} else {
|
||||
announcement.querySelector('.close-button').addEventListener('click', () => dismiss(announcement));
|
||||
|
|
|
@ -75,7 +75,7 @@ switch ($view) {
|
|||
foreach ($announcements as $announcement) {
|
||||
$expire = strtotime($announcement['expire']);
|
||||
if (time() < $expire) {
|
||||
$announcements_html .= '<article class="announcement"' . (isset($announcement['dismissId']) ? ' id="announcement-' . $announcement['dismissId'] . '"' : '') . '>
|
||||
$announcements_html .= '<article class="announcement"' . (isset($announcement['dismissId']) ? ' id="announcement-' . $announcement['dismissId'] . '"' : '') . ' data-expires="' . $announcement['expire'] . '">
|
||||
<a class="close-button" title="Dismiss Announcement">×︎</a>
|
||||
<h4>' . $announcement['header'] . '</h4>
|
||||
' . $announcement['body'] . '
|
||||
|
|
Loading…
Reference in New Issue