Coder Social home page Coder Social logo

froshwebp's Introduction

WebP Support for Shopware

Join the chat at https://gitter.im/FriendsOfShopware/Lobby Download @ Community Store

WebP Browser-Support

This plugin generates additional webp Thumbnails and uses is in various locations like detail, listing, emotion as preferred type using html5 picture tag. Browsers which does not support webp, will get normally jpg. After installation of the Plugin regenerating all thumbnails is required.

Requirements

  • Shopware Version 5.3+
  • any webp encoder
    • php-gd with webp support
    • cwebp executable in PATH

Installation

Zip Installation package for the Shopware Plugin Manager

  • Download the latest plugin version (e.g. FroshWebP-1.0.0.zip)
  • Upload and install plugin using Plugin Manager

Git Version

  • Checkout Plugin in /custom/plugins/FroshWebP
  • Change to Directory and run composer install to install the dependencies
  • Install the Plugin with the Plugin Manager

Install with composer

  • Change to your root Installation of shopware
  • Run command composer require frosh/webp and install and activate plugin with Plugin Manager

After Installation

  • Check if you have valid encoders with php bin/console frosh:webp:status
  • Download google binaries if neccessary php bin/console frosh:webp:download-google-binaries
  • Generate all Thumbnails new with php bin/console sw:thumbnail:generate -f

froshwebp's People

Contributors

alex-espressone avatar aragon999 avatar arosenhagen avatar azd325 avatar christopherholst avatar danielruf avatar devertnet avatar dwza avatar etiennebruines avatar fionera avatar flattermann avatar hlohaus avatar hostyle avatar hotte512 avatar imgbot[bot] avatar jkrzefski avatar joshuabehrens avatar kaisoellch avatar leonrustmeier avatar liaraalis avatar lx-wnk avatar realconvis avatar resslinger avatar schliflo avatar shyim avatar svenherrmann avatar tinect avatar wgaulke avatar xf- avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

froshwebp's Issues

Google cwebp is not always accessible although downloaded

Actual behaviour

Webserver has no webp-support using google cwebp (therefore the media manager does not convert on upload)
CLI has webp-support using google cwebp

Expected behaviour

CLI and webserver have webp-support using google cwebp

Environment

  • Server: Plesk + Cloudlinux
  • PHP 7.2

Steps to reproduce

  1. Have configured php option open_basedir for php-fcgi to reduce access rights
  2. The symfony finder component uses different directories to search
  3. Snap

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

$quality is hard coded to 80

Prerequisites

Currently we can not set the desired quality level (0 - 100) because it is hard coded as 80.

$content = current($runnableEncoders)->encode($im, 80);

$content = $encoder->encode($im, 80);

https://images.guide/ recommends 70 as default quality setting: find ./ -type f -name '*.jpg' -exec cwebp -q 70 {} -o {}.webp \;

Actual behaviour

$quality is always set to 80

Expected behaviour

$quality should be configurable.

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Support for older Browsers

The Plugin does a great job, but in older Browsers like Safari 13 or IE 11 are no images available.

It would be great, if a fallback to the jpg/png media would be included.

How to subscribe webp to jquery.last-seen-products.js ?

Would you give me a hint on how to get webp source in jquery.last-seen-products.js :-)
so i could try to WebP Last-Seen section :-)

console.log(data);
told me that it needs te be added to the data function, but sadly i don't know how :-)

otherwise i just could str_replace the extension and hope that the webp file is there :-D

THX :-D

what to do with the google binaries?

Our webhoster cant compile/does not support php gd with webp (yet).
What to do with frosh:webp:download-google-binaries then? Yeah it downloads the binaries, but that does not change anything. frosh:webp:status still gives "[ERROR] Webp is not available"

Am I doing anything wrong? Any other issues I'm not aware of? Honestly said, I'm autodidact aka bloody amateur, so please bear that in mind when throwing any technical stuff in my direction :-)

Thanks in advance

Can not be compressed by Closure Compiler (duplicate parameter name)

Prerequisites

Actual behaviour

Can not compress with closure compiler due to duplicate parameter name _.

Expected behaviour

Should be able to copress with Closure Compiler.

Environment

Latest closure compiler.

Steps to reproduce

google/closure-compiler#3225

