mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-26 18:21:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add WIP custom background video feature

Browse Source
This commit is contained in:
David Ralph
2020-10-21 13:22:04 +01:00
parent 78d3384d7e
commit 2f8d5eca21
4 changed files with 19 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.jsx
View File

@@ -23,8 +23,8 @@ const Update = React.lazy(() => import('./components/modals/Update'));
const renderLoader = () => <div></div>; const renderLoader = () => <div></div>;
export default class App extends React.PureComponent { export default class App extends React.PureComponent {
constructor(props) { constructor(...args) {
super(props); super(...args);
this.state = { this.state = {
mainModal: false, mainModal: false,
updateModal: false updateModal: false

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

@@ -67,6 +67,7 @@ export default class Background extends React.PureComponent {
const customBackgroundColour = localStorage.getItem('customBackgroundColour'); const customBackgroundColour = localStorage.getItem('customBackgroundColour');
const customBackground = localStorage.getItem('customBackground'); const customBackground = localStorage.getItem('customBackground');
const favourited = JSON.parse(localStorage.getItem('favourite')); const favourited = JSON.parse(localStorage.getItem('favourite'));
const customBackgroundVideo = localStorage.getItem('customBackgroundVideo');
if (favourited) { if (favourited) {
if (offlineMode === 'true') return this.doOffline(); if (offlineMode === 'true') return this.doOffline();
@@ -83,6 +84,12 @@ export default class Background extends React.PureComponent {
this.setBackground(null, customBackgroundColour, 'false'); this.setBackground(null, customBackgroundColour, 'false');
} else if (customBackground !== '') { // Local } else if (customBackground !== '') { // Local
this.setBackground(customBackground, null, 'false'); this.setBackground(customBackground, null, 'false');
} else if (customBackgroundVideo) {
document.getElementById('backgroundImage').innerHTML = `
<video autoplay muted loop id="backgroundVideo">
<source src="${customBackgroundVideo}"/>
</video>`;
document.querySelector('.photoInformation').style.display = 'none'; // Hide the credit
} else { // Online } else { // Online
if (offlineMode === 'true') return this.doOffline(); if (offlineMode === 'true') return this.doOffline();
try { // First we try and get an image from the API... try { // First we try and get an image from the API...

2
src/components/widgets/Notes.jsx
View File

@@ -8,7 +8,7 @@ export default class Notes extends React.PureComponent {
constructor(...args) { constructor(...args) {
super(...args); super(...args);
this.state = { this.state = {
notes: localStorage.getItem('notes') || "" notes: localStorage.getItem('notes') || ''
}; };
} }

9
src/scss/index.scss
View File

@@ -83,6 +83,7 @@ body {
from { from {
opacity: 0; opacity: 0;
} }
to { to {
opacity: 1; opacity: 1;
} }
@@ -101,3 +102,11 @@ body {
::selection { ::selection {
background-color: #c2c2c2; background-color: #c2c2c2;
} }
#backgroundVideo {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
}