Completed
Push — master ( a35b70...1dd31e )
by Tim
13:48
created

CssToInlineStyles::processCSSProperties()   B

Complexity

Conditions 5
Paths 4

Size

Total Lines 36
Code Lines 14

Duplication

Lines 0
Ratio 0 %

Importance

Changes 1
Bugs 0 Features 0
Metric Value
cc 5
eloc 14
c 1
b 0
f 0
nc 4
nop 1
dl 0
loc 36
rs 8.439
1
<?php
2
namespace TijsVerkoyen\CssToInlineStyles;
3
4
use Symfony\Component\CssSelector\CssSelector;
5
use Symfony\Component\CssSelector\Exception\ExceptionInterface;
6
7
/**
8
 * CSS to Inline Styles class
9
 *
10
 * @author         Tijs Verkoyen <[email protected]>
11
 * @version        1.5.4
12
 * @copyright      Copyright (c), Tijs Verkoyen. All rights reserved.
13
 * @license        BSD License
14
 */
15
class CssToInlineStyles
16
{
17
    /**
18
     * The CSS to use
19
     *
20
     * @var    string
21
     */
22
    private $css;
23
24
    /**
25
     * The processed CSS rules
26
     *
27
     * @var    array
28
     */
29
    private $cssRules;
30
31
    /**
32
     * Should the generated HTML be cleaned
33
     *
34
     * @var    bool
35
     */
36
    private $cleanup = false;
37
38
    /**
39
     * The encoding to use.
40
     *
41
     * @var    string
42
     */
43
    private $encoding = 'UTF-8';
44
45
    /**
46
     * The HTML to process
47
     *
48
     * @var    string
49
     */
50
    private $html;
51
52
    /**
53
     * Use inline-styles block as CSS
54
     *
55
     * @var    bool
56
     */
57
    private $useInlineStylesBlock = false;
58
59
    /**
60
     * Strip original style tags
61
     *
62
     * @var bool
63
     */
64
    private $stripOriginalStyleTags = false;
65
66
    /**
67
     * Exclude the media queries from the inlined styles
68
     *
69
     * @var bool
70
     */
71
    private $excludeMediaQueries = true;
72
73
    /**
74
     * Creates an instance, you could set the HTML and CSS here, or load it
75
     * later.
76
     *
77
     * @return void
78
     * @param  string [optional] $html The HTML to process.
79
     * @param  string [optional] $css  The CSS to use.
80
     */
81
    public function __construct($html = null, $css = null)
82
    {
83
        if ($html !== null) {
84
            $this->setHTML($html);
85
        }
86
        if ($css !== null) {
87
            $this->setCSS($css);
88
        }
89
    }
90
91
    /**
92
     * Cleanup the generated HTML
93
     *
94
     * @return string
95
     * @param  string $html The HTML to cleanup.
96
     */
97
    private function cleanupHTML($html)
98
    {
99
        // remove classes
100
        $html = preg_replace('/(\s)+class="(.*)"(\s)*/U', ' ', $html);
101
102
        // remove IDs
103
        $html = preg_replace('/(\s)+id="(.*)"(\s)*/U', ' ', $html);
104
105
        // return
106
        return $html;
107
    }
108
109
    /**
110
     * Converts the loaded HTML into an HTML-string with inline styles based on the loaded CSS
111
     *
112
     * @return string
113
     * @param  bool [optional] $outputXHTML Should we output valid XHTML?
114
     */
115
    public function convert($outputXHTML = false)
116
    {
117
        // redefine
118
        $outputXHTML = (bool) $outputXHTML;
119
120
        // validate
121
        if ($this->html == null) {
122
            throw new Exception('No HTML provided.');
123
        }
124
125
        // should we use inline style-block
126
        if ($this->useInlineStylesBlock) {
127
            // init var
128
            $matches = array();
129
130
            // match the style blocks
131
            preg_match_all('|<style(.*)>(.*)</style>|isU', $this->html, $matches);
132
133
            // any style-blocks found?
134
            if (!empty($matches[2])) {
135
                // add
136
                foreach ($matches[2] as $match) {
137
                    $this->css .= trim($match) . "\n";
138
                }
139
            }
140
        }
141
142
        // process css
143
        $this->processCSS();
144
145
        // create new DOMDocument
146
        $document = new \DOMDocument('1.0', $this->getEncoding());
147
148
        // set error level
149
        $internalErrors = libxml_use_internal_errors(true);
150
151
        // load HTML
152
        $document->loadHTML($this->html);
153
154
        // Restore error level
155
        libxml_use_internal_errors($internalErrors);
156
157
        // create new XPath
158
        $xPath = new \DOMXPath($document);
159
160
        // any rules?
161
        if (!empty($this->cssRules)) {
162
            // loop rules
163
            foreach ($this->cssRules as $rule) {
164
                try {
165
                    $query = CssSelector::toXPath($rule['selector']);
166
                } catch (ExceptionInterface $e) {
167
                    continue;
168
                }
169
170
                // search elements
171
                $elements = $xPath->query($query);
172
173
                // validate elements
174
                if ($elements === false) {
175
                    continue;
176
                }
177
178
                // loop found elements
179
                foreach ($elements as $element) {
180
                    // no styles stored?
181
                    if ($element->attributes->getNamedItem(
182
                            'data-css-to-inline-styles-original-styles'
183
                        ) == null
184
                    ) {
185
                        // init var
186
                        $originalStyle = '';
187
                        if ($element->attributes->getNamedItem('style') !== null) {
188
                            $originalStyle = $element->attributes->getNamedItem('style')->value;
189
                        }
190
191
                        // store original styles
192
                        $element->setAttribute(
193
                            'data-css-to-inline-styles-original-styles',
194
                            $originalStyle
195
                        );
196
197
                        // clear the styles
198
                        $element->setAttribute('style', '');
199
                    }
200
201
                    // init var
202
                    $properties = array();
203
204
                    // get current styles
205
                    $stylesAttribute = $element->attributes->getNamedItem('style');
206
207
                    // any styles defined before?
208
                    if ($stylesAttribute !== null) {
209
                        // get value for the styles attribute
210
                        $definedStyles = (string) $stylesAttribute->value;
211
212
                        // split into properties
213
                        $definedProperties = $this->splitIntoProperties($definedStyles);
214
                        // loop properties
215
                        foreach ($definedProperties as $property) {
216
                            // validate property
217
                            if ($property == '') {
218
                                continue;
219
                            }
220
221
                            // split into chunks
222
                            $chunks = (array) explode(':', trim($property), 2);
223
224
                            // validate
225
                            if (!isset($chunks[1])) {
226
                                continue;
227
                            }
228
229
                            // loop chunks
230
                            $properties[$chunks[0]] = trim($chunks[1]);
231
                        }
232
                    }
233
234
                    // add new properties into the list
235
                    foreach ($rule['properties'] as $key => $value) {
236
                        // If one of the rules is already set and is !important, don't apply it,
237
                        // except if the new rule is also important.
238
                        if (
239
                            !isset($properties[$key])
240
                            || stristr($properties[$key], '!important') === false
241
                            || (stristr(implode('', $value), '!important') !== false)
242
                        ) {
243
                            $properties[$key] = $value;
244
                        }
245
                    }
246
247
                    // build string
248
                    $propertyChunks = array();
249
250
                    // build chunks
251
                    foreach ($properties as $key => $values) {
252
                        foreach ((array) $values as $value) {
253
                            $propertyChunks[] = $key . ': ' . $value . ';';
254
                        }
255
                    }
256
257
                    // build properties string
258
                    $propertiesString = implode(' ', $propertyChunks);
259
260
                    // set attribute
261
                    if ($propertiesString != '') {
262
                        $element->setAttribute('style', $propertiesString);
263
                    }
264
                }
265
            }
266
267
            // reapply original styles
268
            // search elements
269
            $elements = $xPath->query('//*[@data-css-to-inline-styles-original-styles]');
270
271
            // loop found elements
272
            foreach ($elements as $element) {
273
                // get the original styles
274
                $originalStyle = $element->attributes->getNamedItem(
275
                    'data-css-to-inline-styles-original-styles'
276
                )->value;
277
278
                if ($originalStyle != '') {
279
                    $originalProperties = array();
280
                    $originalStyles = $this->splitIntoProperties($originalStyle);
281
282
                    foreach ($originalStyles as $property) {
283
                        // validate property
284
                        if ($property == '') {
285
                            continue;
286
                        }
287
288
                        // split into chunks
289
                        $chunks = (array) explode(':', trim($property), 2);
290
291
                        // validate
292
                        if (!isset($chunks[1])) {
293
                            continue;
294
                        }
295
296
                        // loop chunks
297
                        $originalProperties[$chunks[0]] = trim($chunks[1]);
298
                    }
299
300
                    // get current styles
301
                    $stylesAttribute = $element->attributes->getNamedItem('style');
302
                    $properties = array();
303
304
                    // any styles defined before?
305
                    if ($stylesAttribute !== null) {
306
                        // get value for the styles attribute
307
                        $definedStyles = (string) $stylesAttribute->value;
308
309
                        // split into properties
310
                        $definedProperties = $this->splitIntoProperties($definedStyles);
311
312
                        // loop properties
313
                        foreach ($definedProperties as $property) {
314
                            // validate property
315
                            if ($property == '') {
316
                                continue;
317
                            }
318
319
                            // split into chunks
320
                            $chunks = (array) explode(':', trim($property), 2);
321
322
                            // validate
323
                            if (!isset($chunks[1])) {
324
                                continue;
325
                            }
326
327
                            // loop chunks
328
                            $properties[$chunks[0]] = trim($chunks[1]);
329
                        }
330
                    }
331
332
                    // add new properties into the list
333
                    foreach ($originalProperties as $key => $value) {
334
                        $properties[$key] = $value;
335
                    }
336
337
                    // build string
338
                    $propertyChunks = array();
339
340
                    // build chunks
341
                    foreach ($properties as $key => $values) {
342
                        foreach ((array) $values as $value) {
343
                            $propertyChunks[] = $key . ': ' . $value . ';';
344
                        }
345
                    }
346
347
                    // build properties string
348
                    $propertiesString = implode(' ', $propertyChunks);
349
350
                    // set attribute
351
                    if ($propertiesString != '') {
352
                        $element->setAttribute(
353
                            'style',
354
                            $propertiesString
355
                        );
356
                    }
357
                }
358
359
                // remove placeholder
360
                $element->removeAttribute(
361
                    'data-css-to-inline-styles-original-styles'
362
                );
363
            }
364
        }
365
366
        // strip original style tags if we need to
367
        if ($this->stripOriginalStyleTags) {
368
            $this->stripOriginalStyleTags($xPath);
369
        }
370
371
        // should we output XHTML?
372
        if ($outputXHTML) {
373
            // set formating
374
            $document->formatOutput = true;
375
376
            // get the HTML as XML
377
            $html = $document->saveXML(null, LIBXML_NOEMPTYTAG);
378
379
            // remove the XML-header
380
            $html = ltrim(preg_replace('/<?xml (.*)?>/', '', $html));
381
        } // just regular HTML 4.01 as it should be used in newsletters
382
        else {
383
            // get the HTML
384
            $html = $document->saveHTML();
385
        }
386
387
        // cleanup the HTML if we need to
388
        if ($this->cleanup) {
389
            $html = $this->cleanupHTML($html);
390
        }
391
392
        // return
393
        return $html;
394
    }
395
396
    /**
397
     * Split a style string into an array of properties.
398
     * The returned array can contain empty strings.
399
     *
400
     * @param string $styles ex: 'color:blue;font-size:12px;'
401
     * @return array an array of strings containing css property ex: array('color:blue','font-size:12px')
402
     */
403
    private function splitIntoProperties($styles) {
404
        $properties = (array) explode(';', $styles);
405
406
        for ($i = 0; $i < count($properties); $i++) {
407
            // If next property begins with base64,
408
            // Then the ';' was part of this property (and we should not have split on it).
409
            if (isset($properties[$i + 1]) && strpos($properties[$i + 1], 'base64,') === 0) {
410
                $properties[$i] .= ';' . $properties[$i + 1];
411
                $properties[$i + 1] = '';
412
                $i += 1;
413
            }
414
        }
415
        return $properties;
416
    }
417
418
    /**
419
     * Get the encoding to use
420
     *
421
     * @return string
422
     */
423
    private function getEncoding()
424
    {
425
        return $this->encoding;
426
    }
427
428
    /**
429
     * Process the loaded CSS
430
     *
431
     * @return void
432
     */
433
    private function processCSS()
434
    {
435
        // init vars
436
        $css = (string) $this->css;
437
438
        // remove newlines
439
        $css = str_replace(array("\r", "\n"), '', $css);
440
441
        // replace double quotes by single quotes
442
        $css = str_replace('"', '\'', $css);
443
444
        // remove comments
445
        $css = preg_replace('|/\*.*?\*/|', '', $css);
446
447
        // remove spaces
448
        $css = preg_replace('/\s\s+/', ' ', $css);
449
450
        if ($this->excludeMediaQueries) {
451
            $css = preg_replace('/@media [^{]*{([^{}]|{[^{}]*})*}/', '', $css);
452
        }
453
454
        // rules are splitted by }
455
        $rules = (array) explode('}', $css);
456
457
        // init var
458
        $i = 1;
459
460
        // loop rules
461
        foreach ($rules as $rule) {
462
            // split into chunks
463
            $chunks = explode('{', $rule);
464
465
            // invalid rule?
466
            if (!isset($chunks[1])) {
467
                continue;
468
            }
469
470
            // set the selectors
471
            $selectors = trim($chunks[0]);
472
473
            // get cssProperties
474
            $cssProperties = trim($chunks[1]);
475
476
            // split multiple selectors
477
            $selectors = (array) explode(',', $selectors);
478
479
            // loop selectors
480
            foreach ($selectors as $selector) {
481
                // cleanup
482
                $selector = trim($selector);
483
484
                // build an array for each selector
485
                $ruleSet = array();
486
487
                // store selector
488
                $ruleSet['selector'] = $selector;
489
490
                // process the properties
491
                $ruleSet['properties'] = $this->processCSSProperties(
492
                    $cssProperties
493
                );
494
495
                // calculate specificity
496
                $ruleSet['specificity'] = Specificity::fromSelector($selector);
497
498
                // remember the order in which the rules appear
499
                $ruleSet['order'] = $i;
500
501
                // add into global rules
502
                $this->cssRules[] = $ruleSet;
503
            }
504
505
            // increment
506
            $i++;
507
        }
508
509
        // sort based on specificity
510
        if (!empty($this->cssRules)) {
511
            usort($this->cssRules, array(__CLASS__, 'sortOnSpecificity'));
512
        }
513
    }
514
515
    /**
516
     * Process the CSS-properties
517
     *
518
     * @return array
519
     * @param  string $propertyString The CSS-properties.
520
     */
521
    private function processCSSProperties($propertyString)
522
    {
523
        // split into chunks
524
        $properties = $this->splitIntoProperties($propertyString);
525
526
        // init var
527
        $pairs = array();
528
529
        // loop properties
530
        foreach ($properties as $property) {
531
            // split into chunks
532
            $chunks = (array) explode(':', $property, 2);
533
534
            // validate
535
            if (!isset($chunks[1])) {
536
                continue;
537
            }
538
539
            // cleanup
540
            $chunks[0] = trim($chunks[0]);
541
            $chunks[1] = trim($chunks[1]);
542
543
            // add to pairs array
544
            if (!isset($pairs[$chunks[0]]) ||
545
                !in_array($chunks[1], $pairs[$chunks[0]])
546
            ) {
547
                $pairs[$chunks[0]][] = $chunks[1];
548
            }
549
        }
550
551
        // sort the pairs
552
        ksort($pairs);
553
554
        // return
555
        return $pairs;
556
    }
557
558
    /**
559
     * Should the IDs and classes be removed?
560
     *
561
     * @return void
562
     * @param  bool [optional] $on Should we enable cleanup?
563
     */
564
    public function setCleanup($on = true)
565
    {
566
        $this->cleanup = (bool) $on;
567
    }
568
569
    /**
570
     * Set CSS to use
571
     *
572
     * @return void
573
     * @param  string $css The CSS to use.
574
     */
575
    public function setCSS($css)
576
    {
577
        $this->css = (string) $css;
578
    }
579
580
    /**
581
     * Set the encoding to use with the DOMDocument
582
     *
583
     * @return void
584
     * @param  string $encoding The encoding to use.
585
     *
586
     * @deprecated Doesn't have any effect
587
     */
588
    public function setEncoding($encoding)
589
    {
590
        $this->encoding = (string) $encoding;
591
    }
592
593
    /**
594
     * Set HTML to process
595
     *
596
     * @return void
597
     * @param  string $html The HTML to process.
598
     */
599
    public function setHTML($html)
600
    {
601
        $this->html = (string) $html;
602
    }
603
604
    /**
605
     * Set use of inline styles block
606
     * If this is enabled the class will use the style-block in the HTML.
607
     *
608
     * @return void
609
     * @param  bool [optional] $on Should we process inline styles?
610
     */
611
    public function setUseInlineStylesBlock($on = true)
612
    {
613
        $this->useInlineStylesBlock = (bool) $on;
614
    }
615
616
    /**
617
     * Set strip original style tags
618
     * If this is enabled the class will remove all style tags in the HTML.
619
     *
620
     * @return void
621
     * @param  bool [optional] $on Should we process inline styles?
622
     */
623
    public function setStripOriginalStyleTags($on = true)
624
    {
625
        $this->stripOriginalStyleTags = (bool) $on;
626
    }
627
628
    /**
629
     * Set exclude media queries
630
     *
631
     * If this is enabled the media queries will be removed before inlining the rules
632
     *
633
     * @return void
634
     * @param bool [optional] $on
635
     */
636
    public function setExcludeMediaQueries($on = true)
637
    {
638
        $this->excludeMediaQueries = (bool) $on;
639
    }
640
641
    /**
642
     * Strip style tags into the generated HTML
643
     *
644
     * @return string
645
     * @param  \DOMXPath $xPath The DOMXPath for the entire document.
646
     */
647
    private function stripOriginalStyleTags(\DOMXPath $xPath)
648
    {
649
        // Get all style tags
650
        $nodes = $xPath->query('descendant-or-self::style');
651
652
        foreach ($nodes as $node) {
653
            if ($this->excludeMediaQueries) {
654
                //Search for Media Queries
655
                preg_match_all('/@media [^{]*{([^{}]|{[^{}]*})*}/', $node->nodeValue, $mqs);
656
657
                // Replace the nodeValue with just the Media Queries
658
                $node->nodeValue = implode("\n", $mqs[0]);
659
            } else {
660
                // Remove the entire style tag
661
                $node->parentNode->removeChild($node);
662
            }
663
        }
664
    }
665
666
    /**
667
     * Sort an array on the specificity element
668
     *
669
     * @return int
670
     * @param  array $e1 The first element.
671
     * @param  array $e2 The second element.
672
     */
673
    private static function sortOnSpecificity($e1, $e2)
674
    {
675
        // Compare the specificity
676
        $value = $e1['specificity']->compareTo($e2['specificity']);
677
678
        // if the specificity is the same, use the order in which the element appeared
679
        if ($value === 0) {
680
            $value = $e1['order'] - $e2['order'];
681
        }
682
683
        return $value;
684
    }
685
}
686