ProgressBar.fan

//
// Copyright (c) 2016, Brian Frank and Andy Frank
// Licensed under the Academic Free License version 3.0
//
// History:
//   12 May 2016  Andy Frank  Creation
//

using dom

**
** ProgressBar visualizes progress of a long running operation
**
** See also: [docDomkit]`docDomkit::Controls#progressBar`
**
@Js class ProgressBar : Elem
{
  new make(|This|? f := null) : super("div")
  {
    this.style.addClass("domkit-control domkit-control-button domkit-ProgressBar")
    if (f != null) f(this)
    update
  }

  ** Min progress value.
  Int min := 0
  {
    set
    {
      &min = it
      update
    }
  }

  ** Max progress value.
  Int max := 100
  {
    set
    {
      &max = it
      update
    }
  }

  ** Current progress value.
  Int val := 0
  {
    set
    {
      &val = it.max(min).min(max)
      update
    }
  }

  ** Callback to get progress bar text when `val` is modified.
  Void onText(|ProgressBar->Str| f) { this.cbText=f }

  ** Callback to get progress bar color (as CSS color value) when `val` is modified.
  Void onBarColor(|ProgressBar->Str| f) { this.cbBarColor=f }

  private Void update()
  {
    // text
    this.text = cbText==null ? "" : cbText(this)

    // bar style
    color  := cbBarColor== null ? "#3498db" : cbBarColor(this)
    offset := ((val-min).toFloat / (max-min).toFloat * 100f).toInt
    this.style->background = "linear-gradient(left, $color ${offset}%, $color ${offset}%, #fff ${offset}%)"
  }

  private Func? cbText
  private Func? cbBarColor
}
Fantom
