Major changes to homepage
parent
558f4e57c0
commit
7b9fb321d1
@ -1,32 +0,0 @@
|
||||
var d = document.getElementById.bind(document);
|
||||
var c = document.createElement.bind(document);
|
||||
var q = document.querySelector.bind(document);
|
||||
|
||||
// Clock
|
||||
function showTime() {
|
||||
var date = new Date()
|
||||
var days = ["Zondag","Maandag","Dinsdag","Woensdag","Donderdag","Vrijdag","Zaterdag"]
|
||||
var months = ["Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "Oktober", "November", "December"]
|
||||
if (date.getHours() < 10) {
|
||||
d("hours").innerHTML = "0" + date.getHours() + ":"
|
||||
}
|
||||
else {
|
||||
d("hours").innerHTML = date.getHours() + ":"
|
||||
}
|
||||
if (date.getMinutes() < 10) {
|
||||
d("mins").innerHTML = "0" + date.getMinutes() + ":"
|
||||
}
|
||||
else {
|
||||
d("mins").innerHTML = date.getMinutes() + ":"
|
||||
}
|
||||
if (date.getSeconds() < 10) {
|
||||
d("secs").innerHTML = "0" + date.getSeconds()
|
||||
}
|
||||
else {
|
||||
d("secs").innerHTML = date.getSeconds()
|
||||
}
|
||||
d("date").innerHTML = days[date.getDay()] + " " + date.getDate() + " " + months[date.getMonth()];
|
||||
setTimeout(showTime, 1000);
|
||||
}
|
||||
|
||||
showTime();
|
@ -1,78 +0,0 @@
|
||||
/* Shortcuts */
|
||||
.shortcuts button {
|
||||
margin: 0 0 1rem 1rem;
|
||||
width: 12rem;
|
||||
max-height: 5.3rem;
|
||||
padding: 1rem;
|
||||
color: white;
|
||||
background-color: #363840;
|
||||
border: #363840 0px solid;
|
||||
border-radius: .5rem;
|
||||
display: inline-block;
|
||||
transition: background-color .5s, border .5s;
|
||||
}
|
||||
.shortcuts button::-webkit-scrollbar {
|
||||
display: hidden;
|
||||
}
|
||||
.shortcuts button:hover {
|
||||
background-color: #3d3e47;
|
||||
border-color: #3d3e47;
|
||||
}
|
||||
.shortcuts button:hover .removeShortcut {
|
||||
display: inline;
|
||||
}
|
||||
.shortcuts button:focus {
|
||||
outline: none;
|
||||
box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25) inset;
|
||||
}
|
||||
.shortcuts img {
|
||||
width: 3rem;
|
||||
margin-right: 1rem;
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
/* Shortcut creation menu */
|
||||
.hidden {
|
||||
opacity: 0!important;
|
||||
}
|
||||
.menu {
|
||||
transition: opacity .5s;
|
||||
}
|
||||
#addShortcutMenu {
|
||||
display: inline-block;
|
||||
z-index: 2;
|
||||
border-radius: .75rem;
|
||||
position: absolute;
|
||||
left: calc(50% - 25rem);
|
||||
height: 27rem;
|
||||
width: 50rem;
|
||||
top: 15%;
|
||||
}
|
||||
#addShortcutMenu h1 {
|
||||
margin: 1rem 0 0 1rem;
|
||||
}
|
||||
#addShortcutMenu input {
|
||||
width: 96%;
|
||||
height: 2.5rem;
|
||||
margin-left: 1rem!important;
|
||||
}
|
||||
#addShortcutMenu h4 {
|
||||
margin: 2rem 0 0 1rem;
|
||||
}
|
||||
#addShortcutMenu button {
|
||||
float: right;
|
||||
margin: 4rem 1rem 0 0;
|
||||
padding: .5rem;
|
||||
}
|
||||
@media screen and (min-width:0px) and (max-width:1000px) {
|
||||
#addShortcutMenu {
|
||||
width: 94%!important;
|
||||
left: 1rem!important;
|
||||
margin-left: 0px!important;
|
||||
}
|
||||
section span button {
|
||||
width: 9rem!important;
|
||||
height: 8rem!important;
|
||||
color: transparent!important;
|
||||
}
|
||||
}
|
@ -1,69 +0,0 @@
|
||||
// Toggle Menu
|
||||
function openMenu() {
|
||||
$(".menu").removeClass("lowerIndex");
|
||||
$("#addShortcutMenu").removeClass("hidden");
|
||||
d("shortcutLink").setAttribute('placeholder', 'https://example.com')
|
||||
d("shortcutName").setAttribute('placeholder', 'Example Website')
|
||||
}
|
||||
function closeMenu() {
|
||||
if (!d("addShortcutMenu").classList.contains("hidden")) {
|
||||
setTimeout(function () {
|
||||
$(".menu").addClass("lowerIndex");
|
||||
}, 500)
|
||||
$("#addShortcutMenu").addClass("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
var ls = localStorage
|
||||
var shortcutsData = ls.getItem("shortcuts")
|
||||
if (shortcutsData) {
|
||||
var data = JSON.parse(shortcutsData)
|
||||
data.forEach(d=>{
|
||||
createShortcut(d)
|
||||
})
|
||||
}
|
||||
|
||||
function createShortcut(shortcutObj) {
|
||||
var shortcutName = d("shortcutName").value
|
||||
var shortcutLink = d("shortcutLink").value
|
||||
if (shortcutObj) {
|
||||
shortcutName = shortcutObj.name
|
||||
shortcutLink = shortcutObj.link
|
||||
}
|
||||
if (shortcutName && shortcutLink) {
|
||||
var data = []
|
||||
var shortcutData = ls.getItem("shortcuts")
|
||||
if (shortcutData) {
|
||||
data = JSON.parse(shortcutsData)
|
||||
}
|
||||
if (!shortcutObj) {
|
||||
data.push({
|
||||
name: shortcutName,
|
||||
link: shortcutLink
|
||||
})
|
||||
}
|
||||
var obj = JSON.stringify(data)
|
||||
ls.setItem("shortcuts", obj)
|
||||
var shortcutButton = c("button")
|
||||
shortcutButton.onclick = function() { window.open(shortcutLink); }
|
||||
shortcutButton.innerHTML = shortcutName
|
||||
var shortcutImage = c("img")
|
||||
shortcutImage.src = "/resources/img/shortcut.png"
|
||||
$("#shortcuts").append(shortcutButton);
|
||||
$(shortcutButton).prepend(shortcutImage);
|
||||
$(".inputMenu").val('')
|
||||
closeMenu();
|
||||
}
|
||||
else {
|
||||
$(".inputMenu").attr('placeholder', 'Je moet hier iets invullen!')
|
||||
}
|
||||
}
|
||||
|
||||
var shortcutsA = Array.from(d("shortcuts").querySelectorAll("div"))
|
||||
shortcutsA.forEach(short=>{
|
||||
short.addEventListener("contextmenu", removeShortcut)
|
||||
})
|
||||
function removeShortcut(e) {
|
||||
e.preventDefault()
|
||||
this.outerHTML = ""
|
||||
}
|
Reference in new issue