@automattic/newspack-blocks 1.37.0 → 1.48.0

package/src/blocks/iframe/view.php

@@ -0,0 +1,130 @@
+<?php
+/**
+ * Server-side rendering of the `newspack-blocks/iframe` block.
+ *
+ * @package WordPress
+ */
+
+/**
+ * Renders the `newspack-blocks/iframe` block on server.
+ *
+ * @param array $attributes The block attributes.
+ *
+ * @return string
+ */
+function newspack_blocks_render_block_iframe( $attributes ) {
+	Newspack_Blocks::enqueue_view_assets( 'iframe' );
+
+	return newspack_blocks_get_iframe( $attributes );
+}
+
+/**
+ * Registers the `newspack-blocks/iframe` block on server.
+ */
+function newspack_blocks_register_iframe() {
+	$block_json = json_decode(
+		file_get_contents( __DIR__ . '/block.json' ), // phpcs:ignore WordPress.WP.AlternativeFunctions.file_get_contents_file_get_contents
+		true
+	);
+
+	register_block_type(
+		'newspack-blocks/' . $block_json['name'],
+		[
+			'attributes'      => $block_json['attributes'],
+			'render_callback' => 'newspack_blocks_render_block_iframe',
+		]
+	);
+}
+add_action( 'init', 'newspack_blocks_register_iframe' );
+
+/**
+ * Get iframe data for general args.
+ *
+ * @param array $args Arguments. See $defaults.
+ * @return array of iframe info.
+ */
+function newspack_blocks_get_iframe( $args ) {
+	$defaults = array(
+		'mode'         => 'iframe',
+		'src'          => '',
+		'height'       => '600px',
+		'width'        => '100%',
+		'isFullScreen' => false,
+		'align'        => '',
+	);
+	$args     = wp_parse_args( $args, $defaults );
+
+	return newspack_blocks_get_iframe_html( $args['mode'], $args['src'], $args['height'], $args['width'], $args['isFullScreen'], $args['align'] );
+}
+
+/**
+ * Get embed html for embbed iframe.
+ *
+ * @param string  $mode Embed mode (iframe or document).
+ * @param string  $src Iframe source.
+ * @param string  $height Iframe Height.
+ * @param string  $width Iframe width.
+ * @param boolean $is_full_screen If the Iframe should be rendered full screen.
+ * @param string  $align Iframe block alignment.
+ * @return string HTML embed.
+ */
+function newspack_blocks_get_iframe_html( $mode, $src, $height, $width, $is_full_screen, $align ) {
+	$is_document = 'document' === $mode;
+	$height      = $is_full_screen ? '100' : $height;
+	$width       = $is_full_screen ? '100' : $width;
+	$style       = "height: $height; width: $width;";
+	$layout      = 'responsive';
+	$iframe_id   = 'newspack-iframe-' . wp_generate_password( 12, false );
+	$classes[]   = 'wp-block-newspack-blocks-iframe';
+
+	if ( empty( $src ) ) {
+		return;
+	}
+
+	if ( ! empty( $align ) ) {
+		$classes[] = 'align' . $align;
+	}
+
+	if ( $is_full_screen ) {
+		$layout = 'fill';
+		$style  = 'height: 100vh; width: 100vw; max-width: 100vw; max-height: 100vh; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999999; margin-top: 0!important;';
+	}
+
+	if ( $is_document ) {
+		$src = 'https://docs.google.com/gview?embedded=true&url=' . rawurlencode( $src );
+	}
+
+	ob_start();
+	?>
+	<figure class='<?php echo esc_attr( implode( ' ', $classes ) ); ?>'>
+		<div class='wp-block-embed__wrapper' style="height:<?php echo esc_attr( $height ); ?>; width:<?php echo esc_attr( $width ); ?>;">
+			<iframe
+				id = '<?php echo esc_attr( $iframe_id ); ?>'
+				layout = '<?php echo esc_attr( $layout ); ?>'
+				height = '100'
+				width = '100'
+				src = '<?php echo esc_attr( $src ); ?>'
+				style = '<?php echo esc_attr( $style ); ?>'
+				frameborder = '0'
+				allowfullscreen
+			></iframe>
+		</div>
+	</figure>
+
+	<?php if ( ! Newspack_Blocks::is_amp() ) : ?>
+		<script>
+			const iframe = document.getElementById("<?php echo esc_attr( $iframe_id ); ?>");
+			const timerId = setInterval( function() {
+					iframe.src = iframe.src;
+				}, 2000 );
+
+			iframe.onload = function() {
+				clearInterval(timerId);
+			}
+
+		</script>
+	<?php endif; ?>
+
+	<?php
+	return ob_get_clean();
+}

