Skip to content

Commit 1c321f4

Browse files
dingo-ddingo-d
authored
Merge pull request #32 from dingo-d/feature/mj-head-components
Implement all mj-head components
2 parents 8703373 + d07b40e commit 1c321f4

File tree

11 files changed

+239
-292
lines changed

11 files changed

+239
-292
lines changed

‎src/Elements/HeadComponents/MjAttributes.php‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<?php
2+
3+
declare(strict_types=1);
4+
5+
namespace MadeByDenis\PhpMjmlRenderer\Elements\HeadComponents;
6+
7+
use MadeByDenis\PhpMjmlRenderer\Elements\AbstractElement;
8+
9+
class MjAttributes extends AbstractElement
10+
{
11+
public const string TAG_NAME = 'mj-attributes';
12+
public const bool ENDING_TAG = false;
13+
14+
protected array $allowedAttributes = [];
15+
protected array $defaultAttributes = [];
16+
17+
public function render(): string
18+
{
19+
return '';
20+
}
21+
22+
public function getStyles(): array
23+
{
24+
return [];
25+
}
26+
}

‎src/Elements/HeadComponents/MjBreakpoint.php‎

Lines changed: 1 addition & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,18 @@
11
<?php
22

3-
/**
4-
* PHP MJML Renderer library
5-
*
6-
* @package MadeByDenis\PhpMjmlRenderer
7-
* @link https://github.com/dingo-d/php-mjml-renderer
8-
* @license https://opensource.org/licenses/MIT MIT
9-
*/
10-
113
declare(strict_types=1);
124

135
namespace MadeByDenis\PhpMjmlRenderer\Elements\HeadComponents;
146

157
use MadeByDenis\PhpMjmlRenderer\Elements\AbstractElement;
168

