URL to Public Assets

Hey Paul,

Yeah, that's a problem... Well, you may fetch env vars from $_ENV or with getenv() from the entities - that's not a good practice I think, but it may work this way. Also, you may want to use PHP traits or inheritance to avoid code duplications.

As an alternative way, you can return only the unique (not full) path from the entities, and in the places where you use that path - prefix it with the dynamic env var value. Or you can extract that into a service that will merge the dynamic env var with the unique entity path and creates the full path - you can path the whole entity object into it if needed.

I hope that helps.

Cheers!

Hey Loqman

That's because we are passing our image path to the custom Twig function we've just created uploaded_asset(). In the next chapter you'll learn more about how it works internally

Cheers!

Thanks for your reply, literally the entire next video is the answer to my question :D

NP! Happy to help :)

Hey sridharpandu

Yes, that's possible, you could leverage the Filesystem Symfony component to do that task. It's a nice abstraction for working the filesystem
https://symfony.com/doc/cur...

Cheers!

Hey YinYang,

Use the asset() Twig function - it will automatically add that hash at the end of file name for you.

Cheers!

Hey Kiuega!

Yes, very fair question! I would say it's 2 major things:

1) Yes, I do like showing HOW things work... though that is not by itself a good enough reason to not use a library in a tutorial.

2) VichUploaderBundle - which I used to *love* - just feels a bit *too* magic to me. It is probably something that would work really well for most people, but I find that when you need to start doing more custom stuff, it's really unclear how to do extend. I prefer having more control.

That being said, in a perfect world, we'd probably have something "in between". And if you do need to do some uploading, giving VichUploaderBundle an hour to test out is a good idea in case it works really nicely for you.

Cheers!

Hey Raed

Losks like your $value is null somehow, check your template, how do you use this filter, and which value you pass to it

Cheers!

Hey ``sadikoff ,

Thanks for your reply !
Losks like your $value is null somehow, mmm, i don't think so because when i click to show an article with no photo
it gets rendered,

Here is show.html.twig code:

{% extends 'content_base.html.twig' %}

{% block title %}Read: {{ article.title }}{% endblock %}

{% block content_body %}
    <div class="row">
        <div class="col-sm-12">
            <img class="show-article-img" src="{{ uploaded_asset(article.imagePath) }}">
            <div class="show-article-title-container d-inline-block pl-3 align-middle">
                <span class="show-article-title ">{{ article.title }}</span>
                <br>
                <span class="align-left article-details"><img class="article-author-img rounded-circle" src="{{ asset('images/alien-profile.png') }}"> {{ article.author }} </span>
                <span class="pl-2 article-details">
                    {{ article.publishedAt ? article.publishedAt|ago : 'unpublished' }}
                </span>
                <span class="pl-2 article-details">
                    <span class="js-like-article-count">{{ article.heartCount }}</span>
                    <a href="{{ path('article_toggle_heart', {slug: article.slug}) }}" class="fa fa-heart-o like-article js-like-article"></a>
                </span>
                <span class="pl-2 article-details">
                    {% for tag in article.tags %}
                        <span class="badge badge-secondary">{{ tag.name }}</span>
                    {% endfor %}
                </span>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <div class="article-text">
                {{ article.content|cached_markdown }}
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <p class="share-icons mb-5"><span class="pr-1">Share:</span> <i class="pr-1 fa fa-facebook-square"></i><i class="pr-1 fa fa-twitter-square"></i><i class="pr-1 fa fa-reddit-square"></i><i class="pr-1 fa fa-share-alt-square"></i></p>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <h3><i class="pr-3 fa fa-comment"></i>{{ article.nonDeletedComments|length }} Comments</h3>
            <hr>

            <div class="row mb-5">
                <div class="col-sm-12">
                    <img class="comment-img rounded-circle" src="{{ asset('images/astronaut-profile.png') }}">
                    <div class="comment-container d-inline-block pl-3 align-top">
                        <span class="commenter-name">Amy Oort</span>
                        <div class="form-group">
                            <textarea class="form-control comment-form" id="articleText" rows="1"></textarea>
                        </div>
                        <button type="submit" class="btn btn-info">Comment</button>
                    </div>
                </div>
            </div>

            {% for comment in article.nonDeletedComments %}
            <div class="row">
                <div class="col-sm-12">
                    <img class="comment-img rounded-circle" src="{{ asset('images/alien-profile.png') }}">
                    <div class="comment-container d-inline-block pl-3 align-top">
                        <span class="commenter-name">{{ comment.authorName }}</span>
                        <small>about {{ comment.createdAt|ago }}</small>
                        {% if comment.isDeleted %}
                            <span class="fa fa-close"></span> deleted
                        {% endif %}
                        <br>
                        <span class="comment"> {{ comment.content }}</span>
                        <p><a href="#">Reply</a></p>
                    </div>
                </div>
            </div>
            {% endfor %}

        </div>
    </div>

{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script src="{{ asset('js/article_show.js') }}"></script>
{% endblock %} 

and MarkdownHelper.php class

<?php

namespace App\Service;

use Michelf\MarkdownInterface;
use Psr\Log\LoggerInterface;
use Symfony\Component\Cache\Adapter\AdapterInterface;
use Symfony\Component\Security\Core\Security;
 
class MarkdownHelper
{
    private $cache;
    private $markdown;
    private $logger;
    private $isDebug;

    private $security;

    public function __construct(AdapterInterface $cache, MarkdownInterface $markdown, LoggerInterface $markdownLogger, bool $isDebug, Security $security)
    {
        $this->cache = $cache;
        $this->markdown = $markdown;
        $this->logger = $markdownLogger;
        $this->isDebug = $isDebug;
        $this->security = $security;
    }

    public function parse(string $source): string
    {
        if (stripos($source, 'bacon') !== false) {
            $this->logger->info('They are talking about bacon again!', [
                'user' => $this->security->getUser()
            ]);
        }

        // skip caching entirely in debug
        if ($this->isDebug) {
            return $this->markdown->transform($source);
        }

        $item = $this->cache->getItem('markdown_'.md5($source));
        if (!$item->isHit()) {
            $item->set($this->markdown->transform($source));
            $this->cache->save($item);
        }

        return $item->get();
    }
}

Hey hey

You know...mmm.. my answer will not change, the only reason I see is null value inside article.content variable, so you can check it in Twig by using {{ dump() }} or inside AppExtension using dd() or dump

Cheers!

Hey sadikoff ,

I appreciate your help ! By just re-loading the fixtures again , it works !

Hey Raed.

That getFunctions() comes from the class you extends. So, it's required to have exactly that name so that Twig could register functions in your project. Otherwise, it won't be able to register the functions you listed there, e.g. uploaded_asset in your case. In other words, that method name should not be changed. But you can rename that "uploaded_asset" function name or associated "getUploadedAssetPath()" if needed. But if you change its name - make sure you change it in the whole project.

Cheers!

Hi victor,
Thanks a lot that cleared my doubt.

Hi ojtouch

Have you downloaded course code, like it was mentioned in First chapter? It doesn't return path because it's rely on another service, which probably not fully configured. It's hard to say something without seeing code :)

Cheers!

Ah, you're right! Thanks for the correction - we'll add a note!