<script>
import spotIcon from './spotIcon.vue';

export default {
	components: {
		spotIcon
	},
	props: {
		localTime: String,
		siteTime: String,
		offset: String,
		classes: String,
		icon: String,
		margin: String,
	},
	inject: ['lang'],
	computed: {
		title() {
			if(this.localTime != this.siteTime) return this.lang.get('time.user', this.siteTime.slice(-5)) + ((this.offset != '0')?' ('+this.lang.get('unit.day_short')+this.offset+')':'');
		}
	}
}
</script>

<template>
	<spotIcon v-if="icon" :icon="icon" :margin="margin" :title="title" :text="localTime" width="fixed" size="lg" />
	<span v-else :class="classes" :title="title">{{ localTime }}</span>
</template>
