unfinished date feature

src/components/widgets/Background.jsx

@@ -46,7 +46,7 @@ export default class Background extends React.PureComponent {
   }
 
   doOffline() { // Handles setting the background if the user is offline
-    const offlineImages = require('../../modules/offlineImages.json');
+    const offlineImages = require('../../modules/json/offline_images.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[
@@ -113,7 +113,7 @@ export default class Background extends React.PureComponent {
           this.setBackground(data.file);
           if (localStorage.getItem('backgroundAPI') === 'unsplash') return this.setCredit(data.photographer, 'unsplash', data.photographer_page);
           this.setCredit(data.photographer);
-          document.getElementById('camera').textContent = data.camera;
+          document.getElementById('camera').textContent = data.camera || 'N/A';
           document.getElementById('resolution').textContent = data.resolution || 'N/A';
         }
 

src/components/widgets/Date.jsx

@@ -0,0 +1,68 @@
+import React from 'react';
+import dtf from '@eartharoid/dtf';
+
+export default class DateWidget extends React.PureComponent {
+  constructor(...args) {
+    super(...args);
+    this.state = {
+        date: ''
+    };
+  }
+
+  getDate() {
+    const date = new Date();
+
+    if (localStorage.getItem('dateFormat') === 'short') {
+      const dateDay = date.getDate();
+      const dateMonth = date.getMonth() + 1;
+      const dateYear = date.getFullYear();
+
+      let day = dateDay, month = dateMonth, year = dateYear;
+
+      switch (localStorage.getItem('dateFormat')) {
+        case 'MDY':
+          day = dateMonth;
+          month = dateDay;
+          break;
+        case 'YMD':
+          day = dateYear;
+          year = dateDay;
+          break;
+        default:
+          break;
+      }
+
+      let format;
+      switch (localStorage.getItem('shortFormat')) {
+        case 'dash':
+          format = `${day}-${month}-${year}`;
+          break;
+        case 'gaps':
+          format = `${day} - ${month} - ${year}`;
+          break;
+        default:
+          format = `${day}/${month}/${year}`;
+      }
+
+      this.setState({ date: format });
+    } else { // full date
+      const lang = localStorage.getItem('language');
+
+      const day = date.toLocaleDateString(lang, { weekday: 'long' });
+      const nth = dtf.nth(date.getDate());
+      const month = date.toLocaleDateString(lang, { month: 'long' });
+      const year = date.getFullYear();
+
+      this.setState({ date: `${day} ${nth} ${month} ${year}` });
+    }
+  }
+
+  componentDidMount() {
+    if (localStorage.getItem('date') === 'false') return;
+    this.getDate();
+  }
+
+  render() {
+    return <span style={{ 'text-transform': 'capitalize', 'font-weight': 'bold'}}>{this.state.date}</span>
+  }
+}

src/components/widgets/Notes.jsx

@@ -28,8 +28,6 @@ export default class Notes extends React.PureComponent {
     }
 
     render() {
-        const copyNotes = () => navigator.clipboard.writeText(this.state.notes);
-
         return (
             <span id='noteContainer' className='notescontainer'>
                 <div className='topbarnotes'>
@@ -38,7 +36,7 @@ export default class Notes extends React.PureComponent {
                 </div>
                 <TextareaAutosize rowsMax={50} placeholder={this.props.language.placeholder} value={this.state.notes} onChange={this.setNotes}/>
                 <button onClick={this.pin} className='pinNote'><Pin/></button>
-                <button onClick={copyNotes} className='saveNote'><CopyIcon/></button>
+                <button onClick={() => navigator.clipboard.writeText(this.state.notes)} className='saveNote'><CopyIcon/></button>
             </span>
         );
     }

src/components/widgets/Search.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import SearchIcon from '@material-ui/icons/Search';
 import MicIcon from '@material-ui/icons/Mic';
 
-const searchEngines = require('../../modules/searchEngines.json');
+const searchEngines = require('../../modules/json/search_engines.json');
 
 export default class Search extends React.PureComponent {
   constructor(...args) {