app-MAIL-temp/templates/footer.html

141 lines
4.8 KiB
HTML

<footer class="footer">
<div class="container">
<div class="row align-items-center flex-row-reverse">
<div class="col-auto ml-lg-auto">
<div class="row align-items-center">
<div class="col-auto">
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item"><a href="https://trello.com/b/4d6A69I4/open-roadmap" target="_blank" rel="noopener">
Roadmap <i class="fe fe-external-link"></i>
</a></li>
<li class="list-inline-item">
<a href="https://addons.mozilla.org/firefox/addon/simplelogin/" target="_blank" rel="noopener">
Firefox Add-on<i class="fe fe-external-link"></i>
</a>
</li>
<li class="list-inline-item">
<a href="https://chrome.google.com/webstore/detail/dphilobhebphkdjbpfohgikllaljmgbn" target="_blank" rel="noopener">
Chrome Extension<i class="fe fe-external-link"></i>
</a>
</li>
<li class="list-inline-item">
<a href="https://apps.apple.com/app/id1494359858" target="_blank" rel="noopener">
App Store<i class="fe fe-external-link"></i>
</a>
</li>
<li class="list-inline-item">
<a href="https://play.google.com/store/apps/details?id=io.simplelogin.android" target="_blank" rel="noopener">
Play Store<i class="fe fe-external-link"></i>
</a>
</li>
<li class="list-inline-item"><a href="{{STATUS_PAGE_URL}}" target="_blank" rel="noopener">
Status <i class="fe fe-external-link"></i>
</a></li>
<li class="list-inline-item"><a href="mailto:{{SUPPORT_EMAIL}}">Contact Us
<i class="fe fe-external-link"></i></a></li>
<li class="list-inline-item intro-step-0">
<a onclick="startIntro()"
data-intro="Welcome to SimpleLogin! <br><br>
It seems that this is the first time you are here,
let's walk through some SimpleLogin features together! <br><br>
You can always show this tutorial again any time by clicking on this <i class='fe fe-help-circle'></i> icon below 👇"
data-step="1"
><i class="fe fe-help-circle"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="col-12 col-lg-auto mt-3 mt-lg-0 text-center">
© {{ YEAR }}
<a href="https://simplelogin.io" target="_blank" rel="noopener">SimpleLogin</a>.
</div>
</div>
</div>
</footer>
<script>
function startIntro() {
introJs().setOption('showProgress', true).start();
introJs().start();
}
</script>
<script src="{{ url_for('static', filename='node_modules/vue/dist/vue.min.js') }}"></script>
<script>
var app = new Vue({
el: '#notification-app',
delimiters: ["[[", "]]"], // necessary to avoid conflict with jinja
data: {
notifications: [],
page: 0,
loading: true,
canLoadMore: false,
showNotification: false,
},
computed: {
has_non_read_notification: function () {
for (let i = 0; i < this.notifications.length; i++) {
if (!this.notifications[i].read) return true;
}
return false;
}
},
methods: {
markAsRead: async function (notification) {
notification.read = true;
let res = await fetch(`/api/notifications/${notification.id}/read`, {
method: "POST",
headers: {
"Content-Type": "application/json",
}
});
if (!res.ok) {
toastr.error("Sorry for the inconvenience! Could you refresh the page & retry please?", "Unknown Error");
}
},
loadMore: async function () {
let that = this;
that.page += 1;
let res = await fetch(`/api/notifications?page=${that.page}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
}
});
if (res.ok) {
let json = await res.json();
that.canLoadMore = json.more;
that.notifications = that.notifications.concat(json.notifications);
}
}
},
async mounted() {
let that = this;
let res = await fetch(`/api/notifications?page=${that.page}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
}
});
if (res.ok) {
let json = await res.json();
that.notifications = json.notifications;
that.loading = false;
that.canLoadMore = json.more
if (that.notifications.length > 0)
that.showNotification = true;
}
}
})
</script>