{"version":3,"sources":["https://lively-kernel.org/lively4/BP2019RH1/scratch/drawFreehand/drawFreehand.js"],"names":["boundDraw","boundSetPosition","boundSignalDrawStop","FreehandDrawer","constructor","parentElement","canvas","pos","x","y","ctx","getContext","lastLinePoints","listeners","_draw","bind","_setPosition","_signalDrawStop","start","addEventListener","stop","removeEventListener","addListener","listener","push","e","offsetX","offsetY","buttons","beginPath","lineWidth","lineCap","strokeStyle","moveTo","lineTo","stroke","forEach","drawFinished"],"mappings":";;;;;;;;AAAA;AACA,UAAIA,iHAAJ;;;;;;;;;;;;;;AACA,UAAIC,+HAAJ;;;;;;;;;;;;;;AACA,UAAIC,qIAAJ;;;;;;;;;;;;;;;AAEe,YAAMC,cAAN,CAAqB;AAClCC,oBAAYC,aAAZ,EAA2BC,MAA3B,EAAmC;AACjC,eAAKD,aAAL,GAAqBA,aAArB;AACA,eAAKC,MAAL,GAAcA,MAAd;AACA,eAAKC,GAAL,GAAW,EAAEC,GAAG,CAAL,EAAQC,GAAG,CAAX,EAAX;AACA,eAAKC,GAAL,GAAWJ,OAAOK,UAAP,CAAkB,IAAlB,CAAX;AACA,eAAKC,cAAL,GAAsB,EAAtB;;AAEA,eAAKC,SAAL,GAAiB,EAAjB;;AAEA,kHAAY,KAAKC,KAAL,CAAWC,IAAX,CAAgB,IAAhB,CAAZ;AACA,yHAAmB,KAAKC,YAAL,CAAkBD,IAAlB,CAAuB,IAAvB,CAAnB;AACA,4HAAsB,KAAKE,eAAL,CAAqBF,IAArB,CAA0B,IAA1B,CAAtB;AACD;;AAEDG,gBAAQ;AACN,eAAKb,aAAL,CAAmBc,gBAAnB,CAAoC,WAApC,EAAiDnB,SAAjD;AACA,eAAKK,aAAL,CAAmBc,gBAAnB,CAAoC,WAApC,EAAiDlB,gBAAjD;AACA,eAAKI,aAAL,CAAmBc,gBAAnB,CAAoC,SAApC,EAA+CjB,mBAA/C;AACD;;AAEDkB,eAAO;AACL,eAAKf,aAAL,CAAmBgB,mBAAnB,CAAuC,WAAvC,EAAoDrB,SAApD;AACA,eAAKK,aAAL,CAAmBgB,mBAAnB,CAAuC,WAAvC,EAAoDpB,gBAApD;AACA,eAAKI,aAAL,CAAmBgB,mBAAnB,CAAuC,SAAvC,EAAkDnB,mBAAlD;AACD;;AAEDoB,oBAAYC,QAAZ,EAAsB;AACpB,eAAKV,SAAL,CAAeW,IAAf,CAAoBD,QAApB;AACD;;AAEDP,qBAAaS,CAAb,EAAgB;AACd,eAAKlB,GAAL,CAASC,CAAT,GAAaiB,EAAEC,OAAf;AACA,eAAKnB,GAAL,CAASE,CAAT,GAAagB,EAAEE,OAAf;AACD;;AAEDb,cAAMW,CAAN,EAAS;AACP;AACA,cAAIA,EAAEG,OAAF,KAAc,CAAlB,EAAqB;;AAErB,eAAKlB,GAAL,CAASmB,SAAT,CAAqB;;AAArB,aAEA,KAAKnB,GAAL,CAASoB,SAAT,GAAqB,CAArB;AACA,eAAKpB,GAAL,CAASqB,OAAT,GAAmB,OAAnB;AACA,eAAKrB,GAAL,CAASsB,WAAT,GAAuB,SAAvB;;AAEA,eAAKtB,GAAL,CAASuB,MAAT,CAAgB,KAAK1B,GAAL,CAASC,CAAzB,EAA4B,KAAKD,GAAL,CAASE,CAArC,CAAwC;AAAxC,YACA,KAAKG,cAAL,CAAoBY,IAApB,CAAyB,EAAC,KAAK,KAAKjB,GAAL,CAASC,CAAf,EAAkB,KAAK,KAAKD,GAAL,CAASE,CAAhC,EAAzB;;AAEA,eAAKO,YAAL,CAAkBS,CAAlB;AACA,eAAKf,GAAL,CAASwB,MAAT,CAAgB,KAAK3B,GAAL,CAASC,CAAzB,EAA4B,KAAKD,GAAL,CAASE,CAArC,CAAwC;;AAAxC,YAEA,KAAKC,GAAL,CAASyB,MAAT,CAAkB;AAAlB;AACD;;AAEDlB,0BAAkB;AAChB,eAAKL,cAAL,CAAoBY,IAApB,CAAyB,KAAKjB,GAA9B;;AAEA,eAAKM,SAAL,CAAeuB,OAAf,CAAuBb,YAAY;AACjCA,qBAASc,YAAT,CAAsB,KAAKzB,cAA3B;AACD,WAFD;;AAIA,eAAKA,cAAL,GAAsB,EAAtB;AACD;AA/DiC;;yBAAfT,c","file":"drawFreehand.js","sourcesContent":["// needed to be able to call functions called with event listener with the context of FreehandDrawer and not the context of the element to which the event listener is bound\nvar boundDraw\nvar boundSetPosition\nvar boundSignalDrawStop\n\nexport default class FreehandDrawer {\n  constructor(parentElement, canvas) {\n    this.parentElement = parentElement\n    this.canvas = canvas\n    this.pos = { x: 0, y: 0}\n    this.ctx = canvas.getContext('2d')\n    this.lastLinePoints = []\n    \n    this.listeners = []\n    \n    boundDraw = this._draw.bind(this)\n    boundSetPosition = this._setPosition.bind(this)\n    boundSignalDrawStop = this._signalDrawStop.bind(this)\n  }\n  \n  start() {\n    this.parentElement.addEventListener('mousemove', boundDraw)\n    this.parentElement.addEventListener('mousedown', boundSetPosition);\n    this.parentElement.addEventListener('mouseup', boundSignalDrawStop)\n  }\n  \n  stop() {\n    this.parentElement.removeEventListener('mousemove', boundDraw)\n    this.parentElement.removeEventListener('mousedown', boundSetPosition)\n    this.parentElement.removeEventListener('mouseup', boundSignalDrawStop)\n  }\n  \n  addListener(listener) {\n    this.listeners.push(listener)\n  }\n  \n  _setPosition(e) {\n    this.pos.x = e.offsetX;\n    this.pos.y = e.offsetY;\n  }\n  \n  _draw(e) {\n    // mouse left button must be pressed\n    if (e.buttons !== 1) return\n\n    this.ctx.beginPath() // begin\n\n    this.ctx.lineWidth = 5\n    this.ctx.lineCap = 'round'\n    this.ctx.strokeStyle = '#c0392b'\n    \n    this.ctx.moveTo(this.pos.x, this.pos.y) // from\n    this.lastLinePoints.push({\"x\": this.pos.x, \"y\": this.pos.y})\n    \n    this._setPosition(e);\n    this.ctx.lineTo(this.pos.x, this.pos.y) // to\n\n    this.ctx.stroke() // draw it!\n  }\n\n  _signalDrawStop() {\n    this.lastLinePoints.push(this.pos)\n    \n    this.listeners.forEach(listener => {\n      listener.drawFinished(this.lastLinePoints)\n    })\n    \n    this.lastLinePoints = []\n  } \n}"]}