// zprogress (c) 2013 Thomas Fuchs
// MIT-licensed - https://github.com/madrobby/zprogress

;(function($){
  var html =
    '<style>#zprogress{position:fixed;top:0;left:0;width:100%;height:3px;opacity:0;pointer-events:none;-webkit-pointer-events:none;z-index:1000}'+
    '#zprogress_indicator{width:100%;margin-left:-100%;height:100%;background:#1c88ff}'+
    '</style>'+
    '<div id=zprogress><div id=zprogress_indicator></div></div>',
    $wrapper, $indicator, value, timeout,
    MARGIN = 12.5,
    LMARGIN = MARGIN/100,
    RMARGIN = 1 - LMARGIN

  function init(){
    if($wrapper) return

    $('body').append(html)
    $wrapper = $('#zprogress')
    $indicator = $('#zprogress_indicator')
  }

  function anim(){
    $indicator.animate({ translateX: value*100+'%' }, 200)
  }

  function clear(){
    if(timeout) clearTimeout(timeout)
    timeout = undefined
  }

  function trickle(){
    timeout = setTimeout(function(){
      $.zprogress.inc((RMARGIN-value)*.035*Math.random())
      trickle()
    }, 350+(400*Math.random()))
  }

  $.zprogress = {
    start: function(){
      init()
      clear()
      value = LMARGIN
      $wrapper.animate({ opacity: 1 })
      $indicator.animate({ translateX: '0%' }, 0)
      setTimeout(function(){
        anim()
        trickle()
      },0)
    },
    inc: function(delta){
      if(value<RMARGIN) value+=delta||.05
      anim()
    },
    set: function(newValue){
      init()
      clear()
      value = newValue
      anim()
      trickle()
    },
    done: function(){
      init()
      clear()
      value = 1
      anim()
      setTimeout(function(){$wrapper.animate({ opacity: 0 })}, 100)
    },
    color: function(color){
      init()
      $indicator.css({ backgroundColor: color })
    }
  }
})(Zepto)