mirror of
https://github.com/Derpy-Leggies/OnlyLegs.git
synced 2025-06-29 11:36:16 +00:00
I with push my head through a conrete wall
I hate Joins
This commit is contained in:
parent
0a27d79a82
commit
91278e2d11
10 changed files with 180 additions and 187 deletions
|
@ -5,7 +5,7 @@ document.onscroll = function() {
|
|||
document.querySelector('.background-decoration').style.opacity = `${1 - window.scrollY / 621}`;
|
||||
document.querySelector('.background-decoration').style.top = `-${window.scrollY / 5}px`;
|
||||
} catch (e) {
|
||||
console.log('No background decoration found');
|
||||
// Do nothing if banner not found
|
||||
}
|
||||
|
||||
try {
|
||||
|
@ -16,7 +16,7 @@ document.onscroll = function() {
|
|||
}
|
||||
}
|
||||
catch (e) {
|
||||
console.log('No banner found');
|
||||
// Do nothing if banner not found
|
||||
}
|
||||
|
||||
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
|
||||
|
@ -41,128 +41,3 @@ for (var i = 0; i < times.length; i++) {
|
|||
var date = new Date(time);
|
||||
times[i].innerHTML = date.toLocaleString('en-GB');
|
||||
}
|
||||
|
||||
function addNotification(text='Sample notification', type=4) {
|
||||
var container = document.querySelector('.notifications');
|
||||
|
||||
// Create notification element
|
||||
var div = document.createElement('div');
|
||||
div.classList.add('sniffle__notification');
|
||||
div.onclick = function() {
|
||||
if (div.parentNode) {
|
||||
div.classList.add('sniffle__notification--hide');
|
||||
|
||||
setTimeout(function() {
|
||||
container.removeChild(div);
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
|
||||
// Create icon element and append to notification
|
||||
var icon = document.createElement('span');
|
||||
icon.classList.add('sniffle__notification-icon');
|
||||
switch (type) {
|
||||
case 1:
|
||||
div.classList.add('sniffle__notification--success');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-5 -7 24 24" fill="currentColor">\
|
||||
<path d="M5.486 9.73a.997.997 0 0 1-.707-.292L.537 5.195A1 1 0 1 1 1.95 3.78l3.535 3.535L11.85.952a1 1 0 0 1 1.415 1.414L6.193 9.438a.997.997 0 0 1-.707.292z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
case 2:
|
||||
div.classList.add('sniffle__notification--error');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-6 -6 24 24" fill="currentColor">\
|
||||
<path d="M7.314 5.9l3.535-3.536A1 1 0 1 0 9.435.95L5.899 4.485 2.364.95A1 1 0 1 0 .95 2.364l3.535 3.535L.95 9.435a1 1 0 1 0 1.414 1.414l3.535-3.535 3.536 3.535a1 1 0 1 0 1.414-1.414L7.314 5.899z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
case 3:
|
||||
div.classList.add('sniffle__notification--warning');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -3 24 24" fill="currentColor">\
|
||||
<path d="M12.8 1.613l6.701 11.161c.963 1.603.49 3.712-1.057 4.71a3.213 3.213 0 0 1-1.743.516H3.298C1.477 18 0 16.47 0 14.581c0-.639.173-1.264.498-1.807L7.2 1.613C8.162.01 10.196-.481 11.743.517c.428.276.79.651 1.057 1.096zm-2.22.839a1.077 1.077 0 0 0-1.514.365L2.365 13.98a1.17 1.17 0 0 0-.166.602c0 .63.492 1.14 1.1 1.14H16.7c.206 0 .407-.06.581-.172a1.164 1.164 0 0 0 .353-1.57L10.933 2.817a1.12 1.12 0 0 0-.352-.365zM10 14a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0V6a1 1 0 0 1 1-1z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
default:
|
||||
div.classList.add('sniffle__notification--info');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -2 24 24" fill="currentColor">\
|
||||
<path d="M10 20C4.477 20 0 15.523 0 10S4.477 0 10 0s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-10a1 1 0 0 1 1 1v5a1 1 0 0 1-2 0V9a1 1 0 0 1 1-1zm0-1a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
}
|
||||
div.appendChild(icon);
|
||||
|
||||
// Create text element and append to notification
|
||||
var description = document.createElement('span');
|
||||
description.classList.add('sniffle__notification-text');
|
||||
description.innerHTML = text;
|
||||
div.appendChild(description);
|
||||
|
||||
// Create span to show time remaining
|
||||
var timer = document.createElement('span');
|
||||
timer.classList.add('sniffle__notification-time');
|
||||
div.appendChild(timer);
|
||||
|
||||
// Append notification to container
|
||||
container.appendChild(div);
|
||||
setTimeout(function() {
|
||||
div.classList.add('sniffle__notification-show');
|
||||
}, 100);
|
||||
|
||||
// Remove notification after 5 seconds
|
||||
setTimeout(function() {
|
||||
if (div.parentNode) {
|
||||
div.classList.add('sniffle__notification--hide');
|
||||
|
||||
setTimeout(function() {
|
||||
container.removeChild(div);
|
||||
}, 500);
|
||||
}
|
||||
}, 5000);
|
||||
}
|
||||
|
||||
function popUpShow(title, body, actions, content) {
|
||||
var popup = document.querySelector('.pop-up');
|
||||
var popupContent = document.querySelector('.pop-up-content');
|
||||
var popupActions = document.querySelector('.pop-up-controlls');
|
||||
|
||||
// Set tile and description
|
||||
h3 = document.createElement('h3');
|
||||
h3.innerHTML = title;
|
||||
p = document.createElement('p');
|
||||
p.innerHTML = body;
|
||||
|
||||
popupContent.innerHTML = '';
|
||||
popupContent.appendChild(h3);
|
||||
popupContent.appendChild(p);
|
||||
|
||||
// Set content
|
||||
if (content != '') {
|
||||
popupContent.innerHTML += content;
|
||||
}
|
||||
|
||||
// Set buttons that will be displayed
|
||||
popupActions.innerHTML = '';
|
||||
if (actions != '') {
|
||||
popupActions.innerHTML += actions;
|
||||
}
|
||||
popupActions.innerHTML += '<button class="pop-up__btn pop-up__btn-fill" onclick="popupDissmiss()">Nooooooo</button>';
|
||||
|
||||
// Show popup
|
||||
popup.classList.add('pop-up__active');
|
||||
}
|
||||
|
||||
function popupDissmiss() {
|
||||
var popup = document.querySelector('.pop-up');
|
||||
|
||||
popup.classList.add('pop-up__hide');
|
||||
|
||||
setTimeout(function() {
|
||||
popup.classList = 'pop-up';
|
||||
}, 200);
|
||||
}
|
||||
|
||||
document.addEventListener('keydown', function(event) {
|
||||
if (event.key === 'Escape') {
|
||||
if (document.querySelector('.pop-up').classList.contains('pop-up__active')) {
|
||||
popupDissmiss();
|
||||
}
|
||||
}
|
||||
});
|
75
gallery/static/js/ui/notifications.js
Normal file
75
gallery/static/js/ui/notifications.js
Normal file
|
@ -0,0 +1,75 @@
|
|||
function addNotification(text='Sample notification', type=4) {
|
||||
var container = document.querySelector('.notifications');
|
||||
|
||||
// Create notification element
|
||||
var div = document.createElement('div');
|
||||
div.classList.add('sniffle__notification');
|
||||
div.onclick = function() {
|
||||
if (div.parentNode) {
|
||||
div.classList.add('sniffle__notification--hide');
|
||||
|
||||
setTimeout(function() {
|
||||
container.removeChild(div);
|
||||
}, 500);
|
||||
}
|
||||
};
|
||||
|
||||
// Create icon element and append to notification
|
||||
var icon = document.createElement('span');
|
||||
icon.classList.add('sniffle__notification-icon');
|
||||
switch (type) {
|
||||
case 1:
|
||||
div.classList.add('sniffle__notification--success');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-5 -7 24 24" fill="currentColor">\
|
||||
<path d="M5.486 9.73a.997.997 0 0 1-.707-.292L.537 5.195A1 1 0 1 1 1.95 3.78l3.535 3.535L11.85.952a1 1 0 0 1 1.415 1.414L6.193 9.438a.997.997 0 0 1-.707.292z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
case 2:
|
||||
div.classList.add('sniffle__notification--error');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-6 -6 24 24" fill="currentColor">\
|
||||
<path d="M7.314 5.9l3.535-3.536A1 1 0 1 0 9.435.95L5.899 4.485 2.364.95A1 1 0 1 0 .95 2.364l3.535 3.535L.95 9.435a1 1 0 1 0 1.414 1.414l3.535-3.535 3.536 3.535a1 1 0 1 0 1.414-1.414L7.314 5.899z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
case 3:
|
||||
div.classList.add('sniffle__notification--warning');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -3 24 24" fill="currentColor">\
|
||||
<path d="M12.8 1.613l6.701 11.161c.963 1.603.49 3.712-1.057 4.71a3.213 3.213 0 0 1-1.743.516H3.298C1.477 18 0 16.47 0 14.581c0-.639.173-1.264.498-1.807L7.2 1.613C8.162.01 10.196-.481 11.743.517c.428.276.79.651 1.057 1.096zm-2.22.839a1.077 1.077 0 0 0-1.514.365L2.365 13.98a1.17 1.17 0 0 0-.166.602c0 .63.492 1.14 1.1 1.14H16.7c.206 0 .407-.06.581-.172a1.164 1.164 0 0 0 .353-1.57L10.933 2.817a1.12 1.12 0 0 0-.352-.365zM10 14a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0V6a1 1 0 0 1 1-1z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
default:
|
||||
div.classList.add('sniffle__notification--info');
|
||||
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="-2 -2 24 24" fill="currentColor">\
|
||||
<path d="M10 20C4.477 20 0 15.523 0 10S4.477 0 10 0s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-10a1 1 0 0 1 1 1v5a1 1 0 0 1-2 0V9a1 1 0 0 1 1-1zm0-1a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"></path>\
|
||||
</svg>';
|
||||
break;
|
||||
}
|
||||
div.appendChild(icon);
|
||||
|
||||
// Create text element and append to notification
|
||||
var description = document.createElement('span');
|
||||
description.classList.add('sniffle__notification-text');
|
||||
description.innerHTML = text;
|
||||
div.appendChild(description);
|
||||
|
||||
// Create span to show time remaining
|
||||
var timer = document.createElement('span');
|
||||
timer.classList.add('sniffle__notification-time');
|
||||
div.appendChild(timer);
|
||||
|
||||
// Append notification to container
|
||||
container.appendChild(div);
|
||||
setTimeout(function() {
|
||||
div.classList.add('sniffle__notification-show');
|
||||
}, 100);
|
||||
|
||||
// Remove notification after 5 seconds
|
||||
setTimeout(function() {
|
||||
if (div.parentNode) {
|
||||
div.classList.add('sniffle__notification--hide');
|
||||
|
||||
setTimeout(function() {
|
||||
container.removeChild(div);
|
||||
}, 500);
|
||||
}
|
||||
}, 5000);
|
||||
}
|
48
gallery/static/js/ui/popup.js
Normal file
48
gallery/static/js/ui/popup.js
Normal file
|
@ -0,0 +1,48 @@
|
|||
function popUpShow(title, body, actions, content) {
|
||||
var popup = document.querySelector('.pop-up');
|
||||
var popupContent = document.querySelector('.pop-up-content');
|
||||
var popupActions = document.querySelector('.pop-up-controlls');
|
||||
|
||||
// Set tile and description
|
||||
h3 = document.createElement('h3');
|
||||
h3.innerHTML = title;
|
||||
p = document.createElement('p');
|
||||
p.innerHTML = body;
|
||||
|
||||
popupContent.innerHTML = '';
|
||||
popupContent.appendChild(h3);
|
||||
popupContent.appendChild(p);
|
||||
|
||||
// Set content
|
||||
if (content != '') {
|
||||
popupContent.innerHTML += content;
|
||||
}
|
||||
|
||||
// Set buttons that will be displayed
|
||||
popupActions.innerHTML = '';
|
||||
if (actions != '') {
|
||||
popupActions.innerHTML += actions;
|
||||
}
|
||||
popupActions.innerHTML += '<button class="pop-up__btn pop-up__btn-fill" onclick="popupDissmiss()">Nooooooo</button>';
|
||||
|
||||
// Show popup
|
||||
popup.classList.add('pop-up__active');
|
||||
}
|
||||
|
||||
function popupDissmiss() {
|
||||
var popup = document.querySelector('.pop-up');
|
||||
|
||||
popup.classList.add('pop-up__hide');
|
||||
|
||||
setTimeout(function() {
|
||||
popup.classList = 'pop-up';
|
||||
}, 200);
|
||||
}
|
||||
|
||||
document.addEventListener('keydown', function(event) {
|
||||
if (event.key === 'Escape') {
|
||||
if (document.querySelector('.pop-up').classList.contains('pop-up__active')) {
|
||||
popupDissmiss();
|
||||
}
|
||||
}
|
||||
});
|
|
@ -26,9 +26,7 @@ function uploadFile(){
|
|||
formData.append("description", $("#description").val());
|
||||
formData.append("tags", $("#tags").val());
|
||||
formData.append("submit", $("#submit").val());
|
||||
|
||||
//let bar = $('.bar');
|
||||
|
||||
|
||||
// Upload the information
|
||||
$.ajax({
|
||||
url: '/api/upload',
|
||||
|
@ -37,23 +35,10 @@ function uploadFile(){
|
|||
contentType: false,
|
||||
processData: false,
|
||||
beforeSend: function() {
|
||||
//bar.width('0%');
|
||||
var percentVal = 0;
|
||||
console.log("Uploading...");
|
||||
},
|
||||
uploadProgress: function(event, position, total, percentComplete) {
|
||||
//bar.width(percentComplete + '%');
|
||||
percentVal = percentComplete;
|
||||
console.log(percentVal);
|
||||
},
|
||||
complete: function(xhr) {
|
||||
//bar.width('100%');
|
||||
//bar.class += " loading";
|
||||
console.log("Upload complete");
|
||||
},
|
||||
success: function (response) {
|
||||
addNotification("File uploaded successfully!", 1);
|
||||
// popupDissmiss(); // Close popup
|
||||
console.log('File processed successfully');
|
||||
},
|
||||
error: function (response) {
|
||||
|
@ -75,11 +60,8 @@ function uploadFile(){
|
|||
addNotification('Error uploading file, blame someone', 2);
|
||||
break;
|
||||
}
|
||||
console.log('Error uploading file');
|
||||
},
|
||||
always: function (response) {
|
||||
//bar.class += "";
|
||||
console.log("Upload complete");
|
||||
}
|
||||
});
|
||||
|
||||
// Empty values
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue