diff --git a/output/index.css b/output/index.css index bf2edaf..20c8d9b 100644 --- a/output/index.css +++ b/output/index.css @@ -87,6 +87,9 @@ body { a, .anchorstyle { color: var(--anchor-color); text-decoration: underline; +} + +.clickable { cursor: pointer; } @@ -424,6 +427,7 @@ label[for=toggle-show-room-ids]::after { max-height: 80vh; color: var(--primary-color); background-color: var(--secondary-color); + --icon-size: 4rem; } #details-modal-contents { @@ -462,19 +466,82 @@ label[for=toggle-show-room-ids]::after { justify-content: center; } -#details-modal-community-icon[src=""] { - display: none; +#details-modal-title > * { + display: inline-block; } -#details-modal-community-icon { +#details-modal-title { + margin-bottom: calc( var(--icon-size) * 0.1 ); +} + +#details-modal-community-icon-wrapper { position: relative; - top: 0.15em; - width: 1em; - height: 1em; - margin-right: 0.1em; + box-sizing: border-box; + --strip: calc( var(--icon-size) / 25 ); + --padding-size: calc( var(--icon-size) - 1 * var(--strip) ); + top: calc(var(--icon-size) * 0.5 - 0.6rem); + width: var(--icon-size); + height: var(--icon-size); + margin-right: calc( var(--icon-size) * 0.3 ); + /* box-shadow: var(--primary-color) 0 0 calc( var(--icon-size) / 10 ); */ + border: var(--primary-color) var(--strip) solid; + padding: var(--strip); border-radius: 100%; } +/* Too janky */ + +/* +#details-modal-community-icon-wrapper::after { + position: absolute; + line-height: var(--icon-size); + text-align: center; + font-size: calc(var(--icon-size) / 3); + width: 100%; + opacity: 1; + z-index: 10; + filter: grayscale(); +} + +#details-modal-community-icon-wrapper[data-has-icon="false"]::after { + content: "\2753"; +} + +#details-modal-community-icon-wrapper[data-icon-safety="-1"]::after { + opacity: 0.5; + content: "\26A0"; +} +*/ + +#details-modal-community-icon-wrapper[data-has-icon="false"] { + display: none; +} + +#details-modal-community-icon-wrapper[data-icon-safety="-1"] { + display: none; +} + + +#details-modal-community-icon-wrapper:is([data-has-icon="false"], [data-icon-safety="-1"]) #details-modal-community-icon { + display: none; +} + +#details-modal-community-icon { + position: absolute; + top: 0; + right: 0; + width: 100%; + height: 100%; + border-radius: inherit; + transition: filter 0.15s, opacity 0.15s; +} + +#details-modal-community-icon:not([data-icon-safety="1"], #details-modal-community-icon-wrapper:hover > *) { + opacity: 0.5; + filter: blur(3px); +} + + #details-modal-start #details-modal-description { max-height: 50vh; overflow: auto; diff --git a/output/js/constants.js b/output/js/constants.js index 00af865..80015b5 100644 --- a/output/js/constants.js +++ b/output/js/constants.js @@ -21,7 +21,9 @@ export const dom = { public_key: row.getAttribute(ATTRIBUTES.ROW.PUBLIC_KEY), staff: row.getAttribute(ATTRIBUTES.ROW.STAFF_DATA), tags: row.getAttribute(ATTRIBUTES.ROW.TAGS), - icon: row.getAttribute(ATTRIBUTES.ROW.ROOM_ICON) + icon: row.getAttribute(ATTRIBUTES.ROW.ROOM_ICON), + has_icon: row.getAttribute(ATTRIBUTES.ROW.ROOM_ICON).trim() != "", + icon_safety: row.getAttribute(ATTRIBUTES.ROW.ROOM_ICON_SAFETY) }; }, meta_timestamp: () => document.querySelector('meta[name=timestamp]'), @@ -64,7 +66,8 @@ export const ATTRIBUTES = { PUBLIC_KEY: 'data-pubkey', HOSTNAME: 'data-hostname', STAFF_DATA: 'data-staff', - ROOM_ICON: 'data-icon' + ROOM_ICON: 'data-icon', + ROOM_ICON_SAFETY: 'data-icon-safe' }, SORTING: { ACTIVE: 'data-sort', diff --git a/php/servers/known-servers.php b/php/servers/known-servers.php index ff3bbbd..6f3b74f 100644 --- a/php/servers/known-servers.php +++ b/php/servers/known-servers.php @@ -55,8 +55,21 @@ "sogs.k9net.org" => "fdcb047eb78520e925fda512a45ae74c6e2de9e0df206b3c0471bf1509919559", ); - /** These hostnames are considered to have safe room icons. */ + /** + * @var string[] $ICON_ALLOWLIST + * These hostnames are considered to have safe room icons. + */ $ICON_ALLOWLIST = [ - "open.getsession.org" + "open.getsession.org", + "sog.caliban.org", + "sog.zcyph.cc" + ]; + + /** + * @var string[] $ICON_BLOCKLIST + * These hostnames are considered to have unsafe room icons. + */ + $ICON_BLOCKLIST = [ + "gaohuangse.work" ]; ?> diff --git a/php/utils/room-icons.php b/php/utils/room-icons.php index 73a9e9d..b3327d4 100644 --- a/php/utils/room-icons.php +++ b/php/utils/room-icons.php @@ -42,10 +42,7 @@ $width = intval($width); $height = intval($height); assert(!empty($width) && !empty($height)); - if (!in_array($room->server->get_hostname(), $ICON_ALLOWLIST)) { - return null; - } - if ($room->has_nsfw_keywords()) { + if (room_icon_safety($room) < 0) { return null; } $room_id = $room->get_room_identifier(); @@ -81,6 +78,20 @@ return room_icon_path_relative($room_id, $size); } + function room_icon_safety(\CommunityRoom $room): int { + global $ICON_ALLOWLIST, $ICON_BLOCKLIST; + if (in_array($room->server->get_hostname(), $ICON_ALLOWLIST)) { + return 1; + } + if (in_array($room->server->get_hostname(), $ICON_BLOCKLIST)) { + return -1; + } + if ($room->has_nsfw_keywords()) { + return -1; + } + return 0; + } + file_exists($ROOM_ICONS_CACHE) or mkdir($ROOM_ICONS_CACHE, 0755, true); file_exists($ROOM_ICONS) or mkdir($ROOM_ICONS, 0755, true); ?> \ No newline at end of file diff --git a/sites/+components/qr_modals.php b/sites/+components/qr_modals.php index dea4545..07edd50 100644 --- a/sites/+components/qr_modals.php +++ b/sites/+components/qr_modals.php @@ -10,18 +10,21 @@
diff --git a/sites/+components/tbl_communities.php b/sites/+components/tbl_communities.php index 6c40ebc..d9e54c4 100644 --- a/sites/+components/tbl_communities.php +++ b/sites/+components/tbl_communities.php @@ -76,7 +76,8 @@ data-hostname="=$hostname?>" data-staff='=$staff_json?>' data-tags='=$tags_json?>' - data-icon='=room_icon($room, '64x64')?>' + data-icon='=room_icon($room, '64x64')?>' + data-icon-safe='=room_icon_safety($room)?>' >