Skip to content
This repository has been archived by the owner on Mar 13, 2024. It is now read-only.

Feature/media aside updates #133

Open
wants to merge 6 commits into
base: develop
Choose a base branch
from
Open

Feature/media aside updates #133

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
d7bb850
Add alignment option.
con322 Jan 24, 2019
5b0cc01
Add style array for adding block styles in child theme.
con322 Jan 24, 2019
fd48e57
Fix phpcs issue - missing escape function when outputting value.
con322 Jan 31, 2019
1827352
merge in latest develop.
con322 Feb 1, 2019
ffdc0da
Code review changes.
con322 Feb 11, 2019
a761cc3
Vertically center content.
con322 Feb 12, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 14 additions & 8 deletions block-languages/benenson-blocks.pot
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,6 +176,7 @@ msgstr ""
#: src/scripts/blocks/header/DisplayComponent.js:76
#: src/scripts/blocks/image/BlockEdit.js:201
#: src/scripts/blocks/link/DisplayComponent.js:41
#: src/scripts/blocks/media-aside/DisplayComponent.js:53
#: src/scripts/blocks/slider/DisplayComponent.js:37
msgid "Left"
msgstr ""
Expand All @@ -192,6 +193,7 @@ msgstr ""
#: src/scripts/blocks/header/DisplayComponent.js:83
#: src/scripts/blocks/image/BlockEdit.js:208
#: src/scripts/blocks/link/DisplayComponent.js:47
#: src/scripts/blocks/media-aside/DisplayComponent.js:57
#: src/scripts/blocks/slider/DisplayComponent.js:44
msgid "Right"
msgstr ""
Expand Down Expand Up @@ -461,7 +463,7 @@ msgid "Background Type"
msgstr ""

#: src/scripts/blocks/header/DisplayComponent.js:146
#: src/scripts/blocks/media-aside/DisplayComponent.js:52
#: src/scripts/blocks/media-aside/DisplayComponent.js:69
msgid "Embed url"
msgstr ""

Expand Down Expand Up @@ -649,7 +651,7 @@ msgstr ""
#: src/scripts/blocks/key-facts/fact.js:30
#: src/scripts/blocks/key-facts/index.js:79
#: src/scripts/blocks/links-with-icons/InnerBlockEdit.js:268
#: src/scripts/blocks/media-aside/DisplayComponent.js:83
#: src/scripts/blocks/media-aside/DisplayComponent.js:112
#: src/scripts/blocks/post-list/components/editable/GridItem.js:30
#: src/scripts/blocks/post-list/components/editable/LinkList.js:29
#: src/scripts/blocks/post-list/components/editable/PostItem.js:55
Expand All @@ -658,7 +660,7 @@ msgid "(Insert Title)"
msgstr ""

#: src/scripts/blocks/key-facts/fact.js:39
#: src/scripts/blocks/media-aside/DisplayComponent.js:93
#: src/scripts/blocks/media-aside/DisplayComponent.js:122
#: src/scripts/blocks/post-list/components/editable/GridItem.js:46
#: src/scripts/blocks/post-list/components/editable/PostItem.js:71
#: src/scripts/blocks/post-list/components/editable/SplitGridItem.js:54
Expand Down Expand Up @@ -831,23 +833,27 @@ msgstr ""
msgid "Add a repeatable logo block"
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:103
#: src/scripts/blocks/media-aside/DisplayComponent.js:132
msgid "(Insert Link text)"
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:57
#: src/scripts/blocks/media-aside/DisplayComponent.js:74
msgid "Display in modal"
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:58
#: src/scripts/blocks/media-aside/DisplayComponent.js:75
msgid "Clicking play will open up the video in a modal."
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:62
#: src/scripts/blocks/media-aside/DisplayComponent.js:80
msgid "Image Alignment"
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:85
msgid "Image/Video Poster"
msgstr ""

#: src/scripts/blocks/media-aside/DisplayComponent.js:68
#: src/scripts/blocks/media-aside/DisplayComponent.js:91
msgid "Video (will override embed)"
msgstr ""

Expand Down
66 changes: 36 additions & 30 deletions includes/block-translations.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
__( 'Standard', 'benenson' ),

// Reference: src/scripts/blocks/action/BlockEdit.js:37
// Reference: src/scripts/blocks/section/DisplayComponent.js:62
// Reference: src/scripts/blocks/section/DisplayComponent.js:74
__( 'Wide', 'benenson' ),

