2017 © Pedro Peláez
 

symfony-bundle imagine-bundle

Image manipulation using Imagine and Twig Filters Work with SF3.

image

yellowskies/imagine-bundle

Image manipulation using Imagine and Twig Filters Work with SF3.

  • Monday, January 23, 2017
  • by AntoineTesson
  • Repository
  • 1 Watchers
  • 0 Stars
  • 73 Installations
  • PHP
  • 0 Dependents
  • 0 Suggesters
  • 0 Forks
  • 0 Open issues
  • 9 Versions
  • 0 % Grown

The README.md

Deprecated

This project is no longer actively maintained, please find one of the populate forks. Thanks!, (*1)

SkiesImagineBundle

This bundle provides easy image manipulation support for Symfony2. For example, with this bundle, the following is possible:, (*2)

``` jinja ````, (*3)

This will perform the transformation called thumbnail, which you can define to do a number of different things, such as resizing, cropping, drawing, masking, etc., (*4)

This bundle integrates the standalone PHP "Imagine library"., (*5)

Installation

Installation is a quick 3 step process:, (*6)

  1. Download SkiesImagineBundle using composer
  2. Enable the Bundle
  3. Configure your application's config.yml

Step 1: Download SkiesImagineBundle using composer

Add SkiesImagineBundle in your composer.json:, (*7)

composer require yellowskies/imagine-bundle

Composer will install the bundle to your project's vendor/Skies/imagine-bundle directory., (*8)

Step 2: Enable the bundle

Enable the bundle in the kernel:, (*9)

``` php ``` Or if you're using PHP templates: ``` php , (*10)



Behind the scenes, the bundle applies the filter(s) to the image on the first request and then caches the image to a similar path. On the next request, the cached image would be served directly from the file system. In this example, the final rendered path would be something like `/media/cache/my_thumb/relative/path/to/image.jpg`. This is where Imagine would save the filtered image file. ## HTTP Cache Headers - `cache_type` - one of the three values: `false`, `public` or `private`. Setting `false` disables caching i.e. sets `Cache-Control: no-cache`. default: `false` - `cache_expires` - Sets time when cache expires. Uses format that the `DateTime` parser understands. Expression will be prefixed with `+` so expression should be like `2 weeks`. Used only when `cache_type` equal `public` or `private`. default: `1 day` Configuration example: ``` yaml # app/config/config.yml Skies_imagine: filters: my_thumb: type: thumbnail options: { size: [120, 90], mode: outbound, cache_type: public, cache_expires: 2 weeks }

Cache headers are set only for first request when image is generated. To solve this issue you should add additional configuration for your web server. Example for apache web server:, (*11)

<IfModule mod_expires.c>
    <Directory "/path/to/web/media/cache">
        ExpiresActive On
        ExpiresDefault "access plus 2 weeks"
    </Directory>
</IfModule>

Configuration

The default configuration for the bundle looks like this:, (*12)

``` yaml Skies_imagine: source_root: %kernel.root_dir%/../web web_root: %kernel.root_dir%/../web cache_prefix: media/cache driver: gd filters: [], (*13)


There are several configuration options available: - `source_root` - can be set to the absolute path to your original image's directory. This option allows you to store the original image in a different location from the web root. Under this root the images will be looked for in the same relative path specified in the apply_filter template filter. default: `%kernel.root_dir%/../web` - `web_root` - must be the absolute path to you application's web root. This is used to determine where to put generated image files, so that apache will pick them up before handing the request to Symfony2 next time they are requested. default: `%kernel.root_dir%/../web` - `cache_prefix` - this is also used in the path for image generation, so as to not clutter your web root with cached images. For example by default, the images would be written to the `web/media/cache/` directory. default: `media/cache` - `driver` - one of the three drivers: `gd`, `imagick`, `gmagick` default: `gd` - `filters` - specify the filters that you want to define and use Each filter that you specify have the following options: - `type` - determine the type of filter to be used, refer to *Filters* section for more information - `options` - options that should be passed to the specific filter type - `path` - override the global `cache_prefix` and replace it with this path - `source_root` - override the global `source_root` and replace it with this path ## Built-in Filters Currently, this bundles comes with just one built-in filter: `thumbnail`. ### Thumbnail The `thumbnail` filter, as the name implies, performs a thumbnail transformation on your image. The configuration looks like this: ``` yaml filters: my_thumb: type: thumbnail options: { size: [120, 90], mode: outbound }

