|  |  |  | <?php | 
					
						
							|  |  |  | 	require_once 'php/assets/room-invites.php'; | 
					
						
							|  |  |  | ?> | 
					
						
							|  |  |  | <dialog id="details-modal"> | 
					
						
							|  |  |  | 	<div id="details-modal-contents"> | 
					
						
							|  |  |  | 		<div id="details-modal-close"> | 
					
						
							|  |  |  | 				× | 
					
						
							|  |  |  | 		</div> | 
					
						
							|  |  |  | 		<div id="details-modal-navigation-hint"> | 
					
						
							|  |  |  | 			(Esc to close, ← → to navigate) | 
					
						
							|  |  |  | 		</div> | 
					
						
							|  |  |  | 		<div id="details-modal-flow"> | 
					
						
							|  |  |  | 			<div id="details-modal-panes" data-pane="0"> | 
					
						
							|  |  |  | 				<div id="details-modal-start" class="details-modal-pane" data-pane="0"> | 
					
						
							|  |  |  | 					<div id="details-modal-title"> | 
					
						
							|  |  |  | 						<div | 
					
						
							|  |  |  | 							id="details-modal-community-icon-wrapper" | 
					
						
							|  |  |  | 							class="clickable" | 
					
						
							|  |  |  | 							data-hydrate-with="has_icon:data-has-icon;icon_safety:data-icon-safety" | 
					
						
							|  |  |  | 							title="Community icon" | 
					
						
							|  |  |  | 						><img | 
					
						
							|  |  |  | 							id="details-modal-community-icon" | 
					
						
							|  |  |  | 							width="64" | 
					
						
							|  |  |  | 							height="64" | 
					
						
							|  |  |  | 							data-hydrate-with="icon:src;icon_safety:data-icon-safety" | 
					
						
							|  |  |  | 							alt="Community icon" | 
					
						
							|  |  |  | 						/></div><a | 
					
						
							|  |  |  | 							id="details-modal-community-name" | 
					
						
							|  |  |  | 							class="h2-like" | 
					
						
							|  |  |  | 							data-hydrate-with="name;preview_link:href" | 
					
						
							|  |  |  | 							title="Open preview in new tab" | 
					
						
							|  |  |  | 							href="#" | 
					
						
							|  |  |  | 						></a> | 
					
						
							|  |  |  | 						<img | 
					
						
							|  |  |  | 							id="details-modal-copy-room-details-link" | 
					
						
							|  |  |  | 							class="feather-icon clickable enter-clicks" | 
					
						
							|  |  |  | 							src="/assets/icons/share-2.svg" | 
					
						
							|  |  |  | 							alt="Share" | 
					
						
							|  |  |  | 							title="Share this Community" | 
					
						
							|  |  |  | 							tabindex="0" | 
					
						
							|  |  |  | 						> | 
					
						
							|  |  |  | 					</div> | 
					
						
							|  |  |  | 					<p id="details-modal-description"> | 
					
						
							|  |  |  | 						<span id="details-modal-description-inner" data-hydrate-with="description"></span> | 
					
						
							|  |  |  | 					</p> | 
					
						
							|  |  |  | 					<p id="details-modal-room-tags"> | 
					
						
							|  |  |  | 					</p> | 
					
						
							|  |  |  | 					<gap></gap> | 
					
						
							|  |  |  | 					<div id="details-modal-room-info"> | 
					
						
							|  |  |  | 						<p id="details-modal-language"> | 
					
						
							|  |  |  | 							Language<sup><a | 
					
						
							|  |  |  | 								href="<?=$REPOSITORY_CANONICAL_URL?>/src/branch/main/languages" | 
					
						
							|  |  |  | 								target="_blank" | 
					
						
							|  |  |  | 								title="Community language data on Codeberg" | 
					
						
							|  |  |  | 							>help us label</a></sup>: <span | 
					
						
							|  |  |  | 								id="details-modal-language-flag" | 
					
						
							|  |  |  | 								data-hydrate-with="language_flag" | 
					
						
							|  |  |  | 							></span> | 
					
						
							|  |  |  | 						</p> | 
					
						
							|  |  |  | 						<p id="details-modal-users"> | 
					
						
							|  |  |  | 							Users: <span data-hydrate-with="users"></span> | 
					
						
							|  |  |  | 						</p> | 
					
						
							|  |  |  | 						<p id="details-modal-created"> | 
					
						
							|  |  |  | 							Created: <span data-hydrate-with="creation_datestring"></span> | 
					
						
							|  |  |  | 						</p> | 
					
						
							|  |  |  | 						<p id="details-modal-host"> | 
					
						
							|  |  |  | 							Server: | 
					
						
							|  |  |  | 							<a | 
					
						
							|  |  |  | 								title="Open server in new tab" | 
					
						
							|  |  |  | 								data-hydrate-with="hostname;hostname:href" | 
					
						
							|  |  |  | 								target="_blank" | 
					
						
							|  |  |  | 								rel="noopener noreferrer" | 
					
						
							|  |  |  | 								href="#" | 
					
						
							|  |  |  | 							></a> | 
					
						
							|  |  |  | 						</p> | 
					
						
							|  |  |  | 					</div> | 
					
						
							|  |  |  | 				</div> | 
					
						
							|  |  |  | 				<gap></gap> | 
					
						
							|  |  |  | 				<div id="details-modal-end" class="details-modal-pane" data-pane="1"> | 
					
						
							|  |  |  | 					<img | 
					
						
							|  |  |  | 						src="" | 
					
						
							|  |  |  | 						id="details-modal-qr-code" | 
					
						
							|  |  |  | 						title="Community join link encoded as QR code" | 
					
						
							|  |  |  | 						width="512" | 
					
						
							|  |  |  | 						height="512" | 
					
						
							|  |  |  | 						alt="Community join link encoded as QR code" | 
					
						
							|  |  |  | 					> | 
					
						
							|  |  |  | 					<div id="details-modal-qr-code-label"> | 
					
						
							|  |  |  | 						Scan QR code in Session to join | 
					
						
							|  |  |  | 						<span | 
					
						
							|  |  |  | 							id="details-modal-qr-code-label-name" | 
					
						
							|  |  |  | 						>'<span data-hydrate-with="name"></span>'</span> | 
					
						
							|  |  |  | 					</div> | 
					
						
							|  |  |  | 				</div> | 
					
						
							|  |  |  | 			</div> | 
					
						
							|  |  |  | 			<div id="details-modal-actions"> | 
					
						
							|  |  |  | 				<button | 
					
						
							|  |  |  | 					id="details-modal-copy-button" | 
					
						
							|  |  |  | 					class="themed-button" | 
					
						
							|  |  |  | 					data-hydrate-with="join_link:data-href" | 
					
						
							|  |  |  | 					title="Click here to copy this Community's join link" | 
					
						
							|  |  |  | 				> | 
					
						
							|  |  |  | 					Copy join link | 
					
						
							|  |  |  | 				</button> | 
					
						
							|  |  |  | 				<button | 
					
						
							|  |  |  | 					id="details-modal-copy-staff-id" | 
					
						
							|  |  |  | 					class="themed-button" | 
					
						
							|  |  |  | 					data-hydrate-with="staff:data-staff" | 
					
						
							|  |  |  | 					title="Copy the mention for a random staff member" | 
					
						
							|  |  |  | 				> | 
					
						
							|  |  |  | 					Copy mod ping | 
					
						
							|  |  |  | 				</button> | 
					
						
							|  |  |  | 				<button | 
					
						
							|  |  |  | 				id="details-modal-copy-room-id" | 
					
						
							|  |  |  | 				class="themed-button" | 
					
						
							|  |  |  | 				data-hydrate-with="identifier:data-id" | 
					
						
							|  |  |  | 				title="Copy this room's identifier to uniquely identify this room to the sessioncommunities.online team" | 
					
						
							|  |  |  | 				> | 
					
						
							|  |  |  | 				Copy ID | 
					
						
							|  |  |  | 				</button> | 
					
						
							|  |  |  | 				<gap></gap> | 
					
						
							|  |  |  | 				<div id="details-modal-pane-selection" class="hidden"> | 
					
						
							|  |  |  | 					<button | 
					
						
							|  |  |  | 						class="details-modal-pane-button | 
					
						
							|  |  |  | 						themed-button" | 
					
						
							|  |  |  | 						data-pane="0" | 
					
						
							|  |  |  | 					>Show description</button> | 
					
						
							|  |  |  | 					<button | 
					
						
							|  |  |  | 						class="details-modal-pane-button | 
					
						
							|  |  |  | 						themed-button" | 
					
						
							|  |  |  | 						data-pane="1" | 
					
						
							|  |  |  | 					>Show QR Code</button> | 
					
						
							|  |  |  | 				</div> | 
					
						
							|  |  |  | 			</div> | 
					
						
							|  |  |  | 		</div> | 
					
						
							|  |  |  | 	</div> | 
					
						
							|  |  |  | </dialog> |