// Reference: src/scripts/blocks/action/BlockEdit.js:62
Expand Down Expand Up @@ -70,7 +70,7 @@
// Reference: src/scripts/blocks/blockquote/index.js:232
// Reference: src/scripts/blocks/header/DisplayComponent.js:95
// Reference: src/scripts/blocks/menu/DisplayComponent.js:12
// Reference: src/scripts/blocks/section/DisplayComponent.js:37
// Reference: src/scripts/blocks/section/DisplayComponent.js:49
__( 'White', 'benenson' ),

// Reference: src/scripts/blocks/appearance-options/index.js:42
Expand Down Expand Up @@ -103,7 +103,7 @@
// Reference: src/scripts/blocks/link/DisplayComponent.js:53
// Reference: src/scripts/blocks/menu/DisplayComponent.js:96
// Reference: src/scripts/blocks/post-list/DisplayComponent.js:91
// Reference: src/scripts/blocks/section/DisplayComponent.js:68
// Reference: src/scripts/blocks/section/DisplayComponent.js:80
// Reference: src/scripts/blocks/slider/DisplayComponent.js:215
__( 'Options', 'benenson' ),

Expand Down Expand Up @@ -138,19 +138,22 @@
// Reference: src/scripts/blocks/header/DisplayComponent.js:76
// Reference: src/scripts/blocks/image/BlockEdit.js:201
// Reference: src/scripts/blocks/link/DisplayComponent.js:41
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:53
// Reference: src/scripts/blocks/slider/DisplayComponent.js:37
/* translators: text alignment. for RTL languages, localise as 'Right' */
__( 'Left', 'benenson' ),

// Reference: src/scripts/blocks/blockquote/index.js:165
// Reference: src/scripts/blocks/image/BlockEdit.js:197
// Reference: src/scripts/blocks/section/index.js:53
// Reference: src/scripts/blocks/tweet/index.js:26
__( 'Default', 'benenson' ),

// Reference: src/scripts/blocks/blockquote/index.js:170
// Reference: src/scripts/blocks/header/DisplayComponent.js:83
// Reference: src/scripts/blocks/image/BlockEdit.js:208
// Reference: src/scripts/blocks/link/DisplayComponent.js:47
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:57
// Reference: src/scripts/blocks/slider/DisplayComponent.js:44
/* translators: text alignment. for RTL languages, localise as 'Left' */
__( 'Right', 'benenson' ),
Expand All @@ -159,7 +162,7 @@
// Reference: src/scripts/blocks/header/DisplayComponent.js:114
// Reference: src/scripts/blocks/links-with-icons/InnerBlockEdit.js:223
// Reference: src/scripts/blocks/logo-list/InnerBlockEdit.js:139
// Reference: src/scripts/blocks/section/DisplayComponent.js:48
// Reference: src/scripts/blocks/section/DisplayComponent.js:60
__( 'Small', 'benenson' ),

// Reference: src/scripts/blocks/blockquote/index.js:217
Expand All @@ -181,7 +184,7 @@
// Reference: src/scripts/blocks/links-with-icons/BlockEdit.js:60
// Reference: src/scripts/blocks/logo-list/BlockEdit.js:52
// Reference: src/scripts/blocks/menu/DisplayComponent.js:15
// Reference: src/scripts/blocks/section/DisplayComponent.js:40
// Reference: src/scripts/blocks/section/DisplayComponent.js:52
// Reference: src/scripts/blocks/section/index.js:27
__( 'Grey', 'benenson' ),

Expand Down Expand Up @@ -322,19 +325,19 @@
// Reference: src/scripts/blocks/download/index.js:13
__( 'Add a button to download a resource', 'benenson' ),

// Reference: src/scripts/blocks/download/index.js:44
// Reference: src/scripts/blocks/download/index.js:43
__( 'File', 'benenson' ),

// Reference: src/scripts/blocks/download/index.js:45
// Reference: src/scripts/blocks/download/index.js:44
__( 'A File', 'benenson' ),

// Reference: src/scripts/blocks/download/index.js:67
// Reference: src/scripts/blocks/download/index.js:66
__( '[Download Resource]', 'benenson' ),

// Reference: src/scripts/blocks/download/index.js:75
// Reference: src/scripts/blocks/download/index.js:74
__( 'Remove Resource', 'benenson' ),

