Bring back the collapse button for statuses (#470)

akirk · Feb 13, 2025 · 401ecef · 401ecef
1 parent 86b9480
commit 401ecef
Show file tree

Hide file tree

Showing 8 changed files with 45 additions and 8 deletions.
diff --git a/friends.css b/friends.css
diff --git a/friends.css.map b/friends.css.map
diff --git a/friends.js b/friends.js
@@ -307,10 +307,38 @@
 		return false;
 	} );
 
+	let openMenu = null;
+	$document.on( 'click', 'a.friends-dropdown-toggle', function ( e ) {
+		const $this = $( this );
+		const dropdown = $this.next( '.menu' );
+		if ( dropdown.is( ':visible' ) ) {
+			dropdown.hide();
+			openMenu = null;
+		} else {
+			$( '.menu' ).hide();
+			dropdown.show();
+			openMenu = dropdown;
+		}
+		e.stopPropagation();
+		return false;
+	});
+	$document.on( 'click', function ( e ) {
+		if ( e.target.closest( '.friends-dropdown' ) ) {
+			return true;
+		}
+		if ( openMenu ) {
+			openMenu.hide();
+		}
+	} );
+
 	$document.on( 'click', 'a.collapse-post, .collapsed.card, .all-collapsed .card:not(.uncollapsed)', function ( e ) {
+		if ( e.target.closest( '.friends-dropdown' ) ) {
+			return true;
+		}
+
 		const card = $( this ).closest( 'article' );
 		let collapsed;
-		if ( card.closest( 'section.all-collapsed' ).length ) {
+		if ( card.closest( 'section.all-collapsed' ) ) {
 			card.toggleClass( 'uncollapsed' );
 			collapsed = ! card.is( '.uncollapsed' );
 		} else {

diff --git a/friends.scss b/friends.scss
@@ -64,7 +64,6 @@ div {
 	}
 
 	&.active .menu,
-	.friends-dropdown-toggle:focus+.menu,
 	.menu:hover {
 		display: block;
 	}
@@ -618,6 +617,10 @@ h2#page-title a.dashicons {
 				padding-left: 1rem;
 			}
 
+			a.collapse-post {
+				display: none;
+			}
+
 			&.format-status {
 				padding-bottom: 0;
 				margin-bottom: .5em;

diff --git a/templates/admin/settings.php b/templates/admin/settings.php
@@ -207,8 +207,8 @@
 						<label for="frontend-default-view">
 							<span><?php esc_html_e( 'Default view:', 'friends' ); ?></span>
 							<select name="frontend_default_view" id="frontend-default-view">
-								<option value="expanded"<?php selected( $args['frontend_default_view'], 'expanded' ); ?>><?php esc_html_e( 'Expanded', 'friends' ); ?></option>
-								<option value="collapsed"<?php selected( $args['frontend_default_view'], 'collapsed' ); ?>><?php esc_html_e( 'Collapsed', 'friends' ); ?></option>
+								<option value="expanded"<?php selected( $args['frontend_default_view'], 'expanded' ); ?>><?php esc_html_e( 'Expanded mode', 'friends' ); ?></option>
+								<option value="collapsed"<?php selected( $args['frontend_default_view'], 'collapsed' ); ?>><?php esc_html_e( 'Compact mode', 'friends' ); ?></option>
 							</select>
 						</label>
 					</fieldset>

diff --git a/templates/frontend/author-header.php b/templates/frontend/author-header.php
@@ -127,6 +127,8 @@
 <?php if ( $args['friend_user']->can_refresh_feeds() && apply_filters( 'friends_debug', false ) ) : ?>
 <a class="chip" href="<?php echo esc_url( wp_nonce_url( add_query_arg( 'user', $args['friend_user']->user_login, self_admin_url( 'admin.php?page=friends-refresh' ) ), 'friends-refresh' ) ); ?>"><?php esc_html_e( 'Refresh', 'friends' ); ?></a>
 <?php endif; ?>
-<a class="chip toggle-compact" href=""><?php esc_html_e( 'Compact Mode', 'friends' ); ?></a>
+
+<a class="chip toggle-compact" href=""><?php echo esc_html( 'collapsed' === $args['frontend_default_view'] ? __( 'Expanded mode', 'friends' ) : __( 'Compact mode', 'friends' ) ); ?></a>
+
 <?php do_action( 'friends_author_header', $args['friend_user'], $args ); ?>
 </div>
diff --git a/templates/frontend/main-feed-header.php b/templates/frontend/main-feed-header.php
@@ -116,7 +116,7 @@
 </a>
 <?php endforeach; ?>
 
-<a class="chip toggle-compact" href=""><?php esc_html_e( 'Compact Mode', 'friends' ); ?></a>
+<a class="chip toggle-compact" href=""><?php echo esc_html( 'collapsed' === $args['frontend_default_view'] ? __( 'Expanded mode', 'friends' ) : __( 'Compact mode', 'friends' ) ); ?></a>
 
 <?php do_action( 'friends_main_feed_header', $args ); ?>
 </div>
diff --git a/templates/frontend/parts/header-status.php b/templates/frontend/parts/header-status.php
@@ -112,11 +112,15 @@
 	</div>
 	<div class="overflow col-ml-auto">
 		<div class="friends-dropdown friends-dropdown-right">
+			<a class="btn btn-link collapse-post" tabindex="0" title="<?php esc_html_e( 'Double or meta/shift/cmd click to toggle all', 'friends' ); ?>">
+				<i class="dashicons dashicons-fullscreen-exit-alt"></i>
+			</a>
 			<a class="btn btn-link friends-dropdown-toggle" tabindex="0">
 				<i class="dashicons dashicons-menu-alt2"></i>
 			</a>
 			<ul class="menu" style="min-width: <?php echo esc_attr( intval( _x( '250', 'dropdown-menu-width', 'friends' ) ) ); ?>px">
 				<li class="menu-item"><a href="<?php echo esc_url( add_query_arg( 'in_reply_to', get_permalink() ) ); ?>" class="quick-reply" data-url="<?php echo esc_attr( get_permalink() ); ?>"><?php esc_html_e( 'Reply', 'friends' ); ?></a></li>
+				<li class="menu-item"><a href="<?php echo esc_url( add_query_arg( 'boost', get_permalink() ) ); ?>" class="quick-reply" data-url="<?php echo esc_attr( get_permalink() ); ?>"><?php esc_html_e( 'Boost', 'friends' ); ?></a></li>
 				<?php
 				Friends\Friends::template_loader()->get_template_part(
 					'frontend/parts/header-menu',