Skip to content

Commit 8c831bc

Browse files
committed
added disclaimer for external links
Signed-off-by: Cafetier <69208423+VotreCafetier@users.noreply.github.com>
1 parent ff29670 commit 8c831bc

File tree

5 files changed

+118
-6
lines changed

5 files changed

+118
-6
lines changed

scripts/js/footer.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -773,9 +773,40 @@ function addAdvancedInfo() {
773773
advancedInfoTarget.show();
774774
}
775775

776+
/**
777+
* This function blocks all external links and shows a disclaimer modal
778+
*/
779+
function addDiclaimerOutsideLink() {
780+
const currentOrigin = location.origin;
781+
const areYouSureModal = document.querySelector("#areYouSureModal");
782+
const continueButton = areYouSureModal.querySelector(".btn-primary");
783+
const title = "External Link Warning";
784+
const disclaimer = `You are about to leave Pi-hole. We are not responsible for the content of external sites.
785+
</br></br>Are you sure you want to visit: `;
786+
787+
// Event delegation
788+
document.body.addEventListener("click", function (e) {
789+
const link = e.target.closest("a[href]");
790+
if (!link) return; // skip if its not a link
791+
// if the link is not internal, show the modal
792+
if (!link.href.startsWith(currentOrigin)) {
793+
e.preventDefault();
794+
const website = `<b><i>${link.href}</i></b>`;
795+
areYouSureModal.querySelector(".modal-title").textContent = title;
796+
areYouSureModal.querySelector(".modal-text").innerHTML = disclaimer + website;
797+
continueButton.addEventListener("click", () => {
798+
globalThis.location.href = link.href;
799+
});
800+
801+
$(areYouSureModal).modal("show");
802+
}
803+
});
804+
}
805+
776806
$(function () {
777807
initSettingsLevel();
778808
addAdvancedInfo();
809+
addDiclaimerOutsideLink();
779810
});
780811

781812
// Install custom AJAX error handler for DataTables

scripts/lua/footer.lp

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,29 @@ end
4747
</div>
4848
</div>
4949
</div>
50+
</div>
51+
52+
<!-- Modal for are you sure ? -->
53+
<div class="modal fade" id="areYouSureModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
54+
<div class="modal-dialog modal-md" role="document">
55+
<div class="modal-content">
56+
<div class="modal-header">
57+
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
58+
<div class="vertical-center">
59+
<i class="fa fa-link o-50 mr-3"
60+
title="This is an external link"></i>
61+
<h4 class="modal-title"></h4>
62+
</div>
63+
</div>
64+
<div class="modal-body">
65+
<p class="modal-text"></p>
66+
</div>
67+
<div class="modal-footer">
68+
<button type="button" class="btn btn-default" data-dismiss="modal">Return</button>
69+
<button type="button" id="pihole-disable-custom" class="btn btn-primary" data-dismiss="modal">I want to go there</button>
70+
</div>
71+
</div>
72+
</div>
5073
</div> <!-- /.content-wrapper -->
5174

5275
<footer class="main-footer">

scripts/lua/header_authenticated.lp

