From 2f8d5eca21c5d07fa5e6d56f7bf50e8f89bab69f Mon Sep 17 00:00:00 2001
From: David Ralph <davetheprogrammer2@gmail.com>
Date: Wed, 21 Oct 2020 13:22:04 +0100
Subject: [PATCH] Add WIP custom background video feature

---
 src/App.jsx                           | 4 ++--
 src/components/widgets/Background.jsx | 7 +++++++
 src/components/widgets/Notes.jsx      | 2 +-
 src/scss/index.scss                   | 9 +++++++++
 4 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 3da24d09..65ef91bd 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -23,8 +23,8 @@ const Update = React.lazy(() => import('./components/modals/Update'));
 const renderLoader = () => <div></div>;
 
 export default class App extends React.PureComponent {
-  constructor(props) {
-    super(props);
+  constructor(...args) {
+    super(...args);
     this.state = {
       mainModal: false,
       updateModal: false
diff --git a/src/components/widgets/Background.jsx b/src/components/widgets/Background.jsx
index 9be31dd0..080e9886 100644
--- a/src/components/widgets/Background.jsx
+++ b/src/components/widgets/Background.jsx
@@ -67,6 +67,7 @@ export default class Background extends React.PureComponent {
     const customBackgroundColour = localStorage.getItem('customBackgroundColour');
     const customBackground = localStorage.getItem('customBackground');
     const favourited = JSON.parse(localStorage.getItem('favourite'));
+    const customBackgroundVideo = localStorage.getItem('customBackgroundVideo');
 
     if (favourited) {
       if (offlineMode === 'true') return this.doOffline();
@@ -83,6 +84,12 @@ export default class Background extends React.PureComponent {
       this.setBackground(null, customBackgroundColour, 'false');
     } else if (customBackground !== '') { // Local
       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
       if (offlineMode === 'true') return this.doOffline();
       try { // First we try and get an image from the API...
diff --git a/src/components/widgets/Notes.jsx b/src/components/widgets/Notes.jsx
index 5591ecba..e114b874 100644
--- a/src/components/widgets/Notes.jsx
+++ b/src/components/widgets/Notes.jsx
@@ -8,7 +8,7 @@ export default class Notes extends React.PureComponent {
     constructor(...args) {
         super(...args);
         this.state = {
-            notes: localStorage.getItem('notes') || ""
+            notes: localStorage.getItem('notes') || ''
         };
     }
 
diff --git a/src/scss/index.scss b/src/scss/index.scss
index 55c67406..cacb701b 100644
--- a/src/scss/index.scss
+++ b/src/scss/index.scss
@@ -83,6 +83,7 @@ body {
     from {
         opacity: 0;
     }
+
     to {
         opacity: 1;
     }
@@ -100,4 +101,12 @@ body {
 
 ::selection {
     background-color: #c2c2c2;
+}
+
+#backgroundVideo {
+    position: fixed;
+    right: 0;
+    bottom: 0;
+    min-width: 100%;
+    min-height: 100%;
 }
\ No newline at end of file