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

export default {
	components: {
		spotIcon
	},
	props: {
		localTime: String,
		siteTime: String,
		offset: String,
		classes: String,
		icon: String,
		iconClasses: String
	},
	inject: ['spot'],
	computed: {
		title() {
			if(this.localTime != this.siteTime) return this.spot.lang('your_time', this.siteTime.slice(-5)) + ((this.offset != '0')?' ('+this.spot.lang('unit_d')+this.offset+')':'');
		},
		spotIconClasses() {
			return this.iconClasses || 'fa-fw fa-lg';
		}
	}
}
</script>

<template>
	<spotIcon v-if="icon" :icon="icon" :classes="spotIconClasses" :title="title" :text="localTime" />
	<span v-else :class="classes" :title="title">{{ localTime }}</span>
</template>