2017 © Pedro Peláez
 

library laravel-flyimages

Optimize images on the fly for laravel

image

izupet/laravel-flyimages

Optimize images on the fly for laravel

  • Wednesday, June 15, 2016
  • by izupet
  • Repository
  • 3 Watchers
  • 1 Stars
  • 16 Installations
  • PHP
  • 0 Dependents
  • 0 Suggesters
  • 0 Forks
  • 0 Open issues
  • 2 Versions
  • 0 % Grown

The README.md

laravel-flyimages

Resize/crop image on the fly according to screen resolution (bootstrap grid pattern)., (*1)

Prerequisite

Imagick (ImageMagick) PHP extension
PHP version >= 5.5
Laravel framework 4 and up, (*2)

Installation

First you need to add this line to composer.json file:, (*3)

{
  "require": {
       "izupet/laravel-flyimages" : "^1.0.0"
    }
}

Update composer from the terminal:, (*4)

$ composer update

Add service provider in app.php file:, (*5)

Izupet\FlyImages\FlyImagesServiceProvider::class

After composer finishes its work, run this artisan command to generate config file, (*6)

$ php artisan vendor:publish

Put this line of JavaScript to the <head> tag of your template., (*7)

<script>document.cookie='resolution='+Math.max(screen.width)+'; path=/';</script>

You are done., (*8)

Usage

Customize route in flyimages.php config file. This route will be used as a path to the images in your templates., (*9)

Now for every image you want to optimize you should append query string to the path. Possible parameters are:, (*10)

lg-w lg-h md-w md-h sm-w sm-h xs-w xs-m

Valid values for this parameters are:, (*11)

  • number (integer) of pixels
  • text (string) auto - calculate this dimension automatically according to opposite one (the ratio is kept)

If screen resolution is equal or higher than 1200px the lg prefixed parameters are used., (*12)

If screen resolution is equal or higher than 992px and smaller than 1200px the md prefixed parameters are used. If there are none, closest parent's one (lg) are used., (*13)

The same pattern of hierarchy is used also for sm and xs prefixed parameters., (*14)

A prerequisite for everything to work is that both width and height must be present for certain prefixed parameter. If there are not both present, original image will be delivered., (*15)

Examples

<img src="/optimize/test.jpg?lg-w=400&lg-h=400&md-w=300&md-h=300"/>
<img src="/optimize/test.jpg?lg-w=auto&lg-h=700"/>
<img src="/optimize/test.jpg?sm-w=400&lg-h=400&md-w=300&xs-h=300"/> Wont work
<div style="background-image:url('/optimize/test.jpg?sm-w=256&sm-h=256');"></div>

Caching

Browser caching is available through ETAg header. Server side caching is not used. It is recommended to use reverse proxy cache server or CDN for very visited websites., (*16)

The Versions

15/06 2016

dev-master

9999999-dev

Optimize images on the fly for laravel

  Sources   Download

MIT

by Igor Zupet

laravel bootstrap images dynamically fly

23/11 2015

1.0.0

1.0.0.0

Optimize images on the fly for laravel

  Sources   Download

MIT

The Requires

 

by Igor Zupet

laravel bootstrap images dynamically fly