mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-26 18:21:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: custom background settings

Browse Source
This commit is contained in:
David Ralph
2021-09-08 21:30:03 +01:00
parent 102078744e
commit 2d7db1558d
1 changed files with 13 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/modals/main/settings/sections/background/Background.jsx
View File

@@ -44,7 +44,8 @@ export default class BackgroundSettings extends PureComponent {
this.forceUpdate(); this.forceUpdate();
localStorage.setItem('customBackground', JSON.stringify(customBackground)); localStorage.setItem('customBackground', JSON.stringify(customBackground));
EventBus.dispatch('refresh', 'background'); document.querySelector('.reminder-info').style.display = 'block';
localStorage.setItem('showReminder', true);
} }
addCustomBackground() { addCustomBackground() {
@@ -102,6 +103,15 @@ export default class BackgroundSettings extends PureComponent {
return data; return data;
} }
uploadCustombackground(index) {
document.getElementById('bg-input').setAttribute('index', index);
document.getElementById('bg-input').click();
// to fix loadFunction
this.setState({
currentBackgroundIndex: index
});
}
async getBackgroundCategories() { async getBackgroundCategories() {
const data = await (await fetch(window.constants.API_URL + '/images/categories', { signal: this.controller.signal })).json(); const data = await (await fetch(window.constants.API_URL + '/images/categories', { signal: this.controller.signal })).json();
@@ -191,13 +201,13 @@ export default class BackgroundSettings extends PureComponent {
<Fragment key={index}> <Fragment key={index}>
{this.state.customBackground.length > 1 ? <button className='reset round round-small' onClick={() => this.removeCustomBackground(index)}>x</button> : null} {this.state.customBackground.length > 1 ? <button className='reset round round-small' onClick={() => this.removeCustomBackground(index)}>x</button> : null}
<input type='text' value={this.state.customBackground[index]} onChange={(e) => this.customBackground(e, true, index)}></input> <input type='text' value={this.state.customBackground[index]} onChange={(e) => this.customBackground(e, true, index)}></input>
<span className='modalLink' onClick={() => document.getElementById('bg-input').click(index)}>{background.source.upload}</span> <span className='modalLink' onClick={() => this.uploadCustombackground(index)}>{background.source.upload}</span>
{this.videoCustomSettings(index)} {this.videoCustomSettings(index)}
<br/><br/> <br/><br/>
</Fragment> </Fragment>
))} ))}
<button className='uploadbg' onClick={() => this.addCustomBackground()}>Add</button> <button className='uploadbg' onClick={() => this.addCustomBackground()}>Add</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)} /> <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)} />
</ul> </ul>
</> </>
); );