17-
/**
18-
* Mjml Breakpoint Element
19-
*
20-
* @link https://documentation.mjml.io/#mj-breakpoint
21-
*
22-
* @since 1.0.0
23-
*/
249
class MjBreakpoint extends AbstractElement
2510
{
2611
public const string TAG_NAME = 'mj-breakpoint';
27-
2812
public const bool ENDING_TAG = false;
2913

30-
/**
31-
* List of allowed attributes on the element
32-
*
33-
* @var array<string, array<string, string>>
34-
*/
3514
protected array $allowedAttributes = [
36-
'width' => [
37-
'unit' => 'px',
38-
'type' => 'measure',
39-
'description' => 'breakpoint width',
40-
'default_value' => '480px',
41-
],
15+
'width' => ['unit' => 'px', 'type' => 'string', 'default_value' => '480px'],
4216
];
4317

4418
protected array $defaultAttributes = [
@@ -47,14 +21,9 @@ class MjBreakpoint extends AbstractElement
4721

4822
public function render(): string
4923
{
50-
// mj-breakpoint doesn't render any HTML
51-
// It's processed by mj-head to set responsive breakpoint
5224
return '';
5325
}
5426

55-
/**
56-
* @return array<string, array<string, string>>
57-
*/
5827
public function getStyles(): array
5928
{
6029
return [];

‎src/Elements/HeadComponents/MjFont.php‎

Lines changed: 4 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,35 @@
11
<?php
22

3-
/**
4-
* PHP MJML Renderer library
5-
*
6-
* @package MadeByDenis\PhpMjmlRenderer
7-
* @link https://github.com/dingo-d/php-mjml-renderer
8-
* @license https://opensource.org/licenses/MIT MIT
9-
*/
10-
113
declare(strict_types=1);
124

135
namespace MadeByDenis\PhpMjmlRenderer\Elements\HeadComponents;
146

157
use MadeByDenis\PhpMjmlRenderer\Elements\AbstractElement;
168

17-
/**
18-
* Mjml Font Element
19-
*
20-
* @link https://documentation.mjml.io/#mj-font
21-
*
22-
* @since 1.0.0
23-
*/
249
class MjFont extends AbstractElement
2510
{
2611
public const string TAG_NAME = 'mj-font';
27-
2812
public const bool ENDING_TAG = false;
2913

30-
/**
31-
* List of allowed attributes on the element
32-
*
33-
* @var array<string, array<string, string>>
34-
*/
3514
protected array $allowedAttributes = [
36-
'name' => [
37-
'unit' => 'string',
38-
'type' => 'string',
39-
'description' => 'font name',
40-
'default_value' => '',
41-
],
42-
'href' => [
43-
'unit' => 'string',
44-
'type' => 'string',
45-
'description' => 'font url',
46-
'default_value' => '',
47-
],
15+
'name' => ['unit' => 'string', 'type' => 'string', 'default_value' => ''],
16+
'href' => ['unit' => 'string', 'type' => 'string', 'default_value' => ''],
4817
];
4918

5019
protected array $defaultAttributes = [];
5120

5221
public function render(): string
5322
{
54-
$name = $this->getAttribute('name');
5523
$href = $this->getAttribute('href');
24+
$name = $this->getAttribute('name');
5625

5726
if (!$href) {
5827
return '';
5928
}
6029

61-
// Render as a link tag for non-MSO clients
62-
return "<!--[if !mso]><!--><link href=\"$href\" rel=\"stylesheet\" type=\"text/css\"><!--<![endif]-->";
30+
return "<link href='$href' rel='stylesheet' type='text/css'>";
6331
}
6432

65-
/**
66-
* @return array<string, array<string, string>>
67-
*/
6833
public function getStyles(): array
6934
{
7035
return [];

‎src/Elements/HeadComponents/MjHead.php‎

Lines changed: 1 addition & 129 deletions
Original file line numberDiff line numberDiff line change
@@ -1,153 +1,25 @@
11
<?php
22

3-
/**
4-
* PHP MJML Renderer library
5-
*
6-
* @package MadeByDenis\PhpMjmlRenderer
7-
* @link https://github.com/dingo-d/php-mjml-renderer
8-
* @license https://opensource.org/licenses/MIT MIT
9-
*/
10-
113
declare(strict_types=1);
124

135
namespace MadeByDenis\PhpMjmlRenderer\Elements\HeadComponents;
146

157
use MadeByDenis\PhpMjmlRenderer\Elements\AbstractElement;
16-
use MadeByDenis\PhpMjmlRenderer\Elements\ElementFactory;
178

18-
/**
19-
* Mjml Head Element
20-
*
21-
* @link https://documentation.mjml.io/#mj-head
22-
*
23-
* @since 1.0.0
24-
*/
259
class MjHead extends AbstractElement
2610
{
2711
public const string TAG_NAME = 'mj-head';
28-
2912
public const bool ENDING_TAG = false;
3013

31-
/**
32-
* List of allowed attributes on the element
33-
*
34-
* @var array<string, array<string, string>>
35-
*/
3614
protected array $allowedAttributes = [];
37-
3815
protected array $defaultAttributes = [];
3916

4017
public function render(): string
4118
{
4219
$children = $this->getChildren() ?? [];
43-
44-
$title = '';
45-
$preview = '';
46-
$styles = '';
47-
$fonts = [];
48-
$breakpoint = '480px';
49-
50-
// Process head components
51-
foreach ($children as $child) {
52-
$tag = $child->getTag();
53-
$element = ElementFactory::create($child);
54-
55-
match ($tag) {
56-
'mj-title' => $title = $element->render(),
57-
'mj-preview' => $preview = $element->render(),
58-
'mj-style' => $styles .= $element->render(),
59-
'mj-font' => $fonts[] = $element->render(),
60-
'mj-breakpoint' => $breakpoint = $child->getAttributeValue('width') ?: '480px',
61-
default => null,
62-
};
63-
}
64-
65-
// Build head content
66-
$head = '<head>';
67-
$head .= $title ?: '<title></title>';
68-
$head .= '<!--[if !mso]><!--><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]-->';
69-
$head .= '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">';
70-
$head .= '<meta name="viewport" content="width=device-width,initial-scale=1">';
71-
$head .= $this->renderBaseStyles();
72-
$head .= $this->renderMsoStyles();
73-
$head .= $this->renderOutlookStyles();
74-
75-
// Add fonts
76-
foreach ($fonts as $font) {
77-
$head .= $font;
78-
}
79-
80-
// Add responsive styles
81-
$head .= $this->renderResponsiveStyles($breakpoint);
82-
83-
// Add custom styles
84-
$head .= $styles;
85-
86-
// Add preview
87-
$head .= $preview;
88-
89-
$head .= '</head>';
90-
91-
return $head;
92-
}
93-
94-
private function renderBaseStyles(): string
95-
{
96-
$styles = '<style type="text/css">#outlook a { padding:0; }' . "\n";
97-
$styles .= ' body { margin:0;padding:0;';
98-
$styles .= '-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }' . "\n";
99-
$styles .= ' table, td { border-collapse:collapse;';
100-
$styles .= 'mso-table-lspace:0pt;mso-table-rspace:0pt; }' . "\n";
101-
$styles .= ' img { border:0;height:auto;line-height:100%; outline:none;';
102-
$styles .= 'text-decoration:none;-ms-interpolation-mode:bicubic; }' . "\n";
103-
$styles .= ' p { display:block;margin:13px 0; }</style>';
104-
105-
return $styles;
106-
}
107-
108-
private function renderMsoStyles(): string
109-
{
110-
$msoStyles = '<!--[if mso]>';
111-
$msoStyles .= '<noscript><xml><o:OfficeDocumentSettings>';
112-
$msoStyles .= '<o:AllowPNG/><o:PixelsPerInch>96</o:PixelsPerInch>';
113-
$msoStyles .= '</o:OfficeDocumentSettings></xml></noscript>';
114-
$msoStyles .= '<![endif]-->';
115-
116-
return $msoStyles;
117-
}
118-
119-
private function renderOutlookStyles(): string
120-
{
121-
return '<!--[if lte mso 11]>
122-
<style type="text/css">
123-
.mj-outlook-group-fix { width:100% !important; }
124-
</style>
125-
<![endif]-->';
126-
}
127-
128-
private function renderResponsiveStyles(string $breakpoint): string
129-
{
130-
$minWidth = $breakpoint;
131-
132-
$styles = '<!--[if !mso]><!-->';
133-
$styles .= '<link href="https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700" ';
134-
$styles .= 'rel="stylesheet" type="text/css">';
135-
$styles .= '<style type="text/css">';
136-
$styles .= '@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);';
137-
$styles .= '</style><!--<![endif]-->';
138-
$styles .= "<style type=\"text/css\">@media only screen and (min-width:$minWidth) {";
139-
$styles .= ' .mj-column-per-100 { width:100% !important; max-width: 100%; }';
140-
$styles .= ' }</style>';
141-
$styles .= "<style media=\"screen and (min-width:$minWidth)\">";
142-
$styles .= '.moz-text-html .mj-column-per-100 { width:100% !important; max-width: 100%; }';
143-
$styles .= '</style><style type="text/css"></style>';
144-
145-
return $styles;
20+
return $this->renderChildren($children, []);
14621
}
14722

148-
/**
149-
* @return array<string, array<string, string>>
150-
*/
15123
public function getStyles(): array
15224
{
15325
return [];

‎src/Elements/HeadComponents/MjHtmlAttributes.php‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<?php
2+
3+
declare(strict_types=1);
4+
5+
namespace MadeByDenis\PhpMjmlRenderer\Elements\HeadComponents;
6+
7+
use MadeByDenis\PhpMjmlRenderer\Elements\AbstractElement;
8+
9+
class MjHtmlAttributes extends AbstractElement
10+
{
11+
public const string TAG_NAME = 'mj-html-attributes';
12+
public const bool ENDING_TAG = false;
13+
14+
protected array $allowedAttributes = [];
15+
protected array $defaultAttributes = [];
16+
17+
public function render(): string
18+
{
19+
return '';
20+
}
21+
22+
public function getStyles(): array
23+
{
24+
return [];
25+
}
26+
}

0 commit comments

Comments
 (0)