dbroqua/simple-images-upload
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Compare commits

base: dbroqua:e9052843a7b37e90811a3e549aba68710696f6c7
Branches Tags
dbroqua:master
..
compare: dbroqua:1dcf1da97862c363a32e25fd4093a49f3e49971e
Branches Tags
dbroqua:master

No commits in common. "e9052843a7b37e90811a3e549aba68710696f6c7" and "1dcf1da97862c363a32e25fd4093a49f3e49971e" have entirely different histories.
e9052843a7 ... 1dcf1da978

2 changed files with 73 additions and 130 deletions
Show stats Expand all files Collapse all files

19
.eslintrc.js
View file

@ -1,27 +1,26 @@
module.exports = { module.exports = {
env: { env: {
browser: true, browser: true,
es2021: true, es2021: true
}, },
extends: 'google', extends: 'google',
overrides: [ overrides: [
{ {
env: { env: {
node: true, node: true
}, },
files: [ files: [
'.eslintrc.{js,cjs}', '.eslintrc.{js,cjs}'
], ],
parserOptions: { parserOptions: {
sourceType: 'script', sourceType: 'script'
}, }
}, }
], ],
parserOptions: { parserOptions: {
ecmaVersion: 'latest', ecmaVersion: 'latest',
sourceType: 'module', sourceType: 'module'
}, },
rules: { rules: {
'max-len': ['error', {'code': 120}], }
}, }
};

184
public/js/main.js
View file

@ -1,153 +1,97 @@
/* eslint-disable no-unused-vars */
let timeout = null; let timeout = null;
/**
* Ensemble d'actions effectuées au chargement de la page
*/
document.addEventListener("DOMContentLoaded", () => {
const $navbarBurgers = Array.prototype.slice.call(
document.querySelectorAll(".navbar-burger"),
0
);
if ($navbarBurgers.length > 0) {
$navbarBurgers.forEach((el) => {
el.addEventListener("click", () => {
const { target } = el.dataset;
const $target = document.getElementById(target);
el.classList.toggle("is-active");
$target.classList.toggle("is-active");
});
});
}
});
/** /**
* Fonction permettant d'afficher un message dans un toastr * Fonction permettant d'afficher un message dans un toastr
* @param {String} message * @param {String} message
* @param {Boolean} success
*/ */
function showToastr(message, success = false) { function showToastr(message, success = false) {
const x = document.getElementById('toastr'); const x = document.getElementById("toastr");
if (message) { if (message) {
x.getElementsByTagName('SPAN')[0].innerHTML = message; x.getElementsByTagName("SPAN")[0].innerHTML = message;
} }
if (timeout) { if (timeout) {
clearTimeout(timeout); clearTimeout(timeout);
x.classList.remove('show'); x.classList.remove("show");
} }
x.classList.remove('success'); x.classList.remove("success");
x.classList.remove('error'); x.classList.remove("error");
if (success) { if (success) {
x.classList.add('success'); x.classList.add("success");
} else { } else {
x.classList.add('error'); x.classList.add("error");
} }
x.classList.add('show'); x.classList.add("show");
timeout = setTimeout(() => { timeout = setTimeout(() => {
x.classList.remove('show'); x.classList.remove("show");
}, 3000); }, 3000);
} }
/** /**
* Fonction permettant de masquer le toastr * Fonction permettant de masquer le toastr
*/ */
function hideToastr() { function hideToastr() {
const x = document.getElementById('toastr'); const x = document.getElementById("toastr");
x.className = x.className.replace('show', ''); x.className = x.className.replace("show", "");
x.getElementsByTagName('SPAN')[0].innerHTML = ''; x.getElementsByTagName("SPAN")[0].innerHTML = "";
} }
/**
* Fonction permettant de copier le contenu d'un input dans le presse papier
* @param {String} itemId
* @param {String} message
*/
const copyToClipboard = (itemId, message) => { const copyToClipboard = (itemId, message) => {
const copyText = document.getElementById(itemId); const copyText = document.getElementById(itemId);
copyText.select(); copyText.select();
document.execCommand('copy'); document.execCommand('copy');
showToastr(message, true); showToastr(message, true);
}; };
/**
* Fonction permettant d'afficher une modale
*/
const showModale = () => { const showModale = () => {
const x = document.getElementsByClassName('modal'); const x = document.getElementsByClassName("modal");
x[0].classList.add('is-visible'); x[0].classList.add('is-visible');
}; }
/**
* Fonction permettant de fermer une modale
*/
const closeModale = () => { const closeModale = () => {
const x = document.getElementsByClassName('modal'); const x = document.getElementsByClassName("modal");
x[0].classList.remove('is-visible'); x[0].classList.remove('is-visible');
}; }
/**
* Fonction permettant d'afficher la modale avec le détails d'une image
* @param {Number} itemId
*/
const displayImageDetails = (itemId) => { const displayImageDetails = (itemId) => {
const x = document.getElementById(`item-${itemId}`); const x = document.getElementById(`item-${itemId}`);
const original = x.dataset.original; const original = x.dataset.original;
const medium = x.dataset.medium; const medium = x.dataset.medium;
const small = x.dataset.small; const small = x.dataset.small;
document.getElementById('previewImage').src = small; document.getElementById('previewImage').src = small;
document.getElementById('originalFile-0').value = original; document.getElementById('originalFile-0').value = original;
document.getElementById('mediumFile-0').value = medium; document.getElementById('mediumFile-0').value = medium;
document.getElementById('smallFile-0').value = small; document.getElementById('smallFile-0').value = small;
document.getElementById('bbcode-0').value = `[url=${original}][img]${medium}[/img][/url]`; document.getElementById('bbcode-0').value = `[url=${original}][img]${medium}[/img][/url]`;
showModale(); showModale();
}; }
/**
* Fonction permettant de récupérer le thème du système
* @return {String}
*/
function getPreferredColorScheme() {
if (window.matchMedia) {
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
}
return 'light';
}
/**
* Fonction permettant de changer le thème du site
* @param {String} scheme
*/
function setColorScheme(scheme) {
document.documentElement.setAttribute('data-theme', scheme);
}
/**
* Ensemble d'actions effectuées au chargement de la page
*/
document.addEventListener('DOMContentLoaded', () => {
const $navbarBurgers = Array.prototype.slice.call(
document.querySelectorAll('.navbar-burger'),
0,
);
if ($navbarBurgers.length > 0) {
$navbarBurgers.forEach((el) => {
el.addEventListener('click', () => {
const {target} = el.dataset;
const $target = document.getElementById(target);
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
}
});
if (window.matchMedia) {
/**
* Event permettant de détecter les changements de thème du système
*/
const colorSchemeQuery = window.matchMedia('(prefers-color-scheme: dark)');
colorSchemeQuery.addEventListener('change', () => {
const selectedColorScheme = localStorage.getItem('theme') || 'system';
if (selectedColorScheme === 'system') {
const preferedColorScheme = getPreferredColorScheme();
setColorScheme(preferedColorScheme);
}
});
/**
* Au chargement de la page on détecte le thème à charger
*/
setColorScheme(getPreferredColorScheme());
}