package/src/blocks/iframe/view.scss

@@ -0,0 +1,9 @@
+body.newspack-post-with-fullscreen-iframe {
+	#page {
+		visibility: hidden;
+	}
+
+	.wp-block-newspack-blocks-iframe {
+		visibility: visible;
+	}
+}

package/src/blocks/video-playlist/view.php

@@ -99,7 +99,7 @@ function newspack_blocks_get_video_playlist_videos( $args ) {
 	$query_args = array(
 		'post_type'      => 'post',
 		'post_status'    => 'publish',
-		's'              => 'core-embed/youtube',
+		's'              => 'youtube',
 		'posts_per_page' => $args['videosToShow'],
 	);
 
@@ -113,8 +113,9 @@ function newspack_blocks_get_video_playlist_videos( $args ) {
 		$blocks         = parse_blocks( $post->post_content );
 		$youtube_blocks = array_filter(
 			$blocks,
-			function( $blocks ) {
-				return 'core-embed/youtube' === $blocks['blockName'];
+			function( $block ) {
+				return ( 'core/embed' === $block['blockName'] && 'youtube' === $block['attrs']['providerNameSlug'] )
+					|| 'core-embed/youtube' === $block['blockName'];
 			}
 		);
 		foreach ( $youtube_blocks as $youtube_block ) {

package/src/components/query-controls.js

@@ -31,10 +31,10 @@ class QueryControls extends Component {
 		return apiFetch( {
 			url: addQueryArgs( restUrl, {
 				search,
-				per_page: 20,
+				postsToShow: 20,
 				_fields: 'id,title',
 				type: 'post',
-				post_type: postType,
+				postType,
 			} ),
 		} ).then( function ( posts ) {
 			const result = posts.map( post => ( {
@@ -49,10 +49,11 @@ class QueryControls extends Component {
 		const restUrl = window.newspack_blocks_data.posts_rest_url;
 		return apiFetch( {
 			url: addQueryArgs( restUrl, {
-				per_page: 100,
+				// These params use the block query parameters (see Newspack_Blocks::build_articles_query).
+				postsToShow: 100,
 				include: postIDs.join( ',' ),
 				_fields: 'id,title',
-				post_type: postType,
+				postType,
 			} ),
 		} ).then( function ( posts ) {
 			return posts.map( post => ( {

package/src/setup/editor.js

@@ -1,7 +1,6 @@
 /**
  * Internal dependencies
  */
-import './public-path';
 import './category';
 import './block-styles';
 import './editor.scss';

package/src/shared/js/utils.js

@@ -15,7 +15,7 @@ export const formatAvatars = authorInfo =>
 
 export const formatByline = authorInfo => (
 	<span className="byline">
-		<span className="author-prefix">{ _x( 'by', 'post author', 'newspack-blocks' ) } </span>
+		<span className="author-prefix">{ _x( 'by', 'post author', 'newspack-blocks' ) }</span>{ ' ' }
 		{ authorInfo.reduce( ( accumulator, author, index ) => {
 			return [
 				...accumulator,

package/src/templates/author-profile-card.php

@@ -0,0 +1,99 @@
+<?php
+/**
+ * Template for a single author profile card.
+ *
+ * @global array $attributes Block attributes.
+ * @package WordPress
+ */
+
+call_user_func(
+	function( $data ) {
+		if ( ! isset( $data['attributes'] ) || ! isset( $data['author'] ) ) {
+			return;
+		}
+
+		$attributes = $data['attributes'];
+		$author     = $data['author'];
+
+		// Whether to render links to the author's archive page.
+		$show_archive_link = $attributes['showArchiveLink'] && ! empty( $author['url'] );
+
+		// Combine social links and email, which are shown together.
+		$social_links = $attributes['showSocial'] && ! empty( $author['social'] ) ? $author['social'] : [];
+		if ( $attributes['showEmail'] && ! empty( $author['email'] ) ) {
+			$social_links['email'] = $author['email'];
+		}
+
+		$extra_classes = [
+			'text-size-' . $attributes['textSize'],
+			'avatar-' . $attributes['avatarAlignment'],
+		];
+
+		// Add classes to the block.
+		$classes = Newspack_Blocks::block_classes(
+			'author-profile',
+			$attributes,
+			$extra_classes
+		);
+
+		?>
+		<div class="<?php echo esc_attr( $classes ); ?>">
+			<?php if ( $attributes['showAvatar'] && isset( $author['avatar'] ) ) : ?>
+				<div class="wp-block-newspack-blocks-author-profile__avatar">
+					<figure style="border-radius: <?php echo esc_attr( $attributes['avatarBorderRadius'] ); ?>; height: <?php echo esc_attr( $attributes['avatarSize'] ); ?>px; width: <?php echo esc_attr( $attributes['avatarSize'] ); ?>px;">
+						<?php echo wp_kses_post( $author['avatar'] ); ?>
+					</figure>
+				</div>
+			<?php endif; ?>
+			<div class="wp-block-newspack-blocks-author-profile__bio">
+				<h3>
+					<?php if ( $show_archive_link ) : ?>
+					<a href="<?php echo esc_url( $author['url'] ); ?>">
+					<?php endif; ?>
+						<?php echo esc_html( $author['name'] ); ?>
+					<?php if ( $show_archive_link ) : ?>
+					</a>
+					<?php endif; ?>
+				</h3>
+
+				<?php if ( $attributes['showBio'] && ! empty( $author['bio'] ) ) : ?>
+					<?php
+					$bio = $author['bio'];
+
+					if ( $show_archive_link ) {
+						$bio .= sprintf(
+							// Translators: "more by this author" link.
+							__( ' <a href="%1$s">More by %2$s</a>', 'newspack-blocks' ),
+							$author['url'],
+							$author['name']
+						);
+					}
+
+					echo wp_kses_post( wpautop( $bio ) );
+					?>
+				<?php endif; ?>
+
+				<?php if ( $attributes['showEmail'] || $attributes['showSocial'] ) : ?>
+					<ul class="wp-block-newspack-blocks-author-profile__social-links">
+						<?php foreach ( $social_links as $service => $social_data ) : ?>
+							<li>
+								<a href="<?php echo esc_url( $social_data['url'] ); ?>">
+									<?php if ( ! empty( $social_data['svg'] ) ) : ?>
+										<span>
+											<?php echo Newspack_Blocks::sanitize_svg( $social_data['svg'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
+										</span>
+									<?php endif; ?>
+									<span class="<?php echo ! empty( $social_data['svg'] ) ? esc_attr( 'hidden' ) : esc_attr( 'visible' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>">
+										<?php echo esc_html( $service ); ?>
+									</span>
+								</a>
+							</li>
+						<?php endforeach; ?>
+					</ul>
+				<?php endif; ?>
+			</div>
+		</div>
+		<?php
+	},
+	$data // phpcs:ignore VariableAnalysis.CodeAnalysis.VariableAnalysis.UndefinedVariable
+);

package/vendor/autoload.php

@@ -0,0 +1,7 @@
+<?php
+
+// autoload.php @generated by Composer
+
+require_once __DIR__ . '/composer/autoload_real.php';
+
+return ComposerAutoloaderInit50906784de784e4392a8cd31208be78d::getLoader();