mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-14 12:34:03 +02:00
Code Issues Packages Projects Releases Wiki Activity

Refactor the Background component during offline mode

Browse Source
This commit is contained in:
edenbun
2020-08-27 19:25:50 +01:00
parent 259a36fd5d
commit afb0f5c061
2 changed files with 34 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/widgets/Background.jsx
View File

@@ -3,24 +3,22 @@ import supportsWebP from 'supports-webp';
import * as Constants from '../../modules/constants';
export default class Background extends React.PureComponent {
doOffline() {
const photo = Math.floor(Math.random() * (Constants.OFFLINE_IMAGES - 1 + 1)) + 1; // There are 20 images in the offline-images folder
document.getElementById('backgroundCredits').style.display = 'none'; // Hide the location icon
doOffline() { // Handles setting the background if the user is offline
const offlineImages = require('../../modules/offlineImages.json');
const photographers = Object.keys(offlineImages); // Get all photographers from the keys in offlineImages.json
const photographer = photographers[Math.floor(Math.random() * photographers.length)]; // Select a random photographer from the keys
const randomImage = offlineImages[photographer].photo[
Math.floor(Math.random() * offlineImages[photographer].photo.length)
] // Select a random image
let photographer; // Photographer credit
if ([2, 3, 9, 11, 13, 14, 15].includes(photo)) photographer = 'Pixabay'; // As there are a lot of Pixabay photos, we shorten the code a bit here
else switch (photo) {
case 1: photographer = 'Tirachard Kumtanom'; break;
case 4: photographer = 'Sohail Na'; break;
case 7: photographer = 'Miriam Espacio'; break;
case 10: photographer = 'NO NAME'; break;
case 20: photographer = 'Fabian Wiktor'; break;
default: photographer = 'Unknown'; break;
}
document.querySelector('#backgroundImage').setAttribute(
'style', `background-image: url(../offline-images/${randomImage}.jpeg); -webkit-filter:blur(${localStorage.getItem('blur')}px);`
); // Set background and blur
const creditElem = document.getElementById('photographer');
creditElem.append(` ${photographer} (Pexels)`); // Set the credit
document.getElementById('backgroundImage').setAttribute('style', `-webkit-filter:blur(${localStorage.getItem('blur')}px); background-image: url(../offline-images/${photo}.jpeg)`); // Set background and blur etc
let credit = document.getElementById('photographer');
credit.innerText = `${credit.innerText} ${photographer} (Pexels)`; // Set the credit
document.querySelector('#backgroundCredits').style.display = 'none'; // Hide the location icon
}
async setBackground() {