- Updates button height calculation
- Removes background color when it's set to "transparent" - Removes second line break from paragraphs - Introduces other changes based on Becks's testing - Updates unit tests
This commit is contained in:
@@ -7,7 +7,6 @@ use MailPoet\Newsletter\Renderer\StylesHelper;
|
|||||||
class Button {
|
class Button {
|
||||||
static function render($element, $column_count) {
|
static function render($element, $column_count) {
|
||||||
$element['styles']['block']['width'] = self::calculateWidth($element, $column_count);
|
$element['styles']['block']['width'] = self::calculateWidth($element, $column_count);
|
||||||
$element['styles']['block']['height'] = self::calculateHeight($element);
|
|
||||||
$template = '
|
$template = '
|
||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_padded_bottom mailpoet_padded_side" valign="top">
|
<td class="mailpoet_padded_bottom mailpoet_padded_side" valign="top">
|
||||||
@@ -17,10 +16,10 @@ class Button {
|
|||||||
<td class="mailpoet_button-container" style="padding:8px 20px;text-align:' . $element['styles']['block']['textAlign'] . ';"><!--[if mso]>
|
<td class="mailpoet_button-container" style="padding:8px 20px;text-align:' . $element['styles']['block']['textAlign'] . ';"><!--[if mso]>
|
||||||
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word"
|
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word"
|
||||||
href="' . $element['url'] . '"
|
href="' . $element['url'] . '"
|
||||||
style="height:' . $element['styles']['block']['height'] . ';
|
style="height:' . $element['styles']['block']['lineHeight'] . ';
|
||||||
width:' . $element['styles']['block']['width'] . ';
|
width:' . $element['styles']['block']['width'] . ';
|
||||||
v-text-anchor:middle;"
|
v-text-anchor:middle;"
|
||||||
arcsize="' . round($element['styles']['block']['borderRadius'] / $element['styles']['block']['height'] * 100) . '%"
|
arcsize="' . round($element['styles']['block']['borderRadius'] / $element['styles']['block']['lineHeight'] * 100) . '%"
|
||||||
strokeweight="1px"
|
strokeweight="1px"
|
||||||
strokecolor="' . $element['styles']['block']['borderColor'] . '"
|
strokecolor="' . $element['styles']['block']['borderColor'] . '"
|
||||||
fillcolor="' . $element['styles']['block']['backgroundColor'] . '">
|
fillcolor="' . $element['styles']['block']['backgroundColor'] . '">
|
||||||
@@ -52,11 +51,4 @@ class Button {
|
|||||||
$button_width = $button_width - (2 * $border_width) . 'px';
|
$button_width = $button_width - (2 * $border_width) . 'px';
|
||||||
return $button_width;
|
return $button_width;
|
||||||
}
|
}
|
||||||
|
|
||||||
static function calculateHeight($element) {
|
|
||||||
$border_width = (int) $element['styles']['block']['borderWidth'];
|
|
||||||
$button_height = (int) $element['styles']['block']['lineHeight'];
|
|
||||||
$button_height = $button_height - (2 * $border_width) . 'px';
|
|
||||||
return $button_height;
|
|
||||||
}
|
|
||||||
}
|
}
|
@@ -17,9 +17,14 @@ class Footer {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
$background_color = $element['styles']['block']['backgroundColor'];
|
||||||
|
$background_color = ($background_color !== 'transparent') ?
|
||||||
|
'bgcolor="' . $background_color . '"' :
|
||||||
|
false;
|
||||||
|
if(!$background_color) unset($element['styles']['block']['backgroundColor']);
|
||||||
$template = '
|
$template = '
|
||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_header_footer_padded mailpoet_footer" bgcolor="' . $element['styles']['block']['backgroundColor'] . '"
|
<td class="mailpoet_header_footer_padded mailpoet_footer" ' . $background_color . '
|
||||||
style="line-height: ' . StylesHelper::$line_height . ';' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
style="line-height: ' . StylesHelper::$line_height . ';' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
||||||
' . $DOM->html() . '
|
' . $DOM->html() . '
|
||||||
</td>
|
</td>
|
||||||
|
@@ -17,9 +17,14 @@ class Header {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
$background_color = $element['styles']['block']['backgroundColor'];
|
||||||
|
$background_color = ($background_color !== 'transparent') ?
|
||||||
|
'bgcolor="' . $background_color . '"' :
|
||||||
|
false;
|
||||||
|
if(!$background_color) unset($element['styles']['block']['backgroundColor']);
|
||||||
$template = '
|
$template = '
|
||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_header_footer_padded mailpoet_header" bgcolor="' . $element['styles']['block']['backgroundColor'] . '"
|
<td class="mailpoet_header_footer_padded mailpoet_header" ' . $background_color . '
|
||||||
style="' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
style="' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
||||||
' . $DOM->html() . '
|
' . $DOM->html() . '
|
||||||
</td>
|
</td>
|
||||||
|
@@ -1,6 +1,8 @@
|
|||||||
<?php
|
<?php
|
||||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||||
|
|
||||||
|
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||||
|
|
||||||
class Renderer {
|
class Renderer {
|
||||||
function render($data, $column_count) {
|
function render($data, $column_count) {
|
||||||
$block_content = '';
|
$block_content = '';
|
||||||
@@ -18,6 +20,7 @@ class Renderer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function createElementFromBlockType($block, $column_count) {
|
function createElementFromBlockType($block, $column_count) {
|
||||||
|
$block = StylesHelper::setTextAlign($block);
|
||||||
$block_class = __NAMESPACE__ . '\\' . ucfirst($block['type']);
|
$block_class = __NAMESPACE__ . '\\' . ucfirst($block['type']);
|
||||||
return (class_exists($block_class)) ? $block_class::render($block, $column_count) : '';
|
return (class_exists($block_class)) ? $block_class::render($block, $column_count) : '';
|
||||||
}
|
}
|
||||||
|
@@ -81,7 +81,7 @@ class Text {
|
|||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_paragraph" style="line-height:' . StylesHelper::$line_height . ';word-break:break-word;word-wrap:break-word;' . $style . '">
|
<td class="mailpoet_paragraph" style="line-height:' . StylesHelper::$line_height . ';word-break:break-word;word-wrap:break-word;' . $style . '">
|
||||||
' . $contents . '
|
' . $contents . '
|
||||||
<br /><br />
|
<br />
|
||||||
</td>
|
</td>
|
||||||
</tr>'
|
</tr>'
|
||||||
);
|
);
|
||||||
|
@@ -22,6 +22,7 @@ class Renderer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function getOneColumnTemplate($styles, $class) {
|
function getOneColumnTemplate($styles, $class) {
|
||||||
|
$background_color = $this->getBackgroundColor($styles);
|
||||||
$template['content_start'] = '
|
$template['content_start'] = '
|
||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_content" align="center" style="border-collapse:collapse">
|
<td class="mailpoet_content" align="center" style="border-collapse:collapse">
|
||||||
@@ -29,7 +30,7 @@ class Renderer {
|
|||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td style="padding-left:0;padding-right:0">
|
<td style="padding-left:0;padding-right:0">
|
||||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="mailpoet_' . $class . '" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;table-layout:fixed;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0;background-color:' . $styles['backgroundColor'] . '!important;" bgcolor="' . $styles['backgroundColor'] . '">
|
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="mailpoet_' . $class . '" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;table-layout:fixed;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0;' . $background_color . '">
|
||||||
<tbody>';
|
<tbody>';
|
||||||
$template['content_end'] = '
|
$template['content_end'] = '
|
||||||
</tbody>
|
</tbody>
|
||||||
@@ -44,9 +45,10 @@ class Renderer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function getMultipleColumnsTemplate($styles, $width, $alignment, $class) {
|
function getMultipleColumnsTemplate($styles, $width, $alignment, $class) {
|
||||||
|
$background_color = $this->getBackgroundColor($styles);
|
||||||
$template['container_start'] = '
|
$template['container_start'] = '
|
||||||
<tr>
|
<tr>
|
||||||
<td class="mailpoet_content-' . $class . '" align="left" style="border-collapse:collapse;background-color:' . $styles['backgroundColor'] . '!important;" bgcolor="' . $styles['backgroundColor'] . '">
|
<td class="mailpoet_content-' . $class . '" align="left" style="border-collapse:collapse;' . $background_color . '">
|
||||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
@@ -78,6 +80,14 @@ class Renderer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function removePaddingFromLastElement($element) {
|
function removePaddingFromLastElement($element) {
|
||||||
return preg_replace('/mailpoet_padded_bottom["|\s](?!.*mailpoet_padded_bottom["|\s])/ism', '', $element);
|
return preg_replace('/mailpoet_padded_bottom(?!.*mailpoet_padded_bottom)/ism', '', $element);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getBackgroundColor($styles) {
|
||||||
|
if(!isset($styles['backgroundColor'])) return false;
|
||||||
|
$background_color = $styles['backgroundColor'];
|
||||||
|
return ($background_color !== 'transparent') ?
|
||||||
|
sprintf('background-color:%s!important;" bgcolor="%s', $background_color, $background_color) :
|
||||||
|
false;
|
||||||
}
|
}
|
||||||
}
|
}
|
@@ -1,8 +1,6 @@
|
|||||||
<?php
|
<?php
|
||||||
namespace MailPoet\Newsletter\Renderer;
|
namespace MailPoet\Newsletter\Renderer;
|
||||||
|
|
||||||
use MailPoet\Newsletter\Renderer\Columns\ColumnsHelper;
|
|
||||||
|
|
||||||
class StylesHelper {
|
class StylesHelper {
|
||||||
static $css_attributes = array(
|
static $css_attributes = array(
|
||||||
'backgroundColor' => 'background-color',
|
'backgroundColor' => 'background-color',
|
||||||
@@ -72,4 +70,20 @@ class StylesHelper {
|
|||||||
$css .= '}' . PHP_EOL;
|
$css .= '}' . PHP_EOL;
|
||||||
return $css;
|
return $css;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static function setTextAlign($block) {
|
||||||
|
$alignments = array(
|
||||||
|
'center',
|
||||||
|
'right',
|
||||||
|
'justify'
|
||||||
|
);
|
||||||
|
$text_alignment = isset($block['styles']['block']['textAlign']) ?
|
||||||
|
strtolower($block['styles']['block']['textAlign']) :
|
||||||
|
false;
|
||||||
|
if(!$text_alignment || !in_array($text_alignment, $alignments)) {
|
||||||
|
return $block;
|
||||||
|
}
|
||||||
|
$block['styles']['block']['textAlign'] = 'left';
|
||||||
|
return $block;
|
||||||
|
}
|
||||||
}
|
}
|
@@ -23,7 +23,6 @@ class NewsletterRendererTest extends MailPoetTest {
|
|||||||
$this->DOM_parser = new \pQuery();
|
$this->DOM_parser = new \pQuery();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function testItRendersCompleteNewsletter() {
|
function testItRendersCompleteNewsletter() {
|
||||||
$template = $this->renderer->render();
|
$template = $this->renderer->render();
|
||||||
expect(isset($template['html']))->true();
|
expect(isset($template['html']))->true();
|
||||||
@@ -254,14 +253,6 @@ class NewsletterRendererTest extends MailPoetTest {
|
|||||||
expect($button_width)->equals('618px'); //(width - (2 * border width)
|
expect($button_width)->equals('618px'); //(width - (2 * border width)
|
||||||
}
|
}
|
||||||
|
|
||||||
function testItCalculatesButtonHeight() {
|
|
||||||
$newsletter = json_decode($this->newsletter['body'], true);
|
|
||||||
$template = $newsletter['content']['blocks'][0]['blocks'][0]['blocks'][5];
|
|
||||||
$template['styles']['block']['height'] = '30px';
|
|
||||||
$button_width = Button::calculateHeight($template, $columnCunt = 1);
|
|
||||||
expect($button_width)->equals('28px'); //(height - (2 * border width)
|
|
||||||
}
|
|
||||||
|
|
||||||
function testItRendersButton() {
|
function testItRendersButton() {
|
||||||
$newsletter = json_decode($this->newsletter['body'], true);
|
$newsletter = json_decode($this->newsletter['body'], true);
|
||||||
$template = $newsletter['content']['blocks'][0]['blocks'][0]['blocks'][5];
|
$template = $newsletter['content']['blocks'][0]['blocks'][0]['blocks'][5];
|
||||||
@@ -277,12 +268,12 @@ class NewsletterRendererTest extends MailPoetTest {
|
|||||||
)->equals(1);
|
)->equals(1);
|
||||||
expect(
|
expect(
|
||||||
preg_match(
|
preg_match(
|
||||||
'/arcsize="' . round(20 / 28 * 100) . '%"/',
|
'/arcsize="' . round(20 / 30 * 100) . '%"/',
|
||||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||||
)->equals(1);
|
)->equals(1);
|
||||||
expect(
|
expect(
|
||||||
preg_match(
|
preg_match(
|
||||||
'/style="height:28px.*?width:98px/',
|
'/style="height:30px.*?width:98px/',
|
||||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||||
)->equals(1);
|
)->equals(1);
|
||||||
expect(
|
expect(
|
||||||
|
Reference in New Issue
Block a user