$.subscribe('plugin/swLastSeenProducts/onCreateProductImage', function (_, _, element, data) {

https://closure-compiler.appspot.com/home#code%3D%2524.subscribe('plugin%252FswLastSeenProducts%252FonCreateProductImage'%252C%2520function%2520(_%252C%2520_%252C%2520element%252C%2520data)%2520%257B%250A%2520%2520%2520%2520if%2520(data.images%255B0%255D.sourceSetWebP)%2520%257B%250A%2520%2520%2520%2520%2520%2520%2520%2520var%2520imageElement%2520%253D%2520element.find('.image--element')%253B%250A%2520%2520%2520%2520%2520%2520%2520%2520var%2520content%2520%253D%2520imageElement.find('.image--media').html()%253B%250A%2520%2520%2520%2520%2520%2520%2520%2520var%2520webPTag%2520%253D%2520'%253Csource%2520srcset%253D%2522'%2520%252B%2520data.images%255B0%255D.sourceSetWebP%2520%252B%2520'%2522%2520data-srcset%253D%2522'%2520%252B%2520data.images%255B0%255D.sourceSetWebP%2520%252B%2520'%2522%2520type%253D%2522image%252Fwebp%2522%253E'%253B%250A%250A%2520%2520%2520%2520%2520%2520%2520%2520content%2520%253D%2520'%253Cpicture%253E'%2520%252B%2520webPTag%2520%252B%2520content%2520%252B%2520'%253C%252Fpicture%253E'%253B%250A%250A%2520%2520%2520%2520%2520%2520%2520%2520imageElement.html(content)%253B%250A%2520%2520%2520%2520%257D%250A%257D)%253B

Click compile.

I guess SonarLint and SonarQube would also report this.

  1. First step
  2. Second step
  3. and so on...

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Error in our Shop hildegard-spezialist.de

Hello

Actual behaviour

Once again we have this error on the finish page on https://hildegard-spezialist.de/

CRITICAL
Message:directory '/home/gutsmiedl/htdocs/custom/plugins/FroshWebP/Resources/views/frontend/index/index.tpl' not allowed by security setting
Time:2020-09-18T11:07:43.767592+0200
Channel:core
request:
{
"uri": "/checkout/finish",
"method": "POST",
"query": {
"module": "frontend",
"controller": "checkout",
"action": "finish"
},
"post": {
"sComment": "",
"sAGB": "on",
"__csrf_token": "Auio52xUva5XGBvEJpIU71FRyasUXD"
}
}
session:No session data available
shopId:1
shopName:Deutsch

Expected behaviour

Maybe you can solve it?

Environment

WebP Version 1.1.0
Shopware 5.6.6
PHP Version 7.2.33
nginx/1.18.0

Steps to reproduce

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Shopware 6 Support

Hello,

since there is no support via the Shopware Account for this free plugin, we just wanted to ask, when it's going to be released for Shopware 6?
In the Plugin-Store is a Releasedate for march, so it's already may.
Could you please give an information about the Shopware 6 Version?

Kind Regrads
Marc Grimm

NOT AN ISSUE: How to enable WebP Support in GD (Plesk) ?

SORRY for thist jerk Question..

but do you have a clou how to enable webp support for GD in Plesk (they don't)
(Don't like to install a seperate php handler, spend enought time with that)

But if.. i have to compile my own php-handler would i add --with-vpx-dir=DIR or --with-webp-dir ?

THX

Is there a webp generated img for the original (Fullsize) Picture?

As I try to serve webp for the Category Images ( {media path={$category.media.path|regex_replace:"/.jpg$/i":".webp"}} ) it looks like they are not existing - right? and this might be senseful.

Do you know a clue to get a) thumbs for $category.media.path || b) webp for fulsize || c) a better hint?

btw. some images from "Emotion Product Box" seem not to serve webp, may be not all the time?
on the 13Inch Laptop it serves none from Einkaufswelt:)
Webpagetest gets some on EKW:https://www.webpagetest.org/result/180213_H8_db38cde36e07cb5756c2436e2bd2243c/1/details/#waterfall_view_step1

ArticleDetail page comes up just with small thumbs as webp and Listing does not (Laptop)

I'll have a look on Desktop tomorrow.. seems to be different on Laptop.
Viele Grüße aus Kölle

update: it looks like the system is not serving much webp:
image

Image missing / 404

The images can not be found on the server.

