@ember-responsive-image/imgix v0.0.0
@ember-responsive-image/imgix
Adds a provider helper for ember-responsive-image
for the imgix image CDN.
Compatibility
- Ember.js v4.8 or above
- Embroider or ember-auto-import v2
Installation
ember install @ember-responsive-image/imgix
Usage
Please make sure you have read the main documentation first, especially the section on image providers.
This addon provides a {{responsive-image-imgix-provider}}
helper for use with the <ResponsiveImage/>
component:
<ResponsiveImage @src={{responsive-image-imgix-provider 'path/to/image.jpg'}} />
Custom parameters
Besides the transformations that the addon itself implicitly adds (related to resizing images)
you can add your own imgix parameters by passing a params
hash:
<ResponsiveImage
@src={{responsive-image-imgix-provider
'path/to/image.jpg'
params=(hash monochrome='44768B' px=10)
}}
/>
Quality
Use the quality
parameter to pass a custom quality setting
instead of the default of 75
:
<ResponsiveImage
@src={{responsive-image-imgix-provider 'path/to/image.jpg' quality=50}}
/>
Image formats
By default, all image formats supported by imgix (PNG, JPEG, WEBP, but no AVIF yet) are referenced in the generated <source>
tags.
You can tweak that using the formats
argument:
<ResponsiveImage
@src={{responsive-image-imgix-provider
'path/to/image.jpg'
formats=(array 'webp' 'jpeg')
}}
/>
Configuration
You need to specify your custom imgix domain
in your app's config/addons.js
file:
// config/addons.js
'use strict';
module.exports = {
'@ember-responsive-image/imgix': {
domain: 'my-org.imgix.net',
},
};
License
This project is licensed under the MIT License.
4 months ago
4 months ago