Vlad
@ -1,47 +1,43 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
|
||||
class Button {
|
||||
static function render($element) {
|
||||
$stylesHelper = new StylesHelper();
|
||||
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_button mailpoet_padded" valign = "top" >
|
||||
<div>
|
||||
<table width="100%" cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td align="' . $element['styles']['block']['textAlign'] . '">
|
||||
<!--[if mso]>
|
||||
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml"
|
||||
xmlns:w="urn:schemas-microsoft-com:office:word"
|
||||
href="' . $element['url'] . '"
|
||||
style="height:' . $element['styles']['block']['lineHeight'] . ';
|
||||
width:' . $element['styles']['block']['width'] . ';
|
||||
v-text-anchor:middle;"
|
||||
arcsize="' . round($element['styles']['block']['borderRadius'] / $element['styles']['block']['lineHeight'] * 100) . '%"
|
||||
strokecolor="' . $element['styles']['block']['borderColor'] . '"
|
||||
fillcolor="' . $element['styles']['block']['backgroundColor'] . '">
|
||||
<tr>
|
||||
<td class="mailpoet_padded" valign="top">
|
||||
<div>
|
||||
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;text-align:' . $element['styles']['block']['textAlign'] . ';">
|
||||
<tr>
|
||||
<td class="mailpoet_button-container" style="padding:8px 0;">
|
||||
<!--[if mso]>
|
||||
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word"
|
||||
href="' . $element['url'] . '"
|
||||
style="height:' . $element['styles']['block']['lineHeight'] . ';
|
||||
width:' . $element['styles']['block']['width'] . ';
|
||||
v-text-anchor:middle;"
|
||||
arcsize="' . round($element['styles']['block']['borderRadius'] / $element['styles']['block']['lineHeight'] * 100) . '%"
|
||||
strokeweight="1px"
|
||||
strokecolor="' . $element['styles']['block']['borderColor'] . '"
|
||||
fillcolor="' . $element['styles']['block']['backgroundColor'] . '">
|
||||
<w:anchorlock/>
|
||||
<center style="color:' . $element['styles']['block']['fontColor'] . ';
|
||||
font-family:' . $element['styles']['block']['fontFamily'] . ';
|
||||
font-size:' . $element['styles']['block']['fontSize'] . ';
|
||||
font-weight:bold;">' . $element['text'] . '
|
||||
font-family:' . $element['styles']['block']['fontFamily'] . ';
|
||||
font-size:' . $element['styles']['block']['fontSize'] . ';
|
||||
font-weight:bold;">' . $element['text'] . '
|
||||
</center>
|
||||
</v:roundrect>
|
||||
<![endif]-->
|
||||
<a class="mailpoet_button"
|
||||
href="' . $element['url'] . '"
|
||||
style="display:inline-block;text-align:center;text-decoration:none;-webkit-text-size-adjust:none;mso-hide:all;' . $stylesHelper->getBlockStyles($element, array('textAlign')) . '"> ' . $element['text'] . '
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
<![endif]-->
|
||||
<a class="mailpoet_button" href="' . $element['url'] . '" style="display:inline-block;-webkit-text-size-adjust:none;mso-hide:all;text-decoration:none!important;text-align:center;' . StylesHelper::getBlockStyles($element, $exclude = array('textAlign')) . '"> ' . $element['text'] . '
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
</tr>';
|
||||
//!d($template);exit;
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,23 +1,31 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
|
||||
class Divider {
|
||||
static function render($element) {
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_divider mailpoet_padded"
|
||||
style="background-color: ' . $element['styles']['block']['backgroundColor'] . '; padding: ' . $element['styles']['block']['padding'] . ' 0;"
|
||||
valign="top">
|
||||
<table width="100%">
|
||||
<tr>
|
||||
<td style="border-top-width: ' . $element['styles']['block']['borderWidth'] . ';
|
||||
border-top-style: ' . $element['styles']['block']['borderStyle'] . ';
|
||||
border-top-color: ' . $element['styles']['block']['borderColor'] . ';">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_divider" valign="top" bgColor="' . $element['styles']['block']['backgroundColor'] . '"
|
||||
style="background-color:' . $element['styles']['block']['backgroundColor'] . ';' .
|
||||
sprintf('padding: %s %spx %s %spx;',
|
||||
$element['styles']['block']['padding'],
|
||||
StylesHelper::$paddingWidth,
|
||||
$element['styles']['block']['padding'],
|
||||
StylesHelper::$paddingWidth) . '">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0"
|
||||
style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;">
|
||||
<tr>
|
||||
<td class="mailpoet_divider-cell"
|
||||
style="border-top-width: ' . $element['styles']['block']['borderWidth'] . ';
|
||||
border-top-style: ' . $element['styles']['block']['borderStyle'] . ';
|
||||
border-top-color: ' . $element['styles']['block']['borderColor'] . ';">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,30 +1,27 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
|
||||
class Footer {
|
||||
static function render($element) {
|
||||
$stylesHelper = new StylesHelper();
|
||||
|
||||
// apply link styles
|
||||
if(isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace('<a', '<a style="' . $stylesHelper->getStyles($element['styles'], 'link') . '"', $element['text']);
|
||||
if (isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace(
|
||||
'<a',
|
||||
'<a style="'
|
||||
. StylesHelper::getStyles($element['styles'], 'link')
|
||||
. '"', $element['text']
|
||||
);
|
||||
}
|
||||
|
||||
// apply text styles
|
||||
if(isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace('<p', '<p style="' . $stylesHelper->getStyles($element['styles'], 'text') . '"', $element['text']);
|
||||
}
|
||||
|
||||
$element['text'] = preg_replace('/\n/', '<br /><br />', $element['text']);
|
||||
$element['text'] = preg_replace('/(<\/?p>)/', '', $element['text']);
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_footer"
|
||||
style="' . $stylesHelper->getStyles($element['styles'], 'block') . '"
|
||||
valign="top">
|
||||
<div>' . $element['text'] . '</div>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_padded_header_footer mailpoet_footer" bgcolor="' . $element['styles']['block']['backgroundColor'] . '"
|
||||
style="' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
||||
' . $element['text'] . '
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,30 +1,27 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
|
||||
class Header {
|
||||
static function render($element) {
|
||||
$stylesHelper = new StylesHelper();
|
||||
|
||||
// apply link styles
|
||||
if(isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace('<a', '<a style="' . $stylesHelper->getStyles($element['styles'], 'link') . '"', $element['text']);
|
||||
if (isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace(
|
||||
'<a',
|
||||
'<a style="'
|
||||
. StylesHelper::getStyles($element['styles'], 'link')
|
||||
. '"', $element['text']
|
||||
);
|
||||
}
|
||||
|
||||
// apply text styles
|
||||
if(isset($element['styles']['link'])) {
|
||||
$element['text'] = str_replace('<p', '<p style="' . $stylesHelper->getStyles($element['styles'], 'text') . '"', $element['text']);
|
||||
}
|
||||
|
||||
$element['text'] = preg_replace('/\n/', '<br /><br />', $element['text']);
|
||||
$element['text'] = preg_replace('/(<\/?p>)/', '', $element['text']);
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_header"
|
||||
style="' . $stylesHelper->getBlockStyles($element) . '"
|
||||
valign="top">
|
||||
<div>' . $element['text'] . '</div>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_padded_header_footer mailpoet_header" bgcolor="' . $element['styles']['block']['backgroundColor'] . '"
|
||||
style="padding:10px 0;' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
|
||||
' . $element['text'] . '
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,24 +1,42 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\Columns\ColumnsHelper;
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
|
||||
class Image {
|
||||
static function render($element) {
|
||||
$stylesHelper = new StylesHelper();
|
||||
|
||||
$element['width'] = (int) $element['width'];
|
||||
|
||||
static function render($element, $columnCount) {
|
||||
$element = self::getImageDimensions($element, $columnCount);
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_image ' . (($element['padded'] === true) ? "mailpoet_padded" : "") . '"
|
||||
style="' . $stylesHelper->getBlockStyles($element) . '"
|
||||
valign="top">
|
||||
<img style="top:0; left:0; height: auto; width:100%;"
|
||||
src="' . $element['src'] . '"
|
||||
width="' . (($element['padded'] === true) ? $element['width'] - (20 * 2) : $element['width']) . '">
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_image ' . $element['paddedClass'] . '" align="center" valign="top">
|
||||
<img style="max-width:' . $element['width'] . 'px;" src="' . $element['src'] . '"
|
||||
width="' . $element['width'] . '" height="' . $element['height'] . '" alt="' . $element['alt'] . '"/>
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
|
||||
static function getImageDimensions($element, $columnCount) {
|
||||
$columnWidth = ColumnsHelper::$columnsWidth[$columnCount];
|
||||
$paddedWidth = StylesHelper::$paddingWidth * 2;
|
||||
// resize image if it's wider than the column width
|
||||
if ((int) $element['width'] >= $columnWidth) {
|
||||
$ratio = (int) $element['width'] / $columnWidth;
|
||||
$element['width'] = $columnWidth;
|
||||
$element['height'] = ceil((int) $element['height'] / $ratio);
|
||||
}
|
||||
if ($element['padded'] === true && $element['width'] >= $columnWidth) {
|
||||
// resize image if the padded option is on
|
||||
$ratio = (int) $element['width'] / ((int) $element['width'] - $paddedWidth);
|
||||
$element['width'] = (int) $element['width'] - $paddedWidth;
|
||||
$element['height'] = ceil((int) $element['height'] / $ratio);
|
||||
$element['paddedClass'] = 'mailpoet_padded';
|
||||
} else {
|
||||
$element['width'] = (int) $element['width'];
|
||||
$element['height'] = (int) $element['height'];
|
||||
$element['paddedClass'] = '';
|
||||
}
|
||||
return $element;
|
||||
}
|
||||
}
|
||||
@ -1,11 +1,12 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
class Renderer {
|
||||
function render($data) {
|
||||
array_map(function ($block) use (&$blockContent, &$columns) {
|
||||
$blockContent .= $this->createElementFromBlockType($block);
|
||||
function render($data, $columnCount) {
|
||||
array_map(function ($block) use (&$blockContent, &$columns, $columnCount) {
|
||||
$blockContent .= $this->createElementFromBlockType($block, $columnCount);
|
||||
if(isset($block['blocks'])) {
|
||||
$blockContent = $this->render($block);
|
||||
$blockContent = $this->render($block, $columnCount);
|
||||
}
|
||||
// vertical orientation denotes column container
|
||||
if($block['type'] === 'container' && $block['orientation'] === 'vertical') {
|
||||
@ -16,9 +17,9 @@ class Renderer {
|
||||
return (isset($columns)) ? $columns : $blockContent;
|
||||
}
|
||||
|
||||
function createElementFromBlockType($block) {
|
||||
function createElementFromBlockType($block, $columnCount) {
|
||||
$blockClass = __NAMESPACE__ . '\\' . ucfirst($block['type']);
|
||||
return (class_exists($blockClass)) ? $blockClass::render($block) : '';
|
||||
return (class_exists($blockClass)) ? $blockClass::render($block, $columnCount) : '';
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -1,26 +1,26 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
class Social {
|
||||
static function render($element) {
|
||||
$iconsBlock = '';
|
||||
|
||||
if(is_array($element['icons'])) {
|
||||
foreach ($element['icons'] as $icon) {
|
||||
if (is_array($element['icons'])) {
|
||||
foreach ($element['icons'] as $index => $icon) {
|
||||
$iconsBlock .= '
|
||||
<a href="' . $icon['link'] . '">
|
||||
<img src="' . $icon['image'] . '" width = "32" height = "32" style="width: 32px; height: 32px;" alt="' . $icon['iconType'] . '">
|
||||
</a>
|
||||
<img src="http://mp3.mailpoet.net/spacer.gif" width = "10" height = "1" style=" width: 10px; height: 1px;">';
|
||||
<a href="' . $icon['link'] . '" style="text-decoration:none!important;">
|
||||
<img src="' . $icon['image'] . '" width="' . (int) $icon['width'] . '" height="' . (int) $icon['height'] . '" style="width:' . $icon['width'] . ';height:' . $icon['width'] . ';-ms-interpolation-mode:bicubic;border:0;display:inline;outline:none;" alt="' . $icon['iconType'] . '">
|
||||
</a>';
|
||||
if ($index !== count($element['icons']) - 1) $iconsBlock .= '<img src="https://upload.wikimedia.org/wikipedia/commons/5/52/Spacer.gif" width="10" height="1" style="width:10px;height:1px;-ms-interpolation-mode:bicubic;border:0;display:inline;outline:none;" />';
|
||||
}
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_padded" valign="top" align="center">
|
||||
<div class="mailpoet_social-icon" style="word-break:break-word;word-wrap:break-word;">
|
||||
' . $iconsBlock . '
|
||||
</div>
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_social" valign="top">
|
||||
<div class="mailpoet_social-icon mailpoet_padded">' . $iconsBlock . ' </div>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,23 +1,12 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\StylesHelper;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
class Spacer {
|
||||
static function render($element) {
|
||||
|
||||
$stylesHelper = new StylesHelper();
|
||||
|
||||
// if the parent container (column) has background set and the divider element has a transparent background,
|
||||
// it will assume the newsletter background, not that of the parent container
|
||||
if($element['styles']['block']['backgroundColor'] === 'transparent') {
|
||||
unset($element['styles']['block']['backgroundColor']);
|
||||
}
|
||||
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_spacer" style="' . $stylesHelper->getBlockStyles($element) . '" valign="top"> </td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_spacer" height="' . (int) $element['styles']['block']['height'] . '" valign="top"></td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
@ -1,114 +1,110 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Blocks;
|
||||
|
||||
class Text {
|
||||
static $typeFace = array(
|
||||
'Arial' => "Arial, 'Helvetica Neue', Helvetica, sans-serif",
|
||||
'Comic Sans MS' => "'Comic Sans MS', 'Marker Felt-Thin', Arial, sans-serif",
|
||||
'Courier New' => "'Courier New', Courier, 'Lucida Sans Typewriter', 'Lucida Typewriter', monospace",
|
||||
'Georgia' => "Georgia, Times, 'Times New Roman', serif",
|
||||
'Lucida' => "'Lucida Sans Unicode', 'Lucida Grande', sans-serif",
|
||||
'Tahoma' => "Tahoma, Verdana, Segoe, sans-serif",
|
||||
'Times New Roman' => "'Times New Roman', Times, Baskerville, Georgia, serif",
|
||||
'Trebuchet MS' => "'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif",
|
||||
'Verdana' => "Verdana, Geneva, sans-serif"
|
||||
);
|
||||
|
||||
static function render($element) {
|
||||
$html = $element['text'];
|
||||
|
||||
$html = self::convertBlockquotesToTables($html);
|
||||
$html = self::addLineBreakAfterTags($html);
|
||||
$html = self::removeEmptyTags($html);
|
||||
$html = self::convertEmptyParagraphsToLineBreaks($html);
|
||||
$html = self::convertParagraphsToTables($html);
|
||||
$html = self::removeLastBreakLine($html);
|
||||
|
||||
$html = self::addLineBreakAfterTags($html);
|
||||
$html = self::styleLists($html);
|
||||
$html = self::styleHeadings($html);
|
||||
$html = self::removeLastElementBreakLine($html);
|
||||
$template = '
|
||||
<tr>
|
||||
<td class="mailpoet_col mailpoet_text mailpoet_padded" valign="top">' . $html . ' </td>
|
||||
</tr>';
|
||||
|
||||
<tr>
|
||||
<td class="mailpoet_text mailpoet_padded" valign="top" style="word-break:break-word;word-wrap:break-word;">
|
||||
' . $html . '
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
|
||||
static function removeLastBreakLine($html) {
|
||||
return preg_replace('/<br>([^<br>]*)$/s', '', $html);
|
||||
}
|
||||
|
||||
static function convertParagraphsToTables($html) {
|
||||
$html = preg_replace('/<p>(.*?)<\/p>/', '
|
||||
<table cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td>
|
||||
<span class="paragraph">
|
||||
<table width="100%" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tr>
|
||||
<td class="mailpoet_paragraph" style="word-break:break-word;word-wrap:break-word;">
|
||||
$1
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>', $html);
|
||||
|
||||
return preg_replace('/<p(.+style=\".*?\")?>(.*?)<\/p>/', '
|
||||
<table cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td $1>
|
||||
<span class="paragraph">
|
||||
<br /><br />
|
||||
</td>
|
||||
</tr>
|
||||
</table>'
|
||||
, $html);
|
||||
$html = preg_replace('/<p style=\"(.*)\">(.*?)<\/p>/', '
|
||||
<table width="100%" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tr>
|
||||
<td class="mailpoet_paragraph" style="word-break:break-word;word-wrap:break-word;$1">
|
||||
$2
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>', $html);
|
||||
<br /><br />
|
||||
</td>
|
||||
</tr>
|
||||
</table>'
|
||||
, $html);
|
||||
return $html;
|
||||
}
|
||||
|
||||
static function convertEmptyParagraphsToLineBreaks($html) {
|
||||
return preg_replace('/<p(?:.+style=\".*?\")?><\/p>/', '<br>', $html);
|
||||
|
||||
|
||||
static function removeLastElementBreakLine($html) {
|
||||
return preg_replace('/<br\/>([^<br\/>]*)$/s', '', $html);
|
||||
}
|
||||
|
||||
|
||||
static function addLineBreakAfterTags($html) {
|
||||
return preg_replace('/(<\/(ul|ol|h\d)>)/', '$1<br>', $html);
|
||||
return preg_replace('/(<\/(ul|ol|h\d)>)/', '$1<br />', $html);
|
||||
}
|
||||
|
||||
|
||||
static function convertBlockquotesToTables($html) {
|
||||
$template = '
|
||||
<table cellpadding="0" cellspacing="0" border="0" class="mailpoet_blockquote">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td valign="top">$1</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br>';
|
||||
|
||||
return preg_replace('/<blockquote>(.*?)<\/blockquote>/s', $template, $html);
|
||||
<table width="100%" cellpadding="0" cellspacing="0" border="0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td width="2" bgcolor="#565656"></td>
|
||||
<td width="10"></td>
|
||||
<td valign="top">
|
||||
<table style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tr>
|
||||
<td class="mailpoet_blockquote">
|
||||
$1
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br/>';
|
||||
preg_match('/<blockquote>.*?<\/blockquote>/s', $html, $blockquotes);
|
||||
foreach ($blockquotes as $index => $blockquote) {
|
||||
$blockquote = preg_replace('/<\/p>\n<p>/', '<br/><br/>', $blockquote);
|
||||
$blockquote = preg_replace('/<\/?p>/', '', $blockquote);
|
||||
$blockquote = preg_replace(
|
||||
'/<blockquote>(.*?)<\/blockquote>/s',
|
||||
$template,
|
||||
$blockquote
|
||||
);
|
||||
$html = preg_replace(
|
||||
'/' . preg_quote($blockquotes[$index], '/') . '/',
|
||||
$blockquote,
|
||||
$html
|
||||
);
|
||||
}
|
||||
return $html;
|
||||
}
|
||||
|
||||
static function removeEmptyTags($html) {
|
||||
$pattern = <<<'EOD'
|
||||
~
|
||||
<
|
||||
(?:
|
||||
!--[^-]*(?:-(?!->)[^-]*)*-->[^<]*(*SKIP)(*F) # skip comments
|
||||
|
|
||||
( # group 1
|
||||
(span|em|strong) # tag name in group 2
|
||||
[^"'>]* #'"# all that is not a quote or a closing angle bracket
|
||||
(?: # quoted attributes
|
||||
"[^\\"]*(?:\\.[^\\"]*)*+" [^"'>]* #'"# double quote
|
||||
|
|
||||
'[^\\']*(?:\\.[^\\']*)*+' [^"'>]* #'"# single quote
|
||||
)*+
|
||||
>
|
||||
\s*
|
||||
(?:
|
||||
<!--[^-]*(?:-(?!->)[^-]*)*+--> \s* # html comments
|
||||
|
|
||||
<(?1) \s* # recursion with the group 1
|
||||
)*+
|
||||
</\2> # closing tag
|
||||
) # end of the group 1
|
||||
)
|
||||
~sxi
|
||||
EOD;
|
||||
|
||||
return preg_replace($pattern, '', $html);
|
||||
|
||||
static function styleHeadings($html) {
|
||||
return preg_replace(
|
||||
'/<(h[1-6])(?:.+style=\"(.*)?\")?>/',
|
||||
'<$1 style="margin:0;font-style:normal;font-weight:normal;$2">',
|
||||
$html
|
||||
);
|
||||
}
|
||||
|
||||
static function styleLists($html) {
|
||||
$html = preg_replace(
|
||||
'/<(ul|ol)>/',
|
||||
'<$1 class="mailpoet_paragraph" style="padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;">',
|
||||
$html
|
||||
);
|
||||
$html = preg_replace('/<li>/', '<li class="mailpoet_paragraph">', $html);
|
||||
return $html;
|
||||
}
|
||||
}
|
||||
22
lib/Newsletter/Renderer/Columns/ColumnsHelper.php
Normal file
22
lib/Newsletter/Renderer/Columns/ColumnsHelper.php
Normal file
@ -0,0 +1,22 @@
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Columns;
|
||||
|
||||
class ColumnsHelper {
|
||||
static $columnsWidth = array(
|
||||
1 => 660,
|
||||
2 => 330,
|
||||
3 => 220
|
||||
);
|
||||
|
||||
static $columnsClass = array(
|
||||
1 => 'cols-one',
|
||||
2 => 'cols-two',
|
||||
3 => 'cols-three'
|
||||
);
|
||||
|
||||
static $columnsAlignment = array(
|
||||
1 => null,
|
||||
2 => 'left',
|
||||
3 => 'right'
|
||||
);
|
||||
}
|
||||
@ -1,76 +1,79 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer\Columns;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer\Columns;
|
||||
|
||||
class Renderer {
|
||||
public $columnWidths = array(
|
||||
1 => 600,
|
||||
2 => 300,
|
||||
3 => 200
|
||||
);
|
||||
function render($columnStyles, $columnsCount, $columnsData) {
|
||||
$styles = $columnStyles['block'];
|
||||
|
||||
public $columnClasses = array(
|
||||
1 => 'mailpoet_col-one',
|
||||
2 => 'mailpoet_col-two',
|
||||
3 => 'mailpoet_col-three'
|
||||
);
|
||||
|
||||
function render($columnsCount, $columnsData) {
|
||||
$columnWidth = $this->columnWidths[$columnsCount];
|
||||
$columnClass = $this->columnClasses[$columnsCount];
|
||||
|
||||
// open column container
|
||||
$columnContainerTemplate = '
|
||||
<tr>
|
||||
<td class="mailpoet_content" align="left" style="border-collapse: collapse;">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="mailpoet_cols-wrapper" style="border-collapse: collapse; padding-left: 0px; padding-right: 0px;">
|
||||
<!--[if mso]>
|
||||
<table border="0" width="100%" cellpadding="0" cellspacing="0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td width="' . $columnWidth . '" style="width: ' . $columnWidth . 'px;" valign="top">
|
||||
<![endif]-->';
|
||||
|
||||
$columnOpenTemplate = '
|
||||
<table width="' . $columnWidth . '"
|
||||
border="0" cellpadding="0" cellspacing="0" align="left" class="mailpoet_force-row ' . $columnClass . ' mailpoet_col"
|
||||
style="width: ' . $columnWidth . 'px; border-spacing: 0; mso-table-lspace: 0pt; mso-table-rspace: 0pt;
|
||||
table-layout: fixed; margin-left: auto; margin-right: auto;" bgcolor="#999999">
|
||||
<tbody>';
|
||||
|
||||
$columnCloseTemplate = '
|
||||
</tbody>
|
||||
</table>
|
||||
<!--[if mso]>
|
||||
</td>
|
||||
<td width="' . $columnWidth . '" style="width: ' . $columnWidth . 'px;" valign="top">
|
||||
<![endif]-->';
|
||||
|
||||
foreach ($columnsData as $index => $columnData) {
|
||||
$index++;
|
||||
$columnContainerTemplate .= $columnOpenTemplate . $columnData;
|
||||
if($columnsCount > 1 && $index != $columnsCount) {
|
||||
$columnContainerTemplate .= $columnCloseTemplate;
|
||||
}
|
||||
$width = ColumnsHelper::$columnsWidth[$columnsCount];
|
||||
$class = ColumnsHelper::$columnsClass[$columnsCount];
|
||||
$alignment = ColumnsHelper::$columnsAlignment[$columnsCount];
|
||||
$template = ($columnsCount === 1) ?
|
||||
$this->getOneColumnTemplate($styles, $class) :
|
||||
$this->getMultipleColumnsTemplate($styles, $width, $alignment, $class);
|
||||
$result = array_map(function ($content) use ($template) {
|
||||
return $template['contentStart'] . $content . $template['contentEnd'];
|
||||
}, $columnsData);
|
||||
$result = implode('', $result);
|
||||
if ($columnsCount !== 1) {
|
||||
$result = $template['containerStart'] . $result . $template['containerEnd'];
|
||||
}
|
||||
return $result;
|
||||
}
|
||||
|
||||
function getOneColumnTemplate($styles, $class) {
|
||||
$template['contentStart'] = '
|
||||
<tr>
|
||||
<td class="mailpoet_content" align="center" style="border-collapse:collapse">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<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'] . '">
|
||||
<tbody>';
|
||||
$template['contentEnd'] = '
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>';
|
||||
return $template;
|
||||
}
|
||||
|
||||
// close column container
|
||||
$columnContainerTemplate .= '
|
||||
</tbody>
|
||||
</table>
|
||||
<!--[if mso]>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<![endif]-->
|
||||
</td>
|
||||
</tr>
|
||||
function getMultipleColumnsTemplate($styles, $width, $alignment, $class) {
|
||||
$template['containerStart'] = '
|
||||
<tr>
|
||||
<td class="mailpoet_content-' . $class . '" align="left" style="border-collapse:collapse;background-color:' . $styles['backgroundColor'] . '!important;" bgcolor="' . $styles['backgroundColor'] . '">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td align="center" style="font-size:0;"><!--[if mso]>
|
||||
<table border="0" width="100%" cellpadding="0" cellspacing="0">
|
||||
<tbody>
|
||||
<tr>';
|
||||
$template['contentStart'] = '
|
||||
<td width="' . $width . '" valign="top">
|
||||
<![endif]--><div style="display:inline-block; max-width:' . $width . 'px; vertical-align:top; width:100%;">
|
||||
<table width="' . $width . '" class="mailpoet_' . $class . '" border="0" cellpadding="0" cellspacing="0" align="' . $alignment . '" style="width:100%;max-width:' . $width . 'px;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;">
|
||||
<tbody>';
|
||||
$template['contentEnd'] = '
|
||||
</tbody>
|
||||
</table>
|
||||
</div><!--[if mso]>
|
||||
</td>';
|
||||
$template['containerEnd'] = '
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<![endif]--></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>';
|
||||
|
||||
return $columnContainerTemplate;
|
||||
return $template;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,6 +1,7 @@
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer;
|
||||
if(!defined('ABSPATH')) exit;
|
||||
|
||||
if (!defined('ABSPATH')) exit;
|
||||
|
||||
class Renderer {
|
||||
public $template = 'Template.html';
|
||||
@ -8,7 +9,6 @@ class Renderer {
|
||||
function __construct($newsletterData) {
|
||||
$this->blocksRenderer = new Blocks\Renderer();
|
||||
$this->columnsRenderer = new Columns\Renderer();
|
||||
$this->stylesHelper = new StylesHelper();
|
||||
$this->DOMQuery = new \pQuery();
|
||||
$this->CSSInliner = new \MailPoet\Util\CSS();
|
||||
$this->data = $newsletterData;
|
||||
@ -17,51 +17,75 @@ class Renderer {
|
||||
|
||||
function render() {
|
||||
$newsletterContent = $this->renderContent($this->data['content']);
|
||||
$newsletterStyles = $this->renderStyles($this->data['globalStyles']);
|
||||
|
||||
$newsletterStyles = $this->renderGlobalStyles($this->data['globalStyles']);
|
||||
$newsletterTitle = '';
|
||||
$newsletterPreheader = '';
|
||||
$renderedTemplate = $this->renderTemplate($this->template, array(
|
||||
$newsletterTitle,
|
||||
$newsletterStyles,
|
||||
$newsletterPreheader,
|
||||
$newsletterContent
|
||||
));
|
||||
$renderedTemplateWithInlinedStyles = $this->inlineCSSStyles($renderedTemplate);
|
||||
|
||||
return $this->postProcessRenderedTemplate($renderedTemplateWithInlinedStyles);
|
||||
return $this->postProcessTemplate($renderedTemplateWithInlinedStyles);
|
||||
}
|
||||
|
||||
function renderContent($content) {
|
||||
$newsletterContent = array_map(function ($contentBlock) {
|
||||
$content = array_map(function ($contentBlock) {
|
||||
$columnCount = count($contentBlock['blocks']);
|
||||
$columnData = $this->blocksRenderer->render($contentBlock);
|
||||
return $this->columnsRenderer->render($columnCount, $columnData);
|
||||
$columnData = $this->blocksRenderer->render($contentBlock, $columnCount);
|
||||
return $this->columnsRenderer->render(
|
||||
$contentBlock['styles'],
|
||||
$columnCount,
|
||||
$columnData
|
||||
);
|
||||
}, $content['blocks']);
|
||||
return implode('', $newsletterContent);
|
||||
return implode('', $content);
|
||||
}
|
||||
|
||||
function renderStyles($styles) {
|
||||
$newsletterStyles = '';
|
||||
function renderGlobalStyles($styles) {
|
||||
$css = '';
|
||||
foreach ($styles as $selector => $style) {
|
||||
switch ($selector) {
|
||||
case 'h1':
|
||||
$selector = 'h1';
|
||||
break;
|
||||
case 'h2':
|
||||
$selector = 'h2';
|
||||
break;
|
||||
case 'h3':
|
||||
$selector = 'h3';
|
||||
break;
|
||||
case 'text':
|
||||
$selector = 'span.paragraph, ul, ol';
|
||||
$selector = '.mailpoet_paragraph';
|
||||
break;
|
||||
case 'body':
|
||||
$selector = '.mailpoet_content-wrapper';
|
||||
$selector = 'body, .mailpoet_content-wrapper';
|
||||
break;
|
||||
case 'link':
|
||||
$selector = '.mailpoet_content-wrapper a';
|
||||
break;
|
||||
case 'wrapper':
|
||||
$selector = '.mailpoet_container, .mailpoet_col-one, .mailpoet_col-two, .mailpoet_col-three';
|
||||
$selector = '.mailpoet_content';
|
||||
break;
|
||||
}
|
||||
$newsletterStyles .= $selector . '{' . PHP_EOL;
|
||||
foreach ($style as $attribute => $individualStyle) {
|
||||
$newsletterStyles .= $this->stylesHelper->translateCSSAttribute($attribute) . ':' . $individualStyle . ';' . PHP_EOL;
|
||||
if (isset($style['fontSize'])) {
|
||||
$css .= StylesHelper::setFontAndLineHeight(
|
||||
(int) $style['fontSize'],
|
||||
$selector
|
||||
);
|
||||
unset($style['fontSize']);
|
||||
}
|
||||
$newsletterStyles .= '}' . PHP_EOL;
|
||||
if (isset($style['fontFamily'])) {
|
||||
$css .= StylesHelper::setFontFamily(
|
||||
$style['fontFamily'],
|
||||
$selector
|
||||
);
|
||||
unset($style['fontFamily']);
|
||||
}
|
||||
$css .= StylesHelper::setStyle($style, $selector);
|
||||
}
|
||||
|
||||
return $newsletterStyles;
|
||||
return $css;
|
||||
}
|
||||
|
||||
function renderTemplate($template, $data) {
|
||||
@ -74,14 +98,11 @@ class Renderer {
|
||||
return $this->CSSInliner->inlineCSS(null, $template);
|
||||
}
|
||||
|
||||
function postProcessRenderedTemplate($template) {
|
||||
// remove padding from last element inside each column
|
||||
function postProcessTemplate($template) {
|
||||
// replace all !important tags except for in the body tag
|
||||
$DOM = $this->DOMQuery->parseStr($template);
|
||||
$lastColumnElement = $DOM->query('.mailpoet_col > tbody > tr:last-child > td');
|
||||
foreach ($lastColumnElement as $element) {
|
||||
$element->setAttribute('style', str_replace('padding-bottom:20px;', '', $element->attributes['style']));
|
||||
}
|
||||
|
||||
$lastColumnElement = $DOM->query('.mailpoet_template');
|
||||
$lastColumnElement->html(str_replace('!important', '', $lastColumnElement->html()));
|
||||
return $DOM->__toString();
|
||||
}
|
||||
}
|
||||
@ -1,7 +1,10 @@
|
||||
<?php namespace MailPoet\Newsletter\Renderer;
|
||||
<?php
|
||||
namespace MailPoet\Newsletter\Renderer;
|
||||
|
||||
use MailPoet\Newsletter\Renderer\Columns\ColumnsHelper;
|
||||
|
||||
class StylesHelper {
|
||||
public $cssAtributesTable = array(
|
||||
static $cssAttributesTable = array(
|
||||
'backgroundColor' => 'background-color',
|
||||
'fontColor' => 'color',
|
||||
'fontFamily' => 'font-family',
|
||||
@ -14,26 +17,234 @@ class StylesHelper {
|
||||
'borderRadius' => 'border-radius',
|
||||
'lineHeight' => 'line-height'
|
||||
);
|
||||
|
||||
function getBlockStyles($element, $ignoreSpecificStyles = false) {
|
||||
if(!isset($element['styles']['block'])) {
|
||||
static $font = array(
|
||||
'Arial' => "Arial, 'Helvetica Neue', Helvetica, sans-serif",
|
||||
'Comic Sans MS' => "'Comic Sans MS', 'Marker Felt-Thin', Arial, sans-serif",
|
||||
'Courier New' => "'Courier New', Courier, 'Lucida Sans Typewriter', 'Lucida Typewriter', monospace",
|
||||
'Georgia' => "Georgia, Times, 'Times New Roman', serif",
|
||||
'Lucida' => "'Lucida Sans Unicode', 'Lucida Grande', sans-serif",
|
||||
'Tahoma' => "Tahoma, Verdana, Segoe, sans-serif",
|
||||
'Times New Roman' => "'Times New Roman', Times, Baskerville, Georgia, serif",
|
||||
'Trebuchet MS' => "'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif",
|
||||
'Verdana' => "Verdana, Geneva, sans-serif"
|
||||
);
|
||||
static $fontSize = array(
|
||||
// fontSize => array(columnCount => lineHeight);
|
||||
8 => array(
|
||||
1 => "20",
|
||||
2 => "15",
|
||||
3 => "13"
|
||||
),
|
||||
9 => array(
|
||||
1 => "20",
|
||||
2 => "16",
|
||||
3 => "14"
|
||||
),
|
||||
10 => array(
|
||||
1 => "20",
|
||||
2 => "17",
|
||||
3 => "15"
|
||||
),
|
||||
11 => array(
|
||||
1 => "21",
|
||||
2 => "18",
|
||||
3 => "16"
|
||||
),
|
||||
12 => array(
|
||||
1 => "22",
|
||||
2 => "19",
|
||||
3 => "17"
|
||||
),
|
||||
13 => array(
|
||||
1 => "23",
|
||||
2 => "20",
|
||||
3 => "19"
|
||||
),
|
||||
14 => array(
|
||||
1 => "24",
|
||||
2 => "21",
|
||||
3 => "20"
|
||||
),
|
||||
15 => array(
|
||||
1 => "25",
|
||||
2 => "22",
|
||||
3 => "21"
|
||||
),
|
||||
16 => array(
|
||||
1 => "26",
|
||||
2 => "23",
|
||||
3 => "22"
|
||||
),
|
||||
17 => array(
|
||||
1 => "27",
|
||||
2 => "24",
|
||||
3 => "24"
|
||||
),
|
||||
18 => array(
|
||||
1 => "28",
|
||||
2 => "25",
|
||||
3 => "25"
|
||||
),
|
||||
19 => array(
|
||||
1 => "29",
|
||||
2 => "27",
|
||||
3 => "26"
|
||||
),
|
||||
20 => array(
|
||||
1 => "30",
|
||||
2 => "28",
|
||||
3 => "27"
|
||||
),
|
||||
21 => array(
|
||||
1 => "31",
|
||||
2 => "29",
|
||||
3 => "29"
|
||||
),
|
||||
22 => array(
|
||||
1 => "32",
|
||||
2 => "30",
|
||||
3 => "30"
|
||||
),
|
||||
23 => array(
|
||||
1 => "33",
|
||||
2 => "32",
|
||||
3 => "31"
|
||||
),
|
||||
24 => array(
|
||||
1 => "34",
|
||||
2 => "33",
|
||||
3 => "32"
|
||||
),
|
||||
25 => array(
|
||||
1 => "36",
|
||||
2 => "34",
|
||||
3 => "34"
|
||||
),
|
||||
26 => array(
|
||||
1 => "37",
|
||||
2 => "35",
|
||||
3 => "35"
|
||||
),
|
||||
27 => array(
|
||||
1 => "38",
|
||||
2 => "37",
|
||||
3 => "36"
|
||||
),
|
||||
28 => array(
|
||||
1 => "39",
|
||||
2 => "38",
|
||||
3 => "37"
|
||||
),
|
||||
29 => array(
|
||||
1 => "40",
|
||||
2 => "39",
|
||||
3 => "39"
|
||||
),
|
||||
30 => array(
|
||||
1 => "42",
|
||||
2 => "40",
|
||||
3 => "40"
|
||||
),
|
||||
31 => array(
|
||||
1 => "43",
|
||||
2 => "42",
|
||||
3 => "41"
|
||||
),
|
||||
32 => array(
|
||||
1 => "44",
|
||||
2 => "43",
|
||||
3 => "43"
|
||||
),
|
||||
33 => array(
|
||||
1 => "45",
|
||||
2 => "44",
|
||||
3 => "44"
|
||||
),
|
||||
34 => array(
|
||||
1 => "47",
|
||||
2 => "46",
|
||||
3 => "45"
|
||||
),
|
||||
35 => array(
|
||||
1 => "48",
|
||||
2 => "47",
|
||||
3 => "46"
|
||||
),
|
||||
36 => array(
|
||||
1 => "49",
|
||||
2 => "48",
|
||||
3 => "48"
|
||||
),
|
||||
37 => array(
|
||||
1 => "50",
|
||||
2 => "49",
|
||||
3 => "49"
|
||||
),
|
||||
38 => array(
|
||||
1 => "52",
|
||||
2 => "51",
|
||||
3 => "50"
|
||||
),
|
||||
39 => array(
|
||||
1 => "53",
|
||||
2 => "52",
|
||||
3 => "52"
|
||||
),
|
||||
40 => array(
|
||||
1 => "54",
|
||||
2 => "53",
|
||||
3 => "53"
|
||||
)
|
||||
);
|
||||
static $paddingWidth = 20;
|
||||
|
||||
static function getBlockStyles($element, $ignoreSpecificStyles = false) {
|
||||
if (!isset($element['styles']['block'])) {
|
||||
return;
|
||||
}
|
||||
|
||||
return $this->getStyles($element['styles'], 'block', $ignoreSpecificStyles);
|
||||
return self::getStyles($element['styles'], 'block', $ignoreSpecificStyles);
|
||||
}
|
||||
|
||||
function getStyles($data, $type, $ignoreSpecificStyles = false) {
|
||||
$styles = array_map(function ($attribute, $style) use($ignoreSpecificStyles) {
|
||||
if(!$ignoreSpecificStyles || !in_array($attribute, $ignoreSpecificStyles)) {
|
||||
return $this->translateCSSAttribute($attribute) . ': ' . $style . ' !important;';
|
||||
|
||||
static function getStyles($data, $type, $ignoreSpecificStyles = false) {
|
||||
$styles = array_map(function ($attribute, $style) use ($ignoreSpecificStyles) {
|
||||
if (!$ignoreSpecificStyles || !in_array($attribute, $ignoreSpecificStyles)) {
|
||||
return self::translateCSSAttribute($attribute) . ': ' . $style . ' !important;';
|
||||
}
|
||||
}, array_keys($data[$type]), $data[$type]);
|
||||
|
||||
return implode('', $styles);
|
||||
}
|
||||
|
||||
function translateCSSAttribute($attribute) {
|
||||
return (array_key_exists($attribute, $this->cssAtributesTable)) ? $this->cssAtributesTable[$attribute] : $attribute;
|
||||
|
||||
static function translateCSSAttribute($attribute) {
|
||||
return (array_key_exists($attribute, self::$cssAttributesTable)) ? self::$cssAttributesTable[$attribute] : $attribute;
|
||||
}
|
||||
}
|
||||
|
||||
static function setFontFamily($fontFamily, $selector) {
|
||||
$fontFamily = (isset(self::$font[$fontFamily])) ?
|
||||
self::$font[$fontFamily] :
|
||||
$fontFamily;
|
||||
$css = $selector . '{' . PHP_EOL;
|
||||
$css .= 'font-family:' . $fontFamily . ';' . PHP_EOL;
|
||||
$css .= '}' . PHP_EOL;
|
||||
return $css;
|
||||
}
|
||||
|
||||
static function setFontAndLineHeight($fontSize, $selector) {
|
||||
$css = '';
|
||||
foreach (ColumnsHelper::$columnsClass as $columnCount => $columnClass) {
|
||||
$css .= '.mailpoet_content-' . $columnClass . ' ' . $selector . '{' . PHP_EOL;
|
||||
$css .= 'font-size:' . $fontSize . 'px;' . PHP_EOL;
|
||||
$css .= 'line-height:' . StylesHelper::$fontSize[$fontSize][$columnCount] . 'px;' . PHP_EOL;
|
||||
$css .= '}' . PHP_EOL;
|
||||
}
|
||||
return $css;
|
||||
}
|
||||
|
||||
static function setStyle($style, $selector) {
|
||||
$css = $selector . '{' . PHP_EOL;
|
||||
foreach ($style as $attribute => $individualStyle) {
|
||||
$css .= self::translateCSSAttribute($attribute) . ':' . $individualStyle . ';' . PHP_EOL;
|
||||
}
|
||||
$css .= '}' . PHP_EOL;
|
||||
return $css;
|
||||
}
|
||||
}
|
||||
@ -1,266 +1,96 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<title>MailPoet Newsletter Template</title>
|
||||
<title>{{newsletter_title}}</title>
|
||||
</head>
|
||||
<body style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; mso-line-height-rule: exactly; font-family: Helvetica, Arial, sans-serif; text-align: left; color: #333333; margin: 0; padding: 0;"
|
||||
bgcolor="#F0F0F0" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
mso-line-height-rule: exactly;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p,
|
||||
ol,
|
||||
ul,
|
||||
li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul,
|
||||
li {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.ExternalClass {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ExternalClass,
|
||||
.ExternalClass p,
|
||||
.ExternalClass span,
|
||||
.ExternalClass font,
|
||||
.ExternalClass td,
|
||||
.ExternalClass div {
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
.ReadMsgBody {
|
||||
width: 100%;
|
||||
background-color: #ebebeb;
|
||||
}
|
||||
|
||||
table {
|
||||
border-spacing: 0;
|
||||
mso-table-lspace: 0pt;
|
||||
mso-table-rspace: 0pt;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
table td {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
img {
|
||||
-ms-interpolation-mode: bicubic;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
td.mailpoet_button, .mailpoet_image, .mailpoet_text, .mailpoet_social {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.mailpoet_button div {
|
||||
padding: 8px 0 8px 0;
|
||||
}
|
||||
|
||||
.yshortcuts a {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.mailpoet_container {
|
||||
width: 600px;
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
.mailpoet_col,
|
||||
.mailpoet_cols-wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.mailpoet_col-one,
|
||||
.mailpoet_col-two,
|
||||
.mailpoet_col-three {
|
||||
table-layout: fixed;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mailpoet_col-one,
|
||||
.mailpoet_col-two,
|
||||
.mailpoet_col-three,
|
||||
.mailpoet_header,
|
||||
.mailpoet_footer {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mailpoet_footer div, .mailpoet_header div {
|
||||
margin: 5px 0 5px 0;
|
||||
}
|
||||
|
||||
/* .mailpoet_col-one ol,*/
|
||||
.mailpoet_col-one ul {
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
/*.mailpoet_col-two ol,*/
|
||||
.mailpoet_col-two ul {
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.mailpoet_col-two li {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
/*.mailpoet_col-three ol,*/
|
||||
.mailpoet_col-three ul {
|
||||
margin-left: 14px;
|
||||
}
|
||||
|
||||
.mailpoet_col-three li {
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
||||
.mailpoet_content-wrapper a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.mailpoet_padded {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
/*word-break: break-all;*/
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.mailpoet_centered {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mailpoet_center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mailpoet_right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.mailpoet_left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mailpoet_justify {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.mailpoet_blockquote {
|
||||
border-left: 2px #565656 solid;
|
||||
padding-left: 10px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.mailpoet_blockquote p.mailpoet_signature {
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mailpoet_social {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mailpoet_social img {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.mailpoet_social div {
|
||||
padding: 5px 0 5px 0;
|
||||
}
|
||||
|
||||
.ios-footer a {
|
||||
color: #aaaaaa !important;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 400px) and (-webkit-min-device-pixel-ratio: 1) {
|
||||
[class="mailpoet_cols-wrapper"] {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
|
||||
<style type="text/css">
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 599px) and (-webkit-min-device-pixel-ratio: 1) {
|
||||
[class~="mailpoet_force-row"],
|
||||
[class="mailpoet_container"] {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
.ExternalClass * {
|
||||
line-height: 130%;
|
||||
}
|
||||
|
||||
a[class="mailpoet_button"] {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
padding: 5px 0 !important;
|
||||
.ExternalClass a {
|
||||
line-height: 140%;
|
||||
}
|
||||
|
||||
td[class="mailpoet_col"] {
|
||||
width: 100% !important;
|
||||
.ExternalClass h1, h2, h3, h1, h2, h3 {
|
||||
Margin: 0;
|
||||
}
|
||||
|
||||
[class=mailpoet_wrapper] ol,
|
||||
[class=mailpoet_wrapper] ul {
|
||||
margin-left: 18px !important;
|
||||
.ExternalClass ol {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
[class=mailpoet_wrapper] li {
|
||||
padding-left: 2px !important;
|
||||
table, td {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.mailpoet_social img {
|
||||
height: 32px !important;
|
||||
width: 32px !important;
|
||||
padding-bottom: 20px !important;
|
||||
.mailpoet_image img {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
border: 0;
|
||||
display: block;
|
||||
outline: none;
|
||||
text-align: center;
|
||||
}
|
||||
.mailpoet_padded {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.mailpoet_padded_header_footer {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
@media screen and (max-width: 599px) and (-webkit-min-device-pixel-ratio: 1) {
|
||||
.mailpoet_header {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
.mailpoet_button {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
padding: 5px 0 !important;
|
||||
}
|
||||
div, .mailpoet_cols-two, .mailpoet_cols-three {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
}
|
||||
{{newsletter_styles}}
|
||||
</style>
|
||||
|
||||
}
|
||||
|
||||
{{newsletter_editor_styles}}
|
||||
|
||||
</style>
|
||||
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td align="center" class="mailpoet_content-wrapper" valign="top" style="border-collapse:collapse;" bgcolor="#333333">
|
||||
|
||||
<table border="0" width="600" cellpadding="0" cellspacing="0" class="mailpoet_container" style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;max-width:600px">
|
||||
<tbody>
|
||||
{{newsletter_editor_content}}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<table class="mailpoet_template" border="0" width="100%" cellpadding="0" cellspacing="0"
|
||||
style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="-webkit-text-size-adjust:none;font-size:1px;line-height:1px;color:#333333;"
|
||||
height="1">{{newsletter_preheader}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" class="mailpoet_content-wrapper" valign="top">
|
||||
<!--[if mso]>
|
||||
<table align="center" border="0" cellspacing="0" cellpadding="0"
|
||||
width="660">
|
||||
<tr>
|
||||
<td align="center" valign="top" width="660">
|
||||
<![endif]-->
|
||||
<table border="0" width="660" cellpadding="0" cellspacing="0"
|
||||
style="border-spacing:0;mso-table-lspace:0;mso-table-rspace:0;max-width:660px;width:100%;">
|
||||
<tbody>
|
||||
{{newsletter_content}}
|
||||
</tbody>
|
||||
</table>
|
||||
<!--[if mso]>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<![endif]-->
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
@ -366,7 +366,7 @@ class CSS {
|
||||
$node->style = self::arrayToStyle($style);
|
||||
|
||||
// remove all !important tags (inlined styles take precedent over others anyway)
|
||||
$node->style = str_replace("!important", "", $node->style);
|
||||
// $node->style = str_replace("!important", "", $node->style);
|
||||
|
||||
// I'm leaving this for debug purposes, it has proved useful.
|
||||
/*
|
||||
|
||||
@ -13,7 +13,10 @@ use MailPoet\Newsletter\Renderer\Renderer;
|
||||
|
||||
class NewsletterRendererCest {
|
||||
function __construct() {
|
||||
$this->newsletterData = json_decode(file_get_contents(dirname(__FILE__) . '/RendererTestData.json'), true);
|
||||
$this->newsletterData = json_decode(
|
||||
file_get_contents(dirname(__FILE__) . '/RendererTestData.json'),
|
||||
true
|
||||
);
|
||||
$this->renderer = new Renderer($this->newsletterData);
|
||||
$this->columnRenderer = new ColumnRenderer();
|
||||
$this->queryDOM = new \pQuery();
|
||||
@ -22,109 +25,228 @@ class NewsletterRendererCest {
|
||||
function itRendersCompleteNewsletter() {
|
||||
$template = $this->renderer->render();
|
||||
$DOM = $this->queryDOM->parseStr($template);
|
||||
|
||||
// we expect to have 4 column containers and 7 columns (1x1, 1x2, 1x3, 1x1)
|
||||
expect(count($DOM('.mailpoet_cols-wrapper')))->equals(4);
|
||||
expect(count($DOM('.mailpoet_force-row')))->equals(7);
|
||||
// we expect to have 7 columns:
|
||||
// 1x column including header
|
||||
// 2x column
|
||||
// 3x column
|
||||
// 1x footer
|
||||
expect(count($DOM('.mailpoet_cols-one')))->equals(2);
|
||||
expect(count($DOM('.mailpoet_cols-two')))->equals(2);
|
||||
expect(count($DOM('.mailpoet_cols-three')))->equals(3);
|
||||
}
|
||||
|
||||
function itRendersColumns() {
|
||||
function itRendersOneColumn() {
|
||||
$columnContent = array(
|
||||
'one'
|
||||
);
|
||||
$columnStyles = array(
|
||||
'block' => array(
|
||||
'backgroundColor' => "#999999"
|
||||
)
|
||||
);
|
||||
$DOM = $this->queryDOM->parseStr(
|
||||
$this->columnRenderer->render(
|
||||
$columnStyles,
|
||||
count($columnContent),
|
||||
$columnContent)
|
||||
);
|
||||
foreach ($DOM('table.mailpoet_cols-one > tbody') as $column) {
|
||||
$renderedColumnContent[] = trim($column->text());
|
||||
};
|
||||
expect($renderedColumnContent)->equals($columnContent);
|
||||
}
|
||||
|
||||
function itRendersTwoColumns() {
|
||||
$columnContent = array(
|
||||
'one',
|
||||
'two'
|
||||
);
|
||||
$columnStyles = array(
|
||||
'block' => array(
|
||||
'backgroundColor' => "#999999"
|
||||
)
|
||||
);
|
||||
$DOM = $this->queryDOM->parseStr(
|
||||
$this->columnRenderer->render(
|
||||
$columnStyles,
|
||||
count($columnContent),
|
||||
$columnContent)
|
||||
);
|
||||
foreach ($DOM('table.mailpoet_cols-two > tbody') as $column) {
|
||||
$renderedColumnContent[] = trim($column->text());
|
||||
};
|
||||
expect($renderedColumnContent)->equals($columnContent);
|
||||
}
|
||||
|
||||
function itRendersThreeColumns() {
|
||||
$columnContent = array(
|
||||
'one',
|
||||
'two',
|
||||
'three'
|
||||
);
|
||||
$DOM = $this->queryDOM->parseStr($this->columnRenderer->render(count($columnContent), $columnContent));
|
||||
|
||||
// rendered object should cocntain three columns
|
||||
foreach ($DOM('.mailpoet_force-row > tbody') as $column) {
|
||||
$columnStyles = array(
|
||||
'block' => array(
|
||||
'backgroundColor' => "#999999"
|
||||
)
|
||||
);
|
||||
$DOM = $this->queryDOM->parseStr(
|
||||
$this->columnRenderer->render(
|
||||
$columnStyles,
|
||||
count($columnContent),
|
||||
$columnContent)
|
||||
);
|
||||
foreach ($DOM('table.mailpoet_cols-three > tbody') as $column) {
|
||||
$renderedColumnContent[] = trim($column->text());
|
||||
};
|
||||
expect(count(array_diff($renderedColumnContent, $columnContent)))->equals(0);
|
||||
expect($renderedColumnContent)->equals($columnContent);
|
||||
}
|
||||
|
||||
function itRendersHeader() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][0];
|
||||
$DOM = $this->queryDOM->parseStr(Header::render($template));
|
||||
|
||||
// element should be proplerly nested, and styles should be applied to <td>, <a> and <p> elements
|
||||
expect(is_object($DOM('tr > td > p', 0)))->true();
|
||||
expect(is_object($DOM('tr > td > p > a', 0)))->true();
|
||||
// element should be proplerly nested, and styles should be applied
|
||||
expect(!empty($DOM('tr > td.mailpoet_header', 0)->html()))->true();
|
||||
expect(!empty($DOM('tr > td > a', 0)->html()))->true();
|
||||
expect($DOM('a', 0)->attr('style'))->notEmpty();
|
||||
expect($DOM('p', 0)->attr('style'))->notEmpty();
|
||||
expect($DOM('td', 0)->attr('style'))->notEmpty();
|
||||
}
|
||||
|
||||
|
||||
function itRendersImage() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][1];
|
||||
$DOM = $this->queryDOM->parseStr(Image::render($template));
|
||||
|
||||
// element should be properly nested, it's width set and style applied to <td>
|
||||
expect(is_object($DOM('tr > td > img', 0)))->true();
|
||||
expect($DOM('tr > td > img', 0)->attr('width'))->equals(560);
|
||||
expect($DOM('tr > td', 0)->attr('style'))->notEmpty();
|
||||
$DOM = $this->queryDOM->parseStr(Image::render($template, $columnCount = 1));
|
||||
// element should be properly nested, it's width set and style applied
|
||||
expect($DOM('tr > td > img', 0)->attr('width'))->equals(620);
|
||||
expect($DOM('tr > td > img', 0)->attr('style'))->notEmpty();
|
||||
}
|
||||
|
||||
function itAdjustImageSizeBasedOnColumnWidth() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][1];
|
||||
$template['width'] = '800px';
|
||||
$DOM = $this->queryDOM->parseStr(Image::render($template, $columnCount = 2));
|
||||
// 800px resized to 330px (2-column layout) and 40px padding applied
|
||||
expect($DOM('tr > td > img', 0)->attr('width'))->equals(290);
|
||||
$template['width'] = '280px';
|
||||
$DOM = $this->queryDOM->parseStr(Image::render($template, $columnCount = 2));
|
||||
// 280px image should not be resized and padding should not be applied
|
||||
expect($DOM('tr > td > img', 0)->attr('width'))->equals(280);
|
||||
}
|
||||
|
||||
|
||||
function itRendersText() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][2];
|
||||
$DOM = $this->queryDOM->parseStr(Text::render($template));
|
||||
|
||||
//!d($DOM->__toString());exit;
|
||||
// blockquotes and paragraphs should be converted to spans and placed inside a table
|
||||
expect(is_object($DOM('tr > td.mailpoet_text > table > tr > td > span.paragraph', 0)))->true();
|
||||
expect(is_object($DOM('tr > td.mailpoet_text > table.mailpoet_blockquote > tbody > tr > td > table > tr > td > span.paragraph', 0)))->true();
|
||||
expect(
|
||||
!empty($DOM('tr > td > table > tr > td.mailpoet_paragraph', 0)->html())
|
||||
)->true();
|
||||
expect(
|
||||
!empty($DOM('tr > td > table > tr > td.mailpoet_blockquote', 0)->html()
|
||||
))->true();
|
||||
// ul/ol/li should have mailpoet_paragraph class added & styles applied
|
||||
expect(
|
||||
!empty(
|
||||
$DOM('tr > td > ul.mailpoet_paragraph > li.mailpoet_paragraph', 0)->html()
|
||||
)
|
||||
)->true();
|
||||
expect(
|
||||
!empty(
|
||||
$DOM('tr > td > ol.mailpoet_paragraph > li.mailpoet_paragraph', 0)->html()
|
||||
)
|
||||
)->true();
|
||||
expect($DOM('tr > td.mailpoet_text > ul.mailpoet_paragraph', 0)->attr('style'))
|
||||
->contains('padding-top:0;padding-bottom:0;margin-top:0;margin-bottom:0;');
|
||||
// headings should be styled
|
||||
expect($DOM('tr > td.mailpoet_text > h1', 0)->attr('style'))
|
||||
->contains('margin:0;font-style:normal;font-weight:normal;');
|
||||
|
||||
}
|
||||
|
||||
function itRendersDivider() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][3];
|
||||
$DOM = $this->queryDOM->parseStr(Divider::render($template));
|
||||
|
||||
// element should be properly nested and its border-top-width set
|
||||
expect(is_object($DOM('tr > td.mailpoet_divider > table > tr > td', 0)))->true();
|
||||
expect(preg_match('/border-top-width: 3px/', $DOM('tr > td.mailpoet_divider > table > tr > td', 0)->attr('style')))->equals(1);
|
||||
expect(
|
||||
preg_match(
|
||||
'/border-top-width: 3px/',
|
||||
$DOM('tr > td.mailpoet_divider > table > tr > td.mailpoet_divider-cell', 0)->attr('style')
|
||||
))->equals(1);
|
||||
}
|
||||
|
||||
|
||||
function itRendersSpacer() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][4];
|
||||
$DOM = $this->queryDOM->parseStr(Spacer::render($template));
|
||||
|
||||
// element should be properly nested and its height set
|
||||
expect(is_object($DOM('tr > td.mailpoet_spacer', 0)))->true();
|
||||
expect(preg_match('/height: 50px/', $DOM('tr > td.mailpoet_spacer', 0)->attr('style')))->equals(1);
|
||||
expect($DOM('tr > td.mailpoet_spacer', 0)->attr('height'))->equals(50);
|
||||
}
|
||||
|
||||
function itRendersButton() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][5];
|
||||
$DOM = $this->queryDOM->parseStr(Button::render($template));
|
||||
|
||||
// element should be properly nested with arcsize/styles/fillcolor set
|
||||
expect(is_object($DOM('tr > td.mailpoet_button > div > table > tr > td > a.mailpoet_button', 0)))->true();
|
||||
expect(preg_match('/line-height: 30px/', $DOM('a.mailpoet_button', 0)->attr('style')))->equals(1);
|
||||
expect(preg_match('/arcsize="' . round(20 / 30 * 100) . '%"/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1);
|
||||
expect(preg_match('/style="height:30px.*?width:100px/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1);
|
||||
expect(preg_match('/style="color:#ffffff.*?font-family:Arial.*?font-size:13px/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1);
|
||||
expect(preg_match('/fillcolor="#666666/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1);
|
||||
expect(
|
||||
!empty($DOM('tr > td > div > table > tr > td > a.mailpoet_button', 0)->html())
|
||||
)->true();
|
||||
expect(
|
||||
preg_match(
|
||||
'/line-height: 30px/',
|
||||
$DOM('a.mailpoet_button', 0)->attr('style'))
|
||||
)->equals(1);
|
||||
expect(
|
||||
preg_match(
|
||||
'/arcsize="' . round(20 / 30 * 100) . '%"/',
|
||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||
)->equals(1);
|
||||
expect(
|
||||
preg_match(
|
||||
'/style="height:30px.*?width:100px/',
|
||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||
)->equals(1);
|
||||
expect(
|
||||
preg_match(
|
||||
'/style="color:#ffffff.*?font-family:Arial.*?font-size:14px/',
|
||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||
)->equals(1);
|
||||
expect(
|
||||
preg_match(
|
||||
'/fillcolor="#666666/',
|
||||
$DOM('tr > td > div > table > tr > td', 0)->text())
|
||||
)->equals(1);
|
||||
}
|
||||
|
||||
function itRendersSocialIcons() {
|
||||
$template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][6];
|
||||
$DOM = $this->queryDOM->parseStr(Social::render($template));
|
||||
|
||||
// element should be properly nested, contain social icons and image source/link href/alt should be properly set
|
||||
expect(is_object($DOM('tr > td.mailpoet_social > div', 0)))->true();
|
||||
// element should be properly nested, contain social icons and
|
||||
// image source/link href/alt should be properly set
|
||||
expect(!empty($DOM('tr > td > div.mailpoet_social-icon', 0)->html()))->true();
|
||||
expect($DOM('a', 0)->attr('href'))->equals('http://example.com');
|
||||
expect($DOM('div > a:nth-of-type(10) > img')->attr('src'))->contains('custom.png');
|
||||
expect($DOM('div > a:nth-of-type(10) > img')->attr('alt'))->equals('custom');
|
||||
// there should be 10 icons and 19 spacer images
|
||||
expect(count($DOM('a > img')))->equals(10);
|
||||
expect($DOM('a', 0)->attr('href'))->equals('http://example.org');
|
||||
expect($DOM('a > img', 0)->attr('src'))->equals('http://mp3.mailpoet.net/various/social-icons/custom.png');
|
||||
expect($DOM('a > img', 0)->attr('alt'))->equals('custom');
|
||||
expect(count($DOM('img')))->equals(19);
|
||||
}
|
||||
|
||||
function itRendersFooter() {
|
||||
$template = $this->newsletterData['content']['blocks'][3]['blocks'][0]['blocks'][0];
|
||||
$DOM = $this->queryDOM->parseStr(Footer::render($template));
|
||||
|
||||
// element should be proplerly nested, and styles should be applied to <td>, <a> and <p> elements
|
||||
expect(is_object($DOM('tr > td.mailpoet_footer > div', 0)))->true();
|
||||
expect(is_object($DOM('tr > td.mailpoet_footer > div > a > p', 0)))->true();
|
||||
expect($DOM('tr > td.mailpoet_footer', 0)->attr('style'))->notEmpty();
|
||||
// element should be proplerly nested, and styles should be applied
|
||||
expect(!empty($DOM('tr > td.mailpoet_footer', 0)->html()))->true();
|
||||
expect(!empty($DOM('tr > td > a', 0)->html()))->true();
|
||||
expect($DOM('a', 0)->attr('style'))->notEmpty();
|
||||
expect($DOM('p', 0)->attr('style'))->notEmpty();
|
||||
expect($DOM('td', 0)->attr('style'))->notEmpty();
|
||||
}
|
||||
|
||||
function itPostProcessesTemplate() {
|
||||
$template = $this->renderer->render();
|
||||
// !important should be stripped from everywhere except from
|
||||
// with the <style> tag
|
||||
expect(preg_match('/<style.*?important/s', $template))
|
||||
->equals(1);
|
||||
expect(preg_match('/mailpoet_template.*?important/s', $template))
|
||||
->equals(0);
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user