Request URL: https://www.xyz.de/media/image/93/6d/13/[email protected]
Request Method: GET
Status Code: 404
Remote Address: 92.204.33.6:443
Referrer Policy: strict-origin-when-cross-origin
cache-control: no-store, no-cache, must-revalidate, no-cache, private
content-length: 0
content-type: text/html; charset=UTF-8
date: Fri, 29 Jan 2021 09:16:47 GMT
expires: Thu, 19 Nov 1981 08:52:00 GMT
pragma: no-cache
server: nginx
set-cookie: session-1=ed0e9c9a21cb1448d23134b93987588afff7a19972e67117253f8693f8f91b62; path=/; secure; HttpOnly
x-frame-options: SAMEORIGIN
:authority: www.xyz.de
:method: GET
:path: /media/image/93/6d/13/[email protected]
:scheme: https
accept: image/avif,image/webp,image/apng,image/,/*;q=0.8
accept-encoding: gzip, deflate, br
accept-language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7
cookie: allowCookie=1; cookiePreferences={"groups":{"technical":{"name":"technical","cookies":{"cookieDeclined":{"name":"cookieDeclined","active":true},"allowCookie":{"name":"allowCookie","active":true},"shop":{"name":"shop","active":true},"csrf_token":{"name":"csrf_token","active":true},"cookiePreferences":{"name":"cookiePreferences","active":true},"x-cache-context-hash":{"name":"x-cache-context-hash","active":true},"slt":{"name":"slt","active":true},"nocache":{"name":"nocache","active":true},"session":{"name":"session","active":true},"currency":{"name":"currency","active":true}},"active":true},"comfort":{"name":"comfort","cookies":{"sUniqueID":{"name":"sUniqueID","active":true}},"active":false},"statistics":{"name":"statistics","cookies":{"adcell":{"name":"adcell","active":true},"x-ua-device":{"name":"x-ua-device","active":true},"mmFacebookPixel":{"name":"mmFacebookPixel","active":true},"biloba_google_gtagjs":{"name":"biloba_google_gtagjs","active":true},"matomo":{"name":"matomo","active":true},"lenzBingAdsConversionTracking":{"name":"lenzBingAdsConversionTracking","active":true},"partner":{"name":"partner","active":true}},"active":false}},"hash":"WyJhZGNlbGwiLCJhbGxvd0Nvb2tpZSIsImJpbG9iYV9nb29nbGVfZ3RhZ2pzIiwiY29tZm9ydCIsImNvb2tpZURlY2xpbmVkIiwiY29va2llUHJlZmVyZW5jZXMiLCJjc3JmX3Rva2VuIiwiY3VycmVuY3kiLCJsZW56QmluZ0Fkc0NvbnZlcnNpb25UcmFja2luZyIsIm1hdG9tbyIsIm1tRmFjZWJvb2tQaXhlbCIsIm5vY2FjaGUiLCJwYXJ0bmVyIiwic1VuaXF1ZUlEIiwic2Vzc2lvbiIsInNob3AiLCJzbHQiLCJzdGF0aXN0aWNzIiwidGVjaG5pY2FsIiwieC1jYWNoZS1jb250ZXh0LWhhc2giLCJ4LXVhLWRldmljZSJd"}; _ga=GA1.2.54235383.1610990152; _fbp=fb.1.1610990152139.1014963417; session-1=ed0e9c9a21cb1448d23134b93987588afff7a19972e67117253f8693f8f91b62; __csrf_token-1=JlYEn05JVhMYnldjKFVCMhNZUgGYL6; _gid=GA1.2.565437212.1611576216; nocache=detail-1; _gat_gtag_UA_53703219_1=1; x-ua-device=desktop; _uetsid=5a38eea05f0511ebae9d83cf996ed9a0; _uetvid=d17406a059b011ebad4485f0c74ac11f
referer: https://www.xyz.de/kellerei-kaltern-castel-giovanelli-sauvignon-doc-2014
sec-fetch-dest: image
sec-fetch-mode: no-cors
sec-fetch-site: same-origin
user-agent: Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.141 Mobile Safari/537.36

Makes black background WebP from transparent PNG

Actual behaviour

Generating WebP pictures from my transparent PNGs makes non-transparent WebP images with black background

Example: This PNG https://oberland.la/media/image/c9/33/bd/everbodys-darling-depp_lea_schwarz_600x600.png becomes this WebP https://oberland.la/media/image/65/e1/06/everbodys-darling-depp_lea_schwarz_600x600.webp

Expected behaviour

create transparent WebP from transparent PNG

Environment

Shopware 5.5.10 running on PHP 7.2 wiht Google cwebp an PHP GD installed

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Doesn't work with Lazy Loading plugin

Actual behaviour

WebP images aren't used if this Lazy Loading plugin is active: https://store.shopware.com/ies6685271780164/lazy-loading.html

Expected behaviour

WebP to be used also in combination with the lazy loading feature

Environment

Shopware 5.5.10, Lazy Loading plugin ver. 5.3.1, PHP 7.2

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

Shopware 5.6 support

Actual behaviour

Error while updating to 5.6, because of an someday removed updated trait

In TagReplaceTrait.php line 45:
                                                                                                                                                                                                           
  FroshWebP\FroshWebP:Shopware\Components\DependencyInjection\Compiler\TagReplaceTrait::replaceArgumentWithTaggedServices is deprecated since Shopware 5.6 and will be removed with 5.8. Will be removed   
  without replacement.    

Expected behaviour

No error

Steps to reproduce

  1. Update Shopware from 5.5.10 with newest WebP Plugin to 5.6.0 RC1

fix xxx_manual.md

Prerequisites

Please, before creating this issue make sure that you read the README, that you are running the latest stable version of this plugin and that you already searched other issues to see if your problem or request was already reported.

! PLEASE REMOVE THIS PART AND LEAVE ONLY THE FOLLOWING SECTIONS IN YOUR REPORT !

Actual behaviour

https://github.com/FriendsOfShopware/FroshWebP/blob/master/Resources/store/de_manual.md
needs to be fixed:
before you did not activate the plug in you can not run:
./bin/console frosh:webp:generate,
 because ` There are no commands defined in the "frosh:webp" namespace.`

Expected behaviour

 `There are no commands defined in the "frosh:webp" namespace.`

Environment

Please provide information about the environment in which the issue occurs (e.g. PHP version, webserver, Shopware version, debugging information if you can provide).

Steps to reproduce

  1. just follow your docs at: https://github.com/FriendsOfShopware/FroshWebP/blob/master/Resources/store/de_manual.md

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Only one WebP srcset image size generated for retina images in box-emotion.tpl

In Einkaufswelten/box-emotion.tpl, the plugin does only create one srcset entry for WebP retina thumbnails.
This causes the thumbnails to be displayed way too small on some devices.

This might also be the reason for #67.

To fix it, just replace {if $srcSetRetina} with {if $srcSetRetinaWebp}.

--- box-emotion.tpl.orig        2021-02-03 13:21:39.503333719 +0100
+++ box-emotion.tpl     2021-02-03 13:22:04.916368408 +0100
@@ -39,7 +39,7 @@
             {$srcSetWebp = "{if $srcSetWebp}{$srcSetWebp}, {/if}{$image.webp.source} {$image.maxWidth}w"}

             {if $image.retinaSource}
-                {$srcSetRetinaWebp = "{if $srcSetRetina}{$srcSetRetinaWebp}, {/if}{$image.webp.retinaSource} {$image.maxWidth * 2}w"}
+                {$srcSetRetinaWebp = "{if $srcSetRetinaWebp}{$srcSetRetinaWebp}, {/if}{$image.webp.retinaSource} {$image.maxWidth * 2}w"}
             {/if}
         {/foreach}

Is generating WebP Images from PDF Files

Actual behaviour

It is generating WebP Images from PDF Files

Expected behaviour

WebP from PDF is useless 😄

Reproduce

Upload a PDF File into MediaManager

Environment

PHP 7.2 + Shopware 5.5.6 + Google CDN (GCP)

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

Allowed memory size exhausted

#42 Actual behaviour

While generating WebP images via Shopware CLI console this error occurs: 

PHP Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 18034103 bytes) in /MY_SW_INSTALL_PATH/custom/plugins/FroshWebP/Services/WebpEncoders/PhpGd.php on line 23

Expected behaviour

complete WebP generation

Environment

Hosted on a Managed Server (no shared webspace) at all-inkl.com

Steps to reproduce

  1. type SSH command "bin/console frosh:webp:generate"
  2. wait 'till about 1400 images in our case (think, it depends on file size)
  3. be frustrated because of error message at 27% of process every time you try

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Zoom image viewer doesn't load WebP images

Actual behaviour

Original images loaded, except for the one that was shown when the detail page was opened.

Expected behaviour

The zoom images that load when you click on an image on the detail page should be loaded as WebP.

Environment

Shopware 5.6.3
Plugin 1.1.0 and Google Binary only
PHP 7.2.27
SW Responsive theme

Steps to reproduce

  1. Generate WebP images as usual
  2. Open a product page
  3. Click on the product image to zoom in on it.
  4. Look at the network tab in your browser's dev console and see it not load the WebP images.

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

libpng warning: iCCP: known incorrect sRGB profile

Actual behaviour

Thumbnailgenerator throws following warning:
libpng warning: iCCP: known incorrect sRGB profile
(It does not throw the image name/path)

Due to this there are some .webp images are missing, jpg seems to work.

It looks like gd can not create webp if pictures do have a "wrong" color Profile.

Maybe this can be handled with
imagepalettetotruecolor($image);
imagealphablending($image, true);
imagesavealpha($image, true);
imagewebp($im, "out.webp", 80);
???

Expected behaviour

webp should be generated :)

Environment

sw5.5.4 / webp 1.0.1 / PHP7.2.14 / gd 2.1.0 with libJPEG 6b, libPNG 1.6.28

Steps to reproduce

  1. have a picture with wrong Color-Profile
  2. php bin/console sw:thumbnail:generate -f

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

WebP & BSP Spin: Premium 360 Grad

Prerequisites

Actual behaviour

When using the "BSP Spin: Premium 360 Grad" plug-in in conjunction with the WebP plug-in, the phenomenon occurs that the 360 ° view of the 360 ° plug-in is not loaded in the image gallery - modal box. I think it has to do with the fact that the "swImageGallery" function is overwritten and the JS of the "BSP Spin: Premium 360 Grad" plugin cannot work?

Beim Einsatz des Plugins "BSP Spin: Premium 360 Grad" in Verbindung mit dem WebP Plugin, kommt es zu dem Phänomen, das in der image-gallery--modal Box die 360° Ansicht des 360° plugins nicht geladen wird. Ich denke es hängt damit zusammen das die Funktion "swImageGallery" überschrieben wird und das JS des Plugins "BSP Spin: Premium 360 Grad" nicht greifen kann?

Expected behaviour

I would like the other plugins, especially the "BSP Spin: Premium 360 Grad" plugin to work with your plugin.
Ich würde mir wünschen das andere Plugins, im speziellen das Plugin "BSP Spin: Premium 360 Grad" mit eurem plugin funktioniert.

Environment

PHP 7.3.27, SW 5.6.9

Steps to reproduce

  1. install clean SW with Testproducts
  2. install Testversion Plugin "BSP Spin: Premium 360 Grad" and test the correct function on a article
  3. install FROSH WebP and test the correct function on the same article

Checklist

  • I am using the latest stable version of this plugin.

--

HTML remains unchanged

Actual behaviour

HTML is not changed, but (some?) WebP images are generated (present in media/image folders). But it seems like only for the base images, not the thumbnails with the dimension suffix (e.g. 200x200 and thelike).

The status page thinks there are no WebP encoders, but encoding actually works on the command line (status there is "OK" as well).

Expected behaviour

All WebP images should be created and the generated HTML should include the WebP images instead of PNG ones.

Environment

Shopware 5.6.3
Plugin 1.1.0 and Google Binary only
PHP 7.2.27
Webspace configured via Plesk Obsidian 18.0.21

Steps to reproduce

  1. Install plugin as documented
  2. Load any frontend page like the product listing
  3. Check HTML and see no mention of WebP images

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

Plugin generates transparent pictures

Hi,
I've tried ShyimWebP plugin in Shopware, instalation was completely ok, so was the thumbnails generation. But when I opened my shop in browser, most of pictures was empty (only transparet color).
I used Google Chrome v62.0.3202.89 64bit, I looked on server via FTP dirrectly to the folder with .webp picture and there was transparent picture too. So the problem isn't on the browser's site.
Mozilla doesn't support .webp format and use .jpg - in Mozilla my shop works with .jpg pictures right.

Can someone please explain me, what did I wrong and give me some clue to fix it?
Thanks

Support webp retina quality

Actual behaviour

One quality setting for 1x and Retina 2x

Expected behaviour

Same as media manager - seperate settings.

Steps to reproduce

  1. Compare settings options

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

Plugin tries to convert SVG images.

Actual behaviour

If you have SVG images in the mediamanager the plugin tries to convert the image and adds webp thumbnails to the image object.
The template then puts those broken webp links in the tag and the browser shows a broken image.

Expected behaviour

Do not handle SVG (vector) image types.

Environment

PHP 7.3, Shopware 5.6.6, Latest Plugin version

Steps to reproduce

  1. upload SVG to media manager
  2. use it somewhere on the site
  3. check for brokem image.

Checklist

  • [ x] I have checked all issues and haven't found a similar report.
  • [ x] I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Add dynamic image size / Thumb Index

I do have the "Problem", that Shopware does not use thumbs / image sizes in a super sense-full way.

Could we add a flexible thumb index number for Listint & Article-detail image in Plugin-Configuration?

The actual behavior on loading ArticleDetail is load ALL images size [1] for the article pictures and load all Thumbs with Index [0].
The article Picture is around 600px [1] and the thumbs are shown about 80px [0] but loadin 200px my Listing image is about 200px and uses [0].

So atm it loads every image twice [0]200px to show with 80px and [1] as it is needed vor AricleImageSlider.

Shouldn't we switch it loading only the [1] and use it as Thumb or load Thumbs in [0] as 80px? And [1] more lazy? But then we need to use [1] in Listing ? - This would reduce requests and bytes?

Where is [2] actually in use ?

default index:
0 = 200x200
1 = 600x600
2 = 1280x1280

more sens-full:
0 = mini thump 80px
1 = Listing and slider 200px
2 = Product 600px
3 = 1280 ?

Good or bad idea? let me know :)

THX

btw. there is the prev and nex - nav without image webp atm.

Vector images broken with plugin active

This is a follow up to #59, so all the preconditions are the same.

We are using a SVG image for the logo. Right now the plugin tries to convert those images, too, which fails and leads to a broken image in the browser. They don't seem to try the SVG among the sources, if the WebP image fails to load.

The plugin should just leave vector images alone. It doesn't make sense to try to convert them anyway.

WebP not working on replace media via MediaManager

Actual behaviour

The MediaUploadSubscriber does not subscribe the 'Shopware\Models\Media\Media::postUpdate' Event. As far as i could see the webP images will not be created if I replace an image via Media Manager "Replace media" button. Is this possible?

Expected behaviour

When I replace an image via Media Manager the webp image stays unchanged.

Environment

PHP 7.3
Shopware 5.5.8

Steps to reproduce

  1. open Media Manage
  2. select an image
  3. click on image (for example let us call it mts_sample.jpg)
  4. click on "Replace media"
  5. click "Select File"
  6. select new image
  7. click on save
  8. request media url (on our example this means http://host/media/image/8c/43/a3/mts_sample.webp)

Checklist

  • I have checked all issues and haven't found a similar report. There is a similar Issue but no usefull description
  • I am using the latest stable version of this plugin. As far as a know the latest version for my Shopware version

Plugin overwrites theme thumbnail setting of box-big-image.tpl

If you use customer thumbnail settings webp plugin overwrites it.

In custom/plugins/FroshWebP/Resources/views/frontend/listing/product-box/box-big-image.tpl {$sArticle.image.thumbnails[1].sourceSet} is set. This overwrites custom theme settings like {$sArticle.image.thumbnails[5].sourceSet}

It would be helpfull if blocks integrated in webp plugin, so that tpl settings can be overwritten.

Wrong order in srcset and not all variants are generated

Actual behaviour

The variant 800x800 2x and so on are not generated as WebP. Also the webp variant is not the first in the sources.

See

The browser ignores everything after the first matching condition, so be careful how you order the media conditions.

on https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images

Expected behaviour

Lighthouse and all (mobile) devices should first load the webp and then the jpeg variant and there should be a webp for all variants (also the retina ones).

Environment

Shopware 5.5.4, Frosh WebP 1.0.0

Steps to reproduce

<picture class="banner--image">
        <source sizes="(min-width: 78.75em) 12.5vw, (min-width: 64em) 12.5vw, (min-width: 48em) 12.5vw, (min-width: 30em) 12.5vw, 12.5vw" srcset="https://example.com/media/image/b9/fb/9f/[email protected] 800w, https://example.com/media/image/1b/91/e6/[email protected] 1280w, https://example.com/media/image/fd/25/4d/[email protected] 1920w, https://example.com/media/image/f9/8a/04/[email protected] 1920w" media="(min-resolution: 192dpi), (-webkit-min-device-pixel-ratio: 2)" type="image/webp">
        <source sizes="(min-width: 78.75em) 12.5vw, (min-width: 64em) 12.5vw, (min-width: 48em) 12.5vw, (min-width: 30em) 12.5vw, 12.5vw" srcset="https://example.com/media/image/b9/fb/9f/[email protected] 800w, https://example.com/media/image/1b/91/e6/[email protected] 1280w, https://example.com/media/image/fd/25/4d/[email protected] 1920w" media="(min-resolution: 192dpi), (-webkit-min-device-pixel-ratio: 2)">
        <source sizes="(min-width: 78.75em) 12.5vw, (min-width: 64em) 12.5vw, (min-width: 48em) 12.5vw, (min-width: 30em) 12.5vw, 12.5vw" srcset="https://example.com/media/image/62/e0/ed/image_800x800.webp 800w, https://example.com/media/image/bb/14/03/image_1280x1280.webp 1280w, https://example.com/media/image/ab/3b/d8/image_1920x1920.webp 1920w" type="image/webp">
        <source sizes="(min-width: 78.75em) 12.5vw, (min-width: 64em) 12.5vw, (min-width: 48em) 12.5vw, (min-width: 30em) 12.5vw, 12.5vw" srcset="https://example.com/media/image/bb/c6/3e/image_800x800.jpg 800w, https://example.com/media/image/af/3c/3b/image_1280x1280.jpg 1280w, https://example.com/media/image/2d/e5/bf/image_1920x1920.jpg 1920w">

        
        <img src="https://example.com/media/image/bb/c6/3e/image_800x800.jpg" srcset="https://example.com/media/image/b9/fb/9f/[email protected] 2x" class="banner--image-src" style="width: 100%;">
    </picture>

[email protected] and so on are twice there but just as jpeg.

Do a check on https://lighthouse-ci.appspot.com/try with a slow network connection.

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

5.6.3: Google cwebp not available -> systeminfo

Hello,

after successful installation cwebp is not available in Shopware -> Systeminfo ->Webpsupport.

Installation was successfu and cwebp exist:
[root@www2 html]# ./bin/console frosh:webp:download-google-binaries
[OK] Successfully installed cwebp to /var/www/domain/html/var/libwebp/bin/cwebp

More efficient thumbnail generation

You currently need to run sw:thumbnail:generate -f whenever an image changes. In one of our shops that takes almost 5h to finish.

There should be a way to run the thumbnail generation only for the changed images. Maybe frosh:webp:generate should trigger the thumbnail process, too, since it knows which images are new.

generation always stops at the same picture

Hi

We have the problem at one of our customer's Shopware shop that the generation always stops at the same picture. There is no timeout or another limit which is getting hit:

php bin/console sw:thumbnail:generate -f

Generating Thumbnails for Album Grusskarten (ID: -23)
6/6 [============================] 100%
Generating Thumbnails for Album Geschenkoptionen (ID: -21)
6/6 [============================] 100%
Generating Thumbnails for Album Blog (ID: -11)
0 [>---------------------------]
Generating Thumbnails for Album Einkaufswelten (ID: -3)
0 [>---------------------------]
Generating Thumbnails for Album Banner (ID: -2)
12/12 [============================] 100%
Generating Thumbnails for Album Artikel (ID: -1)
725/2817 [=======>--------------------] 25%

it always stops at the picture 725 of 2817.

Does anyone has an idea what's the issue here?
Thanks in advance for your appreciated answers!

Best Regards
JZ

File not fouond at path

Hi there, I really would like to use your plugin but im getting error messages - for example:

0/519 [>---------------------------] 0%media/image/s_balsam.jpg => File not found at path: media/image/5c/e6/8d/s_balsam.jpg 1/519 [>---------------------------] 0%media/image/s_balsam52fcc50218691.jp g => File not found at path: media/image/14/fb/e8/s_balsam52fcc50218691.jpg 2/519 [>---------------------------] 0%media/image/kamillen_balsam.jpg => F ile not found at path: media/image/4a/e6/47/kamillen_balsam.jpg 3/519 [>---------------------------] 0%media/image/kamillen_balsam52fcc5024 ae0a.jpg => File not found at path: media/image/fa/53/86/kamillen_balsam52fcc502 4ae0a.jpg 4/519 [>---------------------------] 0%media/image/tn_ringelblumen_balsam.j pg => File not found at path: media/image/18/5d/32/tn_ringelblumen_balsam.jpg 5/519 [>---------------------------] 0%media/image/tn_ringelblumen_balsam52 fcc50267f08.jpg => File not found at path: media/image/d7/91/53/tn_ringelblumen_ balsam52fcc50267f08.jpg 6/519 [>---------------------------] 1%media/image/tn_ringelblumen_balsam52 fcc502cc465.jpg => File not found at path: media/image/7a/36/90/tn_ringelblumen_ balsam52fcc502cc465.jpg
At the very end I´m getting error message:

72%PHP Fatal error: Allowed memory siz e of 134217728 bytes exhausted (tried to allocate 47878100 bytes) in /www/htdocs /w00f2b53/shop_neu/sw5/custom/plugins/FroshWebP/Services/WebpEncoders/PhpGd.php on line 23
When I activate the plugin and the webp pictures I dont see any picture in frontend any more. Can you help me out with this?

kwebKB
Shopware 5.4.6 - latest plugin version.

Force flag causes Fatal Error

Prerequisites

Actual behaviour

PHP Fatal error:  Uncaught TypeError: Return value of FroshWebP\Components\ImageStack\Arguments::isForce() must be of the type boolean, null returned in custom/plugins/FroshWebP/Components/ImageStack/Arguments.php:90

Expected behaviour

No errors and re-creation of the WebP images.

Environment

Shopware 5.6.3
Plugin 1.1.0 and Google Binary only
PHP 7.2.27

Steps to reproduce

  1. Invoke ./bin/console frosh:webp:generate -f from the CLI

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

Not creating WebP Pictures

Hello,

after installing the plugin, we did as described in the manual. Every available picture has been converted into WebP. Pictures that have been uploaded afterwards will not be converted.

Thank you
Oliver

Failed to open Stream

Hi we get this error after thumbnail generation via ssh. How can we solve that? Thank you in advance!

xxx:/home/www/xxx/html/shopware534/__test > php bin/console shyim:webp:download-google-binaries
xxx:/home/www/xxx/html/shopware534/__test > php bin/console sw:thumbnail:generate -f
Generating Thumbnails for Album Blog (ID: -11)
0/19 [>---------------------------] 0%
Notice: Array to string conversion in /html/shopware534/__test/vendor/symfony/process/Process.php on line 281

Warning: file_get_contents(/tmp/cwebpOwqGQo-dst): failed to open stream: No such file or directory in /html/shopware534/__test/custom/plugins/ShyimWebP/Services/WebpEncoders/GoogleBinary.php on lin
e 44

WebP in Digitalpublishing

Actual behaviour

Not able to load .webp file in Shopware Digital Publishing images element

Expected behaviour

Load optimized WebP instead of PNG

Environment

Shopware 5.6 with Plugin 1.1.1 on nginx 

Steps to reproduce

I read plugins might not be supported, but I'm guessing the shopware digital publishing uses the native elements vom the core. I tried to add the WebP Source in the file /views/swag_digital_publishing/components/image.tpl like this
`{block name="widgets_digital_publishing_components_image_element"}

{$style = "padding: {$element.paddingTop / 16}rem {$element.paddingRight / 16}rem {$element.paddingBottom / 16}rem {$element.paddingLeft / 16}rem;"}
{$style = "{$style} {if $element.orientation == "right"}float: {elseif $element.orientation == "left"}float: {else}text-align: {/if}{$element.orientation};"}

{$wrapperStyle = "max-width: {$element.maxWidth / 16}rem;"}
{$imageStyle = "max-height: {$element.maxHeight / 16}rem;"}

{$src = $element.media.source}
{$srcWebP = $element.media.webp.source}

{if $element.media.thumbnails}
    {foreach $element.media.thumbnails as $thumbnail}
        {if $thumbnail.maxWidth >= $element.maxWidth}
            {$src = $thumbnail.sourceSet}
            {$srcWebP = $thumbnail.webp.sourceSet}
            {break}
        {/if}
    {/foreach}
{/if}

<div class="dig-pub--image" style="{$style}">
    <div class="dig-pub--img-wrapper" style="{$wrapperStyle}">
        <picture>
            {*if isset($element.media.thumbnails.webp)*}
                <source data-srcset="{$srcWebP}"
                        type="image/webp"
                        class="dig-pub--img{if $element.class} {$element.class}{/if}  lazyload"
                        style="{$imageStyle}"
                        {if $element.alt} alt="{$element.alt}"{/if} />
            {*/if*}
            <img data-srcset="{$src}"
                 class="dig-pub--img{if $element.class} {$element.class}{/if}  lazyload"
                 style="{$imageStyle}"
                    {if $element.alt} alt="{$element.alt}"{/if} />
        </picture>
    </div>
