alice.pds.demo.boltless.dev
This repository has no description
1{{ define "user/fragments/picLink" }}
2 {{ $did := index . 0 }}
3 {{ $classes := index . 1 }}
4 {{ $handle := resolve $did }}
5 {{ $vr := false }}
6 {{ if ge (len .) 3 }}
7 {{ $vr = index . 2 }}
8 {{ end }}
9 <div class="relative inline-block"
10 {{ if $vr }}
11 onmouseenter="(function(el){
12 clearTimeout(el._pht);
13 el._pht = setTimeout(function(){
14 var r=el.getBoundingClientRect(),p=el.querySelector('[data-profile-popover]');
15 if(p){p.style.top=r.bottom+'px';p.style.left=r.left+'px';p.classList.remove('hidden');}
16 }, 500);
17 })(this)"
18 onmouseleave="(function(el){
19 clearTimeout(el._pht);
20 var p=el.querySelector('[data-profile-popover]');
21 if(!p)return;
22 var modal=document.getElementById('vouch-modal-'+p.dataset.vouchModalId);
23 if(modal&&modal.matches(':popover-open'))return;
24 p.classList.add('hidden');
25 })(this)"
26 {{ end }}>
27 <a href="/{{ $handle }}" title="{{ $handle }}"
28 {{ if $vr }}
29 hx-get="/profile/popover?did={{ $did }}"
30 hx-trigger="mouseenter once"
31 hx-target="next [data-profile-popover-content]"
32 hx-swap="innerHTML"
33 {{ end }}>
34 <img
35 src="{{ tinyAvatar $did }}"
36 alt=""
37 class="rounded-full border border-gray-300 dark:border-gray-700 {{ $classes }}"
38 />
39 </a>
40 {{ if $vr }}
41 {{ if ne $did $vr.ViewerDid }}
42 <button
43 type="button"
44 popovertarget="vouch-modal-{{ normalizeForHtmlId $vr.SubjectDid.String }}"
45 popovertargetaction="toggle"
46 class="absolute -bottom-0.5 -right-0.5 w-1/2 h-1/2 cursor-pointer"
47 title="{{ template "user/fragments/vouchTooltip" $vr }}">
48 {{ if $vr.IsDirectVouch }}
49 {{ template "fragments/icons/shield-direct-vouch" "w-full h-full" }}
50 {{ else if $vr.IsDirectDenounce }}
51 {{ template "fragments/icons/shield-direct-denounce" "w-full h-full" }}
52 {{ else if $vr.IsMixed }}
53 {{ template "fragments/icons/shield-mixed" "w-full h-full" }}
54 {{ else if $vr.IsIndirectVouch }}
55 {{ template "fragments/icons/shield-indirect-vouch" "w-full h-full text-white dark:text-gray-900" }}
56 {{ else if $vr.IsIndirectDenounce }}
57 {{ template "fragments/icons/shield-indirect-denounce" "w-full h-full text-white dark:text-gray-900" }}
58 {{ end }}
59 </button>
60 {{ end }}
61 {{ end }}
62 {{ if $vr }}
63 <div data-profile-popover
64 data-vouch-modal-id="{{ normalizeForHtmlId $did }}"
65 class="hidden z-[9999] pt-1 w-80"
66 style="position:fixed;">
67 <div data-profile-popover-content
68 class="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded shadow-sm p-3">
69 <div class="flex items-center justify-center py-4">
70 {{ i "loader-circle" "w-5 h-5 animate-spin text-gray-400" }}
71 </div>
72 </div>
73 </div>
74 {{ end }}
75 </div>
76 {{ if $vr }}
77 {{ if ne $did $vr.ViewerDid }}
78 {{ template "user/fragments/vouchPopover" (dict "VouchRelationship" $vr) }}
79 {{ end }}
80 {{ end }}
81{{ end }}