/// Общие стили круглых датчиков прохождения "кноб"
$(function() {
  var f, l, m, h = Math.max,
    k = Math.min;
  f = {};
  f.d = $(document);
  f.t = function(a) {
    return a.originalEvent.touches.length - 1
  };
  l = function() {
    var a = this;
    this.cv = this.v = this.g = this.i = this.$ = this.o = null;
    this.y = this.x = 0;
    this.c = this.$c = null;
    this.t = 0;
    this.isInit = !1;
    this.rH = this.eH = this.cH = this.dH = this.pColor = this.fgColor = null;
    this.run = function() {
      var b = function(b, d) {
        for (var e in d) a.o[e] = d[e];
        a.init();
        a._configure()._draw()
      };
      if (!this.$.data("kontroled")) return this.$.data("kontroled", !0), this.extend(), this.o = $.extend({
        min: this.$.data("min") || 0,
        max: this.$.data("max") || 100,
        stopper: !0,
        readOnly: this.$.data("readonly"),
        cursor: !0 === this.$.data("cursor") && 30 || this.$.data("cursor") || 0,
        thickness: this.$.data("thickness") || 0.35,
        width: this.$.data("width") || 200,
        height: this.$.data("height") || 200,
        displayInput: null == this.$.data("displayinput") || this.$.data("displayinput"),
        displayPrevious: this.$.data("displayprevious"),
        fgColor: this.$.data("fgcolor") || "#87CEEB",
        inline: !1,
        draw: null,
        change: null,
        cancel: null,
        release: null
      }, this.o), this.$.is("fieldset") ? (this.v = {}, this.i = this.$.find("input"), this.i.each(function(b) {
        var d = $(this);
        a.i[b] = d;
        a.v[b] = d.val();
        d.bind("change", function() {
          var e = {};
          e[b] = d.val();
          a.val(e)
        })
      }), this.$.find("legend").remove()) : (this.i = this.$, this.v = this.$.val(), "" == this.v && (this.v = this.o.min), this.$.bind("change", function() {
        a.val(a.$.val())
      })), !this.o.displayInput && this.$.hide(), this.$c = $('<canvas width="' + this.o.width + 'px" height="' + this.o.height + 'px"></canvas>'), this.c = this.$c[0].getContext("2d"), this.$.wrap($('<div style="' + (this.o.inline ? "display:inline;" : "") + "width:" + this.o.width + "px;height:" + this.o.height + 'px;"></div>')).before(this.$c), this.v instanceof Object ? (this.cv = {}, this.copy(this.v, this.cv)) : this.cv = this.v, this.$.bind("configure", b).parent().bind("configure", b), this._listen()._configure()._xy().init(), this.isInit = !0, this._draw(), this
    };
    this._draw = function() {
      var b = !0,
        c = document.createElement("canvas");
      c.width = a.o.width;
      c.height = a.o.height;
      a.g = c.getContext("2d");
      a.clear();
      a.dH && (b = a.dH());
      !1 !== b && a.draw();
      a.c.drawImage(c, 0, 0)
    };
    this._touch = function(b) {
      var c = function(b) {
        b = a.xy2val(b.originalEvent.touches[a.t].pageX, b.originalEvent.touches[a.t].pageY);
        b == a.cv || a.cH && !1 === a.cH(b) || (a.change(b), a._draw())
      };
      this.t = f.t(b);
      c(b);
      f.d.bind("touchmove.k", c).bind("touchend.k", function() {
        f.d.unbind("touchmove.k touchend.k");
        a.rH && !1 === a.rH(a.cv) || a.val(a.cv)
      });
      return this
    };
    this._mouse = function(b) {
      var c = function(b) {
        b = a.xy2val(b.pageX, b.pageY);
        b == a.cv || a.cH && !1 === a.cH(b) || (a.change(b), a._draw())
      };
      c(b);
      f.d.bind("mousemove.k", c).bind("keyup.k", function(b) {
        27 === b.keyCode && (f.d.unbind("mouseup.k mousemove.k keyup.k"), a.eH && !1 === a.eH() || a.cancel())
      }).bind("mouseup.k", function(b) {
        f.d.unbind("mousemove.k mouseup.k keyup.k");
        a.rH && !1 === a.rH(a.cv) || a.val(a.cv)
      });
      return this
    };
    this._xy = function() {
      var a = this.$c.offset();
      this.x = a.left;
      this.y = a.top;
      return this
    };
    this._listen = function() {
      this.o.readOnly ? this.$.attr("readonly", "readonly") : (this.$c.bind("mousedown", function(b) {
        b.preventDefault();
        a._xy()._mouse(b)
      }).bind("touchstart", function(b) {
        b.preventDefault();
        a._xy()._touch(b)
      }), this.listen());
      return this
    };
    this._configure = function() {
      this.o.draw && (this.dH = this.o.draw);
      this.o.change && (this.cH = this.o.change);
      this.o.cancel && (this.eH = this.o.cancel);
      this.o.release && (this.rH = this.o.release);
      this.o.displayPrevious ? (this.pColor = this.h2rgba(this.o.fgColor, "0.4"), this.fgColor = this.h2rgba(this.o.fgColor, "0.6")) : this.fgColor = this.o.fgColor;
      return this
    };
    this._clear = function() {
      this.$c[0].width = this.$c[0].width
    };
    this.listen = function() {};
    this.extend = function() {};
    this.init = function() {};
    this.change = function(a) {};
    this.val = function(a) {};
    this.xy2val = function(a, c) {};
    this.draw = function() {};
    this.clear = function() {
      this._clear()
    };
    this.h2rgba = function(a, c) {
      var d;
      a = a.substring(1, 7);
      d = [parseInt(a.substring(0, 2), 16), parseInt(a.substring(2, 4), 16), parseInt(a.substring(4, 6), 16)];
      return "rgba(" + d[0] + "," + d[1] + "," + d[2] + "," + c + ")"
    };
    this.copy = function(a, c) {
      for (var d in a) c[d] = a[d]
    }
  };
  m = function() {
    l.call(this);
    this.w2 = this.cursorExt = this.lineWidth = this.radius = this.xy = this.startAngle = null;
    this.PI2 = 2 * Math.PI;
    this.extend = function() {
      this.o = $.extend({
        bgColor: this.$.data("bgcolor") || "#38C59A",
        angleOffset: this.$.data("angleoffset") || 0,
        angleArc: this.$.data("anglearc") || 360,
        inline: !0
      }, this.o)
    };
    this.val = function(a) {
      if (null != a) this.v = this.cv = this.o.stopper ? h(k(a, this.o.max), this.o.min) : a, this.$.val(this.v), this._draw();
      else return this.v
    };
    this.xy2val = function(a, b) {
      var c;
      c = Math.atan2(a - (this.x + this.w2), -(b - this.y - this.w2)) - this.angleOffset;
      this.angleArc != this.PI2 && 0 > c && -0.5 < c ? c = 0 : 0 > c && (c += this.PI2);
      c = ~~(0.5 + c * (this.o.max - this.o.min) / this.angleArc) + this.o.min;
      this.o.stopper && (c = h(k(c, this.o.max), this.o.min));
      return c
    };
    this.listen = function() {
      var a = this,
        b = function(b) {
          b.preventDefault();
          var c = b.originalEvent;
          b = c.detail || c.wheelDeltaX;
          c = c.detail || c.wheelDeltaY;
          b = parseInt(a.$.val()) + (0 < b || 0 < c ? 1 : 0 > b || 0 > c ? -1 : 0);
          a.cH && !1 === a.cH(b) || a.val(b)
        },
        c, d, e = 1,
        f = {
          37: -1,
          38: 1,
          39: 1,
          40: -1
        };
      this.$.bind("keydown", function(b) {
        var g = b.keyCode;
        c = parseInt(String.fromCharCode(g));
        isNaN(c) && (13 !== g && 8 !== g && 9 !== g && 189 !== g && b.preventDefault(), -1 < $.inArray(g, [37, 38, 39, 40]) && (b.preventDefault(), b = parseInt(a.$.val()) + f[g] * e, a.o.stopper && (b = h(k(b, a.o.max), a.o.min)), a.change(b), a._draw(), d = window.setTimeout(function() {
          e *= 2
        }, 30)))
      }).bind("keyup", function(b) {
        isNaN(c) ? d && (window.clearTimeout(d), d = null, e = 1, a.val(a.$.val())) : a.$.val() > a.o.max && a.$.val(a.o.max) || a.$.val() < a.o.min && a.$.val(a.o.min)
      });
      this.$c.bind("mousewheel DOMMouseScroll", b);
      this.$.bind("mousewheel DOMMouseScroll", b)
    };
    this.init = function() {
      if (this.v < this.o.min || this.v > this.o.max) this.v = this.o.min;
      this.$.val(this.v);
      this.w2 = this.o.width / 2;
      this.cursorExt = this.o.cursor / 100;
      this.xy = this.w2;
      this.lineWidth = this.xy * this.o.thickness;
      this.radius = this.xy - this.lineWidth / 2;
      this.o.angleOffset && (this.o.angleOffset = isNaN(this.o.angleOffset) ? 0 : this.o.angleOffset);
      this.o.angleArc && (this.o.angleArc = isNaN(this.o.angleArc) ? this.PI2 : this.o.angleArc);
      this.angleOffset = this.o.angleOffset * Math.PI / 180;
      this.angleArc = this.o.angleArc * Math.PI / 180;
      this.startAngle = 1.5 * Math.PI + this.angleOffset;
      this.endAngle = 1.5 * Math.PI + this.angleOffset + this.angleArc;
      h(String(Math.abs(this.o.max)).length, String(Math.abs(this.o.min)).length, 2);
      this.o.displayInput && this.i.css({
        width: (this.o.width / 2 + 4 >> 0) + "px",
        height: (this.o.width / 3 >> 0) + "px",
        position: "absolute",
        "vertical-align": "middle",
        "margin-top": (this.o.width / 3 >> 0) + "px",
        "margin-left": "-" + (3 * this.o.width / 4 + 2 >> 0) + "px",
        border: 0,
        background: "none",
        "text-align": "center",
        padding: "0px",
        "-webkit-appearance": "none"
      }) || this.i.css({
        width: "0px",
        visibility: "hidden"
      })
    };
    this.change = function(a) {
      this.cv = a;
      this.$.val(a)
    };
    this.angle = function(a) {
      return (a - this.o.min) * this.angleArc / (this.o.max - this.o.min)
    };
    this.draw = function() {
      var a = this.g,
        b = this.angle(this.cv),
        c = this.startAngle,
        b = c + b,
        d, e;
      d = 1;
      a.lineWidth = this.lineWidth;
      this.o.cursor && (c = b - this.cursorExt) && (b += this.cursorExt);
      a.beginPath();
      a.strokeStyle = this.o.bgColor;
      a.arc(this.xy, this.xy, this.radius, this.endAngle, this.startAngle, !0);
      a.stroke();
      this.o.displayPrevious && (e = this.startAngle + this.angle(this.v), d = this.startAngle, this.o.cursor && (d = e - this.cursorExt) && (e += this.cursorExt), a.beginPath(), a.strokeStyle = this.pColor, a.arc(this.xy, this.xy, this.radius, d, e, !1), a.stroke(), d = this.cv == this.v);
      a.beginPath();
      a.strokeStyle = d ? this.o.fgColor : this.fgColor;
      a.arc(this.xy, this.xy, this.radius, c, b, !1);
      a.stroke()
    };
    this.cancel = function() {
      this.val(this.v)
    }
  };
  $.fn.dial = $.fn.knob = function(a) {
    return this.each(function() {
      var b = new m;
      b.o = a;
      b.$ = $(this);
      b.run()
    }).parent()
  }
});

/// Датчик прохождения кареры, верх в левом боковом меню пользователя.
$(document).ready(function(){
    $('.knob').knob({
        readOnly: true,
        width: 70,
        height: 70,
        fgColor: '#3b444b',
        Color: '#3b444b',
        max: 1000
    });
});
