ember-cli-icon-rating

ember-cli-icon-rating

Description

Rating Input that can use any Font Awesome Icon and defaults to using the star icon

DEMO

Installation

• ember install ember-cli-icon-rating

Usage

• Note: Uses DDAU so no updates are done without an onClick handler

Simplest Case

{{icon-rating
  value=value
  onClick=(action (mut value))
}}

Full Example (Defaults)

{{icon-rating
  min=1
  max=5
  step=1
  value=0
  width=0
  size='lg'
  readOnly=false
  baseIcon='star'
  fillIcon='star'
  baseColor='grey'
  fillColor='gold'
  disableHover=false
  showRatingAbove=false
  showRatingBelow=false
  icon=null // No Defaults for icon
  color=null // No Defaults for color
  onClick=null // No Defaults for onClick
}}

Component Options Available

• min - Minumum icon value
• max - Maximum icon value
• readOnly - handlers will not run
• value - Number of icons selected
• width - Set width of individual icon container
• step - How much each consecutive icon value is
• showRatingAbove - Show Rating value above icon
• showRatingBelow - Show Rating rating below icon
• disableHover - Only update icon / color on click
• size - size of icon, i.e. lg, 2 - 5 (see Font Awesome docs)
• baseIcon - Font awesome icon to be used for the initial state
• fillIcon - Font awesome icon to be used on hover and after selection
• icon - Font Awesome icon to use for rating (overrides baseIcon / fillIcon)
• color - any rgb, hex, string color to be used (overrides baseColor / fillColor)
• baseColor - any rgb, hex, string color to be used as the initial color before selection
• fillColor - any rgb, hex, string color to be used as the hover color and after selection
• onClick - handler that runs when icon is clicked. Note: value does not change automatically

License

MIT license.