{"version":3,"sources":["https://lively-kernel.org/lively4/BP2019RH1/src/internal/individuals-as-points/common/distribution-bar-chart.js"],"names":["Chart","DistributionBarChart","constructor","individuals","key","canvasWidth","canvasHeight","visualization","undefined","dataProcessor","colorStore","canvas","_generateBarChartCanvas","ctx","getContext","labels","distributionData","barBackgroundColors","setDataProcessor","setColorStore","generateCanvas","_generateBarChart","_generateLabels","_generateDistributionData","_generateBarBackgroundColors","_generateChart","getValuesForAttribute","forEach","label","individual","getUniqueValueFromIndividual","push","map","getColorForValue","backgroundColor","convertColorObjectToRGBAHexString","type","data","datasets","Object","keys","length","options","title","display","text","responsive","scales","xAxes","ticks","maxRotation","minRotation","yAxes","beginAtZero","onClick","event","activeChartElements","clickedBar","dispatchEvent","CustomEvent","detail","freehandSelectionSVGElement","clientX","clientY","individualsSelection","selectedIndividuals","_model","selectionColor","bubbles","width","height"],"mappings":";;;;;;;;;;;AAAOA,W;;;;;;;;;;;;;;;;;;AAEQ,YAAMC,oBAAN,CAA2B;AACxCC,oBAAYC,WAAZ,EAAyBC,GAAzB,EAA8BC,WAA9B,EAA2CC,YAA3C,EAAyDC,gBAAcC,SAAvE,EAAkF;AAChF,eAAKC,aAAL,GAAqBD,SAArB;AACA,eAAKE,UAAL,GAAkBF,SAAlB;;AAEA,eAAKD,aAAL,GAAqBA,aAArB;AACA,eAAKJ,WAAL,GAAmBA,WAAnB;AACA,eAAKC,GAAL,GAAWA,GAAX;AACA,eAAKC,WAAL,GAAmBA,WAAnB;AACA,eAAKC,YAAL,GAAoBA,YAApB;;AAEA,eAAKK,MAAL,GAAc,KAAKC,uBAAL,EAAd;AACA,eAAKC,GAAL,GAAW,KAAKF,MAAL,CAAYG,UAAZ,CAAuB,IAAvB,CAAX;;AAEA,eAAKC,MAAL,GAAc,EAAd;AACA,eAAKC,gBAAL,GAAwB,EAAxB;AACA,eAAKC,mBAAL,GAA2B,EAA3B;AACD;;AAED;AACA;AACA;;AAEAC,yBAAiBT,aAAjB,EAAgC;AAC9B,eAAKA,aAAL,GAAqBA,aAArB;AACD;;AAEDU,sBAAcT,UAAd,EAA0B;AACxB,eAAKA,UAAL,GAAkBA,UAAlB;AACD;;AAEDU,yBAAiB;AACf,eAAKC,iBAAL;AACA,iBAAO,KAAKV,MAAZ;AACD;;AAED;AACA;AACA;;AAEAU,4BAAoB;AAClB,eAAKC,eAAL;AACA,eAAKC,yBAAL;AACA,eAAKC,4BAAL;AACA,eAAKC,cAAL;AAED;;AAEDH,0BAAkB;AAChB,eAAKP,MAAL,GAAc,KAAKN,aAAL,CAAmBiB,qBAAnB,CAAyC,KAAKtB,GAA9C,CAAd;AACA,eAAKW,MAAL,CAAYY,OAAZ,CAAoBC,SAAS,KAAKZ,gBAAL,CAAsBY,KAAtB,IAA+B,CAA5D;AACD;;AAEDL,oCAA4B;AAC1B,eAAKpB,WAAL,CAAiBwB,OAAjB,CAA0BE,cAAc;AACtC,gBAAID,QAAQ,KAAKnB,aAAL,CAAmBqB,4BAAnB,CAAgDD,UAAhD,EAA4D,KAAKzB,GAAjE,CAAZ;AACA,gBAAI,CAAC,KAAKY,gBAAL,CAAsBY,KAAtB,CAAL,EAAmC;AACjC,mBAAKZ,gBAAL,CAAsBY,KAAtB,IAA+B,EAA/B;AACD;AACD,iBAAKZ,gBAAL,CAAsBY,KAAtB,EAA6BG,IAA7B,CAAkCF,UAAlC;AACD,WAND;AAOD;;AAEDL,uCAA+B;AAC7B,eAAKP,mBAAL,GAA2B,KAAKF,MAAL,CAAYiB,GAAZ,CAAgBJ,SAAS,KAAKlB,UAAL,CAAgBuB,gBAAhB,CAAiC,KAAK7B,GAAtC,EAA2CwB,KAA3C,CAAzB,CAA3B;AACA,eAAKX,mBAAL,GAA2B,KAAKA,mBAAL,CAAyBe,GAAzB,CAA6BE,mBAAmB,KAAKxB,UAAL,CAAgByB,iCAAhB,CAAkDD,eAAlD,CAAhD,CAA3B;AACD;;AAEDT,yBAAiB;AACf,cAAIzB,KAAJ,CAAU,KAAKa,GAAf,EAAoB;AAClBuB,kBAAM,KADY;AAElBC,kBAAM;AACJtB,sBAAQ,KAAKA,MADT;AAEJuB,wBAAU,CAAC;AACTV,uBAAO,kBADE;AAETS,sBAAME,OAAOC,IAAP,CAAY,KAAKxB,gBAAjB,EAAmCgB,GAAnC,CAAuC5B,OAAO,KAAKY,gBAAL,CAAsBZ,GAAtB,EAA2BqC,MAAzE,CAFG;AAGTP,iCAAiB,KAAKjB;AAHb,eAAD;AAFN,aAFY;AAUlByB,qBAAS;AACPC,qBAAO;AACLC,yBAAS,IADJ;AAELC,sBAAM,KAAKzC;AAFN,eADA;AAKP0C,0BAAY,KALL;AAMPC,sBAAQ;AACNC,uBAAO,CAAC;AACNC,yBAAO;AACLC,iCAAa,EADR;AAELC,iCAAa;AAFR;AADD,iBAAD,CADD;AAONC,uBAAO,CAAC;AACNH,yBAAO;AACLI,iCAAa;AADR;AADD,iBAAD;AAPD,eAND;AAmBPC,uBAAS,CAACC,KAAD,EAAQC,mBAAR,KAAgC;AACvC,oBAAG,CAAC,KAAKjD,aAAT,EAAwB;;AAExB,oBAAIkD,aAAaD,oBAAoB,CAApB,CAAjB;AACA,oBAAG,CAACC,UAAJ,EAAgB;;AAEhB,qBAAKlD,aAAL,CAAmBmD,aAAnB,CAAiC,IAAIC,WAAJ,CAAgB,gCAAhB,EAAkD;AACjFC,0BAAQ;AACNC,iDAA6BrD,SADvB;AAENsD,6BAASP,MAAMO,OAFT;AAGNC,6BAASR,MAAMQ,OAHT;AAINC,0CAAsB;AACpBC,2CAAqB,KAAKjD,gBAAL,CAAsByC,WAAWS,MAAX,CAAkBtC,KAAxC,CADD;AAEpBuC,sCAAgBV,WAAWS,MAAX,CAAkBhC,eAFd;AAJhB,mBADyE;AASjFkC,2BAAS;AATwE,iBAAlD,CAAjC;AAWD;AApCM;AAVS,WAApB;AAiDD;;AAEDxD,kCAA0B;AACxB,cAAID;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAJ;AACAA,iBAAO0D,KAAP,GAAe,KAAKhE,WAApB;AACAM,iBAAO2D,MAAP,GAAgB,KAAKhE,YAArB;AACA,iBAAOK,MAAP;AACD;AA7HuC;;yBAArBV,oB","file":"distribution-bar-chart.js","sourcesContent":["import Chart from \"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js\"\n\nexport default class DistributionBarChart {\n  constructor(individuals, key, canvasWidth, canvasHeight, visualization=undefined) {\n    this.dataProcessor = undefined\n    this.colorStore = undefined\n    \n    this.visualization = visualization\n    this.individuals = individuals\n    this.key = key\n    this.canvasWidth = canvasWidth\n    this.canvasHeight = canvasHeight\n    \n    this.canvas = this._generateBarChartCanvas()\n    this.ctx = this.canvas.getContext('2d')\n    \n    this.labels = []\n    this.distributionData = {}\n    this.barBackgroundColors = []\n  }\n  \n  // ------------------------------------------\n  // Public Methods\n  // ------------------------------------------\n  \n  setDataProcessor(dataProcessor) {\n    this.dataProcessor = dataProcessor\n  }\n  \n  setColorStore(colorStore) {\n    this.colorStore = colorStore\n  }\n  \n  generateCanvas() {\n    this._generateBarChart()\n    return this.canvas\n  }\n  \n  // ------------------------------------------\n  // Private Methods\n  // ------------------------------------------\n  \n  _generateBarChart() {\n    this._generateLabels()\n    this._generateDistributionData()\n    this._generateBarBackgroundColors()\n    this._generateChart()\n    \n  }\n  \n  _generateLabels() {\n    this.labels = this.dataProcessor.getValuesForAttribute(this.key)\n    this.labels.forEach(label => this.distributionData[label] = 0)\n  }\n  \n  _generateDistributionData() {\n    this.individuals.forEach( individual => {\n      let label = this.dataProcessor.getUniqueValueFromIndividual(individual, this.key)\n      if (!this.distributionData[label]) {\n        this.distributionData[label] = []\n      }\n      this.distributionData[label].push(individual)\n    })\n  }\n  \n  _generateBarBackgroundColors() {\n    this.barBackgroundColors = this.labels.map(label => this.colorStore.getColorForValue(this.key, label))\n    this.barBackgroundColors = this.barBackgroundColors.map(backgroundColor => this.colorStore.convertColorObjectToRGBAHexString(backgroundColor))\n  }\n  \n  _generateChart() {\n    new Chart(this.ctx, {\n      type: 'bar',\n      data: {\n        labels: this.labels,\n        datasets: [{\n          label: '# of individuals',\n          data: Object.keys(this.distributionData).map(key => this.distributionData[key].length),\n          backgroundColor: this.barBackgroundColors,\n        }]\n      },\n      options: {\n        title: {\n          display: true,\n          text: this.key\n        },\n        responsive: false,\n        scales: {\n          xAxes: [{\n            ticks: {\n              maxRotation: 90,\n              minRotation: 80\n            }\n          }],\n          yAxes: [{\n            ticks: {\n              beginAtZero: true\n            }\n          }]\n        },\n        onClick: (event, activeChartElements) => {\n          if(!this.visualization) return;\n          \n          let clickedBar = activeChartElements[0]\n          if(!clickedBar) return;\n                        \n          this.visualization.dispatchEvent(new CustomEvent(\"freehand-selection-contextmenu\", {\n            detail: {\n              freehandSelectionSVGElement: undefined,\n              clientX: event.clientX,\n              clientY: event.clientY,\n              individualsSelection: {\n                selectedIndividuals: this.distributionData[clickedBar._model.label], \n                selectionColor: clickedBar._model.backgroundColor}\n            },\n            bubbles: true\n          }))\n        }\n      }\n    })\n  }\n  \n  _generateBarChartCanvas() {\n    let canvas = <canvas></canvas>;\n    canvas.width = this.canvasWidth\n    canvas.height = this.canvasHeight\n    return canvas\n  }\n}"]}