The mode can be either outbound or inset., (*14)

Resize

The resize filter may be used to simply change the width and height of an image irrespective of its proportions., (*15)

Consider the following configuration example, which defines two filters to alter an image to an exact screen resolution:, (*16)

``` yaml Skies_imagine: filters: cga: type: resize options: { size: [320, 200] } wuxga: type: resize options: { size: [1920, 1200] }, (*17)


### RelativeResize The `relative_resize` filter may be used to `heighten`, `widen`, `increase` or `scale` an image with respect to its existing dimensions. These options directly correspond to methods on Imagine's `BoxInterface`. Given an input image sized 50x40 (width, height), consider the following annotated configuration examples: ``` yaml Skies_imagine: filters: heighten: type: relative_resize options: { heighten: 60 } # Transforms 50x40 to 75x60 widen: type: relative_resize options: { widen: 32 } # Transforms 50x40 to 40x32 increase: type: relative_resize options: { increase: 10 } # Transforms 50x40 to 60x50 scale: type: relative_resize options: { scale: 2.5 } # Transforms 50x40 to 125x100

If you prefer using Imagine without a filter configuration, the RelativeResize class may be used directly., (*18)

Paste

The paste filter pastes an image into your image., (*19)

``` yaml Skies_imagine: filters: paste: type: paste options: image: %kernel.root_dir%/Resources/image.png # path to image x: right # [left|right|center] or integer y: bottom # [top|bottom|middle] or integer, (*20)


### Chain With `chain` filter you can apply some filters on your image. You can quite simply create a `watermark` filter: ``` yaml Skies_imagine: filters: watermark: type: chain options: filters: thumbnail: # filter type size: [100, 100] # filter options mode: outbound paste: image: %kernel.root_dir%/Resources/image.png x: right y: bottom

Crop

The crop filter crop an image with start coordinate, and size dimension., (*21)

``` yaml Skies_imagine: filters: crop: type : crop options: { start: [0, 0], size: [100, 100] } #crop image with 100x100 square box, (*22)


## Load your Custom Filters The ImagineBundle allows you to load your own custom filter classes. The only requirement is that each filter loader implement the following interface: Skies\Bundle\ImagineBundle\Imagine\Filter\Loader\LoaderInterface To tell the bundle about your new filter loader, register it in the service container and apply the following tag to it (example here in XML): ``` xml <tag name="imagine.filter.loader" filter="my_custom_filter" />

For more information on the service container, see the Symfony2 Service Container documentation., (*23)

You can now reference and use your custom filter when defining filters you'd like to apply in your configuration:, (*24)

``` yaml filters: my_special_filter: type: my_custom_filter options: { }, (*25)


For an example of a filter loader implementation, refer to `Skies\Bundle\ImagineBundle\Imagine\Filter\Loader\ThumbnailFilterLoader`. ## Caveats If you are generating your image names from multiple parts in a Twig template, please be aware that Twig applies filters __before__ concatenation, so ``` jinja <img src="{{ '/relative/path/to/' ~ some_variable ~ '.jpg' | apply_filter('my_thumb') }}" />

will apply your filter to '.jpg', and then concatenate the result to '/relative/path/to/' and some_variable. So the correct invocation would be, (*26)

``` jinja , (*27)


## Using as a service You can use ImagineBundle as a service and resolve the cached image path. ```php $SkiesService = $this->get('imagine.cache.path.resolver');

Then, call the getBrowserPath and pass the original image webpath and the filter you want to use, (*28)

$cachedImage = $SkiesService->getBrowserPath($object->getWebPath(), 'my_thumb');

And also use ImagineBundle as a service and create the cache image from controller., (*29)

$cacheManager = $this->get('imagine.cache.manager');
$cachedPath = $cacheManager->cacheImage($this->getRequest()->getBaseUrl(), '/images/picture1.jpg', 'my_filter');

The Versions

23/01 2017

dev-master

9999999-dev

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

23/01 2017

4.0.4

4.0.4.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

4.0.2

4.0.2.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

4.0.3

4.0.3.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

4.0.1

4.0.1.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

4

4.0.0.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

v1

1.0.0.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

2

2.0.0.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine

15/12 2016

v3

3.0.0.0

Image manipulation using Imagine and Twig Filters Work with SF3.

  Sources   Download

GNU-LGPLv3

The Requires

 

The Development Requires

twig symfony2 bundle symfony3 symfony imagine