Added pfp in player list; added sizing in outer div
This commit is contained in:
parent
31db2f0fc1
commit
b306ff49d8
|
|
@ -1,4 +1,5 @@
|
|||
<script setup>
|
||||
import ProfilePicture from '@/components/blocks/ProfilePicture.vue';
|
||||
|
||||
const props = defineProps({
|
||||
player: Object,
|
||||
|
|
@ -18,6 +19,13 @@ const props = defineProps({
|
|||
|
||||
const emit = defineEmits(["manualPointsAdjustment", "answerRuled", "revealPlayerAnswer", "letPlayerChoose"]);
|
||||
|
||||
let protocol = ('https:' == document.location.protocol ? 'https://' : 'http://');
|
||||
let hostname = window.location.hostname;
|
||||
if( window.location.hostname.includes("localhost" ) ){
|
||||
hostname += ':3000';
|
||||
}
|
||||
const API_URL = `${protocol}${hostname}/api`;
|
||||
|
||||
function revealAnswer(){
|
||||
emit("revealPlayerAnswer", props.player._id);
|
||||
}
|
||||
|
|
@ -33,13 +41,20 @@ function letPlayerChoose(){
|
|||
<div class="card-body p-2">
|
||||
<div class="row">
|
||||
<div class="col position-relative">
|
||||
<h5 class="mb-0 text-truncate">
|
||||
<div class="d-flex justify-content-start align-content-center">
|
||||
<template v-if="props.player.isAnswering">
|
||||
<span class="align-self-center me-2">
|
||||
<font-awesome-layers :title="'Player is answering'">
|
||||
<font-awesome-icon class="text-pink-accent-primary" icon="fa-solid fa-square" size="lg" fade style="--fa-animation-duration:2s" />
|
||||
<font-awesome-icon class="text-white" icon="fa-solid fa-angle-right" size="sm" />
|
||||
</font-awesome-layers>
|
||||
</span>
|
||||
</template>
|
||||
<ProfilePicture
|
||||
:sizing="'2em'"
|
||||
:srcOverride="API_URL + '/user/pfp/' + props.player.pfpFilename"
|
||||
/>
|
||||
<h5 class="mb-0 ms-2 text-truncate align-self-center">
|
||||
{{ props.player.name }}
|
||||
</h5>
|
||||
<span
|
||||
|
|
@ -50,6 +65,7 @@ function letPlayerChoose(){
|
|||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="props.isHost || props.player.currentTextAnswer" class="row mt-2">
|
||||
<div class="col-sm-2 text-nowrap">
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ const pfpSrc = computed( () => {
|
|||
|
||||
<template>
|
||||
<div>
|
||||
<div class="border border-1 border-white rounded-3 overflow-hidden">
|
||||
<div class="border border-1 border-white rounded-3 overflow-hidden" :style="[ { 'width': props.sizing }, { 'height': props.sizing } ]" >
|
||||
<img :src="pfpSrc" alt="Profile Picture of the user" class="pfp" :style="[ { 'width': props.sizing }, { 'height': props.sizing } ]" />
|
||||
<div v-show="props.isPreview" class="position-relative">
|
||||
<span class="position-absolute bottom-0 end-0 bg-black bg-opacity-50 px-1 rounded-2">
|
||||
|
|
|
|||
Loading…
Reference in New Issue