</div>

{/block}`

the webp is on the server. I also tried srcSet instead of just src and $element.webp.media.source, but it doesn't load the file in html.
src

Checklist

  • [x ] I have checked all issues and haven't found a similar report.
  • [x ] I am using the latest stable version of this plugin.

--

valid license key

Hi,

how can i get rid of these messages?
image

Thank you in advance

Kai

rename() can not be used with tmp

Prerequisites

Please, before creating this issue make sure that you read the README, that you are running the latest stable version of this plugin and that you already searched other issues to see if your problem or request was already reported.

! PLEASE REMOVE THIS PART AND LEAVE ONLY THE FOLLOWING SECTIONS IN YOUR REPORT !

Actual behaviour

webp binaries can not be saved because rename() does not work on all platforms with tmp.
Also see https://bugs.launchpad.net/ubuntu/+source/php5/+bug/723330

exec("mv " . escapeshellarg($downloadDir . DIRECTORY_SEPARATOR . $packageDirectory) . " " . escapeshellarg($cacheDownloadDir)); would work were allowed.

rename($downloadDir . DIRECTORY_SEPARATOR . $packageDirectory, $cacheDownloadDir);

Expected behaviour

webp binaries should be downloaded

Environment

Debian / Ubuntu

Steps to reproduce

  1. run the CLI command for the binary downloads

Checklist

  • I have checked all issues and haven't found a similar report.
  • I am using the latest stable version of this plugin.

--

♥ ANY INCOMPLETE REPORT WILL BE CLOSED RIGHT AWAY ♥

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.