Fix
This commit is contained in:
parent
3a26acbdb2
commit
fab0cc51b3
13 changed files with 17 additions and 24 deletions
|
@ -153,7 +153,7 @@ export default Vue.extend({
|
|||
|
||||
thumbnail(file: any): any {
|
||||
return {
|
||||
'background-color': file.properties.avgColor && file.properties.avgColor.length == 3 ? `rgb(${file.properties.avgColor.join(',')})` : 'transparent',
|
||||
'background-color': file.properties.avgColor || 'transparent',
|
||||
'background-image': `url(${file.thumbnailUrl})`
|
||||
};
|
||||
},
|
||||
|
|
|
@ -55,12 +55,7 @@ export default Vue.extend({
|
|||
},
|
||||
icon(): any {
|
||||
return {
|
||||
backgroundColor: this.user.avatarColor ? this.lightmode
|
||||
? this.user.avatarColor
|
||||
: this.user.avatarColor.startsWith('rgb(')
|
||||
? this.user.avatarColor
|
||||
: null
|
||||
: null,
|
||||
backgroundColor: this.user.avatarColor,
|
||||
backgroundImage: this.lightmode ? null : `url(${this.url})`,
|
||||
borderRadius: this.$store.state.settings.circleIcons ? '100%' : null
|
||||
};
|
||||
|
|
|
@ -111,9 +111,7 @@ export default Vue.extend({
|
|||
: false;
|
||||
},
|
||||
background(): string {
|
||||
return this.file.properties.avgColor && this.file.properties.avgColor.length == 3
|
||||
? `rgb(${this.file.properties.avgColor.join(',')})`
|
||||
: 'transparent';
|
||||
return this.file.properties.avgColor || 'transparent';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
@ -122,10 +120,10 @@ export default Vue.extend({
|
|||
},
|
||||
methods: {
|
||||
onThumbnailLoaded() {
|
||||
if (this.file.properties.avgColor && this.file.properties.avgColor.length == 3) {
|
||||
if (this.file.properties.avgColor) {
|
||||
anime({
|
||||
targets: this.$refs.thumbnail,
|
||||
backgroundColor: `rgba(${this.file.properties.avgColor.join(',')}, 0)`,
|
||||
backgroundColor: this.file.properties.avgColor.replace('255)', '0)'),
|
||||
duration: 100,
|
||||
easing: 'linear'
|
||||
});
|
||||
|
|
|
@ -52,7 +52,7 @@ export default Vue.extend({
|
|||
}
|
||||
|
||||
return {
|
||||
'background-color': this.image.properties.avgColor && this.image.properties.avgColor.length == 3 ? `rgb(${this.image.properties.avgColor.join(',')})` : 'transparent',
|
||||
'background-color': this.image.properties.avgColor || 'transparent',
|
||||
'background-image': url
|
||||
};
|
||||
}
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<div class="file" v-if="message.file">
|
||||
<a :href="message.file.url" target="_blank" :title="message.file.name">
|
||||
<img v-if="message.file.type.split('/')[0] == 'image'" :src="message.file.url" :alt="message.file.name"
|
||||
:style="{ backgroundColor: message.file.properties.avgColor && message.file.properties.avgColor.length == 3 ? `rgb(${message.file.properties.avgColor.join(',')})` : 'transparent' }"/>
|
||||
:style="{ backgroundColor: message.file.properties.avgColor || 'transparent' }"/>
|
||||
<p v-else>{{ message.file.name }}</p>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -165,7 +165,7 @@ export default Vue.extend({
|
|||
bannerStyle(): any {
|
||||
if (this.$store.state.i.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundColor: this.$store.state.i.bannerColor ? this.$store.state.i.bannerColor : null,
|
||||
backgroundColor: this.$store.state.i.bannerColor,
|
||||
backgroundImage: `url(${ this.$store.state.i.bannerUrl })`
|
||||
};
|
||||
},
|
||||
|
|
|
@ -88,7 +88,7 @@ export default Vue.extend({
|
|||
if (this.user == null) return {};
|
||||
if (this.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundColor: this.user.bannerColor && this.user.bannerColor.length == 3 ? `rgb(${ this.user.bannerColor.join(',') })` : null,
|
||||
backgroundColor: this.user.bannerColor,
|
||||
backgroundImage: `url(${ this.user.bannerUrl })`
|
||||
};
|
||||
},
|
||||
|
|
|
@ -57,7 +57,7 @@ export default Vue.extend({
|
|||
bannerStyle(): any {
|
||||
if (this.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundColor: this.user.bannerColor && this.user.bannerColor.length == 3 ? `rgb(${ this.user.bannerColor.join(',') })` : null,
|
||||
backgroundColor: this.user.bannerColor,
|
||||
backgroundImage: `url(${ this.user.bannerUrl })`
|
||||
};
|
||||
}
|
||||
|
|
|
@ -139,10 +139,10 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
onThumbnailLoaded() {
|
||||
if (this.file.properties.avgColor && this.file.properties.avgColor.length == 3) {
|
||||
if (this.file.properties.avgColor) {
|
||||
anime({
|
||||
targets: this.$refs.thumbnail,
|
||||
backgroundColor: `rgba(${this.file.properties.avgColor.join(',')}, 0)`,
|
||||
backgroundColor: this.file.properties.avgColor.replace('255)', '0)'),
|
||||
duration: 100,
|
||||
easing: 'linear'
|
||||
});
|
||||
|
|
|
@ -65,7 +65,7 @@ export default Vue.extend({
|
|||
style(): any {
|
||||
if (this.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundColor: this.user.bannerColor && this.user.bannerColor.length == 3 ? `rgb(${ this.user.bannerColor.join(',') })` : null,
|
||||
backgroundColor: this.user.bannerColor,
|
||||
backgroundImage: `url(${ this.user.bannerUrl })`
|
||||
};
|
||||
},
|
||||
|
|
|
@ -85,8 +85,8 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
style(): any {
|
||||
return this.file.properties.avgColor && this.file.properties.avgColor.length == 3 ? {
|
||||
'background-color': `rgb(${ this.file.properties.avgColor.join(',') })`
|
||||
return this.file.properties.avgColor ? {
|
||||
'background-color': this.file.properties.avgColor
|
||||
} : {};
|
||||
},
|
||||
|
||||
|
|
|
@ -114,7 +114,7 @@ export default Vue.extend({
|
|||
style(): any {
|
||||
if (this.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundColor: this.user.bannerColor && this.user.bannerColor.length == 3 ? `rgb(${ this.user.bannerColor.join(',') })` : null,
|
||||
backgroundColor: this.user.bannerColor,
|
||||
backgroundImage: `url(${ this.user.bannerUrl })`
|
||||
};
|
||||
}
|
||||
|
|
|
@ -356,7 +356,7 @@ export default async function(
|
|||
|
||||
logger.debug(`average color is calculated: ${r}, ${g}, ${b}`);
|
||||
|
||||
const value = info.isOpaque ? `rgb(${r},${g},${b})` : `rgba(${r},${g},${b},255)`;
|
||||
const value = info.isOpaque ? `rgba(${r},${g},${b},0)` : `rgba(${r},${g},${b},255)`;
|
||||
|
||||
properties['avgColor'] = value;
|
||||
} catch (e) { }
|
||||
|
|
Loading…
Reference in a new issue