Slice Twig path - symfony

I would like to delete the first occurrence of '/' in my twig path. I need it to show image in my pdf. I don't know how to deal with it and need help from someone smarter.
<p>{% path(project.mainImage), 'reference' %}</p>
Gives me:
/upload/media/img/a6ab300301dd8e5de89bac068a16aaa9e90b2a1b.jpeg
I need:
upload/media/img/a6ab300301dd8e5de89bac068a16aaa9e90b2a1b.jpeg

Ok guys, I am just stupid.
Here is the answer:
{% set rendered %}{% path project.mainImage, 'reference' %}{% endset %}
<img src="{{ rendered|replace({'/upload':'upload'}) }}">
Works like a charm.

You could use the slice Twig filter, like this:
{% set rendered %}{% path project.mainImage, 'reference' %}{% endset %}
<img src="{{ rendered|slice(1) }}">
UPDATE:
And if you only want to do it on routes starting with /, you could do like this:
{% set rendered %}{% path project.mainImage, 'reference' %}{% endset %}
{% if rendered|slice(1) == '/' %}
<img src="{{ rendered|slice(1) }}">
{% else %}
<img src="{{ rendered }}">
{% endif %}

Related

Reuseable blocks inside of custom form themes in symfony

I want to call a custom block inside an overwritten theme-block:
{% block file_widget %}
{% if image is not null %}
{{ block('imagePreview') }}
{% endif %}
{{ block('form_widget') }}
{% endblock %}
{% block imagePreview %}
<img src="{{ image.getFullPath | imagine_filter('medium_square') }}"
alt="{{ image.filename }}"/>
{% endblock %}
The imagePreview is not shown.
But it is working when I don't use a block.
And it is also working when I dont use a FormTypeExtension and create an ImageType instead.
So I guess the file_widgetblock still has the scope of the parent form_div_layout.html.twig and there in fact no imagePreview block exists.
So how can I solve this.
I mean now I solved it by removing the block.
But I just want to know if someone has a solution to this.
Maybe there is a way for using reuseable blocks inside of custom form themes in symfony?
Finally I found the solution:
I just did not 'use' the base template explicit.
The form theme worked without this - because symfony falls back the the base form theme when it does not find a block inside the new theme file.
But it seems then you also can not use custom blocks inside this new theme file.
So this works now:
{% use 'form_div_layout.html.twig' %}
{% block file_widget %}
{% if image is not null %}
{{ block('imagePreview') }}
{% endif %}
{{ block('form_widget') }}
{% endblock %}
{% block imagePreview %}
<img src="{{ image.getFullPath | imagine_filter('medium_square') }}"
alt="{{ image.filename }}"/>
{% endblock %}

Assigning output of a twig function to a twig variable

I have the twig/assetic code below:
{% if post.media %}
{% image '#ApplicationMyBundle/Resources/images/AjaxLoader-298x179.gif' output='/images/AjaxLoader-298x179.gif' %}
<img src="{{ asset_url }}" data-src="{% path post.media, 'news_size_4' %}" />
{% endimage %}
{% endif %}
The real image path is in {% path post.media, 'news_size_4' %}, I need to get this output in to a variable so i can use it elsewhere. {{ asset_url }} is no good as that only gives me the ajaxloader image.
Is there anyway this can be done?
As suggested by Hakim in a comment, you can use the set Twig tag.
Define the variable:
{% set myPath %}
{% path post.media, 'news_size_4' %}
{% endset %}
Display this variable:
{{ myPath }}

Is it possible to do some sort of implicit loop with Twigs `{% image %}` to return all images in the directory?

Considering that Twig has it's {% for %} loops and it's {% image %} sections, is there something such as the following be done with Twig to return all images within the AppBundle/Resources/images/gallery/ directory? It would seem to make sense but I've not been able to find anything so far:
{% image #AppBundle/Resources/images/gallery/*.jpg %}
<img src="{{ asset_url }} />
{% endimage %}
Yes, that is possible. Assetic just doesn't distinguish between different file types:
{% image '#AppBundle/Resources/images/gallery/*' %}
<img src="{{ asset_url }}" />
{% endimage %}
This will render all images from the gallery directory, no matter the file extension.
The same can be done with CSS and JS files via
{% stylesheets '#AppBundle/Resources/css/*' %}
<img src="{{ asset_url }}" />
{% endstylesheets %}
{% javascripts '#AppBundle/Resources/js/*' %}
<img src="{{ asset_url }}" />
{% endjavascripts %}

eZ Publish 5: get absolute url of an image attribute of a class

In eZ Publish 5, I have a class with an image attribute.
Within the twig template, I can get the relative url (e.g. '/var/site/storage/image/...') from the attribute parameters.
Now I need the absolute url. Which is the best way to get it?
Should I get the request information and append the base url to the relative one? Or there's a built in method for that?
Thanks
You should do something like this:
{{ asset( ez_image_alias( content.getField( 'image' ), content.versionInfo, 'original' ).uri, absolute=true ) }}
ez_image_alias is used to get the image alias (obviously), and here we get the original variation.
Then we take the uri of the image alias, and pass it to symfony asset function.
That should work.
Yes this the correct answer.
Just don't forget to add some tests before such as :
Check if the content field you want to retrieve data from exists and if that field is not empty :
{% if content.fields['myFieldIdentifier'] is defined and not ez_is_field_empty(content, 'myFieldIdentifier') %}
{# do the job #}
{% endif %}
Here's how the ImageFieldType is rendered by default :
{% block ezimage_field %}
{% spaceless %}
{% if not ez_is_field_empty( content, field ) %}
<figure {{ block( 'field_attributes' ) }}>
{% set imageAlias = ez_image_alias( field, versionInfo, parameters.alias|default( 'original' ) ) %}
<img src="{% if imageAlias %}{{ asset( imageAlias.uri ) }}{% else %}//:0{% endif %}"{% if imageAlias.width is defined %} width="{{ imageAlias.width }}"{% endif %}{% if imageAlias.height is defined %} height="{{ imageAlias.height }}"{% endif %} alt="{{ field.value.alternativeText }}" />
</figure>
{% endif %}
{% endspaceless %}
{% endblock %}

Assetic image filter and localized resources

For one of our projects we have a couple of headers which are different for each locale. At this moment I'm using the assetic image function to load the correct image, like this:
{% image '#AgendaBundle/Resources/public/images/header_1.png' output='/images/header_1.png' %}
<img src="{{ asset_url }}" class="mod-rounded" />
{% endimage %}
To add a translated version of the headers, the only way to do this seems to be hardcoding the locale:
{% if app.request.locale == 'nl' %}
{% image '#AgendaBundle/Resources/public/images/header_1.png' output='/images/header_1.png' %}
<img src="{{ asset_url }}" class="mod-rounded" />
{% endimage %}
{% else %}
{% image '#AgendaBundle/Resources/public/images/header_1_en.png' output='/images/header_1_en.png' %}
<img src="{{ asset_url }}" class="mod-rounded" />
{% endimage %}
{% endif %}
This seems tedious, error prone and hard to maintain. Is there a better and more elegant solution available?

Resources