Skip to content

Commit 0e23f43

Browse files
authored
Merge pull request #339 from sjrd/scam-alert-banner
Add scam banner.
2 parents d8e91cd + e158cfa commit 0e23f43

File tree

6 files changed

+126
-2
lines changed

6 files changed

+126
-2
lines changed

_data/messages.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
scam-banner: "**⚠️ Beware of Scams**: since Feb 2024, scammers are using [fake Scala websites to sell courses](https://www.scala-lang.org/blog/2024/03/01/fake-scala-courses.html), please check you are using an official source."

_includes/alert-banner.html

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{% comment %}use the variable 'message' to include markdown text to display in the alert.{% endcomment %}
2+
3+
<header id="site-header" class="header-home">
4+
<div class="alert-warning" data-message_id="{{include.message_id}}">
5+
<p>{{include.message|markdownify}}</p>
6+
<span class="hide-with-preference"><i class="fa fa-close"></i></span>
7+
</div>
8+
</header>

_layouts/default.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@
55

66
<body>
77

8+
{% include alert-banner.html message=site.data.messages.scam-banner message_id='scam-courses-feb-2024' %}
9+
810
<div id="wrap">
911
{% include navbar.html %}
1012
<div id="main" class="container clear-top">
@@ -17,5 +19,3 @@
1719
</body>
1820

1921
</html>
20-
21-

_layouts/frontpage.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
{% include head.html %}
55

66
<body class="home">
7+
{% include alert-banner.html message=site.data.messages.scam-banner message_id='scam-courses-feb-2024' %}
78
<div id="wrap">
89
<div id="main">
910
<div class="splash">

resources/css/main.scss

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,10 @@ $grey-color-light: lighten($grey-color, 40%);
3434
$grey-color-medium: lighten($grey-color, 7%);
3535
$grey-color-dark: darken($grey-color, 25%);
3636

37+
$warning-bg: #ffa500;
38+
$warning-link: #185eb3;
39+
$warning-text: #000;
40+
3741
// Width of the content area
3842
$content-width: 800px;
3943

@@ -53,6 +57,53 @@ $fa-font-path: "./../../bower_components/font-awesome/fonts";
5357
// Import partials from `sass_dir` (defaults to `_sass`)
5458
@import "base";
5559

60+
#site-header {
61+
background: $gray-darker;
62+
.alert-warning {
63+
text-align: center;
64+
padding: 8px 0;
65+
/*transition: $base-transition;*/
66+
position: relative;
67+
font-size: 16px;
68+
/*@include bp(medium) {
69+
padding: 10px 40px;
70+
}*/
71+
72+
background: $warning-bg;
73+
color: $warning-text;
74+
75+
a {
76+
color: $warning-link;
77+
font-weight: bold;
78+
text-decoration: underline;
79+
80+
&:active,
81+
&:focus,
82+
&:hover {
83+
text-decoration: none;
84+
}
85+
}
86+
87+
p {
88+
margin: 0;
89+
}
90+
91+
span {
92+
position: absolute;
93+
right: 20px;
94+
top: 3px;
95+
z-index: 1;
96+
cursor: pointer;
97+
font-size: 22px;
98+
opacity: 0.6;
99+
/*transition: $base-transition;*/
100+
&:hover {
101+
opacity: 1;
102+
}
103+
}
104+
}
105+
}
106+
56107
.home #main {
57108
overflow-x: hidden;
58109
}

resources/js/main.js

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,20 @@
55
* Document initialization
66
**************************/
77

8+
// Browser Storage Support (https://stackoverflow.com/a/41462752/2538602)
9+
function storageAvailable(type) {
10+
try {
11+
var storage = window[type],
12+
x = '__storage_test__';
13+
storage.setItem(x, x);
14+
storage.removeItem(x);
15+
return true;
16+
}
17+
catch (e) {
18+
return false;
19+
}
20+
}
21+
822
$(document).ready(function(){
923
/* SEARCH FUNCTIONALITY */
1024
var search = $('.search input');
@@ -83,4 +97,53 @@ $(document).ready(function(){
8397
}
8498
$('#modal-description').modal('hide');
8599
});
100+
101+
// --- Preferences stored in localStorage ---
102+
103+
const Storage = (namespace) => {
104+
return ({
105+
getPreference(key, defaultValue) {
106+
const res = localStorage.getItem(`${namespace}.${key}`);
107+
return res === null ? defaultValue : res;
108+
},
109+
setPreference(key, value, onChange) {
110+
const old = this.getPreference(key, null);
111+
if (old !== value) { // activate effect only if value changed.
112+
localStorage.setItem(`${namespace}.${key}`, value);
113+
onChange(old);
114+
}
115+
}
116+
});
117+
};
118+
119+
function setupAlertCancel(alert, storage) {
120+
const messageId = alert.data('message_id');
121+
let onHide = () => {};
122+
if (messageId) {
123+
const key = `alert.${messageId}`;
124+
const isHidden = storage.getPreference(key, 'show') === 'hidden';
125+
if (isHidden) {
126+
alert.hide();
127+
}
128+
onHide = () => storage.setPreference(key, 'hidden', _ => {});
129+
}
130+
131+
132+
alert.find('.hide-with-preference').click(function() {
133+
alert.hide(), onHide();
134+
});
135+
}
136+
137+
function setupAllAlertCancels(storage) {
138+
var alertBanners = $(".alert-warning");
139+
if (alertBanners.length) {
140+
setupAlertCancel(alertBanners, storage);
141+
}
142+
}
143+
144+
if (storageAvailable('localStorage')) {
145+
const PreferenceStorage = Storage('ch.epfl.scala.preferences');
146+
setupAllAlertCancels(PreferenceStorage);
147+
}
148+
86149
});

0 commit comments

Comments
 (0)