// Reference: src/scripts/blocks/download/index.js:85
// Reference: src/scripts/blocks/download/index.js:84
__( 'Edit File', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:103
Expand All @@ -346,30 +349,30 @@
__( 'Video', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:111
// Reference: src/scripts/blocks/section/DisplayComponent.js:56
// Reference: src/scripts/blocks/section/DisplayComponent.js:68
__( 'Normal', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:128
// Reference: src/scripts/blocks/key-facts/index.js:68
// Reference: src/scripts/blocks/links-with-icons/BlockEdit.js:81
// Reference: src/scripts/blocks/logo-list/BlockEdit.js:67
// Reference: src/scripts/blocks/menu/DisplayComponent.js:107
// Reference: src/scripts/blocks/section/DisplayComponent.js:70
// Reference: src/scripts/blocks/section/DisplayComponent.js:82
__( 'Background Colour', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:140
// Reference: src/scripts/blocks/image/BlockEdit.js:387
__( 'Background Type', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:146
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:52
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:69
__( 'Embed url', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:150
__( 'Setting this will override the cta link and will now open a modal with the embed in the hero.', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:152
// Reference: src/scripts/blocks/section/DisplayComponent.js:93
// Reference: src/scripts/blocks/section/DisplayComponent.js:105
__( 'Background Image', 'benenson' ),

// Reference: src/scripts/blocks/header/DisplayComponent.js:152
Expand Down Expand Up @@ -400,7 +403,7 @@
// Reference: src/scripts/blocks/link/DisplayComponent.js:30
// Reference: src/scripts/blocks/links-with-icons/BlockEdit.js:57
// Reference: src/scripts/blocks/logo-list/BlockEdit.js:49
// Reference: src/scripts/blocks/section/DisplayComponent.js:51
// Reference: src/scripts/blocks/section/DisplayComponent.js:63
__( 'None', 'benenson' ),

// Reference: src/scripts/blocks/header/PostFeaturedVideo.js:6
Expand Down Expand Up @@ -438,7 +441,7 @@
__( 'Write caption…', 'benenson' ),

// Reference: src/scripts/blocks/iframe/DisplayComponent.js:91
// Reference: src/scripts/blocks/section/DisplayComponent.js:82
// Reference: src/scripts/blocks/section/DisplayComponent.js:94
__( 'Width', 'benenson' ),

// Reference: src/scripts/blocks/iframe/DisplayComponent.js:95
Expand Down Expand Up @@ -505,15 +508,15 @@
// Reference: src/scripts/blocks/key-facts/fact.js:30
// Reference: src/scripts/blocks/key-facts/index.js:79
// Reference: src/scripts/blocks/links-with-icons/InnerBlockEdit.js:268
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:83
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:112
// Reference: src/scripts/blocks/post-list/components/editable/GridItem.js:30
// Reference: src/scripts/blocks/post-list/components/editable/LinkList.js:27
// Reference: src/scripts/blocks/post-list/components/editable/LinkList.js:29
// Reference: src/scripts/blocks/post-list/components/editable/PostItem.js:55
// Reference: src/scripts/blocks/post-list/components/editable/SplitGridItem.js:38
__( '(Insert Title)', 'benenson' ),

// Reference: src/scripts/blocks/key-facts/fact.js:39
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:94
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:122
// Reference: src/scripts/blocks/post-list/components/editable/GridItem.js:46
// Reference: src/scripts/blocks/post-list/components/editable/PostItem.js:71
// Reference: src/scripts/blocks/post-list/components/editable/SplitGridItem.js:54
Expand Down Expand Up @@ -645,19 +648,22 @@
// Reference: src/scripts/blocks/logo-list/index.js:21
__( 'Add a repeatable logo block', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:104
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:132
__( '(Insert Link text)', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:57
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:74
__( 'Display in modal', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:58
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:75
__( 'Clicking play will open up the video in a modal.', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:62
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:80
__( 'Image Alignment', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:85
__( 'Image/Video Poster', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:68
// Reference: src/scripts/blocks/media-aside/DisplayComponent.js:91
__( 'Video (will override embed)', 'benenson' ),

// Reference: src/scripts/blocks/media-aside/index.js:27
Expand Down Expand Up @@ -760,7 +766,7 @@
// Reference: src/scripts/blocks/post-list/components/editable/SplitGridItem.js:22
__( '(Insert Tag)', 'benenson' ),

// Reference: src/scripts/blocks/post-list/components/editable/LinkList.js:12
// Reference: src/scripts/blocks/post-list/components/editable/LinkList.js:13
__( '(Tag Name)', 'benenson' ),

// Reference: src/scripts/blocks/post-list/components/post-selector/PostList.js:21
Expand Down Expand Up @@ -790,15 +796,15 @@
// Reference: src/scripts/blocks/post-list/index.js:49
__( 'Posts', 'benenson' ),

// Reference: src/scripts/blocks/section/DisplayComponent.js:59
// Reference: src/scripts/blocks/section/DisplayComponent.js:100
__( 'Id (scroll location)', 'benenson' ),

// Reference: src/scripts/blocks/section/DisplayComponent.js:71
// Reference: src/scripts/blocks/tweet/index.js:27
__( 'Narrow', 'benenson' ),

// Reference: src/scripts/blocks/section/DisplayComponent.js:76
__( 'Padding', 'benenson' ),

// Reference: src/scripts/blocks/section/DisplayComponent.js:88
__( 'Id (scroll location)', 'benenson' ),
__( 'Padding', 'benenson' ),

// Reference: src/scripts/blocks/section/index.js:26
__( 'Section', 'benenson' ),
Expand Down
62 changes: 30 additions & 32 deletions includes/blocks/media-aside/render.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,39 @@ function benenson_render_media_aside_block( array $attributes = [] ) {
$modal = ! empty( $attributes['modal'] ) ? $attributes['modal'] : false;
$embed_url = ! empty( $attributes['embed'] ) ? $attributes['embed'] : '';
$video_url = ! empty( $attributes['videoId'] ) ? wp_get_attachment_url( $attributes['videoId'] ) : $embed_url;
$alignment = ! empty( $attributes['mediaAlignment'] ) ? $attributes['mediaAlignment'] : 'Right';

spaceless();
?>

<div class="mediaAside">
<div class="mediaAside mediaAside--alignment<?php echo esc_attr( $alignment ); ?>">
<div class="mediaAside-col">
<?php
if ( ! empty( $attributes['mediaId'] ) && ! empty( $video_url ) ) {
if ( $modal ) {
printf(
'<div class="mediaAside-image">%s <a class="btn" data-modal-embed="%s"><i class="play-icon">%s</i></a></div>',
wp_get_attachment_image( $attributes['mediaId'], 'full' ),
esc_url( $video_url ),
esc_html__( 'Play video', 'benenson' )
);
} else {
printf(
'<div class="inlineVideo mediaAside-videoContainer"><div class="inlineVideo-poster" style="background-image:url(\'%s\');"></div><a class="btn" data-inline-embed="%s"><i class="play-icon">%s</i></a></div>',
esc_url( wp_get_attachment_url( $attributes['mediaId'] ) ),
esc_url( $video_url ),
esc_html__( 'Play video', 'benenson' )
);
}
} elseif ( ! empty( $attributes['mediaId'] ) ) {
printf(
'<div class="mediaAside-image">%s</div>',
wp_get_attachment_image( $attributes['mediaId'], 'full' )
);
}

?>
</div>
<div class="mediaAside-col">
<div class="mediaAside-content">

Expand All @@ -44,37 +72,7 @@ function benenson_render_media_aside_block( array $attributes = [] ) {

?>

</div>
</div>

<div class="mediaAside-col">

<?php
if ( ! empty( $attributes['mediaId'] ) && ! empty( $video_url ) ) {
if ( $modal ) {
printf(
'<div class="mediaAside-image">%s <a class="btn" data-modal-embed="%s"><i class="play-icon">%s</i></a></div>',
wp_get_attachment_image( $attributes['mediaId'], 'full' ),
esc_url( $video_url ),
esc_html__( 'Play video', 'benenson' )
);
} else {
printf(
'<div><div class="inlineVideo mediaAside-videoContainer"><div class="inlineVideo-poster" style="background-image:url(\'%s\');"></div><a class="btn" data-inline-embed="%s"><i class="play-icon">%s</i></a></div></div>',
esc_url( wp_get_attachment_url( $attributes['mediaId'] ) ),
esc_url( $video_url ),
esc_html__( 'Play video', 'benenson' )
);
}
} elseif ( ! empty( $attributes['mediaId'] ) ) {
printf(
'<div class="mediaAside-image">%s</div>',
wp_get_attachment_image( $attributes['mediaId'], 'full' )
);
}

?>

</div>
</div>
</div>

Expand Down
Loading