Commit 18c8b00b authored by Sylvain Kerkour's avatar Sylvain Kerkour

start merging osw

parent 1e653ff7
// function rot13(s) {
// return (s ? s : this).split('').map(function(_){
// if (!_.match(/[A-Za-z]/)) return _;
// c = Math.floor(_.charCodeAt(0) / 97);
// k = (_.toLowerCase().charCodeAt(0) - 83) % 26 || 26;
// return String.fromCharCode(k + ((c == 0) ? 64 : 96));
// }).join('');
// }
// // document ready
// $(document).ready(function() {
// var previousScroll = 20;
// var minimumScroll = 71;
// // scroll functions
// $(window).scroll(function(e) {
// // add/remove class to navbar when scrolling to hide/show
// var scroll = $(window).scrollTop();
// if (scroll >= previousScroll && scroll >= minimumScroll) {
// $('.navbar').addClass("navbar-hide");
// } else if (scroll < previousScroll) {
// $('.navbar').removeClass("navbar-hide");
// }
// previousScroll = scroll;
// });
// // deofuscate emails
// var emails = document.getElementsByClassName("obfuscated-email");
// if (emails) {
// for (var i = 0; i < emails.length; i += 1) {
// emails[i].innerHTML = rot13(window.obfuscatedEmail);
// }
// }
// // open all external links in new tab
// $(document.links).filter(function() {
// return this.hostname != window.location.hostname;
// }).attr('target', '_blank').attr('rel', 'noopener');
// });
// Setup
window.apiBaseUrl = 'https://shibui.bloom42.com/api';
// window.apiBaseUrl = 'http://localhost:8000/api';
window.shibuiProjectId = 'c2lkOi8vc2hpYnVpL1Byb2plY3QvMQ';
// Functions
function rot13(s) {
return (s ? s : this).split('').map(function(_){
if (!_.match(/[A-Za-z]/)) return _;
......@@ -7,33 +52,73 @@ function rot13(s) {
}).join('');
}
function displayError(message) {
$('#osw-alert').html('<div class="alert alert-danger" role="alert">'
+ message +
'</div>');
$('#osw-alert').show();
}
function displaySuccess(message) {
$('#osw-alert').html('<div class="alert alert-success" role="alert">'
+ message +
'</div>');
$('#osw-alert').show();
}
function hideAlert() {
$('#osw-alert').hide();
}
function hideLoader() {
$('#osw-loader').hide();
}
function showLoader() {
$('#osw-loader').show();
}
function graphqlReq(query, variables) {
var payload = {
query: query,
variables: variables,
};
var data = {
data : JSON.stringify(payload),
contentType : 'application/json',
type : 'POST',
};
return $.ajax(window.apiBaseUrl+'/graphql', data);
}
// document ready
$(document).ready(function() {
var previousScroll = 20;
var minimumScroll = 71;
// scroll functions
$(window).scroll(function(e) {
// add/remove class to navbar when scrolling to hide/show
var scroll = $(window).scrollTop();
if (scroll >= previousScroll && scroll >= minimumScroll) {
$('.navbar').addClass("navbar-hide");
} else if (scroll < previousScroll) {
$('.navbar').removeClass("navbar-hide");
}
previousScroll = scroll;
});
// deofuscate emails
var emails = document.getElementsByClassName("obfuscated-email");
if (emails) {
for (var i = 0; i < emails.length; i += 1) {
emails[i].innerHTML = rot13(window.obfuscatedEmail);
// scroll functions
$(window).scroll(function(e) {
// add/remove class to navbar when scrolling to hide/show
var scroll = $(window).scrollTop();
if (scroll >= previousScroll && scroll >= minimumScroll) {
$('nav').addClass("nav-hide");
} else if (scroll < previousScroll) {
$('nav').removeClass("nav-hide");
}
previousScroll = scroll;
});
// deofuscate emails
var emails = document.getElementsByClassName("obfuscated-email");
if (emails) {
for (var i = 0; i < emails.length; i += 1) {
emails[i].innerHTML = rot13(window.obfuscatedEmail);
}
}
}
// open all external links in new tab
$(document.links).filter(function() {
return this.hostname != window.location.hostname;
}).attr('target', '_blank').attr('rel', 'noopener');
$(document.links).filter(function() {
return this.hostname != window.location.hostname;
}).attr('target', '_blank').attr('rel', 'noopener');
});
@charset "utf-8";
$font-family-serif: "Times New Roman", Times, serif;
// from bootstrap
$font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
$line-height: 150%;
$color-dark: #343a40;
@charset "utf-8";
@import "const.scss";
body {
margin: 0;
font-family: $font-family-serif;
font-size: 21px;
font-weight: 520;
line-height: $line-height;
/* color: #333; */
/* background-color: #f6f6ef; */
}
/* Nav */
nav {
align-items: center;
display: flex;
justify-content: space-between;
background-color: $color-dark;
font-size: 26px;
font-weight: 600;
font-family: $font-family-sans-serif;
// fixed top
position: fixed !important;
top: 0;
right: 0;
left: 0;
z-index: 1030;
// navbar
// position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: justify;
justify-content: space-between;
padding: .5rem 1rem;
}
nav ul {
list-style: none;
padding: 0;
margin: 8px;
}
nav ul li {
display: inline-block;
margin: 0 0.5rem;
}
nav a {
color: yellow !important;
}
main {
/* padding-top: 30px; */
/* padding-bottom: 30px; */
max-width: 960px;
padding-left: 15px;
padding-right: 15px;
justify-content: center !important;
margin: 0 auto;
margin-top: 63px;
text-align: justify !important;
padding-top: 15px;
padding-bottom: 20px;
}
h1, h2, h3, h4, h5, h6 {
font-family: $font-family-sans-serif;
/* font-family: arial, sans-serif; */
/* font-weight: 800; */
word-break: break-word;
color: #000;
font-weight: 800;
text-align: center;
}
a:hover {
text-decoration: underline;
}
a, a:visited {
color: #5522FA;
outline: 0;
text-decoration: none;
/* transition: color 0.25s; */
}
p {
margin: 1rem 0;
}
small {
font-size: 18px;
}
button {
display: inline-block;
font-weight: 400;
color: #212529;
text-align: center;
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
border-top-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
padding: .375rem .75rem;
font-size: 1rem;
line-height: 1.5;
border-radius: .25rem;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
font-family: $font-family-sans-serif;
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
button:hover {
background-color: #0069d9;
border-color: #0062cc;
text-decoration: none;
}
img, video {
max-width: 100%;
height: auto;
}
hr {
margin-top: 1rem;
margin-bottom: 1rem;
border: 0;
border-top: 1px solid rgba(0,0,0,.1);
box-sizing: content-box;
height: 0;
overflow: visible;
}
@media (max-width: 768px) {
body {
font-size: 18px;
}
main {
margin-top: 58px;
}
small {
font-size: 17px;
}
nav {
font-size: 24px;
transition: top 0.5s ease;
}
}
+++
title = "Confirm Subscription"
type = "page"
date = 2019-02-05T01:42:42+02:00
+++
<br />
# Please confirm your email address
<div class="text-left">
<br />
To complete the subscription process, please click the link in the email I just sent you.
If you don't see it within a couple minutes check your spam folder.
<!-- ### 2. Add {{< email >}} to your address book
To help ensure that you get each issue of Open Source Weekly please add my email to your address book.
This is especially true if you use Gmail as it may mark it as spam. -->
<!-- ### 3. Spread the word
When it comes to newsletters, word of mouth is powerful!
-->
Thanks for subscribing! <br/>
Sylvain
</div>
+++
title = "Thank you!"
type = "page"
date = 2019-02-05T01:42:42+02:00
+++
<br />
# Thank you for subscribing!
<div class="text-left">
<br />
<div id="osw-alert"></div>
<div class="spinner-border text-primary" role="status" id="osw-loader">
<span class="sr-only">Loading...</span>
</div>
The next issue will be coming soon, but in the mean time you can check out the **[last issues](/#past-issues)**.
Also, just so you know, you can always click reply to any issue to give feedback or ask questions.
</div>
<script type="application/javascript">
$(document).ready(function() {
var urlParams = new URLSearchParams(window.location.search);
var token = urlParams.get('token');
var contactId = urlParams.get('contact');
if (token == null || contactId == null) {
hideLoader();
displayError('Error confirming your subscription. Please click again on the link provided in the email.');
return;
}
var query = 'mutation($input: VerifyContactInput!) { verifyContact(input: $input) }';
var variables = {
input: {
id: decodeURIComponent(contactId),
token: token,
},
};
graphqlReq(query, variables)
.done(function(data) {
if (data.errors && data.errors.length > 0) {
displayError(data.errors[0].message);
return ;
}
displaySuccess('You are now subscribed to <b>Open Source Weekly</b>');
})
.fail(function() {
displayError('Error confirming your subscription. Please click again on the link provided in the email.');
})
.always(function() {
hideLoader();
})
});
</script>
+++
title = "Thank you!"
type = "page"
date = 2019-02-05T01:42:42+02:00
+++
<br />
# Unsubscribe
<br />
<div id="osw-alert"></div>
<div class="spinner-border text-primary" role="status" style="display: none;" id="osw-loader">
<span class="sr-only">Loading...</span>
</div>
Are you Sure?
<a href="/"><button type="button" class="btn btn-primary">Cancel</button></a>
<button type="button" class="btn btn-danger" id="osw-unsubscribe-btn">Yes, unsubscribe me</button>
<script type="application/javascript">
function unsubscribe() {
hideAlert();
var urlParams = new URLSearchParams(window.location.search);
var token = urlParams.get('token');
var contactId = urlParams.get('contact');
if (token == null || contactId == null) {
hideLoader();
displayError('Error unsuscribing. Please click again on the link provided in the email.');
return;
}
var query = 'mutation($input: UnsubscribeContactInput!) { unsubscribeContact(input: $input) }';
var variables = {
input: {
id: decodeURIComponent(contactId),
token: token,
},
};
graphqlReq(query, variables)
.done(function(data) {
if (data.errors && data.errors.length > 0) {
displayError(data.errors[0].message);
return ;
}
displaySuccess('You no longer will receive our emails. Have a good day!');
})
.fail(function() {
displayError('Error unsuscribing. Please click again on the link provided in the email.');
})
.always(function() {
hideLoader();
})
}
$(document).ready(function() {
hideLoader();
$("#osw-unsubscribe-btn").click(function(e) {
e.preventDefault();
unsubscribe();
});
});
</script>
......@@ -12,6 +12,11 @@
_redirect('fatalentropy.com');
window.obfuscatedEmail = {{ .Site.Params.ObfuscatedEmail | safeHTML }};
</script>
<!-- js -->
<script src="{{ "js/jquery-3.4.1.min.js" | relURL }}"></script>
{{ with resources.Get "js/index.js" | minify }}
<script type="text/javascript">{{ .Content | safeJS }}</script>
{{ end }}
<body>
{{ partial "nav.html" . }}
<!-- Page Header -->
......@@ -37,10 +42,10 @@
{{ partial "footer.html" . }}
</body>
<!-- js -->
<script src="{{ "js/jquery-3.4.1.slim.min.js" | relURL }}"></script>
<!-- <script src="{{ "js/jquery-3.4.1.slim.min.js" | relURL }}"></script>
<script src="{{ "js/popper.min.js" | relURL }}"></script>
<script src="{{ "js/bootstrap.min.js" | relURL }}"></script>
{{ with resources.Get "js/index.js" | minify }}
<script type="text/javascript">{{ .Content | safeJS }}</script>
{{ end }}
{{ end }} -->
</html>
......@@ -7,8 +7,12 @@
</div>
</div>
<div class="container">
<div class="row d-flex justify-content-center">
<div>
{{ partial "subscribe.html" . }}
</div>
<div class="col-md-10 col-12">
<div class="mt-3">
......
......@@ -47,8 +47,11 @@
<!-- css -->
<link rel="stylesheet" href="{{ "css/bootstrap.min.css" | relURL }}">
<style>
{{ with resources.Get "sass/style.scss" | toCSS | minify }}
{{ .Content | safeCSS }}
{{ end }}
{{ with resources.Get "sass/theme.scss" | toCSS | minify }}
{{ .Content | safeCSS }}
{{ end }}
{{ with resources.Get "sass/style.scss" | toCSS | minify }}
{{ .Content | safeCSS }}
{{ end }}
</style>
</head>
<div class="subscribe">
<div>
<noscript>
<strong>We're sorry but Fatal Entropy doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="osw-alert"></div>
<div class="spinner-border text-primary" role="status" style="display: none;" id="osw-loader">
<span class="sr-only">Loading...</span>
</div>
<form class="form-row">
<div class="form-group col-9 blm-email-input-col">
<input type="email" class="form-control" id="osw-subscribe-email-input" aria-describedby="emailHelp" placeholder="[email protected]">
</div>
<div class="form-group col-3">
<button id="osw-subscribe-button-input">Subscribe</button>
</div>
<small class="form-text text-muted">We hate spam even more than you do.
We'll never share your email and you can unsubscribe at anytime. Also there is no tracking or ads.
</small>
</form>
<p>
<small>
Prefer <b>RSS</b>? <a href='{{ "index.xml" | absURL }}'>Use this URL in your favorite RSS reader</a>.
</small>
</p>
</div>
</div>
<script type="application/javascript">
function subscribeToNewsletter(email) {
showLoader();
hideAlert();
var query = 'mutation($input: SubscribeContactInput!) { subscribeContact(input: $input) }';
var variables = {
input: {
projectId: window.shibuiProjectId,
email: email,
},
};
graphqlReq(query, variables)
.done(function(data) {
if (data.errors && data.errors.length > 0) {
displayError(data.errors[0].message);
return ;
}
window.location.href = '/confirm';
})
.fail(function() {
displayError('Error subscribing. Please try again.');
})
.always(function() {
hideLoader();
})
}
$(document).ready(function() {
hideLoader();
$("#osw-subscribe-button-input").click(function(e) {
e.preventDefault();
subscribeToNewsletter($('#osw-subscribe-email-input').val());
});
});
</script>
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment