Better white space control in Twig template

[ghost]

Hello, I'm sorry, but I forgot something (not really) important in PR #16 : White space control in Twig template. This commit avoids sending too much white space to the browser. This removes 184 bytes per <img> if the page isn't GZipped. On a test page (With GZip enabled) containing 12 images in the galley, this removes 51 bytes of transfer. 😆 You can merge this commit or not, as you wish. This isn't really for using less network, but I just think it's cleaner this way. 😉 Have a nice day ! ^^

[sal0max]

Hi again,

thanks for this PR! I wasn't even aware of white space control in Twig. I agree, that it's probably not worth the effort in regards of network traffic. But it is well worth the effort to make the generated HTML cleaner.

However, I won't accept your PR, as I played with white space control this evening and formatted it slightly different. Hope that's okay. :)

[sal0max]

Now looking like in this example:

<p id="939876899">
    <a href="/user/pages/demo/02.gallery-plusplus/photo-1487260211189-670c54da558d.jpg" class="glightbox-939876899" data-description="Title 3">
        <img title="Title 3" alt="Alt 3" src="/images/5/f/7/2/d/5f72d37e8515e18030c236c20d07bc576e6a958a-photo-1487260211189-670c54da558d.jpg" />
    </a>
    <a href="/user/pages/demo/02.gallery-plusplus/photo-1500239038240-9b3b8bac73c3.jpg" class="glightbox-939876899" data-description="Title 4">
        <img title="Title 4" alt="Alt 4" src="/images/a/8/c/6/3/a8c63aa6619eb346cb1e49b12d9da83b3a1ffc8e-photo-1500239038240-9b3b8bac73c3.jpg" />
    </a>
    <a href="/user/pages/demo/02.gallery-plusplus/photo-1494200483035-db7bc6aa5739.jpg" class="glightbox-939876899" data-description="Title 5">
        <img title="Title 5" alt="Alt 5" src="/images/7/3/e/e/b/73eebdb03a9bc880ad9c70823354d148f102fe4c-photo-1494200483035-db7bc6aa5739.jpg" />
    </a>
    <a href="/user/pages/demo/02.gallery-plusplus/photo-1495476479092-6ece1898a101.jpg" class="glightbox-939876899" data-description="">
        <img alt="Alt 9" src="/images/0/7/9/b/5/079b5c21e43acb10a28b6646a7cc07f25ac4334a-photo-1495476479092-6ece1898a101.jpg" />
    </a>
    <a href="/user/pages/demo/02.gallery-plusplus/photo-1448318440207-ef1893eb8ac0.jpg" class="glightbox-939876899" data-description="Title 10">
        <img title="Title 10" alt="" src="/images/9/0/c/5/3/90c53a05ee8f02042e48e24d3ae8a9d219b2f2f2-photo-1448318440207-ef1893eb8ac0.jpg" />
    </a>
</p>

<script>
$("#939876899").justifiedGallery({
    rowHeight: 230,
    margins: 25,
    lastRow: "justify",
    captions: true,
    border: 0,
});

GLightbox({
    selector: ".glightbox-939876899",
    openEffect: "zoom",
    closeEffect: "zoom",
    slideEffect: "slide",
    closeButton: true,
    touchNavigation: true,
    touchFollowAxis: true,
    keyboardNavigation: true,
    closeOnOutsideClick: true,
    loop: false,
    draggable: true,
    descPosition: "bottom",
});</script>

[ghost]

Hello ! ^^ You did a better job than what I did ! :D And don't worry about my PR, it's your repository. ;) Thank you for improving this, and have a nice day ! ^^