Choose or drop image for upload

Fix up some JS
Update Icons
This commit is contained in:
Michał Gdula 2023-03-23 12:54:00 +00:00
parent 0e1514bf93
commit 69d264739b
13 changed files with 279 additions and 194 deletions

View file

@ -5,26 +5,29 @@ function imgFade(obj, time = 250) {
// https://stackoverflow.com/questions/3942878/how-to-decide-font-color-in-white-or-black-depending-on-background-color
function colourContrast(bgColor, lightColor, darkColor, threshold = 0.179) {
// if color is in hex format then convert to rgb else parese rgb
let r = 0
let g = 0
let b = 0
if (bgColor.charAt(0) === '#') {
var color = (bgColor.charAt(0) === '#') ? bgColor.substring(1, 7) : bgColor;
var r = parseInt(color.substring(0, 2), 16); // hexToR
var g = parseInt(color.substring(2, 4), 16); // hexToG
var b = parseInt(color.substring(4, 6), 16); // hexToB
const color = (bgColor.charAt(0) === '#') ? bgColor.substring(1, 7) : bgColor;
r = parseInt(color.substring(0, 2), 16); // hexToR
g = parseInt(color.substring(2, 4), 16); // hexToG
b = parseInt(color.substring(4, 6), 16); // hexToB
} else {
var color = bgColor.replace('rgb(', '').replace(')', '').split(',');
var r = color[0];
var g = color[1];
var b = color[2];
const color = bgColor.replace('rgb(', '').replace(')', '').split(',');
r = color[0];
g = color[1];
b = color[2];
}
var uicolors = [r / 255, g / 255, b / 255];
var c = uicolors.map((col) => {
const uicolors = [r / 255, g / 255, b / 255];
const c = uicolors.map((col) => {
if (col <= 0.03928) {
return col / 12.92;
}
return Math.pow((col + 0.055) / 1.055, 2.4);
});
var L = (0.2126 * c[0]) + (0.7152 * c[1]) + (0.0722 * c[2]);
const L = (0.2126 * c[0]) + (0.7152 * c[1]) + (0.0722 * c[2]);
return (L > threshold) ? darkColor : lightColor;
}
// Lazy load images when they are in view
@ -48,8 +51,7 @@ window.onload = function () {
const lightColor = '#E8E3E3';
let contrastCheck = document.querySelectorAll('#contrast-check');
for (let i = 0; i < contrastCheck.length; i++) {
console.log(contrastCheck[i].getAttribute('data-color'));
bgColor = contrastCheck[i].getAttribute('data-color');
let bgColor = contrastCheck[i].getAttribute('data-color');
contrastCheck[i].style.color = colourContrast(bgColor, lightColor, darkColor);
}
@ -89,4 +91,4 @@ window.onscroll = function () {
};
window.onresize = function () {
loadOnView();
};
};