feat: background interval for custom

This commit is contained in:
David Ralph
2021-09-19 20:10:22 +01:00
parent cbbc911cc3
commit 52745a267f
2 changed files with 28 additions and 13 deletions

View File

@@ -154,6 +154,21 @@ export default class BackgroundSettings extends PureComponent {
}
];
const interval = (
<>
<br/><br/>
<Dropdown label={getMessage('modals.main.settings.sections.background.interval.title')} name='backgroundchange'>
<option value='refresh'>{getMessage('tabname')}</option>
<option value='60000'>{getMessage('modals.main.settings.sections.background.interval.minute')}</option>
<option value='1800000'>{getMessage('modals.main.settings.sections.background.interval.half_hour')}</option>
<option value='3600000'>{getMessage('modals.main.settings.sections.background.interval.hour')}</option>
<option value='86400000'>{getMessage('modals.main.settings.sections.background.interval.day')}</option>
<option value='604800000'>{getMessage('widgets.date.week')}</option>
<option value='2628000000'>{getMessage('modals.main.settings.sections.background.interval.month')}</option>
</Dropdown>
</>
);
const APISettings = (
<>
<br/>
@@ -171,16 +186,7 @@ export default class BackgroundSettings extends PureComponent {
<option value='normal'>{getMessage('modals.main.settings.sections.background.source.quality.normal')}</option>
<option value='datasaver'>{getMessage('modals.main.settings.sections.background.source.quality.datasaver')}</option>
</Dropdown>
<br/><br/>
<Dropdown label={getMessage('modals.main.settings.sections.background.interval.title')} name='backgroundchange'>
<option value='refresh'>{getMessage('tabname')}</option>
<option value='60000'>{getMessage('modals.main.settings.sections.background.interval.minute')}</option>
<option value='1800000'>{getMessage('modals.main.settings.sections.background.interval.half_hour')}</option>
<option value='3600000'>{getMessage('modals.main.settings.sections.background.interval.hour')}</option>
<option value='86400000'>{getMessage('modals.main.settings.sections.background.interval.day')}</option>
<option value='604800000'>{getMessage('widgets.date.week')}</option>
<option value='2628000000'>{getMessage('modals.main.settings.sections.background.interval.month')}</option>
</Dropdown>
{interval}
</>
);
@@ -201,6 +207,7 @@ export default class BackgroundSettings extends PureComponent {
))}
<button className='uploadbg' onClick={() => this.modifyCustomBackground('add')}>{getMessage('modals.main.settings.sections.background.source.add_background')}</button>
<FileUpload id='bg-input' accept='image/jpeg, image/png, image/webp, image/webm, image/gif, video/mp4, video/webm, video/ogg' loadFunction={(e) => this.customBackground(e, false, this.state.currentBackgroundIndex)} />
{interval}
</ul>
</>
);

View File

@@ -210,14 +210,18 @@ export default class Background extends PureComponent {
}
if (customBackground !== '' && customBackground !== 'undefined' && customBackground !== ['']) {
this.setState({
const object = {
url: customBackground,
type: 'custom',
video: videoCheck(customBackground),
photoInfo: {
hidden: true
}
});
};
this.setState(object);
localStorage.setItem('currentBackground', JSON.stringify(object));
}
break;
@@ -338,7 +342,8 @@ export default class Background extends PureComponent {
const interval = localStorage.getItem('backgroundchange');
if (interval && interval !== 'refresh') {
if (localStorage.getItem('backgroundType') === 'api') {
const type = localStorage.getItem('backgroundType')
if (type === 'api' || type === 'custom') {
Interval(() => {
try {
document.getElementById('backgroundImage').classList.remove('fade-in');
@@ -352,6 +357,9 @@ export default class Background extends PureComponent {
try {
// todo: refactor this mess
const current = JSON.parse(localStorage.getItem('currentBackground'));
if (current.type !== type) {
this.getBackground();
}
const offline = localStorage.getItem('offlineMode');
if (current.url.startsWith('http') && offline === 'false') {
this.setState(current);