fix: many bug fixes and some performance improvements

Co-authored-by: Alex Sparkes <turbomarshmello@gmail.com>

src/components/widgets/background/Background.jsx

@@ -59,12 +59,6 @@ export default class Background extends React.PureComponent {
   }
 
   setBackground() {
-    // Brightness
-    let brightness = localStorage.getItem('brightness');
-    if (localStorage.getItem('brightnessTime') && new Date().getHours() > 18) {
-      brightness = 75;
-    }
-
     if (this.state.url !== '') {
       const url = this.ddgproxy ? window.constants.DDG_PROXY + this.state.url : this.state.url;
 
@@ -82,12 +76,12 @@ export default class Background extends React.PureComponent {
 
         backgroundImage.setAttribute(
           'style',
-          `background-image: url(${url}); -webkit-filter: blur(${localStorage.getItem('blur')}px) brightness(${brightness}%);`
+          `background-image: url(${url}); -webkit-filter: blur(${localStorage.getItem('blur')}px) brightness(${localStorage.getItem('brightness')}%);`
         ); 
         preloader = null;
 
         // wait before showing photoinformation, should make this better with state or something later but lazy
-        if (this.state.photoInfo.hidden === false) {
+        if (this.state.photoInfo.hidden !== false) {
           setTimeout(() => {
             document.querySelector('.photoInformation').style.display = 'block';
           }, 800);
@@ -96,7 +90,7 @@ export default class Background extends React.PureComponent {
     } else {
       document.querySelector('#backgroundImage').setAttribute(
         'style',
-        `${this.state.style}; -webkit-filter: blur(${localStorage.getItem('blur')}px) brightness(${brightness}%);`
+        `${this.state.style}; -webkit-filter: blur(${localStorage.getItem('blur')}px) brightness(${localStorage.getItem('brightness')}%);`
       );
     }
   }

src/components/widgets/background/Favourite.jsx

@@ -9,15 +9,15 @@ export default class Favourite extends React.PureComponent {
   constructor() {
     super();
     this.state = {
-      favourited: (localStorage.getItem('favourite')) ? <StarIcon onClick={() => this.favourite()} className='topicons' /> : <StarIcon2 onClick={() => this.favourite()}  className='topicons' />
+      favourited: (localStorage.getItem('favourite')) ? <StarIcon onClick={this.favourite} className='topicons' /> : <StarIcon2 onClick={this.favourite}  className='topicons' />
     };
   }
 
-  favourite() {
+  favourite = () => {
     if (localStorage.getItem('favourite')) {
       localStorage.removeItem('favourite');
       this.setState({
-        favourited: <StarIcon2 onClick={() => this.favourite()} className='topicons' />
+        favourited: <StarIcon2 onClick={this.favourite} className='topicons' />
       });
     } else {
       const url = document.getElementById('backgroundImage').style.backgroundImage.replace('url("', '').replace('")', '');
@@ -26,13 +26,13 @@ export default class Favourite extends React.PureComponent {
       localStorage.setItem('favourite', JSON.stringify({ url: url, credit: credit }));
 
       this.setState({
-        favourited: <StarIcon onClick={() => this.favourite()} className='topicons' />
+        favourited: <StarIcon onClick={this.favourite} className='topicons' />
       });
     }
   }
 
   render() {
-    if (localStorage.getItem('background') === 'false' || localStorage.getItem('customBackgroundColour') || localStorage.getItem('customBackground')) {
+    if (localStorage.getItem('backgroundType') === 'colour') {
       return null;
     }
 

src/components/widgets/background/Maximise.jsx

@@ -19,9 +19,9 @@ export default class View extends React.PureComponent {
     );
   }
 
-  viewStuff() {
+  maximise = () => {
     // elements to hide
-    const elements = ['.searchBar', '.clock', '.greeting', '.quotediv', 'time', '.quicklinks-container', '.weather'];
+    const elements = ['.searchBar', '.clock', '.greeting', '.quotediv', 'time', '.quicklinks-container', '.weather', '.date'];
 
     elements.forEach((element) => {
       try {
@@ -47,13 +47,9 @@ export default class View extends React.PureComponent {
   }
 
   render() {
-    if (localStorage.getItem('background') === 'false') {
-      return null;
-    }
-
     return (
-      <Tooltip title='View' placement='top'>
-        <FullscreenIcon onClick={() => this.viewStuff()} className='topicons' />
+      <Tooltip title={window.language.modals.main.settings.sections.background.buttons.view} placement='top'>
+        <FullscreenIcon onClick={this.maximise} className='topicons' />
       </Tooltip>
     );
   }

src/components/widgets/background/PhotoInformation.jsx

@@ -8,9 +8,8 @@ import Photographer from '@material-ui/icons/Person';
 import Download from '@material-ui/icons/GetApp';
 
 const toDataURL = async (url) => {
-  const response = await fetch(url);
-  const blob = await response.blob();
-  return URL.createObjectURL(blob);
+  const res = await fetch(url);
+  return URL.createObjectURL(await res.blob());
 };
 
 const downloadImage = async (info) => {
@@ -31,7 +30,7 @@ export default function PhotoInformation(props) {
   }
 
   return (
-    <div className='photoInformation' style={{'display': 'none'}}>
+    <div className='photoInformation' style={{ 'display': 'none' }}>
       <h1>{language.credit} <span id='credit'>{props.info.credit}</span></h1>
       <Info className='photoInformationHover'/>
       <div className={props.className || 'infoCard'}>

src/components/widgets/greeting/Greeting.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import dtf from '@eartharoid/dtf';
+import dtf from '../../../modules/helpers/date';
 
 import './greeting.scss';
 

src/components/widgets/navbar/Navbar.jsx

@@ -8,7 +8,7 @@ import Report from '@material-ui/icons/SmsFailed';
 import Tooltip from '@material-ui/core/Tooltip';
 
 import Notes from './Notes';
-import View from '../background/Maximise';
+import Maximise from '../background/Maximise';
 import Favourite from '../background/Favourite';
 
 import './scss/index.scss';
@@ -16,10 +16,12 @@ import './scss/index.scss';
 export default function Navbar(props) {
   const language = window.language;
 
+  const backgroundEnabled = (localStorage.getItem('background') === 'true');
+
   return (
     <div className='navbar-container'>
-      {(localStorage.getItem('view') === 'true') ? <View/> :null}
-      {(localStorage.getItem('favouriteEnabled') === 'true') ? <Favourite/> :null}
+      {(localStorage.getItem('view') === 'true' && backgroundEnabled) ? <Maximise/> :null}
+      {(localStorage.getItem('favouriteEnabled') === 'true' && backgroundEnabled) ? <Favourite/> :null}
   
       {(localStorage.getItem('notesEnabled') === 'true') ?
         <div className='notes'>

src/components/widgets/time/Date.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import dtf from '@eartharoid/dtf';
+import dtf from '../../../modules/helpers/date';
 
 export default class DateWidget extends React.PureComponent {
   constructor() {
@@ -100,6 +100,6 @@ export default class DateWidget extends React.PureComponent {
   }
 
   render() {
-    return <span style={{ 'textTransform': 'capitalize', 'fontWeight': 'bold' }}>{this.state.date} <br/> {this.state.weekNumber}</span>;
+    return <span className='date' style={{ 'textTransform': 'capitalize', 'fontWeight': 'bold' }}>{this.state.date} <br/> {this.state.weekNumber}</span>;
   }
 }