xref: /dokuwiki/lib/exe/css.php (revision 0e18d4f543d0ed24dda3ba77b417473cfad483e2)
1<?php
2
3/**
4 * DokuWiki StyleSheet creator
5 *
6 * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
7 * @author     Andreas Gohr <andi@splitbrain.org>
8 */
9
10use dokuwiki\StyleUtils;
11use dokuwiki\Cache\Cache;
12use dokuwiki\Extension\Event;
13
14if (!defined('DOKU_INC')) define('DOKU_INC', __DIR__ . '/../../');
15if (!defined('NOSESSION')) define('NOSESSION', true); // we do not use a session or authentication here (better caching)
16if (!defined('DOKU_DISABLE_GZIP_OUTPUT')) define('DOKU_DISABLE_GZIP_OUTPUT', 1); // we gzip ourself here
17if (!defined('NL')) define('NL', "\n");
18require_once(DOKU_INC . 'inc/init.php');
19
20// Main (don't run when UNIT test)
21if (!defined('SIMPLE_TEST')) {
22    header('Content-Type: text/css; charset=utf-8');
23    css_out();
24}
25
26
27// ---------------------- functions ------------------------------
28
29/**
30 * Output all needed Styles
31 *
32 * @author Andreas Gohr <andi@splitbrain.org>
33 */
34function css_out()
35{
36    global $conf;
37    global $lang;
38    global $config_cascade;
39    global $INPUT;
40
41    if ($INPUT->str('s') == 'feed') {
42        $mediatypes = ['feed'];
43        $type = 'feed';
44    } else {
45        $mediatypes = ['screen', 'all', 'print', 'speech'];
46        $type = '';
47    }
48
49    // decide from where to get the template
50    $tpl = trim(preg_replace('/[^\w-]+/', '', $INPUT->str('t')));
51    if (!$tpl) {
52        $tpl = $conf['template'];
53    }
54
55    // load style.ini
56    $styleUtil = new StyleUtils($tpl, $INPUT->bool('preview'));
57    $styleini = $styleUtil->cssStyleini();
58
59    // cache influencers
60    $tplinc = tpl_incdir($tpl);
61    $cache_files = getConfigFiles('main');
62    $cache_files[] = $tplinc . 'style.ini';
63    $cache_files[] = DOKU_CONF . "tpl/$tpl/style.ini";
64    $cache_files[] = __FILE__;
65    if ($INPUT->bool('preview')) {
66        $cache_files[] = $conf['cachedir'] . '/preview.ini';
67    }
68
69    // Array of needed files and their web locations, the latter ones
70    // are needed to fix relative paths in the stylesheets
71    $media_files = [];
72    foreach ($mediatypes as $mediatype) {
73        $files = [];
74
75        // load core styles
76        $files[DOKU_INC . 'lib/styles/' . $mediatype . '.css'] = DOKU_BASE . 'lib/styles/';
77
78        // load jQuery-UI theme
79        if ($mediatype == 'screen') {
80            $files[DOKU_INC . 'lib/scripts/jquery/jquery-ui-theme/smoothness.css'] =
81                DOKU_BASE . 'lib/scripts/jquery/jquery-ui-theme/';
82        }
83        // load plugin styles
84        $files = array_merge($files, css_pluginstyles($mediatype));
85        // load template styles
86        if (isset($styleini['stylesheets'][$mediatype])) {
87            $files = array_merge($files, $styleini['stylesheets'][$mediatype]);
88        }
89        // load user styles
90        if (isset($config_cascade['userstyle'][$mediatype]) && is_array($config_cascade['userstyle'][$mediatype])) {
91            foreach ($config_cascade['userstyle'][$mediatype] as $userstyle) {
92                $files[$userstyle] = DOKU_BASE;
93            }
94        }
95
96        // Let plugins decide to either put more styles here or to remove some
97        $media_files[$mediatype] = css_filewrapper($mediatype, $files);
98        $CSSEvt = new Event('CSS_STYLES_INCLUDED', $media_files[$mediatype]);
99
100        // Make it preventable.
101        if ($CSSEvt->advise_before()) {
102            $cache_files = array_merge($cache_files, array_keys($media_files[$mediatype]['files']));
103        } else {
104            // unset if prevented. Nothing will be printed for this mediatype.
105            unset($media_files[$mediatype]);
106        }
107
108        // finish event.
109        $CSSEvt->advise_after();
110    }
111
112    // The generated script depends on some dynamic options
113    $cache = new Cache(
114        'styles' .
115        $_SERVER['HTTP_HOST'] .
116        $_SERVER['SERVER_PORT'] .
117        $INPUT->bool('preview') .
118        DOKU_BASE .
119        $tpl .
120        $type,
121        '.css'
122    );
123    $cache->setEvent('CSS_CACHE_USE');
124
125    // check cache age & handle conditional request
126    // This may exit if a cache can be used
127    $cache_ok = $cache->useCache(['files' => $cache_files]);
128    http_cached($cache->cache, $cache_ok);
129
130    // start output buffering
131    ob_start();
132
133    // Fire CSS_STYLES_INCLUDED for one last time to let the
134    // plugins decide whether to include the DW default styles.
135    // This can be done by preventing the Default.
136    $media_files['DW_DEFAULT'] = css_filewrapper('DW_DEFAULT');
137    Event::createAndTrigger('CSS_STYLES_INCLUDED', $media_files['DW_DEFAULT'], 'css_defaultstyles');
138
139    // build the stylesheet
140    foreach ($mediatypes as $mediatype) {
141        // Check if there is a wrapper set for this type.
142        if (!isset($media_files[$mediatype])) {
143            continue;
144        }
145
146        $cssData = $media_files[$mediatype];
147
148        // Print the styles.
149        echo NL;
150        if ($cssData['encapsulate'] === true) {
151            echo $cssData['encapsulationPrefix'] . ' {';
152        }
153        echo '/* START ' . $cssData['mediatype'] . ' styles */' . NL;
154
155        // load files
156        foreach ($cssData['files'] as $file => $location) {
157            $display = str_replace(fullpath(DOKU_INC), '', fullpath($file));
158            echo "\n/* XXXXXXXXX $display XXXXXXXXX */\n";
159            echo css_loadfile($file, $location);
160        }
161
162        echo NL;
163        if ($cssData['encapsulate'] === true) {
164            echo '} /* /@media ';
165        } else {
166            echo '/*';
167        }
168        echo ' END ' . $cssData['mediatype'] . ' styles */' . NL;
169    }
170
171    // end output buffering and get contents
172    $css = ob_get_contents();
173    ob_end_clean();
174
175    // strip any source maps
176    stripsourcemaps($css);
177
178    // apply style replacements
179    $css = css_applystyle($css, $styleini['replacements']);
180
181    // parse less
182    $css = css_parseless($css);
183
184    // compress whitespace and comments
185    if ($conf['compress']) {
186        $css = css_compress($css);
187    }
188
189    // embed small images right into the stylesheet
190    if ($conf['cssdatauri']) {
191        $base = preg_quote(DOKU_BASE, '#');
192        $css = preg_replace_callback('#(url\([ \'"]*)(' . $base . ')(.*?(?:\.(png|gif)))#i', 'css_datauri', $css);
193    }
194
195    http_cached_finish($cache->cache, $css);
196}
197
198/**
199 * Uses phpless to parse LESS in our CSS
200 *
201 * most of this function is error handling to show a nice useful error when
202 * LESS compilation fails
203 *
204 * @param string $css
205 * @return string
206 */
207function css_parseless($css)
208{
209    global $conf;
210
211    $less = new lessc();
212    $less->importDir = [DOKU_INC];
213    $less->setPreserveComments(!$conf['compress']);
214
215    if (defined('DOKU_UNITTEST')) {
216        $less->importDir[] = TMP_DIR;
217    }
218
219    try {
220        return $less->compile($css);
221    } catch (Exception $e) {
222        // get exception message
223        $msg = str_replace(["\n", "\r", "'"], [], $e->getMessage());
224
225        // try to use line number to find affected file
226        if (preg_match('/line: (\d+)$/', $msg, $m)) {
227            $msg = substr($msg, 0, -1 * strlen($m[0])); //remove useless linenumber
228            $lno = $m[1];
229
230            // walk upwards to last include
231            $lines = explode("\n", $css);
232            for ($i = $lno - 1; $i >= 0; $i--) {
233                if (preg_match('/\/(\* XXXXXXXXX )(.*?)( XXXXXXXXX \*)\//', $lines[$i], $m)) {
234                    // we found it, add info to message
235                    $msg .= ' in ' . $m[2] . ' at line ' . ($lno - $i);
236                    break;
237                }
238            }
239        }
240
241        // something went wrong
242        $error = 'A fatal error occured during compilation of the CSS files. ' .
243            'If you recently installed a new plugin or template it ' .
244            'might be broken and you should try disabling it again. [' . $msg . ']';
245
246        echo ".dokuwiki:before {
247            content: '$error';
248            background-color: red;
249            display: block;
250            background-color: #fcc;
251            border-color: #ebb;
252            color: #000;
253            padding: 0.5em;
254        }";
255
256        exit;
257    }
258}
259
260/**
261 * Does placeholder replacements in the style according to
262 * the ones defined in a templates style.ini file
263 *
264 * This also adds the ini defined placeholders as less variables
265 * (sans the surrounding __ and with a ini_ prefix)
266 *
267 * @param string $css
268 * @param array $replacements array(placeholder => value)
269 * @return string
270 *
271 * @author Andreas Gohr <andi@splitbrain.org>
272 */
273function css_applystyle($css, $replacements)
274{
275    // we convert ini replacements to LESS variable names
276    // and build a list of variable: value; pairs
277    $less = '';
278    foreach ((array)$replacements as $key => $value) {
279        $lkey = trim($key, '_');
280        $lkey = '@ini_' . $lkey;
281        $less .= "$lkey: $value;\n";
282
283        $replacements[$key] = $lkey;
284    }
285
286    // we now replace all old ini replacements with LESS variables
287    $css = strtr($css, $replacements);
288
289    // now prepend the list of LESS variables as the very first thing
290    $css = $less . $css;
291    return $css;
292}
293
294/**
295 * Wrapper for the files, content and mediatype for the event CSS_STYLES_INCLUDED
296 *
297 * @param string $mediatype type ofthe current media files/content set
298 * @param array $files set of files that define the current mediatype
299 * @return array
300 *
301 * @author Gerry Weißbach <gerry.w@gammaproduction.de>
302 */
303function css_filewrapper($mediatype, $files = [])
304{
305    return [
306        'files' => $files,
307        'mediatype' => $mediatype,
308        'encapsulate' => $mediatype != 'all',
309        'encapsulationPrefix' => '@media ' . $mediatype
310    ];
311}
312
313/**
314 * Prints the @media encapsulated default styles of DokuWiki
315 *
316 * This function is being called by a CSS_STYLES_INCLUDED event
317 * The event can be distinguished by the mediatype which is:
318 *   DW_DEFAULT
319 *
320 * @author Gerry Weißbach <gerry.w@gammaproduction.de>
321 */
322function css_defaultstyles()
323{
324    // print the default classes for interwiki links and file downloads
325    echo '@media screen {';
326    css_interwiki();
327    css_filetypes();
328    echo '}';
329}
330
331/**
332 * Prints classes for interwikilinks
333 *
334 * Interwiki links have two classes: 'interwiki' and 'iw_$name>' where
335 * $name is the identifier given in the config. All Interwiki links get
336 * an default style with a default icon. If a special icon is available
337 * for an interwiki URL it is set in it's own class. Both classes can be
338 * overwritten in the template or userstyles.
339 *
340 * @author Andreas Gohr <andi@splitbrain.org>
341 */
342function css_interwiki()
343{
344
345    // default style
346    echo 'a.interwiki {';
347    echo ' background: transparent url(' . DOKU_BASE . 'lib/images/interwiki.svg) 0 0 no-repeat;';
348    echo ' background-size: 1.2em;';
349    echo ' padding: 0 0 0 1.4em;';
350    echo '}';
351
352    // additional styles when icon available
353    $iwlinks = getInterwiki();
354    foreach (array_keys($iwlinks) as $iw) {
355        $class = preg_replace('/[^_\-a-z0-9]+/i', '_', $iw);
356        foreach (['svg', 'png', 'gif'] as $ext) {
357            $file = 'lib/images/interwiki/' . $iw . '.' . $ext;
358
359            if (file_exists(DOKU_INC . $file)) {
360                echo "a.iw_$class {";
361                echo '  background-image: url(' . DOKU_BASE . $file . ')';
362                echo '}';
363                break;
364            }
365        }
366    }
367}
368
369/**
370 * Prints classes for file download links
371 *
372 * @author Andreas Gohr <andi@splitbrain.org>
373 */
374function css_filetypes()
375{
376
377    // default style
378    echo '.mediafile {';
379    echo ' background: transparent url(' . DOKU_BASE . 'lib/images/fileicons/svg/file.svg) 0px 1px no-repeat;';
380    echo ' background-size: 1.2em;';
381    echo ' padding-left: 1.5em;';
382    echo '}';
383
384    // additional styles when icon available
385    // scan directory for all icons
386    $exts = [];
387    if ($dh = opendir(DOKU_INC . 'lib/images/fileicons/svg')) {
388        while (false !== ($file = readdir($dh))) {
389            if (preg_match('/(.*?)\.svg$/i', $file, $match)) {
390                $exts[] = strtolower($match[1]);
391            }
392        }
393        closedir($dh);
394    }
395    foreach ($exts as $ext) {
396        $class = preg_replace('/[^_\-a-z0-9]+/', '_', $ext);
397        echo ".mf_$class {";
398        echo '  background-image: url(' . DOKU_BASE . 'lib/images/fileicons/svg/' . $ext . '.svg)';
399        echo '}';
400    }
401}
402
403/**
404 * Loads a given file and fixes relative URLs with the
405 * given location prefix
406 *
407 * @param string $file file system path
408 * @param string $location
409 * @return string
410 */
411function css_loadfile($file, $location = '')
412{
413    $css_file = new DokuCssFile($file);
414    return $css_file->load($location);
415}
416
417/**
418 * Helper class to abstract loading of css/less files
419 *
420 * @author Chris Smith <chris@jalakai.co.uk>
421 */
422class DokuCssFile
423{
424    protected $filepath;             // file system path to the CSS/Less file
425    protected $location;             // base url location of the CSS/Less file
426    protected $relative_path;
427
428    public function __construct($file)
429    {
430        $this->filepath = $file;
431    }
432
433    /**
434     * Load the contents of the css/less file and adjust any relative paths/urls (relative to this file) to be
435     * relative to the dokuwiki root: the web root (DOKU_BASE) for most files; the file system root (DOKU_INC)
436     * for less files.
437     *
438     * @param string $location base url for this file
439     * @return string the CSS/Less contents of the file
440     */
441    public function load($location = '')
442    {
443        if (!file_exists($this->filepath)) return '';
444
445        $css = io_readFile($this->filepath);
446        if (!$location) return $css;
447
448        $this->location = $location;
449
450        $css = preg_replace_callback('#(url\( *)([\'"]?)(.*?)(\2)( *\))#', [$this, 'replacements'], $css);
451        $css = preg_replace_callback('#(@import\s+)([\'"])(.*?)(\2)#', [$this, 'replacements'], $css);
452
453        return $css;
454    }
455
456    /**
457     * Get the relative file system path of this file, relative to dokuwiki's root folder, DOKU_INC
458     *
459     * @return string   relative file system path
460     */
461    protected function getRelativePath()
462    {
463
464        if (is_null($this->relative_path)) {
465            $basedir = [DOKU_INC];
466
467            // during testing, files may be found relative to a second base dir, TMP_DIR
468            if (defined('DOKU_UNITTEST')) {
469                $basedir[] = realpath(TMP_DIR);
470            }
471
472            $basedir = array_map('preg_quote_cb', $basedir);
473            $regex = '/^(' . implode('|', $basedir) . ')/';
474            $this->relative_path = preg_replace($regex, '', dirname($this->filepath));
475        }
476
477        return $this->relative_path;
478    }
479
480    /**
481     * preg_replace callback to adjust relative urls from relative to this file to relative
482     * to the appropriate dokuwiki root location as described in the code
483     *
484     * @param array $match see http://php.net/preg_replace_callback
485     * @return string   see http://php.net/preg_replace_callback
486     */
487    public function replacements($match)
488    {
489
490        if (preg_match('#^(/|data:|https?://)#', $match[3])) { // not a relative url? - no adjustment required
491            return $match[0];
492        } elseif (str_ends_with($match[3], '.less')) { // a less file import? - requires a file system location
493            if ($match[3][0] != '/') {
494                $match[3] = $this->getRelativePath() . '/' . $match[3];
495            }
496        } else { // everything else requires a url adjustment
497            $match[3] = $this->location . $match[3];
498        }
499
500        return implode('', array_slice($match, 1));
501    }
502}
503
504/**
505 * Convert local image URLs to data URLs if the filesize is small
506 *
507 * Callback for preg_replace_callback
508 *
509 * @param array $match
510 * @return string
511 */
512function css_datauri($match)
513{
514    global $conf;
515
516    $pre = unslash($match[1]);
517    $base = unslash($match[2]);
518    $url = unslash($match[3]);
519    $ext = unslash($match[4]);
520
521    $local = DOKU_INC . $url;
522    $size = @filesize($local);
523    if ($size && $size < $conf['cssdatauri']) {
524        $data = base64_encode(file_get_contents($local));
525    }
526    if (!empty($data)) {
527        $url = 'data:image/' . $ext . ';base64,' . $data;
528    } else {
529        $url = $base . $url;
530    }
531    return $pre . $url;
532}
533
534
535/**
536 * Returns a list of possible Plugin Styles (no existance check here)
537 *
538 * @param string $mediatype
539 * @return array
540 * @author Andreas Gohr <andi@splitbrain.org>
541 *
542 */
543function css_pluginstyles($mediatype = 'screen')
544{
545    $list = [];
546    $plugins = plugin_list();
547    foreach ($plugins as $p) {
548        $list[DOKU_PLUGIN . "$p/$mediatype.css"] = DOKU_BASE . "lib/plugins/$p/";
549        $list[DOKU_PLUGIN . "$p/$mediatype.less"] = DOKU_BASE . "lib/plugins/$p/";
550        // alternative for screen.css
551        if ($mediatype == 'screen') {
552            $list[DOKU_PLUGIN . "$p/style.css"] = DOKU_BASE . "lib/plugins/$p/";
553            $list[DOKU_PLUGIN . "$p/style.less"] = DOKU_BASE . "lib/plugins/$p/";
554        }
555    }
556    return $list;
557}
558
559/**
560 * Very simple CSS optimizer
561 *
562 * @param string $css
563 * @return string
564 * @author Andreas Gohr <andi@splitbrain.org>
565 *
566 */
567function css_compress($css)
568{
569    // replace quoted strings with placeholder
570    $quote_storage = [];
571
572    $quote_cb = function ($match) use (&$quote_storage) {
573        $quote_storage[] = $match[0];
574        return '"STR' . (count($quote_storage) - 1) . '"';
575    };
576
577    $css = preg_replace_callback('/(([\'"]).*?(?<!\\\\)\2)/', $quote_cb, $css);
578
579    // strip comments through a callback
580    $css = preg_replace_callback('#(/\*)(.*?)(\*/)#s', 'css_comment_cb', $css);
581
582    // strip (incorrect but common) one line comments
583    $css = preg_replace_callback('/^.*\/\/.*$/m', 'css_onelinecomment_cb', $css);
584
585    // strip whitespaces
586    $css = preg_replace('![\r\n\t ]+!', ' ', $css);
587    $css = preg_replace('/ ?([;,{}\/]) ?/', '\\1', $css);
588    $css = preg_replace('/ ?: /', ':', $css);
589
590    // number compression
591    $css = preg_replace(
592        '/([: ])0+(\.\d+?)0*((?:pt|pc|in|mm|cm|em|ex|px)\b|%)(?=[^\{]*[;\}])/',
593        '$1$2$3',
594        $css
595    ); // "0.1em" to ".1em", "1.10em" to "1.1em"
596    $css = preg_replace(
597        '/([: ])\.(0)+((?:pt|pc|in|mm|cm|em|ex|px)\b|%)(?=[^\{]*[;\}])/',
598        '$1$2',
599        $css
600    ); // ".0em" to "0"
601    $css = preg_replace(
602        '/([: ]0)0*(\.0*)?((?:pt|pc|in|mm|cm|em|ex|px)(?=[^\{]*[;\}])\b|%)/',
603        '$1',
604        $css
605    ); // "0.0em" to "0"
606    $css = preg_replace(
607        '/([: ]\d+)(\.0*)((?:pt|pc|in|mm|cm|em|ex|px)(?=[^\{]*[;\}])\b|%)/',
608        '$1$3',
609        $css
610    ); // "1.0em" to "1em"
611    $css = preg_replace(
612        '/([: ])0+(\d+|\d*\.\d+)((?:pt|pc|in|mm|cm|em|ex|px)(?=[^\{]*[;\}])\b|%)/',
613        '$1$2$3',
614        $css
615    ); // "001em" to "1em"
616
617    // shorten attributes (1em 1em 1em 1em -> 1em)
618    $css = preg_replace(
619        '/(?<![\w\-])((?:margin|padding|border|border-(?:width|radius)):)([\w\.]+)( \2)+(?=[;\}]| !)/',
620        '$1$2',
621        $css
622    ); // "1em 1em 1em 1em" to "1em"
623    $css = preg_replace(
624        '/(?<![\w\-])((?:margin|padding|border|border-(?:width)):)([\w\.]+) ([\w\.]+) \2 \3(?=[;\}]| !)/',
625        '$1$2 $3',
626        $css
627    ); // "1em 2em 1em 2em" to "1em 2em"
628
629    // shorten colors
630    $css = preg_replace(
631        "/#([0-9a-fA-F]{1})\\1([0-9a-fA-F]{1})\\2([0-9a-fA-F]{1})\\3(?=[^\{]*[;\}])/",
632        "#\\1\\2\\3",
633        $css
634    );
635
636    // replace back protected strings
637    $quote_back_cb = function ($match) use (&$quote_storage) {
638        return $quote_storage[$match[1]];
639    };
640
641    $css = preg_replace_callback('/"STR(\d+)"/', $quote_back_cb, $css);
642    $css = trim($css);
643
644    return $css;
645}
646
647/**
648 * Callback for css_compress()
649 *
650 * Keeps short comments (< 5 chars) to maintain typical browser hacks
651 *
652 * @param array $matches
653 * @return string
654 *
655 * @author Andreas Gohr <andi@splitbrain.org>
656 *
657 */
658function css_comment_cb($matches)
659{
660    if (strlen($matches[2]) > 4) return '';
661    return $matches[0];
662}
663
664/**
665 * Callback for css_compress()
666 *
667 * Strips one line comments but makes sure it will not destroy url() constructs with slashes
668 *
669 * @param array $matches
670 * @return string
671 */
672function css_onelinecomment_cb($matches)
673{
674    $line = $matches[0];
675
676    $i = 0;
677    $len = strlen($line);
678
679    while ($i < $len) {
680        $nextcom = strpos($line, '//', $i);
681        $nexturl = stripos($line, 'url(', $i);
682
683        if ($nextcom === false) {
684            // no more comments, we're done
685            $i = $len;
686            break;
687        }
688
689        if ($nexturl === false || $nextcom < $nexturl) {
690            // no url anymore, strip comment and be done
691            $i = $nextcom;
692            break;
693        }
694
695        // we have an upcoming url
696        $i = strpos($line, ')', $nexturl);
697    }
698
699    return substr($line, 0, $i);
700}
701
702//Setup VIM: ex: et ts=4 :
703