Client is now 100% hosted on the included files
no more web references (so you don't need internet access on a closed network)
This commit is contained in:
parent
dcfe7115fa
commit
b20f0ecad0
4 changed files with 145 additions and 10 deletions
134
Client/ext/popper.js
Normal file
134
Client/ext/popper.js
Normal file
|
|
@ -0,0 +1,134 @@
|
|||
function Pop() {
|
||||
// var cssRuleFile = "/src/css/style.css"; // will be the link once this css file became available online
|
||||
var cssRuleFile = "https://cookieconsent.popupsmart.com/src/css/style.css"; // will be the link once this css file became available online
|
||||
|
||||
let lnk = document.createElement("link");
|
||||
lnk.setAttribute("rel", "stylesheet");
|
||||
lnk.setAttribute("type", "text/css");
|
||||
lnk.setAttribute("href", cssRuleFile);
|
||||
document.getElementsByTagName("head")[0].appendChild(lnk);
|
||||
|
||||
let styl = "undefined";
|
||||
var conDivObj;
|
||||
|
||||
var fadeInTime = 10; // If needed could be served as an customizable option to the user
|
||||
var fadeOutTime = 10;
|
||||
|
||||
let cookie = {
|
||||
name: "cookieconsent_status",
|
||||
path: "/",
|
||||
expiryDays: 365 * 24 * 60 * 60 * 5000,
|
||||
};
|
||||
|
||||
let content = {
|
||||
/// Add a field for link color
|
||||
message:
|
||||
"This website uses cookies to ensure you get the best experience on our website.",
|
||||
btnText: "Got it!",
|
||||
mode: " banner bottom",
|
||||
theme: " theme-classic",
|
||||
palette: " palette1",
|
||||
link: "Learn more",
|
||||
href: "https://www.cookiesandyou.com",
|
||||
target: "_blank",
|
||||
};
|
||||
|
||||
let createPopUp = function () {
|
||||
console.log(content);
|
||||
if (typeof conDivObj === "undefined") {
|
||||
conDivObj = document.createElement("DIV");
|
||||
conDivObj.style.opacity = 0;
|
||||
conDivObj.setAttribute("id", "spopupCont");
|
||||
}
|
||||
conDivObj.innerHTML =
|
||||
'<div id="poper" class="window ' +
|
||||
content.mode +
|
||||
content.theme +
|
||||
content.palette +
|
||||
'"><span id="msg" class="message">' +
|
||||
content.message +
|
||||
'<a id="plcy-lnk" class="policylink" href="' +
|
||||
content.href +
|
||||
'"' +
|
||||
" target=" +
|
||||
content.target +
|
||||
">" +
|
||||
content.link +
|
||||
'</a></span><div id="btn" class="compliance"><a id="cookie-btn" class="spopupbtnok" >' +
|
||||
content.btnText +
|
||||
'</a></div><span class="credit"><a href="https://popupsmart.com" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 60 60" fill="currentColor"><path id="popupsmart" d="M56.627,12.279a22.441,22.441,0,0,0-9.549-9.074c-4.122-2.088-8.951-3.2-15.722-3.2H28.644c-6.769,0-11.6,1.112-15.72,3.2a22.425,22.425,0,0,0-9.551,9.072C1.174,16.191,0,20.783,0,27.214v5.578c0,6.434,1.173,11.024,3.373,14.934A22.412,22.412,0,0,0,12.924,56.8c4.12,2.094,8.949,3.206,15.72,3.206h2.711c6.771,0,11.6-1.112,15.72-3.206a22.427,22.427,0,0,0,9.551-9.072c2.2-3.91,3.373-8.5,3.373-14.934V27.216C60,20.78,58.827,16.19,56.627,12.279ZM30,45.006c-.237,0-.473-.005-.708-.015l-.211-.012c-.14-.008-.28-.019-.419-.031-.123-.011-.245-.022-.367-.036l-.191-.024a14.979,14.979,0,0,1-2.672-.59V44.3a14.861,14.861,0,0,1-6.294-3.955,1.406,1.406,0,1,0-2.036,1.94,17.648,17.648,0,0,0,8.33,4.944v.354a5.214,5.214,0,1,1-10.428,0V30.046c0-.013,0-.026,0-.039a15,15,0,1,1,15,15Z" transform="translate(0 -0.005)"></path></svg><span>Powered by Popupsmart</span></a></span></div>';
|
||||
|
||||
document.body.appendChild(conDivObj);
|
||||
fadeIn(conDivObj);
|
||||
|
||||
document
|
||||
.getElementById("cookie-btn")
|
||||
.addEventListener("click", function () {
|
||||
saveCookie();
|
||||
fadeOut(conDivObj);
|
||||
});
|
||||
};
|
||||
|
||||
let fadeOut = function (element) {
|
||||
var op = 1;
|
||||
var timer = setInterval(function () {
|
||||
if (op <= 0.1) {
|
||||
clearInterval(timer);
|
||||
conDivObj.parentElement.removeChild(conDivObj);
|
||||
}
|
||||
element.style.opacity = op;
|
||||
element.style.filter = "alpha(opacity=" + op * 100 + ")";
|
||||
op -= op * 0.1;
|
||||
}, fadeOutTime);
|
||||
};
|
||||
let fadeIn = function (element) {
|
||||
var op = 0.1;
|
||||
var timer = setInterval(function () {
|
||||
if (op >= 1) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
element.style.opacity = op;
|
||||
element.style.filter = "alpha(opacity=" + op * 100 + ")";
|
||||
op += op * 0.1;
|
||||
}, fadeInTime);
|
||||
};
|
||||
|
||||
let checkCookie = function (key) {
|
||||
var keyValue = document.cookie.match("(^|;) ?" + key + "=([^;]*)(;|$)");
|
||||
return keyValue ? true : false;
|
||||
};
|
||||
|
||||
let saveCookie = function () {
|
||||
var expires = new Date();
|
||||
expires.setTime(expires.getTime() + cookie.expiryDays);
|
||||
document.cookie =
|
||||
cookie.name +
|
||||
"=" +
|
||||
"ok" +
|
||||
";expires=" +
|
||||
expires.toUTCString() +
|
||||
"path=" +
|
||||
cookie.path;
|
||||
};
|
||||
|
||||
this.init = function (param) {
|
||||
if (checkCookie(cookie.name)) return;
|
||||
|
||||
if (typeof param === "object") {
|
||||
if ("ButtonText" in param) content.btnText = param.ButtonText;
|
||||
if ("Mode" in param) content.mode = " " + param.Mode;
|
||||
if ("Theme" in param) content.theme = " " + param.Theme;
|
||||
if ("Palette" in param) content.palette = " " + param.Palette;
|
||||
if ("Message" in param) content.message = param.Message;
|
||||
if ("LinkText" in param) content.link = param.LinkText;
|
||||
if ("Location" in param) content.href = param.Location;
|
||||
if ("Target" in param) content.target = param.Target;
|
||||
if ("Time" in param)
|
||||
setTimeout(function () {
|
||||
createPopUp();
|
||||
}, param.Time * 1000);
|
||||
else createPopUp();
|
||||
}
|
||||
};
|
||||
}
|
||||
window.start = new Pop();
|
||||
1
Client/ext/qrcode.min.js
vendored
Normal file
1
Client/ext/qrcode.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -8,7 +8,7 @@
|
|||
</head>
|
||||
<body id="test-body">
|
||||
<!--Cookie Popup(does it matter if im not tracking them? i have no idea)-->
|
||||
<script type="text/javascript" src="https://cookieconsent.popupsmart.com/src/js/popper.js"></script><script> window.start.init({Palette:"palette2",Mode:"floating left",Theme:"classic",LinkText:" Learn More!",Message:"This website uses cookies to save necessary data to your device, and no tracking is performed.",Time:"0",})</script>
|
||||
<script type="text/javascript" src="/ext/popper.js"></script><script> window.start.init({Palette:"palette2",Mode:"floating left",Theme:"classic",LinkText:" Learn More!",Message:"This website uses cookies to save necessary data to your device, and no tracking is performed.",Time:"0",})</script>
|
||||
|
||||
<div class="intro">
|
||||
<h1 id="title">Jukebox Remote</h1>
|
||||
|
|
@ -27,7 +27,7 @@ changes visibility with JS-->
|
|||
These are generated using javascript for search
|
||||
|
||||
<div class="item">
|
||||
<img src="search.png"></img>
|
||||
<img src="placeholder.png"></img>
|
||||
<h3><span>Song title</span></h3>
|
||||
<h4>Artist</h4>
|
||||
</div>
|
||||
|
|
@ -83,8 +83,6 @@ changes visibility with JS-->
|
|||
</div>
|
||||
<div class="item">
|
||||
<h2>Share the remote:</h2>
|
||||
<!-- <p class="italic">Hit settings icon to refresh the code</p>
|
||||
You actually no longer need to do that, it does it anytime the ip changes -->
|
||||
<div id="qrcode" alt="QR code to the remote URL"></div>
|
||||
</div>
|
||||
<h1>Admin Settings</h1>
|
||||
|
|
@ -111,13 +109,13 @@ changes visibility with JS-->
|
|||
<!--All the buttons are down here but settings is just doing its own thing-->
|
||||
<img class="settings-button" id="settings-button" src="./images/settings.png" alt="settings"></img>
|
||||
<div id="controls" class="controls">
|
||||
<img class="control-button" id="playlist-button" src="./images/playlist.png" alt="playlist"></img>
|
||||
<img class="control-button" id="play-pause-button" src="./images/play-pause.png" alt="play pause"></img>
|
||||
<img class="control-button" id="skip-button" src="./images/skip.png" alt="skip"></img>
|
||||
<img class="control-button" id="search-button" src="./images/search.png" alt="search"></img>
|
||||
<img class="control-button" id="playlist-button" src="./images/playlist.png" alt="Playlist"></img>
|
||||
<img class="control-button" id="play-pause-button" src="./images/play-pause.png" alt="Play pause"></img>
|
||||
<img class="control-button" id="skip-button" src="./images/skip.png" alt="Skip"></img>
|
||||
<img class="control-button" id="search-button" src="./images/search.png" alt="Search"></img>
|
||||
|
||||
</div>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js" integrity="sha512-CNgIRecGo7nphbeZ04Sc13ka07paqdeTu0WR1IM4kNcpmBAUSHSQX0FslNhTDadL4O5SAGapGt4FodqL8My0mA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="/ext/qrcode.min.js" integrity="sha512-CNgIRecGo7nphbeZ04Sc13ka07paqdeTu0WR1IM4kNcpmBAUSHSQX0FslNhTDadL4O5SAGapGt4FodqL8My0mA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="scripts.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue