mirror of https://github.com/mue/mue.git
refactor: once again move background utils, this time to api
This commit is contained in:
parent
a049cb297d
commit
12248db893
|
@ -2,7 +2,7 @@ import variables from 'config/variables';
|
||||||
import { PureComponent } from 'react';
|
import { PureComponent } from 'react';
|
||||||
import { toast } from 'react-toastify';
|
import { toast } from 'react-toastify';
|
||||||
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
||||||
import { videoCheck } from 'utils/background';
|
import videoCheck from 'features/background/api/videoCheck';
|
||||||
|
|
||||||
class FileUpload extends PureComponent {
|
class FileUpload extends PureComponent {
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
|
|
@ -6,14 +6,12 @@ import { PureComponent } from 'react';
|
||||||
import PhotoInformation from './components/PhotoInformation';
|
import PhotoInformation from './components/PhotoInformation';
|
||||||
|
|
||||||
import EventBus from 'utils/eventbus';
|
import EventBus from 'utils/eventbus';
|
||||||
import {
|
|
||||||
videoCheck,
|
|
||||||
offlineBackground,
|
|
||||||
randomColourStyleBuilder,
|
|
||||||
supportsAVIF,
|
|
||||||
} from 'utils/background';
|
|
||||||
|
|
||||||
import { getGradient } from 'utils/background/gradient';
|
import { supportsAVIF } from './api/avif';
|
||||||
|
import { getOfflineImage } from './api/getOfflineImage';
|
||||||
|
import videoCheck from './api/videoCheck';
|
||||||
|
import { getGradient } from './api/gradient';
|
||||||
|
import { randomColourStyleBuilder } from './api/randomColour';
|
||||||
|
|
||||||
import './scss/index.scss';
|
import './scss/index.scss';
|
||||||
import { decodeBlurHash } from 'fast-blurhash';
|
import { decodeBlurHash } from 'fast-blurhash';
|
||||||
|
@ -128,7 +126,7 @@ export default class Background extends PureComponent {
|
||||||
data = await (await fetch(requestURL, { headers: { accept } })).json();
|
data = await (await fetch(requestURL, { headers: { accept } })).json();
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// if requesting to the API fails, we get an offline image
|
// if requesting to the API fails, we get an offline image
|
||||||
this.setState(offlineBackground('api'));
|
this.setState(getOfflineImage('api'));
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -201,7 +199,7 @@ export default class Background extends PureComponent {
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'api':
|
case 'api':
|
||||||
if (offline) {
|
if (offline) {
|
||||||
return this.setState(offlineBackground('api'));
|
return this.setState(getOfflineImage('api'));
|
||||||
}
|
}
|
||||||
|
|
||||||
// API background
|
// API background
|
||||||
|
@ -246,7 +244,7 @@ export default class Background extends PureComponent {
|
||||||
|
|
||||||
// allow users to use offline images
|
// allow users to use offline images
|
||||||
if (offline && !customBackground.startsWith('data:')) {
|
if (offline && !customBackground.startsWith('data:')) {
|
||||||
return this.setState(offlineBackground('custom'));
|
return this.setState(getOfflineImage('custom'));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
if (
|
||||||
|
@ -271,7 +269,7 @@ export default class Background extends PureComponent {
|
||||||
|
|
||||||
case 'photo_pack':
|
case 'photo_pack':
|
||||||
if (offline) {
|
if (offline) {
|
||||||
return this.setState(offlineBackground('photo_pack'));
|
return this.setState(getOfflineImage('photo_pack'));
|
||||||
}
|
}
|
||||||
|
|
||||||
const photofavourited = JSON.parse(localStorage.getItem('favourite'));
|
const photofavourited = JSON.parse(localStorage.getItem('favourite'));
|
||||||
|
@ -503,7 +501,7 @@ export default class Background extends PureComponent {
|
||||||
this.setState(current);
|
this.setState(current);
|
||||||
}
|
}
|
||||||
} else if (current.url.startsWith('http')) {
|
} else if (current.url.startsWith('http')) {
|
||||||
this.setState(offlineBackground());
|
this.setState(getOfflineImage());
|
||||||
}
|
}
|
||||||
if (this.state.firstTime !== true) {
|
if (this.state.firstTime !== true) {
|
||||||
this.setState(current);
|
this.setState(current);
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import offlineImages from 'utils/data/offline_images.json';
|
import offlineImages from '../offline_images.json';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* It gets a random photographer from the offlineImages.json file, then gets a random image from that
|
* It gets a random photographer from the offlineImages.json file, then gets a random image from that
|
||||||
|
@ -12,7 +12,7 @@ import offlineImages from 'utils/data/offline_images.json';
|
||||||
* offline: A boolean that is true.
|
* offline: A boolean that is true.
|
||||||
* credit: A string that is the name of the photographer.
|
* credit: A string that is the name of the photographer.
|
||||||
*/
|
*/
|
||||||
export function offlineBackground(type) {
|
export function getOfflineImage(type) {
|
||||||
const photographers = Object.keys(offlineImages);
|
const photographers = Object.keys(offlineImages);
|
||||||
const photographer = photographers[Math.floor(Math.random() * photographers.length)];
|
const photographer = photographers[Math.floor(Math.random() * photographers.length)];
|
||||||
|
|
|
@ -4,7 +4,7 @@ import { ColorPicker } from '@muetab/react-color-gradient-picker';
|
||||||
import { toast } from 'react-toastify';
|
import { toast } from 'react-toastify';
|
||||||
import { Row, Content, Action } from '../../../components/Layout/Settings/Item/SettingsItem';
|
import { Row, Content, Action } from '../../../components/Layout/Settings/Item/SettingsItem';
|
||||||
|
|
||||||
import { hexToRgb, rgbToHex } from 'utils/background/gradient';
|
import { hexToRgb, rgbToHex } from '../api/gradient';
|
||||||
|
|
||||||
//import '@muetab/react-color-gradient-picker/dist/index.css';
|
//import '@muetab/react-color-gradient-picker/dist/index.css';
|
||||||
import '../scss/react-color-picker-gradient-picker-custom-styles.scss';
|
import '../scss/react-color-picker-gradient-picker-custom-styles.scss';
|
||||||
|
|
|
@ -11,7 +11,7 @@ import {
|
||||||
} from 'react-icons/md';
|
} from 'react-icons/md';
|
||||||
import EventBus from 'utils/eventbus';
|
import EventBus from 'utils/eventbus';
|
||||||
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
||||||
import { videoCheck } from 'utils/background';
|
import videoCheck from '../api/videoCheck';
|
||||||
|
|
||||||
import Checkbox from '../../../components/Form/Settings/Checkbox/Checkbox';
|
import Checkbox from '../../../components/Form/Settings/Checkbox/Checkbox';
|
||||||
import FileUpload from '../../../components/Form/Settings/FileUpload/FileUpload';
|
import FileUpload from '../../../components/Form/Settings/FileUpload/FileUpload';
|
||||||
|
|
|
@ -2,6 +2,7 @@ import variables from 'config/variables';
|
||||||
import { useState, memo } from 'react';
|
import { useState, memo } from 'react';
|
||||||
import { MdClose, MdOutlineAddLink } from 'react-icons/md';
|
import { MdClose, MdOutlineAddLink } from 'react-icons/md';
|
||||||
import { Tooltip } from 'components/Elements';
|
import { Tooltip } from 'components/Elements';
|
||||||
|
|
||||||
function CustomURLModal({ modalClose, urlError, modalCloseOnly }) {
|
function CustomURLModal({ modalClose, urlError, modalCloseOnly }) {
|
||||||
const [url, setURL] = useState();
|
const [url, setURL] = useState();
|
||||||
|
|
||||||
|
|
|
@ -1,6 +0,0 @@
|
||||||
import { supportsAVIF } from './avif';
|
|
||||||
import { offlineBackground } from './getOfflineImage';
|
|
||||||
import { randomColourStyleBuilder } from './randomColour';
|
|
||||||
import videoCheck from './videoCheck';
|
|
||||||
|
|
||||||
export { supportsAVIF, offlineBackground, randomColourStyleBuilder, videoCheck };
|
|
Loading…
Reference in New Issue