diff options
Diffstat (limited to 'master/client/src/components')
| -rw-r--r-- | master/client/src/components/G7Map.vue | 165 | 
1 files changed, 142 insertions, 23 deletions
diff --git a/master/client/src/components/G7Map.vue b/master/client/src/components/G7Map.vue index 6a887b1..771756a 100644 --- a/master/client/src/components/G7Map.vue +++ b/master/client/src/components/G7Map.vue @@ -3,43 +3,161 @@  		<img src="g7-map.svg">  		<div class="rooms">  			<span class="title">Rooms</span> -			<ol> +			<ul>  				<li  					:key="room" -					v-for="room in rooms" +					v-for="[index, room] in Object.entries(rooms)"  				> -					{{ room }} +					{{ index }}. {{ room }}  				</li> -			</ol> +			</ul> +		</div> +		<div> +			{{ minion_data_arr }}  		</div>  	</div>  </template>  <script lang="ts"> -import { defineComponent } from "vue"; +import { defineComponent, Ref, ref } from "vue"; + +type MinionInfo = { +	ip_address: string +	position: number +}; + +type MinionInfoResponse = { +	data: MinionInfo[] +} + +type MinionTemperatureResponse = { +    data: { temperature: number } | null +    error: string | null +} + +type MinionData = { +	temperature: number +	position: number +} + +const rooms = { +	1: "Studio / G3", +	2: "Studio 1", +	3: "Hall", +	4: "Studio 2", +	5: "Studio 3", +	6: "Grupprum", +	7: "Verkstad", +	8: "Serverrum", +	9: "Kurator", +	10: "Pannrum", +	11: "Toalett", +	12: "Inspelningsbås", +	13: "G2", +	14: "Trapphus" +};  export default defineComponent(  	{  		name: "G7Map",  		data() {  			return { -				rooms: [ -					"Studio / G3", -					"Studio 1", -					"Hall", -					"Studio 2", -					"Studio 3", -					"Grupprum", -					"Verkstad", -					"Serverrum", -					"Kurator", -					"Pannrum", -					"Toalett", -					"Inspelningsbås", -					"G2", -					"Trapphus" -				] +				rooms: rooms  			}; +		}, +		setup(props) { +			const minion_data_arr: Ref<MinionData[]> = ref([]); + +			async function fetch_minion_ip_addresses() { +				let response: Response; + +				const api_endpoint_url = +					`${window.location.protocol}//${window.location.host}/api/v1/minions`; + +				try { +					response = await fetch(api_endpoint_url); +				} +				catch (err) { +					const error = err as Error; + +					throw Error(`Failed to fetch minion IP addresses. ${error.message}`); +				} + +				const data = await response.json() as MinionInfoResponse; + +				if(!response.ok) { +					throw Error( +						"Failed to get minion IP addresses. Responded with status " + +						`${response.status}` +					); +				} + +				return data.data; +			} + +			async function fetch_minion_temperature( +				minion_name: string, +				minion_ip_address: string +			) { +				let response: Response; + +				try { +					response = await fetch(`http://${minion_ip_address}`); +				} +				catch (err) { +					const error = err as Error; + +					throw Error( +						`Failed to fetch temperature for minion "${minion_name}". ` + +                        `${error.message}` +					); +				} + +				const data = await response.json() as MinionTemperatureResponse; + +				if(!response.ok) { +					if(data.error !== null) { +						throw Error( +							`Minion "${minion_name}" responded with status ` + +                                `${response.status} and error "${data.error}"` +						); +					} + +					throw Error( +						`Minion "${minion_name}" responded with status ` + +                                `${response.status} and a unknown error` +					); +				} + +				if(data.data == null) { +					throw Error(`Minion "${minion_name}" has no data in response`); +				} + +				return data.data.temperature; +			} + +			async function fetch_all_minion_data() { +				const minion_info_arr = await fetch_minion_ip_addresses(); + +				const minion_data_arr_buf: MinionData[] = []; + +				for(const minion_info of minion_info_arr) { +					const temperature = +						await fetch_minion_temperature("lol", minion_info.ip_address); + +					minion_data_arr_buf.push({ +						temperature: temperature, +						position: minion_info.position +					}); +				} + +				minion_data_arr.value = minion_data_arr_buf; +			} + +			return { minion_data_arr, fetch_all_minion_data }; +		}, +		created() { +			this.fetch_all_minion_data();  		}  	}  ); @@ -65,8 +183,9 @@ export default defineComponent(      .rooms {          min-width: 40%; -        ol li { -            line-height: 1.75em; +        ul li { +			line-height: 1.75em; +			list-style: none;          }          .title {  | 
