Neologistic Paraphasic Mumbling

    ember-filter-image

    0.4.3 • Public • Published

    npm version Ember Observer Score Build Status

    ember-filter-image

    An ember-cli addon for cross-browser image filtering using SVG filters.

    Just take me to the demo!

    Usage

    Just add the filter-image component to your template:

    {{filter-image src="image.jpg" filters=filters}}
    

    src should be pretty self-explanatory, and filters is an object containing the filter settings, e.g. (in your route):

    setupController(controller) {
      controller.set('filters', {
        contrast: 1,
        saturation: 1,
        brightness: 0
      })
    }

    Scaling

    By default, the rendered image will be scaled such that it is contained in the parent DOM element. If you'd prefer it to be cropped apply this:

    {{filter-image src="image.jpg" filters=filters crop=true}}
    

    If you don't want the aspect ratio to be locked, apply this:

    {{filter-image src="image.jpg" filters=filters lockAspectRatio=false}}
    

    Options

    Name Type Default Description
    src String N/A The source of the image
    filters Object { saturation: 1, contrast: 1, brightness: 0 } The values for the filters to apply
    crop Boolean false Whether to crop the image on scaling (this is obviously ignored if the aspect ratio is not locked)
    lockAspectRatio Boolean true Whether to lock the aspect ratio on scaling

    Why not use CSS filters?

    Because IE11 doesn't support them...

    Supported filters

    Adding more filters just a matter of implementing the respective filter function, though.

    Installation

    • git clone <repository-url> this repository
    • cd ember-filter-image
    • npm install
    • bower install

    Running

    Running Tests

    • npm test (Runs ember try:each to test your addon against multiple Ember versions)
    • ember test
    • ember test --server

    Building

    • ember build

    For more information on using ember-cli, visit http://ember-cli.com/.

    Install

    npm i ember-filter-image

    DownloadsWeekly Downloads

    5

    Version

    0.4.3

    License

    MIT

    Last publish

    Collaborators

    • velrest
    • anehx
    • czosel
    • dave_v
    • yelinz
    • kaldras