2024-02-18 23:05:15 +00:00
|
|
|
import variables from 'config/variables';
|
2023-03-21 19:59:16 +00:00
|
|
|
import { PureComponent } from 'react';
|
2022-04-07 09:25:01 +00:00
|
|
|
import { MdStar, MdStarBorder } from 'react-icons/md';
|
2021-01-17 18:07:26 +00:00
|
|
|
|
2023-03-16 11:11:18 +00:00
|
|
|
class Favourite extends PureComponent {
|
2021-07-12 10:34:05 +00:00
|
|
|
buttons = {
|
2022-04-08 13:48:36 +00:00
|
|
|
favourited: <MdStar onClick={() => this.favourite()} className="topicons" />,
|
|
|
|
unfavourited: <MdStarBorder onClick={() => this.favourite()} className="topicons" />,
|
|
|
|
};
|
2021-07-12 10:34:05 +00:00
|
|
|
|
2021-03-23 13:10:34 +00:00
|
|
|
constructor() {
|
|
|
|
super();
|
2021-03-17 13:01:53 +00:00
|
|
|
this.state = {
|
2022-04-08 13:48:36 +00:00
|
|
|
favourited: localStorage.getItem('favourite')
|
|
|
|
? this.buttons.favourited
|
|
|
|
: this.buttons.unfavourited,
|
2021-03-17 13:01:53 +00:00
|
|
|
};
|
|
|
|
}
|
2020-09-16 11:32:09 +00:00
|
|
|
|
2022-11-19 22:28:45 +00:00
|
|
|
async favourite() {
|
2021-03-17 13:01:53 +00:00
|
|
|
if (localStorage.getItem('favourite')) {
|
|
|
|
localStorage.removeItem('favourite');
|
|
|
|
this.setState({
|
2022-04-08 13:48:36 +00:00
|
|
|
favourited: this.buttons.unfavourited,
|
2021-03-17 13:01:53 +00:00
|
|
|
});
|
2024-03-18 22:08:08 +00:00
|
|
|
this.props.tooltipText(variables.getMessage('widgets.quote.favourite'));
|
2021-09-28 22:04:04 +00:00
|
|
|
variables.stats.postEvent('feature', 'Background favourite');
|
2021-03-17 13:01:53 +00:00
|
|
|
} else {
|
2021-11-11 20:43:33 +00:00
|
|
|
const type = localStorage.getItem('backgroundType');
|
2022-04-16 18:25:42 +00:00
|
|
|
|
2021-11-11 20:43:33 +00:00
|
|
|
switch (type) {
|
|
|
|
case 'colour':
|
|
|
|
return;
|
|
|
|
case 'random_colour':
|
|
|
|
case 'random_gradient':
|
2022-04-08 13:48:36 +00:00
|
|
|
localStorage.setItem(
|
|
|
|
'favourite',
|
|
|
|
JSON.stringify({
|
|
|
|
type: localStorage.getItem('backgroundType'),
|
|
|
|
url: document.getElementById('backgroundImage').style.background,
|
|
|
|
}),
|
|
|
|
);
|
2021-11-11 20:43:33 +00:00
|
|
|
break;
|
|
|
|
default:
|
2022-11-19 22:28:45 +00:00
|
|
|
let url = document
|
2022-04-08 13:48:36 +00:00
|
|
|
.getElementById('backgroundImage')
|
|
|
|
.style.backgroundImage.replace('url("', '')
|
|
|
|
.replace('")', '')
|
|
|
|
.replace(variables.constants.DDG_IMAGE_PROXY, '');
|
2021-03-17 13:01:53 +00:00
|
|
|
|
2021-11-11 20:43:33 +00:00
|
|
|
if (!url) {
|
|
|
|
return;
|
|
|
|
}
|
2021-08-20 10:52:05 +00:00
|
|
|
|
2022-11-19 22:28:45 +00:00
|
|
|
if (url.startsWith('blob:')) {
|
|
|
|
const reader = new FileReader();
|
2022-11-26 21:32:50 +00:00
|
|
|
url = await new Promise(async (resolve) => {
|
2022-11-19 22:28:45 +00:00
|
|
|
reader.onloadend = () => resolve(reader.result);
|
|
|
|
reader.readAsDataURL(await (await fetch(url)).blob());
|
2022-11-26 21:32:50 +00:00
|
|
|
});
|
2022-11-19 22:28:45 +00:00
|
|
|
}
|
|
|
|
|
2021-11-11 20:43:33 +00:00
|
|
|
if (type === 'custom') {
|
2022-04-08 13:48:36 +00:00
|
|
|
localStorage.setItem(
|
|
|
|
'favourite',
|
|
|
|
JSON.stringify({
|
|
|
|
type,
|
|
|
|
url,
|
|
|
|
}),
|
|
|
|
);
|
2021-11-11 20:43:33 +00:00
|
|
|
} else {
|
|
|
|
// photo information now hides information if it isn't sent, unless if photoinformation hover is hidden
|
|
|
|
const location = document.getElementById('infoLocation');
|
|
|
|
const camera = document.getElementById('infoCamera');
|
2022-04-08 13:48:36 +00:00
|
|
|
|
|
|
|
localStorage.setItem(
|
|
|
|
'favourite',
|
|
|
|
JSON.stringify({
|
|
|
|
type,
|
|
|
|
url,
|
2023-02-17 15:25:04 +00:00
|
|
|
credit: this.props.credit || '',
|
2022-11-19 22:28:45 +00:00
|
|
|
location: location?.innerText,
|
|
|
|
camera: camera?.innerText,
|
2022-04-08 13:48:36 +00:00
|
|
|
resolution: document.getElementById('infoResolution').textContent || '',
|
2023-02-17 15:25:04 +00:00
|
|
|
offline: this.props.offline,
|
|
|
|
pun: this.props.pun,
|
2022-04-08 13:48:36 +00:00
|
|
|
}),
|
|
|
|
);
|
2021-11-11 20:43:33 +00:00
|
|
|
}
|
|
|
|
}
|
2021-03-17 13:01:53 +00:00
|
|
|
|
|
|
|
this.setState({
|
2022-04-08 13:48:36 +00:00
|
|
|
favourited: this.buttons.favourited,
|
2021-03-17 13:01:53 +00:00
|
|
|
});
|
2024-03-18 22:08:08 +00:00
|
|
|
this.props.tooltipText(variables.getMessage('widgets.quote.unfavourite'));
|
2021-09-28 22:04:04 +00:00
|
|
|
variables.stats.postEvent('feature', 'Background unfavourite');
|
2021-03-17 13:01:53 +00:00
|
|
|
}
|
2020-09-16 11:32:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
2022-04-16 18:25:42 +00:00
|
|
|
if (localStorage.getItem('backgroundType') === 'colour') {
|
2021-01-16 22:43:46 +00:00
|
|
|
return null;
|
|
|
|
}
|
2021-03-17 13:01:53 +00:00
|
|
|
|
2024-03-18 22:08:08 +00:00
|
|
|
this.props.tooltipText(
|
|
|
|
localStorage.getItem('favourite')
|
|
|
|
? variables.getMessage('widgets.quote.unfavourite')
|
|
|
|
: variables.getMessage('widgets.quote.favourite'),
|
|
|
|
);
|
|
|
|
|
2022-08-31 12:31:49 +00:00
|
|
|
return this.state.favourited;
|
2020-09-16 11:32:09 +00:00
|
|
|
}
|
2021-03-17 13:01:53 +00:00
|
|
|
}
|
2023-03-16 11:11:18 +00:00
|
|
|
|
2023-03-16 11:15:37 +00:00
|
|
|
export default Favourite;
|