⌈⌋ ⎇ branch:  Bitrhythm


Hex Artifact Content

Artifact ec17133aa32ad2d508ddd19fbe8a56eee48e3b1d231e1adc25b7034e467ce668:


0000: 0a 27 75 73 65 20 73 74 72 69 63 74 27 3b 0a 0a  .'use strict';..
0010: 6c 65 74 20 73 76 67 20 3d 20 72 65 71 75 69 72  let svg = requir
0020: 65 28 27 2e 2e 2f 75 74 69 6c 2f 73 76 67 27 29  e('../util/svg')
0030: 3b 0a 6c 65 74 20 49 6e 74 65 72 66 61 63 65 20  ;.let Interface 
0040: 3d 20 72 65 71 75 69 72 65 28 27 2e 2e 2f 63 6f  = require('../co
0050: 72 65 2f 69 6e 74 65 72 66 61 63 65 27 29 3b 0a  re/interface');.
0060: 6c 65 74 20 53 74 65 70 20 3d 20 72 65 71 75 69  let Step = requi
0070: 72 65 28 27 2e 2e 2f 6d 6f 64 65 6c 73 2f 73 74  re('../models/st
0080: 65 70 27 29 3b 0a 69 6d 70 6f 72 74 20 2a 20 61  ep');.import * a
0090: 73 20 49 6e 74 65 72 61 63 74 69 6f 6e 20 66 72  s Interaction fr
00a0: 6f 6d 20 27 2e 2e 2f 75 74 69 6c 2f 69 6e 74 65  om '../util/inte
00b0: 72 61 63 74 69 6f 6e 27 3b 0a 0a 2f 2a 2a 0a 2a  raction';../**.*
00c0: 20 50 6f 73 69 74 69 6f 6e 0a 2a 0a 2a 20 40 64   Position.*.* @d
00d0: 65 73 63 72 69 70 74 69 6f 6e 20 54 77 6f 2d 64  escription Two-d
00e0: 69 6d 65 6e 73 69 6f 6e 61 6c 20 74 6f 75 63 68  imensional touch
00f0: 20 73 6c 69 64 65 72 2e 0a 2a 0a 2a 20 40 64 65   slider..*.* @de
0100: 6d 6f 20 3c 73 70 61 6e 20 6e 65 78 75 73 2d 75  mo <span nexus-u
0110: 69 3d 22 70 6f 73 69 74 69 6f 6e 22 3e 3c 2f 73  i="position"></s
0120: 70 61 6e 3e 0a 2a 0a 2a 20 40 65 78 61 6d 70 6c  pan>.*.* @exampl
0130: 65 0a 2a 20 76 61 72 20 70 6f 73 69 74 69 6f 6e  e.* var position
0140: 20 3d 20 6e 65 77 20 4e 65 78 75 73 2e 50 6f 73   = new Nexus.Pos
0150: 69 74 69 6f 6e 28 27 23 74 61 72 67 65 74 27 29  ition('#target')
0160: 0a 2a 0a 2a 20 40 65 78 61 6d 70 6c 65 0a 2a 20  .*.* @example.* 
0170: 76 61 72 20 70 6f 73 69 74 69 6f 6e 20 3d 20 6e  var position = n
0180: 65 77 20 4e 65 78 75 73 2e 50 6f 73 69 74 69 6f  ew Nexus.Positio
0190: 6e 28 27 23 74 61 72 67 65 74 27 2c 7b 0a 2a 20  n('#target',{.* 
01a0: 20 20 27 73 69 7a 65 27 3a 20 5b 32 30 30 2c 32    'size': [200,2
01b0: 30 30 5d 2c 0a 2a 20 20 20 27 6d 6f 64 65 27 3a  00],.*   'mode':
01c0: 20 27 61 62 73 6f 6c 75 74 65 27 2c 20 20 2f 2f   'absolute',  //
01d0: 20 22 61 62 73 6f 6c 75 74 65 22 20 6f 72 20 22   "absolute" or "
01e0: 72 65 6c 61 74 69 76 65 22 0a 2a 20 20 20 27 78  relative".*   'x
01f0: 27 3a 20 30 2e 35 2c 20 20 2f 2f 20 69 6e 69 74  ': 0.5,  // init
0200: 69 61 6c 20 78 20 76 61 6c 75 65 0a 2a 20 20 20  ial x value.*   
0210: 27 6d 69 6e 58 27 3a 20 30 2c 0a 2a 20 20 20 27  'minX': 0,.*   '
0220: 6d 61 78 58 27 3a 20 31 2c 0a 2a 20 20 20 27 73  maxX': 1,.*   's
0230: 74 65 70 58 27 3a 20 30 2c 0a 2a 20 20 20 27 79  tepX': 0,.*   'y
0240: 27 3a 20 30 2e 35 2c 20 20 2f 2f 20 69 6e 69 74  ': 0.5,  // init
0250: 69 61 6c 20 79 20 76 61 6c 75 65 0a 2a 20 20 20  ial y value.*   
0260: 27 6d 69 6e 59 27 3a 20 30 2c 0a 2a 20 20 20 27  'minY': 0,.*   '
0270: 6d 61 78 59 27 3a 20 31 2c 0a 2a 20 20 20 27 73  maxY': 1,.*   's
0280: 74 65 70 59 27 3a 20 30 0a 2a 20 7d 29 0a 2a 0a  tepY': 0.* }).*.
0290: 2a 20 40 6f 75 74 70 75 74 0a 2a 20 63 68 61 6e  * @output.* chan
02a0: 67 65 0a 2a 20 46 69 72 65 73 20 61 6e 79 20 74  ge.* Fires any t
02b0: 69 6d 65 20 74 68 65 20 69 6e 74 65 72 66 61 63  ime the interfac
02c0: 65 27 73 20 76 61 6c 75 65 20 63 68 61 6e 67 65  e's value change
02d0: 73 2e 20 3c 62 72 3e 0a 2a 20 54 68 65 20 65 76  s. <br>.* The ev
02e0: 65 6e 74 20 64 61 74 61 20 69 73 20 61 6e 20 6f  ent data is an o
02f0: 62 6a 65 63 74 20 77 69 74 68 20 78 20 61 6e 64  bject with x and
0300: 20 79 20 70 72 6f 70 65 72 74 69 65 73 20 63 6f   y properties co
0310: 6e 74 61 69 6e 69 6e 67 20 74 68 65 20 78 20 61  ntaining the x a
0320: 6e 64 20 79 20 76 61 6c 75 65 73 20 6f 66 20 74  nd y values of t
0330: 68 65 20 69 6e 74 65 72 66 61 63 65 2e 0a 2a 0a  he interface..*.
0340: 2a 20 40 6f 75 74 70 75 74 65 78 61 6d 70 6c 65  * @outputexample
0350: 0a 2a 20 70 6f 73 69 74 69 6f 6e 2e 6f 6e 28 27  .* position.on('
0360: 63 68 61 6e 67 65 27 2c 66 75 6e 63 74 69 6f 6e  change',function
0370: 28 76 29 20 7b 0a 2a 20 20 20 63 6f 6e 73 6f 6c  (v) {.*   consol
0380: 65 2e 6c 6f 67 28 76 29 3b 0a 2a 20 7d 29 0a 2a  e.log(v);.* }).*
0390: 0a 2a 0a 2a 2f 0a 0a 65 78 70 6f 72 74 20 64 65  .*.*/..export de
03a0: 66 61 75 6c 74 20 63 6c 61 73 73 20 50 6f 73 69  fault class Posi
03b0: 74 69 6f 6e 20 65 78 74 65 6e 64 73 20 49 6e 74  tion extends Int
03c0: 65 72 66 61 63 65 20 7b 0a 0a 20 20 63 6f 6e 73  erface {..  cons
03d0: 74 72 75 63 74 6f 72 28 29 20 7b 0a 0a 20 20 20  tructor() {..   
03e0: 20 6c 65 74 20 6f 70 74 69 6f 6e 73 20 3d 20 5b   let options = [
03f0: 27 76 61 6c 75 65 27 5d 3b 0a 0a 20 20 20 20 6c  'value'];..    l
0400: 65 74 20 64 65 66 61 75 6c 74 73 20 3d 20 7b 0a  et defaults = {.
0410: 20 20 20 20 20 20 27 73 69 7a 65 27 3a 20 5b 32        'size': [2
0420: 30 30 2c 32 30 30 5d 2c 0a 20 20 20 20 20 20 27  00,200],.      '
0430: 6d 6f 64 65 27 3a 20 27 61 62 73 6f 6c 75 74 65  mode': 'absolute
0440: 27 2c 0a 20 20 20 20 20 20 27 6d 69 6e 58 27 3a  ',.      'minX':
0450: 20 30 2c 0a 20 20 20 20 20 20 27 6d 61 78 58 27   0,.      'maxX'
0460: 3a 20 31 2c 0a 20 20 20 20 20 20 27 73 74 65 70  : 1,.      'step
0470: 58 27 3a 20 30 2c 0a 20 20 20 20 20 20 27 78 27  X': 0,.      'x'
0480: 3a 20 30 2e 35 2c 0a 20 20 20 20 20 20 27 6d 69  : 0.5,.      'mi
0490: 6e 59 27 3a 20 30 2c 0a 20 20 20 20 20 20 27 6d  nY': 0,.      'm
04a0: 61 78 59 27 3a 20 31 2c 0a 20 20 20 20 20 20 27  axY': 1,.      '
04b0: 73 74 65 70 59 27 3a 20 30 2c 0a 20 20 20 20 20  stepY': 0,.     
04c0: 20 27 79 27 3a 20 30 2e 35 0a 20 20 20 20 7d 3b   'y': 0.5.    };
04d0: 0a 0a 20 20 20 20 73 75 70 65 72 28 61 72 67 75  ..    super(argu
04e0: 6d 65 6e 74 73 2c 6f 70 74 69 6f 6e 73 2c 64 65  ments,options,de
04f0: 66 61 75 6c 74 73 29 3b 0a 0a 0a 20 20 20 20 74  faults);...    t
0500: 68 69 73 2e 5f 78 20 3d 20 6e 65 77 20 53 74 65  his._x = new Ste
0510: 70 28 20 74 68 69 73 2e 73 65 74 74 69 6e 67 73  p( this.settings
0520: 2e 6d 69 6e 58 2c 20 74 68 69 73 2e 73 65 74 74  .minX, this.sett
0530: 69 6e 67 73 2e 6d 61 78 58 2c 20 74 68 69 73 2e  ings.maxX, this.
0540: 73 65 74 74 69 6e 67 73 2e 73 74 65 70 58 2c 20  settings.stepX, 
0550: 74 68 69 73 2e 73 65 74 74 69 6e 67 73 2e 78 20  this.settings.x 
0560: 29 3b 0a 20 20 20 20 74 68 69 73 2e 5f 79 20 3d  );.    this._y =
0570: 20 6e 65 77 20 53 74 65 70 28 20 74 68 69 73 2e   new Step( this.
0580: 73 65 74 74 69 6e 67 73 2e 6d 69 6e 59 2c 20 74  settings.minY, t
0590: 68 69 73 2e 73 65 74 74 69 6e 67 73 2e 6d 61 78  his.settings.max
05a0: 59 2c 20 74 68 69 73 2e 73 65 74 74 69 6e 67 73  Y, this.settings
05b0: 2e 73 74 65 70 59 2c 20 74 68 69 73 2e 73 65 74  .stepY, this.set
05c0: 74 69 6e 67 73 2e 79 20 29 3b 0a 0a 20 20 20 20  tings.y );..    
05d0: 74 68 69 73 2e 70 6f 73 69 74 69 6f 6e 20 3d 20  this.position = 
05e0: 7b 0a 20 20 20 20 20 20 78 3a 20 6e 65 77 20 49  {.      x: new I
05f0: 6e 74 65 72 61 63 74 69 6f 6e 2e 48 61 6e 64 6c  nteraction.Handl
0600: 65 28 74 68 69 73 2e 73 65 74 74 69 6e 67 73 2e  e(this.settings.
0610: 6d 6f 64 65 2c 27 68 6f 72 69 7a 6f 6e 74 61 6c  mode,'horizontal
0620: 27 2c 5b 30 2c 74 68 69 73 2e 77 69 64 74 68 5d  ',[0,this.width]
0630: 2c 5b 74 68 69 73 2e 68 65 69 67 68 74 2c 30 5d  ,[this.height,0]
0640: 29 2c 0a 20 20 20 20 20 20 79 3a 20 6e 65 77 20  ),.      y: new 
0650: 49 6e 74 65 72 61 63 74 69 6f 6e 2e 48 61 6e 64  Interaction.Hand
0660: 6c 65 28 74 68 69 73 2e 73 65 74 74 69 6e 67 73  le(this.settings
0670: 2e 6d 6f 64 65 2c 27 76 65 72 74 69 63 61 6c 27  .mode,'vertical'
0680: 2c 5b 30 2c 74 68 69 73 2e 77 69 64 74 68 5d 2c  ,[0,this.width],
0690: 5b 74 68 69 73 2e 68 65 69 67 68 74 2c 30 5d 29  [this.height,0])
06a0: 0a 20 20 20 20 7d 3b 0a 20 20 20 20 74 68 69 73  .    };.    this
06b0: 2e 70 6f 73 69 74 69 6f 6e 2e 78 2e 76 61 6c 75  .position.x.valu
06c0: 65 20 3d 20 74 68 69 73 2e 5f 78 2e 6e 6f 72 6d  e = this._x.norm
06d0: 61 6c 69 7a 65 64 3b 0a 20 20 20 20 74 68 69 73  alized;.    this
06e0: 2e 70 6f 73 69 74 69 6f 6e 2e 79 2e 76 61 6c 75  .position.y.valu
06f0: 65 20 3d 20 74 68 69 73 2e 5f 79 2e 6e 6f 72 6d  e = this._y.norm
0700: 61 6c 69 7a 65 64 3b 0a 0a 20 20 20 20 74 68 69  alized;..    thi
0710: 73 2e 69 6e 69 74 28 29 3b 0a 20 20 20 20 74 68  s.init();.    th
0720: 69 73 2e 72 65 6e 64 65 72 28 29 3b 0a 0a 20 20  is.render();..  
0730: 7d 0a 0a 20 20 62 75 69 6c 64 49 6e 74 65 72 66  }..  buildInterf
0740: 61 63 65 28 29 20 7b 0a 0a 20 20 20 20 74 68 69  ace() {..    thi
0750: 73 2e 6b 6e 6f 62 20 3d 20 73 76 67 2e 63 72 65  s.knob = svg.cre
0760: 61 74 65 28 27 63 69 72 63 6c 65 27 29 3b 0a 20  ate('circle');. 
0770: 20 20 20 74 68 69 73 2e 65 6c 65 6d 65 6e 74 2e     this.element.
0780: 61 70 70 65 6e 64 43 68 69 6c 64 28 74 68 69 73  appendChild(this
0790: 2e 6b 6e 6f 62 29 3b 0a 20 20 20 20 0a 20 20 7d  .knob);.    .  }
07a0: 0a 0a 20 20 73 69 7a 65 49 6e 74 65 72 66 61 63  ..  sizeInterfac
07b0: 65 28 29 20 7b 0a 0a 20 20 20 20 20 20 74 68 69  e() {..      thi
07c0: 73 2e 70 6f 73 69 74 69 6f 6e 2e 78 2e 72 65 73  s.position.x.res
07d0: 69 7a 65 28 5b 30 2c 74 68 69 73 2e 77 69 64 74  ize([0,this.widt
07e0: 68 5d 2c 5b 74 68 69 73 2e 68 65 69 67 68 74 2c  h],[this.height,
07f0: 30 5d 29 3b 0a 20 20 20 20 20 20 74 68 69 73 2e  0]);.      this.
0800: 70 6f 73 69 74 69 6f 6e 2e 79 2e 72 65 73 69 7a  position.y.resiz
0810: 65 28 5b 30 2c 74 68 69 73 2e 77 69 64 74 68 5d  e([0,this.width]
0820: 2c 5b 74 68 69 73 2e 68 65 69 67 68 74 2c 30 5d  ,[this.height,0]
0830: 29 3b 0a 0a 20 20 20 20 20 20 74 68 69 73 2e 5f  );..      this._
0840: 6d 69 6e 44 69 6d 65 6e 73 69 6f 6e 20 3d 20 4d  minDimension = M
0850: 61 74 68 2e 6d 69 6e 28 74 68 69 73 2e 77 69 64  ath.min(this.wid
0860: 74 68 2c 74 68 69 73 2e 68 65 69 67 68 74 29 3b  th,this.height);
0870: 0a 0a 20 20 20 20 20 20 74 68 69 73 2e 6b 6e 6f  ..      this.kno
0880: 62 52 61 64 69 75 73 20 3d 20 7b 0a 20 20 20 20  bRadius = {.    
0890: 20 20 20 20 6f 66 66 3a 20 7e 7e 28 74 68 69 73      off: ~~(this
08a0: 2e 5f 6d 69 6e 44 69 6d 65 6e 73 69 6f 6e 2f 31  ._minDimension/1
08b0: 30 30 29 20 2a 20 35 20 2b 20 35 2c 0a 20 20 20  00) * 5 + 5,.   
08c0: 20 20 20 7d 3b 0a 20 20 20 20 20 20 74 68 69 73     };.      this
08d0: 2e 6b 6e 6f 62 52 61 64 69 75 73 2e 6f 6e 20 3d  .knobRadius.on =
08e0: 20 74 68 69 73 2e 6b 6e 6f 62 52 61 64 69 75 73   this.knobRadius
08f0: 2e 6f 66 66 20 2a 20 32 3b 0a 0a 20 20 20 20 20  .off * 2;..     
0900: 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65 74 41 74   this.knob.setAt
0910: 74 72 69 62 75 74 65 28 27 63 78 27 2c 74 68 69  tribute('cx',thi
0920: 73 2e 77 69 64 74 68 2f 32 29 3b 0a 20 20 20 20  s.width/2);.    
0930: 20 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65 74 41    this.knob.setA
0940: 74 74 72 69 62 75 74 65 28 27 63 79 27 2c 74 68  ttribute('cy',th
0950: 69 73 2e 68 65 69 67 68 74 2f 32 29 3b 0a 20 20  is.height/2);.  
0960: 20 20 20 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65      this.knob.se
0970: 74 41 74 74 72 69 62 75 74 65 28 27 72 27 2c 74  tAttribute('r',t
0980: 68 69 73 2e 6b 6e 6f 62 52 61 64 69 75 73 2e 6f  his.knobRadius.o
0990: 66 66 29 3b 0a 20 20 7d 0a 0a 20 20 63 6f 6c 6f  ff);.  }..  colo
09a0: 72 49 6e 74 65 72 66 61 63 65 28 29 20 7b 0a 20  rInterface() {. 
09b0: 20 20 20 20 20 74 68 69 73 2e 65 6c 65 6d 65 6e       this.elemen
09c0: 74 2e 73 74 79 6c 65 2e 62 61 63 6b 67 72 6f 75  t.style.backgrou
09d0: 6e 64 43 6f 6c 6f 72 20 3d 20 74 68 69 73 2e 63  ndColor = this.c
09e0: 6f 6c 6f 72 73 2e 66 69 6c 6c 3b 0a 20 20 20 20  olors.fill;.    
09f0: 20 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65 74 41    this.knob.setA
0a00: 74 74 72 69 62 75 74 65 28 27 66 69 6c 6c 27 2c  ttribute('fill',
0a10: 20 74 68 69 73 2e 63 6f 6c 6f 72 73 2e 61 63 63   this.colors.acc
0a20: 65 6e 74 29 3b 0a 20 20 7d 0a 0a 20 20 72 65 6e  ent);.  }..  ren
0a30: 64 65 72 28 29 20 7b 0a 20 20 20 20 69 66 20 28  der() {.    if (
0a40: 74 68 69 73 2e 63 6c 69 63 6b 65 64 29 20 7b 0a  this.clicked) {.
0a50: 20 20 20 20 2f 2f 20 20 74 68 69 73 2e 6b 6e 6f      //  this.kno
0a60: 62 52 61 64 69 75 73 20 3d 20 33 30 3b 0a 20 20  bRadius = 30;.  
0a70: 20 20 20 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65      this.knob.se
0a80: 74 41 74 74 72 69 62 75 74 65 28 27 72 27 2c 74  tAttribute('r',t
0a90: 68 69 73 2e 6b 6e 6f 62 52 61 64 69 75 73 2e 6f  his.knobRadius.o
0aa0: 6e 29 3b 0a 20 20 20 20 7d 20 65 6c 73 65 20 7b  n);.    } else {
0ab0: 0a 20 20 20 20 2f 2f 20 20 74 68 69 73 2e 6b 6e  .    //  this.kn
0ac0: 6f 62 52 61 64 69 75 73 20 3d 20 31 35 3b 0a 20  obRadius = 15;. 
0ad0: 20 20 20 20 20 74 68 69 73 2e 6b 6e 6f 62 2e 73       this.knob.s
0ae0: 65 74 41 74 74 72 69 62 75 74 65 28 27 72 27 2c  etAttribute('r',
0af0: 74 68 69 73 2e 6b 6e 6f 62 52 61 64 69 75 73 2e  this.knobRadius.
0b00: 6f 66 66 29 3b 0a 20 20 20 20 7d 0a 0a 20 20 20  off);.    }..   
0b10: 20 74 68 69 73 2e 6b 6e 6f 62 43 6f 6f 72 64 69   this.knobCoordi
0b20: 6e 61 74 65 73 20 3d 20 7b 0a 20 20 20 20 20 20  nates = {.      
0b30: 78 3a 20 74 68 69 73 2e 5f 78 2e 6e 6f 72 6d 61  x: this._x.norma
0b40: 6c 69 7a 65 64 20 2a 20 74 68 69 73 2e 77 69 64  lized * this.wid
0b50: 74 68 2c 0a 20 20 20 20 20 20 79 3a 20 74 68 69  th,.      y: thi
0b60: 73 2e 68 65 69 67 68 74 20 2d 20 74 68 69 73 2e  s.height - this.
0b70: 5f 79 2e 6e 6f 72 6d 61 6c 69 7a 65 64 20 2a 20  _y.normalized * 
0b80: 74 68 69 73 2e 68 65 69 67 68 74 0a 20 20 20 20  this.height.    
0b90: 7d 3b 0a 0a 20 20 20 20 74 68 69 73 2e 6b 6e 6f  };..    this.kno
0ba0: 62 2e 73 65 74 41 74 74 72 69 62 75 74 65 28 27  b.setAttribute('
0bb0: 63 78 27 2c 74 68 69 73 2e 6b 6e 6f 62 43 6f 6f  cx',this.knobCoo
0bc0: 72 64 69 6e 61 74 65 73 2e 78 29 3b 0a 20 20 20  rdinates.x);.   
0bd0: 20 74 68 69 73 2e 6b 6e 6f 62 2e 73 65 74 41 74   this.knob.setAt
0be0: 74 72 69 62 75 74 65 28 27 63 79 27 2c 74 68 69  tribute('cy',thi
0bf0: 73 2e 6b 6e 6f 62 43 6f 6f 72 64 69 6e 61 74 65  s.knobCoordinate
0c00: 73 2e 79 29 3b 0a 20 20 7d 0a 0a 0a 20 20 63 6c  s.y);.  }...  cl
0c10: 69 63 6b 28 29 20 7b 0a 20 20 20 20 74 68 69 73  ick() {.    this
0c20: 2e 70 6f 73 69 74 69 6f 6e 2e 78 2e 61 6e 63 68  .position.x.anch
0c30: 6f 72 20 3d 20 74 68 69 73 2e 6d 6f 75 73 65 3b  or = this.mouse;
0c40: 0a 20 20 20 20 74 68 69 73 2e 70 6f 73 69 74 69  .    this.positi
0c50: 6f 6e 2e 79 2e 61 6e 63 68 6f 72 20 3d 20 74 68  on.y.anchor = th
0c60: 69 73 2e 6d 6f 75 73 65 3b 0a 20 20 20 20 74 68  is.mouse;.    th
0c70: 69 73 2e 6d 6f 76 65 28 29 3b 0a 20 20 7d 0a 0a  is.move();.  }..
0c80: 20 20 6d 6f 76 65 28 29 20 7b 0a 20 20 20 20 69    move() {.    i
0c90: 66 20 28 74 68 69 73 2e 63 6c 69 63 6b 65 64 29  f (this.clicked)
0ca0: 20 7b 0a 20 20 20 20 20 20 74 68 69 73 2e 70 6f   {.      this.po
0cb0: 73 69 74 69 6f 6e 2e 78 2e 75 70 64 61 74 65 28  sition.x.update(
0cc0: 74 68 69 73 2e 6d 6f 75 73 65 29 3b 0a 20 20 20  this.mouse);.   
0cd0: 20 20 20 74 68 69 73 2e 70 6f 73 69 74 69 6f 6e     this.position
0ce0: 2e 79 2e 75 70 64 61 74 65 28 74 68 69 73 2e 6d  .y.update(this.m
0cf0: 6f 75 73 65 29 3b 0a 20 20 20 20 20 20 74 68 69  ouse);.      thi
0d00: 73 2e 5f 78 2e 75 70 64 61 74 65 4e 6f 72 6d 61  s._x.updateNorma
0d10: 6c 28 20 74 68 69 73 2e 70 6f 73 69 74 69 6f 6e  l( this.position
0d20: 2e 78 2e 76 61 6c 75 65 20 29 3b 0a 20 20 20 20  .x.value );.    
0d30: 20 20 74 68 69 73 2e 5f 79 2e 75 70 64 61 74 65    this._y.update
0d40: 4e 6f 72 6d 61 6c 28 20 74 68 69 73 2e 70 6f 73  Normal( this.pos
0d50: 69 74 69 6f 6e 2e 79 2e 76 61 6c 75 65 20 29 3b  ition.y.value );
0d60: 0a 20 20 20 20 20 20 74 68 69 73 2e 65 6d 69 74  .      this.emit
0d70: 28 27 63 68 61 6e 67 65 27 2c 7b 0a 20 20 20 20  ('change',{.    
0d80: 20 20 20 20 78 3a 20 74 68 69 73 2e 5f 78 2e 76      x: this._x.v
0d90: 61 6c 75 65 2c 0a 20 20 20 20 20 20 20 20 79 3a  alue,.        y:
0da0: 20 74 68 69 73 2e 5f 79 2e 76 61 6c 75 65 0a 20   this._y.value. 
0db0: 20 20 20 20 20 7d 29 3b 0a 20 20 20 20 20 20 74       });.      t
0dc0: 68 69 73 2e 72 65 6e 64 65 72 28 29 3b 0a 20 20  his.render();.  
0dd0: 20 20 7d 0a 20 20 7d 0a 0a 20 20 72 65 6c 65 61    }.  }..  relea
0de0: 73 65 28 29 20 7b 0a 20 20 20 20 74 68 69 73 2e  se() {.    this.
0df0: 72 65 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a 20  render();.  }.. 
0e00: 20 2f 2a 2a 0a 20 20 2a 20 54 68 65 20 69 6e 74   /**.  * The int
0e10: 65 72 66 61 63 65 27 73 20 78 20 76 61 6c 75 65  erface's x value
0e20: 2e 20 57 68 65 6e 20 73 65 74 2c 20 69 74 20 77  . When set, it w
0e30: 69 6c 6c 20 61 75 74 6f 6d 61 74 69 63 61 6c 6c  ill automaticall
0e40: 79 20 61 64 6a 75 73 74 20 74 6f 20 66 69 74 20  y adjust to fit 
0e50: 6d 69 6e 2f 6d 61 78 2f 73 74 65 70 20 73 65 74  min/max/step set
0e60: 74 69 6e 67 73 20 6f 66 20 74 68 65 20 69 6e 74  tings of the int
0e70: 65 72 66 61 63 65 2e 0a 20 20 2a 20 40 74 79 70  erface..  * @typ
0e80: 65 20 7b 6f 62 6a 65 63 74 7d 0a 20 20 2a 20 40  e {object}.  * @
0e90: 65 78 61 6d 70 6c 65 20 70 6f 73 69 74 69 6f 6e  example position
0ea0: 2e 78 20 3d 20 30 2e 35 3b 0a 20 20 2a 2f 0a 0a  .x = 0.5;.  */..
0eb0: 20 20 67 65 74 20 78 28 29 20 7b 0a 20 20 20 20    get x() {.    
0ec0: 72 65 74 75 72 6e 20 74 68 69 73 2e 5f 78 2e 76  return this._x.v
0ed0: 61 6c 75 65 3b 0a 20 20 7d 0a 0a 20 20 73 65 74  alue;.  }..  set
0ee0: 20 78 28 76 61 6c 75 65 29 20 7b 0a 20 20 20 20   x(value) {.    
0ef0: 74 68 69 73 2e 5f 78 2e 75 70 64 61 74 65 28 76  this._x.update(v
0f00: 61 6c 75 65 29 3b 0a 20 20 20 20 74 68 69 73 2e  alue);.    this.
0f10: 65 6d 69 74 28 27 63 68 61 6e 67 65 27 2c 7b 0a  emit('change',{.
0f20: 20 20 20 20 20 20 78 3a 20 74 68 69 73 2e 5f 78        x: this._x
0f30: 2e 76 61 6c 75 65 2c 0a 20 20 20 20 20 20 79 3a  .value,.      y:
0f40: 20 74 68 69 73 2e 5f 79 2e 76 61 6c 75 65 0a 20   this._y.value. 
0f50: 20 20 20 7d 29 3b 0a 20 20 20 20 74 68 69 73 2e     });.    this.
0f60: 72 65 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a 20  render();.  }.. 
0f70: 20 2f 2a 2a 0a 20 20 2a 20 54 68 65 20 69 6e 74   /**.  * The int
0f80: 65 72 66 61 63 65 27 73 20 79 20 76 61 6c 75 65  erface's y value
0f90: 73 2e 20 57 68 65 6e 20 73 65 74 2c 20 69 74 20  s. When set, it 
0fa0: 77 69 6c 6c 20 61 75 74 6f 6d 61 74 69 63 61 6c  will automatical
0fb0: 6c 79 20 61 64 6a 75 73 74 20 74 6f 20 66 69 74  ly adjust to fit
0fc0: 20 6d 69 6e 2f 6d 61 78 2f 73 74 65 70 20 73 65   min/max/step se
0fd0: 74 74 69 6e 67 73 20 6f 66 20 74 68 65 20 69 6e  ttings of the in
0fe0: 74 65 72 66 61 63 65 2e 0a 20 20 2a 20 40 74 79  terface..  * @ty
0ff0: 70 65 20 7b 6f 62 6a 65 63 74 7d 0a 20 20 2a 20  pe {object}.  * 
1000: 40 65 78 61 6d 70 6c 65 20 70 6f 73 69 74 69 6f  @example positio
1010: 6e 2e 78 20 3d 20 30 2e 35 3b 0a 20 20 2a 2f 0a  n.x = 0.5;.  */.
1020: 0a 20 20 67 65 74 20 79 28 29 20 7b 0a 20 20 20  .  get y() {.   
1030: 20 72 65 74 75 72 6e 20 74 68 69 73 2e 5f 79 2e   return this._y.
1040: 76 61 6c 75 65 3b 0a 20 20 7d 0a 0a 20 20 73 65  value;.  }..  se
1050: 74 20 79 28 76 61 6c 75 65 29 20 7b 0a 20 20 20  t y(value) {.   
1060: 20 74 68 69 73 2e 5f 79 2e 75 70 64 61 74 65 28   this._y.update(
1070: 76 61 6c 75 65 29 3b 0a 20 20 20 20 74 68 69 73  value);.    this
1080: 2e 65 6d 69 74 28 27 63 68 61 6e 67 65 27 2c 7b  .emit('change',{
1090: 0a 20 20 20 20 20 20 78 3a 20 74 68 69 73 2e 5f  .      x: this._
10a0: 78 2e 76 61 6c 75 65 2c 0a 20 20 20 20 20 20 79  x.value,.      y
10b0: 3a 20 74 68 69 73 2e 5f 79 2e 76 61 6c 75 65 0a  : this._y.value.
10c0: 20 20 20 20 7d 29 3b 0a 20 20 20 20 74 68 69 73      });.    this
10d0: 2e 72 65 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a  .render();.  }..
10e0: 0a 0a 20 20 67 65 74 20 6e 6f 72 6d 61 6c 69 7a  ..  get normaliz
10f0: 65 64 28 29 20 7b 0a 20 20 20 20 72 65 74 75 72  ed() {.    retur
1100: 6e 20 7b 0a 20 20 20 20 20 20 78 3a 20 74 68 69  n {.      x: thi
1110: 73 2e 5f 78 2e 6e 6f 72 6d 61 6c 69 7a 65 64 2c  s._x.normalized,
1120: 0a 20 20 20 20 20 20 79 3a 20 74 68 69 73 2e 5f  .      y: this._
1130: 79 2e 6e 6f 72 6d 61 6c 69 7a 65 64 0a 20 20 20  y.normalized.   
1140: 20 7d 3b 0a 20 20 7d 0a 0a 20 20 2f 2a 2a 0a 20   };.  }..  /**. 
1150: 20 2a 20 54 68 65 20 6c 6f 77 65 72 20 6c 69 6d   * The lower lim
1160: 69 74 20 6f 66 20 76 61 6c 75 65 20 6f 6e 20 74  it of value on t
1170: 68 65 20 78 20 61 78 69 73 0a 20 20 2a 20 40 74  he x axis.  * @t
1180: 79 70 65 20 7b 6f 62 6a 65 63 74 7d 0a 20 20 2a  ype {object}.  *
1190: 2f 0a 20 20 67 65 74 20 6d 69 6e 58 28 29 20 7b  /.  get minX() {
11a0: 0a 20 20 20 20 72 65 74 75 72 6e 20 74 68 69 73  .    return this
11b0: 2e 5f 78 2e 6d 69 6e 3b 0a 20 20 7d 0a 0a 20 20  ._x.min;.  }..  
11c0: 73 65 74 20 6d 69 6e 58 28 76 29 20 7b 0a 20 20  set minX(v) {.  
11d0: 20 20 74 68 69 73 2e 5f 78 2e 6d 69 6e 20 3d 20    this._x.min = 
11e0: 76 3b 0a 20 20 20 20 74 68 69 73 2e 72 65 6e 64  v;.    this.rend
11f0: 65 72 28 29 3b 0a 20 20 7d 0a 0a 20 20 2f 2a 2a  er();.  }..  /**
1200: 0a 20 20 2a 20 54 68 65 20 6c 6f 77 65 72 20 6c  .  * The lower l
1210: 69 6d 69 74 20 6f 66 20 76 61 6c 75 65 20 6f 6e  imit of value on
1220: 20 74 68 65 20 79 20 61 78 69 73 0a 20 20 2a 20   the y axis.  * 
1230: 40 74 79 70 65 20 7b 6f 62 6a 65 63 74 7d 0a 20  @type {object}. 
1240: 20 2a 2f 0a 20 20 67 65 74 20 6d 69 6e 59 28 29   */.  get minY()
1250: 20 7b 0a 20 20 20 20 72 65 74 75 72 6e 20 74 68   {.    return th
1260: 69 73 2e 5f 79 2e 6d 69 6e 3b 0a 20 20 7d 0a 0a  is._y.min;.  }..
1270: 20 20 73 65 74 20 6d 69 6e 59 28 76 29 20 7b 0a    set minY(v) {.
1280: 20 20 20 20 74 68 69 73 2e 5f 79 2e 6d 69 6e 20      this._y.min 
1290: 3d 20 76 3b 0a 20 20 20 20 74 68 69 73 2e 72 65  = v;.    this.re
12a0: 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a 0a 20 20  nder();.  }...  
12b0: 2f 2a 2a 0a 20 20 2a 20 54 68 65 20 75 70 70 65  /**.  * The uppe
12c0: 72 20 6c 69 6d 69 74 20 6f 66 20 76 61 6c 75 65  r limit of value
12d0: 20 6f 6e 20 74 68 65 20 78 20 61 78 69 73 0a 20   on the x axis. 
12e0: 20 2a 20 40 74 79 70 65 20 7b 6f 62 6a 65 63 74   * @type {object
12f0: 7d 0a 20 20 2a 2f 0a 20 20 67 65 74 20 6d 61 78  }.  */.  get max
1300: 58 28 29 20 7b 0a 20 20 20 20 72 65 74 75 72 6e  X() {.    return
1310: 20 74 68 69 73 2e 5f 78 2e 6d 61 78 3b 0a 20 20   this._x.max;.  
1320: 7d 0a 0a 20 20 73 65 74 20 6d 61 78 58 28 76 29  }..  set maxX(v)
1330: 20 7b 0a 20 20 20 20 74 68 69 73 2e 5f 78 2e 6d   {.    this._x.m
1340: 61 78 20 3d 20 76 3b 0a 20 20 20 20 74 68 69 73  ax = v;.    this
1350: 2e 72 65 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a  .render();.  }..
1360: 0a 20 20 2f 2a 2a 0a 20 20 2a 20 54 68 65 20 75  .  /**.  * The u
1370: 70 70 65 72 20 6c 69 6d 69 74 20 6f 66 20 76 61  pper limit of va
1380: 6c 75 65 20 6f 6e 20 74 68 65 20 79 20 61 78 69  lue on the y axi
1390: 73 0a 20 20 2a 20 40 74 79 70 65 20 7b 6f 62 6a  s.  * @type {obj
13a0: 65 63 74 7d 0a 20 20 2a 2f 0a 20 20 67 65 74 20  ect}.  */.  get 
13b0: 6d 61 78 59 28 29 20 7b 0a 20 20 20 20 72 65 74  maxY() {.    ret
13c0: 75 72 6e 20 74 68 69 73 2e 5f 79 2e 6d 61 78 3b  urn this._y.max;
13d0: 0a 20 20 7d 0a 0a 20 20 73 65 74 20 6d 61 78 59  .  }..  set maxY
13e0: 28 76 29 20 7b 0a 20 20 20 20 74 68 69 73 2e 5f  (v) {.    this._
13f0: 79 2e 6d 61 78 20 3d 20 76 3b 0a 20 20 20 20 74  y.max = v;.    t
1400: 68 69 73 2e 72 65 6e 64 65 72 28 29 3b 0a 20 20  his.render();.  
1410: 7d 0a 0a 0a 20 20 2f 2a 2a 0a 20 20 2a 20 54 68  }...  /**.  * Th
1420: 65 20 69 6e 63 72 65 6d 65 6e 74 61 6c 20 73 74  e incremental st
1430: 65 70 20 6f 66 20 76 61 6c 75 65 73 20 6f 6e 20  ep of values on 
1440: 74 68 65 20 78 20 61 78 69 73 0a 20 20 2a 20 40  the x axis.  * @
1450: 74 79 70 65 20 7b 6f 62 6a 65 63 74 7d 0a 20 20  type {object}.  
1460: 2a 2f 0a 20 20 67 65 74 20 73 74 65 70 58 28 29  */.  get stepX()
1470: 20 7b 0a 20 20 20 20 72 65 74 75 72 6e 20 74 68   {.    return th
1480: 69 73 2e 5f 78 2e 73 74 65 70 3b 0a 20 20 7d 0a  is._x.step;.  }.
1490: 0a 20 20 73 65 74 20 73 74 65 70 58 28 76 29 20  .  set stepX(v) 
14a0: 7b 0a 20 20 20 20 74 68 69 73 2e 5f 78 2e 73 74  {.    this._x.st
14b0: 65 70 20 3d 20 76 3b 0a 20 20 20 20 74 68 69 73  ep = v;.    this
14c0: 2e 72 65 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a  .render();.  }..
14d0: 0a 20 20 2f 2a 2a 0a 20 20 2a 20 54 68 65 20 69  .  /**.  * The i
14e0: 6e 63 72 65 6d 65 6e 74 61 6c 20 73 74 65 70 20  ncremental step 
14f0: 6f 66 20 76 61 6c 75 65 73 20 6f 6e 20 74 68 65  of values on the
1500: 20 79 20 61 78 69 73 0a 20 20 2a 20 40 74 79 70   y axis.  * @typ
1510: 65 20 7b 6f 62 6a 65 63 74 7d 0a 20 20 2a 2f 0a  e {object}.  */.
1520: 20 20 67 65 74 20 73 74 65 70 59 28 29 20 7b 0a    get stepY() {.
1530: 20 20 20 20 72 65 74 75 72 6e 20 74 68 69 73 2e      return this.
1540: 5f 79 2e 73 74 65 70 3b 0a 20 20 7d 0a 0a 20 20  _y.step;.  }..  
1550: 73 65 74 20 73 74 65 70 59 28 76 29 20 7b 0a 20  set stepY(v) {. 
1560: 20 20 20 74 68 69 73 2e 5f 79 2e 73 74 65 70 20     this._y.step 
1570: 3d 20 76 3b 0a 20 20 20 20 74 68 69 73 2e 72 65  = v;.    this.re
1580: 6e 64 65 72 28 29 3b 0a 20 20 7d 0a 0a 0a 20 20  nder();.  }...  
1590: 2f 2a 2a 0a 20 20 41 62 73 6f 6c 75 74 65 20 6d  /**.  Absolute m
15a0: 6f 64 65 20 28 70 6f 73 69 74 69 6f 6e 27 73 20  ode (position's 
15b0: 76 61 6c 75 65 20 6a 75 6d 70 73 20 74 6f 20 6d  value jumps to m
15c0: 6f 75 73 65 20 63 6c 69 63 6b 20 70 6f 73 69 74  ouse click posit
15d0: 69 6f 6e 29 20 6f 72 20 72 65 6c 61 74 69 76 65  ion) or relative
15e0: 20 6d 6f 64 65 20 28 6d 6f 75 73 65 20 64 72 61   mode (mouse dra
15f0: 67 20 63 68 61 6e 67 65 73 20 76 61 6c 75 65 20  g changes value 
1600: 72 65 6c 61 74 69 76 65 20 74 6f 20 69 74 73 20  relative to its 
1610: 63 75 72 72 65 6e 74 20 70 6f 73 69 74 69 6f 6e  current position
1620: 29 2e 20 44 65 66 61 75 6c 74 3a 20 22 61 62 73  ). Default: "abs
1630: 6f 6c 75 74 65 22 2e 0a 20 20 40 74 79 70 65 20  olute"..  @type 
1640: 7b 73 74 72 69 6e 67 7d 0a 20 20 40 65 78 61 6d  {string}.  @exam
1650: 70 6c 65 20 70 6f 73 69 74 69 6f 6e 2e 6d 6f 64  ple position.mod
1660: 65 20 3d 20 22 72 65 6c 61 74 69 76 65 22 3b 0a  e = "relative";.
1670: 20 20 2a 2f 0a 20 20 67 65 74 20 6d 6f 64 65 28    */.  get mode(
1680: 29 20 7b 0a 20 20 20 20 72 65 74 75 72 6e 20 74  ) {.    return t
1690: 68 69 73 2e 70 6f 73 69 74 69 6f 6e 2e 78 2e 6d  his.position.x.m
16a0: 6f 64 65 3b 0a 20 20 7d 0a 20 20 73 65 74 20 6d  ode;.  }.  set m
16b0: 6f 64 65 28 76 29 20 7b 0a 20 20 20 20 74 68 69  ode(v) {.    thi
16c0: 73 2e 70 6f 73 69 74 69 6f 6e 2e 78 2e 6d 6f 64  s.position.x.mod
16d0: 65 20 3d 20 76 3b 0a 20 20 20 20 74 68 69 73 2e  e = v;.    this.
16e0: 70 6f 73 69 74 69 6f 6e 2e 79 2e 6d 6f 64 65 20  position.y.mode 
16f0: 3d 20 76 3b 0a 20 20 7d 0a 0a 0a 0a 0a 7d 0a     = v;.  }.....}.