Fixed assets rendering

6 years ago · 4bf3a68f43
parent 222c9fed7d
commit 4bf3a68f43
4 changed files with 98 additions and 20 deletions
--- a/src/Renderer/Twig/Extensions/Assets.php
+++ b/src/Renderer/Twig/Extensions/Assets.php
@ -0,0 +1,42 @@
+<?php
+
+namespace Engelsystem\Renderer\Twig\Extensions;
+
+use Engelsystem\Http\UrlGenerator;
+use Twig_Extension as TwigExtension;
+use Twig_Function as TwigFunction;
+
+class Assets extends TwigExtension
+{
+    /** @var UrlGenerator */
+    protected $urlGenerator;
+
+    /**
+     * @param UrlGenerator $urlGenerator
+     */
+    public function __construct(UrlGenerator $urlGenerator)
+    {
+        $this->urlGenerator = $urlGenerator;
+    }
+
+    /**
+     * @return TwigFunction[]
+     */
+    public function getFunctions()
+    {
+        return [
+            new TwigFunction('asset', [$this, 'getAsset']),
+        ];
+    }
+
+    /**
+     * @param string $path
+     * @return UrlGenerator|string
+     */
+    public function getAsset($path)
+    {
+        $path = ltrim($path, '/');
+
+        return $this->urlGenerator->to('/' . $path);
+    }
+}
--- a/src/Renderer/TwigServiceProvider.php
+++ b/src/Renderer/TwigServiceProvider.php
@ -3,6 +3,7 @@
 namespace Engelsystem\Renderer;

 use Engelsystem\Container\ServiceProvider;
+use Engelsystem\Renderer\Twig\Extensions\Assets;
 use Engelsystem\Renderer\Twig\Extensions\Config;
 use Engelsystem\Renderer\Twig\Extensions\Globals;
 use Engelsystem\Renderer\Twig\Extensions\Session;
@ -15,6 +16,7 @@ class TwigServiceProvider extends ServiceProvider
 {
    /** @var array */
    protected $extensions = [
+        'assets'      => Assets::class,
        'config'      => Config::class,
        'globals'     => Globals::class,
        'session'     => Session::class,
--- a/templates/layouts/app.twig
+++ b/templates/layouts/app.twig
@ -1,19 +1,20 @@
 {% set theme = user.color|default(config('theme')) %}
 <!DOCTYPE html>
-<html>
+<html lang="{{ session_get('locale')|split('_')[0]|escape('html_attr') }}">
 <head>
    {% block head %}
        <title>{% block title %}{{ title }}{% endblock %} - Engelsystem</title>
+
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <link rel="stylesheet" type="text/css" href="css/theme{{ theme }}.css"/>
-        <link rel="stylesheet" type="text/css" href="vendor/icomoon/style.css"/>
-        <link rel="stylesheet" type="text/css" href="vendor/bootstrap-datepicker-1.7.1/css/bootstrap-datepicker3.min.css"/>
-        <script type="text/javascript" src="vendor/jquery-2.1.1.min.js"></script>
-        <script type="text/javascript" src="vendor/jquery-ui.min.js"></script>
+
+        <link rel="stylesheet" type="text/css" href="{{ asset('assets/theme' ~ theme ~ '.css') }}"/>
+        <script type="text/javascript" src="{{ asset('assets/vendor.js') }}"></script>
+
        {% if atom_feed -%}
            <link href="{{ url('atom', atom_feed) }}" type="application/atom+xml" rel="alternate" title="Atom Feed">
        {% endif %}
+
    {% endblock %}
 </head>
 <body>
@ -67,20 +68,6 @@
            {% endblock %}
        </div>
    </div>
-
-    <script type="text/javascript" src="vendor/bootstrap/js/bootstrap.min.js"></script>
-    <script type="text/javascript" src="vendor/bootstrap-datepicker-1.7.1/js/bootstrap-datepicker.min.js"></script>
-    <script type="text/javascript" src="vendor/bootstrap-datepicker-1.7.1/locales/bootstrap-datepicker.de.min.js"></script>
-    <script type="text/javascript" src="vendor/Chart.min.js"></script>
-    <script type="text/javascript" src="js/forms.js"></script>
-    <script type="text/javascript" src="vendor/moment-with-locales.min.js"></script>
-    <script type="text/javascript">
-        $(function () {
-            moment.locale("{{ session_get('locale')|escape('js') }}");
-        });
-    </script>
-    <script type="text/javascript" src="js/moment-countdown.js"></script>
-    <script type="text/javascript" src="js/sticky-headers.js"></script>
 {% endblock %}

 </body>
--- a/tests/Unit/Renderer/Twig/Extensions/AssetsTest.php
+++ b/tests/Unit/Renderer/Twig/Extensions/AssetsTest.php
@ -0,0 +1,47 @@
+<?php
+
+namespace Engelsystem\Test\Unit\Renderer\Twig\Extensions;
+
+use Engelsystem\Http\UrlGenerator;
+use Engelsystem\Renderer\Twig\Extensions\Assets;
+use PHPUnit\Framework\MockObject\MockObject;
+
+class AssetsTest extends ExtensionTest
+{
+    /**
+     * @covers \Engelsystem\Renderer\Twig\Extensions\Assets::__construct
+     * @covers \Engelsystem\Renderer\Twig\Extensions\Assets::getFunctions
+     */
+    public function testGetGlobals()
+    {
+        /** @var UrlGenerator|MockObject $urlGenerator */
+        $urlGenerator = $this->createMock(UrlGenerator::class);
+
+        $extension = new Assets($urlGenerator);
+        $functions = $extension->getFunctions();
+
+        $this->assertExtensionExists('asset', [$extension, 'getAsset'], $functions);
+    }
+
+    /**
+     * @covers \Engelsystem\Renderer\Twig\Extensions\Assets::getAsset
+     */
+    public function testGetAsset()
+    {
+        /** @var UrlGenerator|MockObject $urlGenerator */
+        $urlGenerator = $this->createMock(UrlGenerator::class);
+
+        $urlGenerator->expects($this->exactly(2))
+            ->method('to')
+            ->with('/assets/foo.css')
+            ->willReturn('https://foo.bar/project/assets/foo.css');
+
+        $extension = new Assets($urlGenerator);
+
+        $return = $extension->getAsset('assets/foo.css');
+        $this->assertEquals('https://foo.bar/project/assets/foo.css', $return);
+
+        $return = $extension->getAsset('/assets/foo.css');
+        $this->assertEquals('https://foo.bar/project/assets/foo.css', $return);
+    }
+}