templates/web/components/picture.html.twig line 1

Open in your IDE?
  1. {% set path = '/uploads/media/files' %}
  2. {% set format = (format is defined) ? format : 'large' %}
  3. {% set class = (class is defined) ? class : 'bg-image w-100' %}
  4. {% set device_class = (device_class is defined) ? device_class : '' %}
  6. {% if mediaObject is null %}
  7. no image
  8. {% else %}
  9. <picture class="{{ device_class }}">
  10.     {% if "image/jpeg" == mediaObject.encodingFormat %}
  11.         <source srcset="{{ asset(path ~ '/' ~ mediaObject.originalFilename ~ '.webp') | imagine_filter(format) }}" type="image/webp">
  12.         <source srcset="{{ asset(path ~ '/' ~ mediaObject.originalFilename) | imagine_filter(format) }}" type="image/jpeg">
  13.         <img
  14.                 src="{{ asset(path ~ '/' ~ mediaObject.originalFilename) }}"
  15.                 alt="{{ mediaObject.alt }}"
  16.                 class="{{ class }}">
  17.     {% endif %}
  18.     {% if "image/png" == mediaObject.encodingFormat %}
  19.         <source srcset="{{ asset(path ~ '/' ~ mediaObject.originalFilename ~ '.webp') | imagine_filter(format) }}" type="image/webp">
  20.         <source srcset="{{ asset(path ~ '/' ~ mediaObject.originalFilename) | imagine_filter(format) }}" type="image/png">
  21.         <img
  22.                 src="{{ asset(path ~ '/' ~ mediaObject.originalFilename) }}"
  23.                 alt="{{ mediaObject.alt }}"
  24.                 class="{{ class }}">
  25.     {% endif %}
  26. </picture>
  27. {% endif %}
  37. {#<picture>#}
  38. {#    <source srcset="{{ asset('media/cache/large/uploads/media/files/' ~ mediaObject.filename ~ '.webp') }}" type="image/webp">#}
  39. {#    {% if "image/jpeg" == mediaObject.encodingFormat %}#}
  40. {#        <source srcset="{{ asset('media/cache/large/uploads/media/files/' ~ mediaObject.filename ~ '.jpg') }}" type="image/jpeg">#}
  41. {#        <img #}
  42. {#        src="media/cache/large/uploads/media/files/{{ mediaObject.filename ~ '.jpg' }}" #}
  43. {#        alt="{{ mediaObject.alt }}" #}
  44. {#        class="bg-image w-100">#}
  45. {#        #}{# class="bg-image desktop-hide w-100"> #}
  46. {#    {% endif %}#}
  47. {#    {% if "image/png" == mediaObject.encodingFormat %}#}
  48. {#        <source srcset="{{ asset('media/cache/large/uploads/media/files/' ~ mediaObject.filename ~ '.png') }}" type="image/png">#}
  49. {#        <img #}
  50. {#        src="media/cache/large/uploads/media/files/{{ mediaObject.filename ~ '.png' }}" #}
  51. {#        alt="{{ mediaObject.alt }}" #}
  52. {#        class="bg-image w-100">#}
  53. {#        #}{# class="bg-image desktop-hide w-100"> #}
  54. {#    {% endif %}#}
  55. {#</picture>#}
  56. {#<img src="{{asset('images/accueil.webp')}}" class="desktop-hide w-100" alt="...">
  57. <img src="{{asset('images/accueil-mobile.webp')}}" class="mobile-hide w-100" alt="...">#}