Lines changed: 45 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -77,15 +77,55 @@ mg.include('header.lp','r')
7777
<li class="user-body" id="advanced-info" style="display:none;"></li>
7878
<!-- Menu Footer -->
7979
<li class="user-footer">
80-
<a class="btn-link" href="https://pi-hole.net/" rel="noopener" target="_blank">
80+
<a class="btn-link vertical-center" href="https://pi-hole.net/" rel="noopener" target="_blank">
8181
<? mg.include('../../img/logo-bw.svg', 'r') ?>
8282
Pi-hole Website
83+
84+
<i class="fa fa-link ml-auto o-50"
85+
title="This is an external link"
86+
style="font-size: 10px; margin-right: 8px"></i>
8387
</a>
88+
8489
<hr>
85-
<a class="btn-link" href="https://docs.pi-hole.net/" rel="noopener" target="_blank"><i class="fa-fw menu-icon fa-regular fa-circle-question"></i> Documentation</a>
86-
<a class="btn-link" href="https://discourse.pi-hole.net/" rel="noopener" target="_blank"><i class="fa-fw menu-icon fab fa-discourse"></i> Pi-hole Discourse</a>
87-
<a class="btn-link" href="https://github.com/pi-hole" rel="noopener" target="_blank"><i class="fa-fw menu-icon fab fa-github"></i> GitHub</a>
88-
<a class="btn-link" href="https://discourse.pi-hole.net/c/announcements/5" rel="noopener" target="_blank"><i class="fa-fw menu-icon fa-solid fa-rocket"></i> Pi-hole Releases</a>
90+
91+
<a class="btn-link vertical-center"
92+
href="https://docs.pi-hole.net/"
93+
rel="noopener"
94+
target="_blank">
95+
96+
<i class="fa-fw menu-icon fa-regular fa-circle-question"></i>
97+
98+
Documentation
99+
100+
<i class="fa fa-link ml-auto o-50"
101+
title="This is an external link"
102+
style="font-size: 10px; margin-right: 8px"></i>
103+
</a>
104+
105+
<a class="btn-link vertical-center" href="https://discourse.pi-hole.net/" rel="noopener" target="_blank">
106+
<i class="fa-fw menu-icon fab fa-discourse"></i>
107+
Pi-hole Discourse
108+
<i class="fa fa-link ml-auto o-50"
109+
title="This is an external link"
110+
style="font-size: 10px; margin-right: 8px"></i>
111+
</a>
112+
113+
<a class="btn-link vertical-center" href="https://github.com/pi-hole" rel="noopener" target="_blank">
114+
<i class="fa-fw menu-icon fab fa-github"></i>
115+
GitHub
116+
<i class="fa fa-link ml-auto o-50"
117+
title="This is an external link"
118+
style="font-size: 10px; margin-right: 8px"></i>
119+
</a>
120+
121+
<a class="btn-link vertical-center" href="https://discourse.pi-hole.net/c/announcements/5" rel="noopener" target="_blank">
122+
<i class="fa-fw menu-icon fa-solid fa-rocket"></i>
123+
Pi-hole Releases
124+
<i class="fa fa-link ml-auto o-50"
125+
title="This is an external link"
126+
style="font-size: 10px; margin-right: 8px"></i>
127+
</a>
128+
89129
<? if pihole.needLogin() then ?>
90130
<a class="btn-link" href="#" id="logout-button"><i class="fa-fw menu-icon fa-solid fa-arrow-right-from-bracket"></i> Log out</a>
91131
<? end ?>

scripts/lua/sidebar.lp

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -260,7 +260,12 @@
260260
<li class="header text-uppercase">Donate</li>
261261
<li class="menu-donate">
262262
<a href="https://pi-hole.net/donate/" target="_blank">
263-
<i class="fas fa-fw menu-icon fa-donate"></i> <span>Donate</span>
263+
<i class="fas fa-fw menu-icon fa-donate"></i>
264+
<span>Donate</span>
265+
266+
<span class="pull-right-container">
267+
<i class="fa fa-link pull-right o-50" title="This is an external link" style="font-size: 12px; margin-right: 8px"></i>
268+
</span>
264269
</a>
265270
</li>
266271
</ul>

style/pi-hole.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1586,3 +1586,16 @@ textarea.field-sizing-content {
15861586
line-height: 0.5em;
15871587
font-size: 1.7em;
15881588
}
1589+
1590+
.o-50 {
1591+
opacity: 0.5;
1592+
}
1593+
1594+
.vertical-center {
1595+
display: flex !important;
1596+
align-items: center;
1597+
}
1598+
1599+
.ml-auto {
1600+
margin-left: auto;
1601+
}

0 commit comments

Comments
 (0)