@papaemmelab/isabl-web 0.3.25 → 0.3.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14732,7 +14732,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ".link-chip{text-decoration:none}.link-
14732
14732
 
14733
14733
  /***/ }),
14734
14734
 
14735
- /***/ 57043:
14735
+ /***/ 89953:
14736
14736
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
14737
14737
 
14738
14738
  "use strict";
@@ -14921,7 +14921,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ".individual-tag{background-color:#e7f5
14921
14921
 
14922
14922
  /***/ }),
14923
14923
 
14924
- /***/ 11158:
14924
+ /***/ 79527:
14925
14925
  /***/ (function(module, __webpack_exports__, __webpack_require__) {
14926
14926
 
14927
14927
  "use strict";
@@ -97189,19 +97189,19 @@ var update = add("05b2f32b", content, true, {"sourceMap":false,"shadowMode":fals
97189
97189
 
97190
97190
  /***/ }),
97191
97191
 
97192
- /***/ 43344:
97192
+ /***/ 89181:
97193
97193
  /***/ (function(module, __unused_webpack_exports, __webpack_require__) {
97194
97194
 
97195
97195
  // style-loader: Adds some css to the DOM by adding a <style> tag
97196
97196
 
97197
97197
  // load the styles
97198
- var content = __webpack_require__(57043);
97198
+ var content = __webpack_require__(89953);
97199
97199
  if(content.__esModule) content = content.default;
97200
97200
  if(typeof content === 'string') content = [[module.id, content, '']];
97201
97201
  if(content.locals) module.exports = content.locals;
97202
97202
  // add the styles to the DOM
97203
97203
  var add = (__webpack_require__(54402)/* ["default"] */ .Z)
97204
- var update = add("a4788f5e", content, true, {"sourceMap":false,"shadowMode":false});
97204
+ var update = add("5c359b12", content, true, {"sourceMap":false,"shadowMode":false});
97205
97205
 
97206
97206
  /***/ }),
97207
97207
 
@@ -97333,19 +97333,19 @@ var update = add("aa9d95b6", content, true, {"sourceMap":false,"shadowMode":fals
97333
97333
 
97334
97334
  /***/ }),
97335
97335
 
97336
- /***/ 6034:
97336
+ /***/ 9256:
97337
97337
  /***/ (function(module, __unused_webpack_exports, __webpack_require__) {
97338
97338
 
97339
97339
  // style-loader: Adds some css to the DOM by adding a <style> tag
97340
97340
 
97341
97341
  // load the styles
97342
- var content = __webpack_require__(11158);
97342
+ var content = __webpack_require__(79527);
97343
97343
  if(content.__esModule) content = content.default;
97344
97344
  if(typeof content === 'string') content = [[module.id, content, '']];
97345
97345
  if(content.locals) module.exports = content.locals;
97346
97346
  // add the styles to the DOM
97347
97347
  var add = (__webpack_require__(54402)/* ["default"] */ .Z)
97348
- var update = add("3acdb1a8", content, true, {"sourceMap":false,"shadowMode":false});
97348
+ var update = add("8fb88640", content, true, {"sourceMap":false,"shadowMode":false});
97349
97349
 
97350
97350
  /***/ }),
97351
97351
 
@@ -211010,7 +211010,7 @@ var MainSearchvue_type_template_id_2cb26e73_staticRenderFns = (cov_16wbf36ey0.s[
211010
211010
  ;// CONCATENATED MODULE: ./src/components/search/MainSearch.vue?vue&type=template&id=2cb26e73&
211011
211011
 
211012
211012
  ;// CONCATENATED MODULE: ./package.json
211013
- var package_namespaceObject = {"i8":"0.3.25"};
211013
+ var package_namespaceObject = {"i8":"0.3.26"};
211014
211014
  ;// CONCATENATED MODULE: ./src/utils/settings.js
211015
211015
  var cov_1sxapcxhz3 = function () {
211016
211016
  var path = "/Users/arangooj/papaemme/isabl_web/src/utils/settings.js";
@@ -214148,7 +214148,7 @@ var axios_default = /*#__PURE__*/__webpack_require__.n(axios);
214148
214148
  function api_typeof(obj) { "@babel/helpers - typeof"; return api_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, api_typeof(obj); }
214149
214149
  var cov_mm8t9pmbx = function () {
214150
214150
  var path = "/Users/arangooj/papaemme/isabl_web/src/utils/api.js";
214151
- var hash = "a46b194059b1db0d104b2c37ef142480558c6022";
214151
+ var hash = "0a4d47f54a6c3a0ebfb1b9447a02463908071fc9";
214152
214152
  var global = new Function("return this")();
214153
214153
  var gcv = "__coverage__";
214154
214154
  var coverageData = {
@@ -215430,7 +215430,7 @@ var cov_mm8t9pmbx = function () {
215430
215430
  column: 35
215431
215431
  },
215432
215432
  end: {
215433
- line: 259,
215433
+ line: 258,
215434
215434
  column: 1
215435
215435
  }
215436
215436
  },
@@ -215446,11 +215446,11 @@ var cov_mm8t9pmbx = function () {
215446
215446
  },
215447
215447
  "129": {
215448
215448
  start: {
215449
- line: 258,
215449
+ line: 257,
215450
215450
  column: 2
215451
215451
  },
215452
215452
  end: {
215453
- line: 258,
215453
+ line: 257,
215454
215454
  column: 68
215455
215455
  }
215456
215456
  }
@@ -216362,7 +216362,7 @@ var cov_mm8t9pmbx = function () {
216362
216362
  column: 60
216363
216363
  },
216364
216364
  end: {
216365
- line: 259,
216365
+ line: 258,
216366
216366
  column: 1
216367
216367
  }
216368
216368
  },
@@ -217013,7 +217013,7 @@ var cov_mm8t9pmbx = function () {
217013
217013
  "13": [0, 0]
217014
217014
  },
217015
217015
  _coverageSchema: "43e27e138ebf9cfc5966b082cf9a028302ed4184",
217016
- hash: "a46b194059b1db0d104b2c37ef142480558c6022"
217016
+ hash: "0a4d47f54a6c3a0ebfb1b9447a02463908071fc9"
217017
217017
  };
217018
217018
  var coverage = global[gcv] || (global[gcv] = {});
217019
217019
  if (coverage[path] && coverage[path].hash === hash) {
@@ -217443,7 +217443,6 @@ cov_mm8t9pmbx.s[127]++;
217443
217443
  var getExperimentIGVURL = function getExperimentIGVURL(system_id, assembly) {
217444
217444
  cov_mm8t9pmbx.f[37]++;
217445
217445
  var endpoint = (cov_mm8t9pmbx.s[128]++, api_endpoints['experiments']);
217446
- // const endpoint = "http://localhost:8000/api/v1/experiments"
217447
217446
  cov_mm8t9pmbx.s[129]++;
217448
217447
  return "".concat(endpoint, "/igv/").concat(system_id, "?").concat(queryParams({
217449
217448
  assembly: assembly
@@ -273569,10 +273568,10 @@ var RerunButton_component = normalizeComponent(
273569
273568
  )
273570
273569
 
273571
273570
  /* harmony default export */ var RerunButton = (RerunButton_component.exports);
273572
- ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/analyses/ResultsGallery.vue?vue&type=template&id=1140a7e3&
273571
+ ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/analyses/ResultsGallery.vue?vue&type=template&id=b464b2ba&
273573
273572
  var cov_lsyw1a7bv = function () {
273574
273573
  var path = "/Users/arangooj/papaemme/isabl_web/src/components/analyses/ResultsGallery.vue";
273575
- var hash = "e4e1bd496ed983e86b8d8d401807e8e88dfe4b40";
273574
+ var hash = "37a0c8e228cc957542f8e940af9fe406703c987c";
273576
273575
  var global = new Function("return this")();
273577
273576
  var gcv = "__coverage__";
273578
273577
  var coverageData = {
@@ -273615,7 +273614,7 @@ var cov_lsyw1a7bv = function () {
273615
273614
  },
273616
273615
  end: {
273617
273616
  line: 1,
273618
- column: 6491
273617
+ column: 6622
273619
273618
  }
273620
273619
  },
273621
273620
  "4": {
@@ -273711,31 +273710,31 @@ var cov_lsyw1a7bv = function () {
273711
273710
  "13": {
273712
273711
  start: {
273713
273712
  line: 1,
273714
- column: 4958
273713
+ column: 5085
273715
273714
  },
273716
273715
  end: {
273717
273716
  line: 1,
273718
- column: 5275
273717
+ column: 5402
273719
273718
  }
273720
273719
  },
273721
273720
  "14": {
273722
273721
  start: {
273723
273722
  line: 1,
273724
- column: 5007
273723
+ column: 5134
273725
273724
  },
273726
273725
  end: {
273727
273726
  line: 1,
273728
- column: 5269
273727
+ column: 5396
273729
273728
  }
273730
273729
  },
273731
273730
  "15": {
273732
273731
  start: {
273733
273732
  line: 1,
273734
- column: 5085
273733
+ column: 5212
273735
273734
  },
273736
273735
  end: {
273737
273736
  line: 1,
273738
- column: 5264
273737
+ column: 5391
273739
273738
  }
273740
273739
  },
273741
273740
  "16": {
@@ -273995,21 +273994,21 @@ var cov_lsyw1a7bv = function () {
273995
273994
  decl: {
273996
273995
  start: {
273997
273996
  line: 1,
273998
- column: 4938
273997
+ column: 5065
273999
273998
  },
274000
273999
  end: {
274001
274000
  line: 1,
274002
- column: 4939
274001
+ column: 5066
274003
274002
  }
274004
274003
  },
274005
274004
  loc: {
274006
274005
  start: {
274007
274006
  line: 1,
274008
- column: 4957
274007
+ column: 5084
274009
274008
  },
274010
274009
  end: {
274011
274010
  line: 1,
274012
- column: 5276
274011
+ column: 5403
274013
274012
  }
274014
274013
  },
274015
274014
  line: 1
@@ -274019,21 +274018,21 @@ var cov_lsyw1a7bv = function () {
274019
274018
  decl: {
274020
274019
  start: {
274021
274020
  line: 1,
274022
- column: 4992
274021
+ column: 5119
274023
274022
  },
274024
274023
  end: {
274025
274024
  line: 1,
274026
- column: 4993
274025
+ column: 5120
274027
274026
  }
274028
274027
  },
274029
274028
  loc: {
274030
274029
  start: {
274031
274030
  line: 1,
274032
- column: 5006
274031
+ column: 5133
274033
274032
  },
274034
274033
  end: {
274035
274034
  line: 1,
274036
- column: 5270
274035
+ column: 5397
274037
274036
  }
274038
274037
  },
274039
274038
  line: 1
@@ -274043,21 +274042,21 @@ var cov_lsyw1a7bv = function () {
274043
274042
  decl: {
274044
274043
  start: {
274045
274044
  line: 1,
274046
- column: 5062
274045
+ column: 5189
274047
274046
  },
274048
274047
  end: {
274049
274048
  line: 1,
274050
- column: 5063
274049
+ column: 5190
274051
274050
  }
274052
274051
  },
274053
274052
  loc: {
274054
274053
  start: {
274055
274054
  line: 1,
274056
- column: 5084
274055
+ column: 5211
274057
274056
  },
274058
274057
  end: {
274059
274058
  line: 1,
274060
- column: 5265
274059
+ column: 5392
274061
274060
  }
274062
274061
  },
274063
274062
  line: 1
@@ -274072,7 +274071,7 @@ var cov_lsyw1a7bv = function () {
274072
274071
  },
274073
274072
  end: {
274074
274073
  line: 1,
274075
- column: 6491
274074
+ column: 6622
274076
274075
  }
274077
274076
  },
274078
274077
  type: "cond-expr",
@@ -274083,16 +274082,16 @@ var cov_lsyw1a7bv = function () {
274083
274082
  },
274084
274083
  end: {
274085
274084
  line: 1,
274086
- column: 6482
274085
+ column: 6613
274087
274086
  }
274088
274087
  }, {
274089
274088
  start: {
274090
274089
  line: 1,
274091
- column: 6483
274090
+ column: 6614
274092
274091
  },
274093
274092
  end: {
274094
274093
  line: 1,
274095
- column: 6491
274094
+ column: 6622
274096
274095
  }
274097
274096
  }],
274098
274097
  line: 1
@@ -274534,7 +274533,7 @@ var cov_lsyw1a7bv = function () {
274534
274533
  },
274535
274534
  end: {
274536
274535
  line: 1,
274537
- column: 6470
274536
+ column: 6601
274538
274537
  }
274539
274538
  },
274540
274539
  type: "cond-expr",
@@ -274554,7 +274553,7 @@ var cov_lsyw1a7bv = function () {
274554
274553
  },
274555
274554
  end: {
274556
274555
  line: 1,
274557
- column: 6470
274556
+ column: 6601
274558
274557
  }
274559
274558
  }],
274560
274559
  line: 1
@@ -274600,7 +274599,7 @@ var cov_lsyw1a7bv = function () {
274600
274599
  },
274601
274600
  end: {
274602
274601
  line: 1,
274603
- column: 6470
274602
+ column: 6601
274604
274603
  }
274605
274604
  },
274606
274605
  type: "cond-expr",
@@ -274620,7 +274619,7 @@ var cov_lsyw1a7bv = function () {
274620
274619
  },
274621
274620
  end: {
274622
274621
  line: 1,
274623
- column: 6470
274622
+ column: 6601
274624
274623
  }
274625
274624
  }],
274626
274625
  line: 1
@@ -274633,7 +274632,7 @@ var cov_lsyw1a7bv = function () {
274633
274632
  },
274634
274633
  end: {
274635
274634
  line: 1,
274636
- column: 6470
274635
+ column: 6601
274637
274636
  }
274638
274637
  },
274639
274638
  type: "cond-expr",
@@ -274644,16 +274643,16 @@ var cov_lsyw1a7bv = function () {
274644
274643
  },
274645
274644
  end: {
274646
274645
  line: 1,
274647
- column: 4645
274646
+ column: 4772
274648
274647
  }
274649
274648
  }, {
274650
274649
  start: {
274651
274650
  line: 1,
274652
- column: 4646
274651
+ column: 4773
274653
274652
  },
274654
274653
  end: {
274655
274654
  line: 1,
274656
- column: 6470
274655
+ column: 6601
274657
274656
  }
274658
274657
  }],
274659
274658
  line: 1
@@ -274662,31 +274661,31 @@ var cov_lsyw1a7bv = function () {
274662
274661
  loc: {
274663
274662
  start: {
274664
274663
  line: 1,
274665
- column: 4265
274664
+ column: 4288
274666
274665
  },
274667
274666
  end: {
274668
274667
  line: 1,
274669
- column: 4436
274668
+ column: 4747
274670
274669
  }
274671
274670
  },
274672
274671
  type: "cond-expr",
274673
274672
  locations: [{
274674
274673
  start: {
274675
274674
  line: 1,
274676
- column: 4305
274675
+ column: 4343
274677
274676
  },
274678
274677
  end: {
274679
274678
  line: 1,
274680
- column: 4427
274679
+ column: 4738
274681
274680
  }
274682
274681
  }, {
274683
274682
  start: {
274684
274683
  line: 1,
274685
- column: 4428
274684
+ column: 4739
274686
274685
  },
274687
274686
  end: {
274688
274687
  line: 1,
274689
- column: 4436
274688
+ column: 4747
274690
274689
  }
274691
274690
  }],
274692
274691
  line: 1
@@ -274695,31 +274694,31 @@ var cov_lsyw1a7bv = function () {
274695
274694
  loc: {
274696
274695
  start: {
274697
274696
  line: 1,
274698
- column: 4266
274697
+ column: 4289
274699
274698
  },
274700
274699
  end: {
274701
274700
  line: 1,
274702
- column: 4303
274701
+ column: 4341
274703
274702
  }
274704
274703
  },
274705
274704
  type: "binary-expr",
274706
274705
  locations: [{
274707
274706
  start: {
274708
274707
  line: 1,
274709
- column: 4266
274708
+ column: 4289
274710
274709
  },
274711
274710
  end: {
274712
274711
  line: 1,
274713
- column: 4277
274712
+ column: 4300
274714
274713
  }
274715
274714
  }, {
274716
274715
  start: {
274717
274716
  line: 1,
274718
- column: 4281
274717
+ column: 4304
274719
274718
  },
274720
274719
  end: {
274721
274720
  line: 1,
274722
- column: 4303
274721
+ column: 4341
274723
274722
  }
274724
274723
  }],
274725
274724
  line: 1
@@ -274728,31 +274727,31 @@ var cov_lsyw1a7bv = function () {
274728
274727
  loc: {
274729
274728
  start: {
274730
274729
  line: 1,
274731
- column: 4460
274730
+ column: 4379
274732
274731
  },
274733
274732
  end: {
274734
274733
  line: 1,
274735
- column: 4620
274734
+ column: 4539
274736
274735
  }
274737
274736
  },
274738
274737
  type: "cond-expr",
274739
274738
  locations: [{
274740
274739
  start: {
274741
274740
  line: 1,
274742
- column: 4500
274741
+ column: 4404
274743
274742
  },
274744
274743
  end: {
274745
274744
  line: 1,
274746
- column: 4611
274745
+ column: 4530
274747
274746
  }
274748
274747
  }, {
274749
274748
  start: {
274750
274749
  line: 1,
274751
- column: 4612
274750
+ column: 4531
274752
274751
  },
274753
274752
  end: {
274754
274753
  line: 1,
274755
- column: 4620
274754
+ column: 4539
274756
274755
  }
274757
274756
  }],
274758
274757
  line: 1
@@ -274761,31 +274760,31 @@ var cov_lsyw1a7bv = function () {
274761
274760
  loc: {
274762
274761
  start: {
274763
274762
  line: 1,
274764
- column: 4461
274763
+ column: 4565
274765
274764
  },
274766
274765
  end: {
274767
274766
  line: 1,
274768
- column: 4498
274767
+ column: 4713
274769
274768
  }
274770
274769
  },
274771
- type: "binary-expr",
274770
+ type: "cond-expr",
274772
274771
  locations: [{
274773
274772
  start: {
274774
274773
  line: 1,
274775
- column: 4461
274774
+ column: 4589
274776
274775
  },
274777
274776
  end: {
274778
274777
  line: 1,
274779
- column: 4473
274778
+ column: 4704
274780
274779
  }
274781
274780
  }, {
274782
274781
  start: {
274783
274782
  line: 1,
274784
- column: 4477
274783
+ column: 4705
274785
274784
  },
274786
274785
  end: {
274787
274786
  line: 1,
274788
- column: 4498
274787
+ column: 4713
274789
274788
  }
274790
274789
  }],
274791
274790
  line: 1
@@ -274794,31 +274793,31 @@ var cov_lsyw1a7bv = function () {
274794
274793
  loc: {
274795
274794
  start: {
274796
274795
  line: 1,
274797
- column: 4646
274796
+ column: 4773
274798
274797
  },
274799
274798
  end: {
274800
274799
  line: 1,
274801
- column: 6470
274800
+ column: 6601
274802
274801
  }
274803
274802
  },
274804
274803
  type: "cond-expr",
274805
274804
  locations: [{
274806
274805
  start: {
274807
274806
  line: 1,
274808
- column: 4675
274807
+ column: 4802
274809
274808
  },
274810
274809
  end: {
274811
274810
  line: 1,
274812
- column: 5541
274811
+ column: 5672
274813
274812
  }
274814
274813
  }, {
274815
274814
  start: {
274816
274815
  line: 1,
274817
- column: 5542
274816
+ column: 5673
274818
274817
  },
274819
274818
  end: {
274820
274819
  line: 1,
274821
- column: 6470
274820
+ column: 6601
274822
274821
  }
274823
274822
  }],
274824
274823
  line: 1
@@ -274827,31 +274826,31 @@ var cov_lsyw1a7bv = function () {
274827
274826
  loc: {
274828
274827
  start: {
274829
274828
  line: 1,
274830
- column: 5133
274829
+ column: 5260
274831
274830
  },
274832
274831
  end: {
274833
274832
  line: 1,
274834
- column: 5183
274833
+ column: 5310
274835
274834
  }
274836
274835
  },
274837
274836
  type: "cond-expr",
274838
274837
  locations: [{
274839
274838
  start: {
274840
274839
  line: 1,
274841
- column: 5160
274840
+ column: 5287
274842
274841
  },
274843
274842
  end: {
274844
274843
  line: 1,
274845
- column: 5178
274844
+ column: 5305
274846
274845
  }
274847
274846
  }, {
274848
274847
  start: {
274849
274848
  line: 1,
274850
- column: 5181
274849
+ column: 5308
274851
274850
  },
274852
274851
  end: {
274853
274852
  line: 1,
274854
- column: 5183
274853
+ column: 5310
274855
274854
  }
274856
274855
  }],
274857
274856
  line: 1
@@ -274860,31 +274859,31 @@ var cov_lsyw1a7bv = function () {
274860
274859
  loc: {
274861
274860
  start: {
274862
274861
  line: 1,
274863
- column: 5357
274862
+ column: 5484
274864
274863
  },
274865
274864
  end: {
274866
274865
  line: 1,
274867
- column: 5450
274866
+ column: 5666
274868
274867
  }
274869
274868
  },
274870
274869
  type: "cond-expr",
274871
274870
  locations: [{
274872
274871
  start: {
274873
274872
  line: 1,
274874
- column: 5397
274873
+ column: 5539
274875
274874
  },
274876
274875
  end: {
274877
274876
  line: 1,
274878
- column: 5441
274877
+ column: 5657
274879
274878
  }
274880
274879
  }, {
274881
274880
  start: {
274882
274881
  line: 1,
274883
- column: 5442
274882
+ column: 5658
274884
274883
  },
274885
274884
  end: {
274886
274885
  line: 1,
274887
- column: 5450
274886
+ column: 5666
274888
274887
  }
274889
274888
  }],
274890
274889
  line: 1
@@ -274893,31 +274892,31 @@ var cov_lsyw1a7bv = function () {
274893
274892
  loc: {
274894
274893
  start: {
274895
274894
  line: 1,
274896
- column: 5358
274895
+ column: 5485
274897
274896
  },
274898
274897
  end: {
274899
274898
  line: 1,
274900
- column: 5395
274899
+ column: 5537
274901
274900
  }
274902
274901
  },
274903
274902
  type: "binary-expr",
274904
274903
  locations: [{
274905
274904
  start: {
274906
274905
  line: 1,
274907
- column: 5358
274906
+ column: 5485
274908
274907
  },
274909
274908
  end: {
274910
274909
  line: 1,
274911
- column: 5369
274910
+ column: 5496
274912
274911
  }
274913
274912
  }, {
274914
274913
  start: {
274915
274914
  line: 1,
274916
- column: 5373
274915
+ column: 5500
274917
274916
  },
274918
274917
  end: {
274919
274918
  line: 1,
274920
- column: 5395
274919
+ column: 5537
274921
274920
  }
274922
274921
  }],
274923
274922
  line: 1
@@ -274926,31 +274925,31 @@ var cov_lsyw1a7bv = function () {
274926
274925
  loc: {
274927
274926
  start: {
274928
274927
  line: 1,
274929
- column: 5451
274928
+ column: 5550
274930
274929
  },
274931
274930
  end: {
274932
274931
  line: 1,
274933
- column: 5535
274932
+ column: 5655
274934
274933
  }
274935
274934
  },
274936
274935
  type: "cond-expr",
274937
274936
  locations: [{
274938
274937
  start: {
274939
274938
  line: 1,
274940
- column: 5491
274939
+ column: 5575
274941
274940
  },
274942
274941
  end: {
274943
274942
  line: 1,
274944
- column: 5526
274943
+ column: 5619
274945
274944
  }
274946
274945
  }, {
274947
274946
  start: {
274948
274947
  line: 1,
274949
- column: 5527
274948
+ column: 5620
274950
274949
  },
274951
274950
  end: {
274952
274951
  line: 1,
274953
- column: 5535
274952
+ column: 5655
274954
274953
  }
274955
274954
  }],
274956
274955
  line: 1
@@ -274959,31 +274958,31 @@ var cov_lsyw1a7bv = function () {
274959
274958
  loc: {
274960
274959
  start: {
274961
274960
  line: 1,
274962
- column: 5452
274961
+ column: 5673
274963
274962
  },
274964
274963
  end: {
274965
274964
  line: 1,
274966
- column: 5489
274965
+ column: 6601
274967
274966
  }
274968
274967
  },
274969
- type: "binary-expr",
274968
+ type: "cond-expr",
274970
274969
  locations: [{
274971
274970
  start: {
274972
274971
  line: 1,
274973
- column: 5452
274972
+ column: 5702
274974
274973
  },
274975
274974
  end: {
274976
274975
  line: 1,
274977
- column: 5464
274976
+ column: 5838
274978
274977
  }
274979
274978
  }, {
274980
274979
  start: {
274981
274980
  line: 1,
274982
- column: 5468
274981
+ column: 5839
274983
274982
  },
274984
274983
  end: {
274985
274984
  line: 1,
274986
- column: 5489
274985
+ column: 6601
274987
274986
  }
274988
274987
  }],
274989
274988
  line: 1
@@ -274992,31 +274991,31 @@ var cov_lsyw1a7bv = function () {
274992
274991
  loc: {
274993
274992
  start: {
274994
274993
  line: 1,
274995
- column: 5542
274994
+ column: 5839
274996
274995
  },
274997
274996
  end: {
274998
274997
  line: 1,
274999
- column: 6470
274998
+ column: 6601
275000
274999
  }
275001
275000
  },
275002
275001
  type: "cond-expr",
275003
275002
  locations: [{
275004
275003
  start: {
275005
275004
  line: 1,
275006
- column: 5571
275005
+ column: 5882
275007
275006
  },
275008
275007
  end: {
275009
275008
  line: 1,
275010
- column: 5707
275009
+ column: 6080
275011
275010
  }
275012
275011
  }, {
275013
275012
  start: {
275014
275013
  line: 1,
275015
- column: 5708
275014
+ column: 6081
275016
275015
  },
275017
275016
  end: {
275018
275017
  line: 1,
275019
- column: 6470
275018
+ column: 6601
275020
275019
  }
275021
275020
  }],
275022
275021
  line: 1
@@ -275025,31 +275024,31 @@ var cov_lsyw1a7bv = function () {
275025
275024
  loc: {
275026
275025
  start: {
275027
275026
  line: 1,
275028
- column: 5708
275027
+ column: 6081
275029
275028
  },
275030
275029
  end: {
275031
275030
  line: 1,
275032
- column: 6470
275031
+ column: 6601
275033
275032
  }
275034
275033
  },
275035
275034
  type: "cond-expr",
275036
275035
  locations: [{
275037
275036
  start: {
275038
275037
  line: 1,
275039
- column: 5751
275038
+ column: 6112
275040
275039
  },
275041
275040
  end: {
275042
275041
  line: 1,
275043
- column: 5949
275042
+ column: 6275
275044
275043
  }
275045
275044
  }, {
275046
275045
  start: {
275047
275046
  line: 1,
275048
- column: 5950
275047
+ column: 6276
275049
275048
  },
275050
275049
  end: {
275051
275050
  line: 1,
275052
- column: 6470
275051
+ column: 6601
275053
275052
  }
275054
275053
  }],
275055
275054
  line: 1
@@ -275058,31 +275057,31 @@ var cov_lsyw1a7bv = function () {
275058
275057
  loc: {
275059
275058
  start: {
275060
275059
  line: 1,
275061
- column: 5950
275060
+ column: 6276
275062
275061
  },
275063
275062
  end: {
275064
275063
  line: 1,
275065
- column: 6470
275064
+ column: 6601
275066
275065
  }
275067
275066
  },
275068
275067
  type: "cond-expr",
275069
275068
  locations: [{
275070
275069
  start: {
275071
275070
  line: 1,
275072
- column: 5981
275071
+ column: 6306
275073
275072
  },
275074
275073
  end: {
275075
275074
  line: 1,
275076
- column: 6144
275075
+ column: 6433
275077
275076
  }
275078
275077
  }, {
275079
275078
  start: {
275080
275079
  line: 1,
275081
- column: 6145
275080
+ column: 6434
275082
275081
  },
275083
275082
  end: {
275084
275083
  line: 1,
275085
- column: 6470
275084
+ column: 6601
275086
275085
  }
275087
275086
  }],
275088
275087
  line: 1
@@ -275091,64 +275090,31 @@ var cov_lsyw1a7bv = function () {
275091
275090
  loc: {
275092
275091
  start: {
275093
275092
  line: 1,
275094
- column: 6145
275093
+ column: 6434
275095
275094
  },
275096
275095
  end: {
275097
275096
  line: 1,
275098
- column: 6470
275097
+ column: 6601
275099
275098
  }
275100
275099
  },
275101
275100
  type: "cond-expr",
275102
275101
  locations: [{
275103
275102
  start: {
275104
275103
  line: 1,
275105
- column: 6175
275104
+ column: 6484
275106
275105
  },
275107
275106
  end: {
275108
275107
  line: 1,
275109
- column: 6302
275108
+ column: 6592
275110
275109
  }
275111
275110
  }, {
275112
275111
  start: {
275113
275112
  line: 1,
275114
- column: 6303
275113
+ column: 6593
275115
275114
  },
275116
275115
  end: {
275117
275116
  line: 1,
275118
- column: 6470
275119
- }
275120
- }],
275121
- line: 1
275122
- },
275123
- "32": {
275124
- loc: {
275125
- start: {
275126
- line: 1,
275127
- column: 6303
275128
- },
275129
- end: {
275130
- line: 1,
275131
- column: 6470
275132
- }
275133
- },
275134
- type: "cond-expr",
275135
- locations: [{
275136
- start: {
275137
- line: 1,
275138
- column: 6353
275139
- },
275140
- end: {
275141
- line: 1,
275142
- column: 6461
275143
- }
275144
- }, {
275145
- start: {
275146
- line: 1,
275147
- column: 6462
275148
- },
275149
- end: {
275150
- line: 1,
275151
- column: 6470
275117
+ column: 6601
275152
275118
  }
275153
275119
  }],
275154
275120
  line: 1
@@ -275220,11 +275186,10 @@ var cov_lsyw1a7bv = function () {
275220
275186
  "28": [0, 0],
275221
275187
  "29": [0, 0],
275222
275188
  "30": [0, 0],
275223
- "31": [0, 0],
275224
- "32": [0, 0]
275189
+ "31": [0, 0]
275225
275190
  },
275226
275191
  _coverageSchema: "43e27e138ebf9cfc5966b082cf9a028302ed4184",
275227
- hash: "e4e1bd496ed983e86b8d8d401807e8e88dfe4b40"
275192
+ hash: "37a0c8e228cc957542f8e940af9fe406703c987c"
275228
275193
  };
275229
275194
  var coverage = global[gcv] || (global[gcv] = {});
275230
275195
  if (coverage[path] && coverage[path].hash === hash) {
@@ -275233,7 +275198,7 @@ var cov_lsyw1a7bv = function () {
275233
275198
  return coverage[path] = coverageData;
275234
275199
  }();
275235
275200
  cov_lsyw1a7bv.s[0]++;
275236
- var ResultsGalleryvue_type_template_id_1140a7e3_render = function render() {
275201
+ var ResultsGalleryvue_type_template_id_b464b2ba_render = function render() {
275237
275202
  cov_lsyw1a7bv.f[0]++;
275238
275203
  var _vm = (cov_lsyw1a7bv.s[1]++, this),
275239
275204
  _c = (cov_lsyw1a7bv.s[2]++, _vm._self._c);
@@ -275461,11 +275426,11 @@ var ResultsGalleryvue_type_template_id_1140a7e3_render = function render() {
275461
275426
  })])) : (cov_lsyw1a7bv.b[16][1]++, _vm.resultType === 'raw' ? (cov_lsyw1a7bv.b[17][0]++, _c('code', {
275462
275427
  ref: "raw",
275463
275428
  staticClass: "v-markup"
275464
- }, [_c('pre', [_vm._v(" " + _vm._s(_vm.content) + "\n "), (cov_lsyw1a7bv.b[19][0]++, _vm.content) && (cov_lsyw1a7bv.b[19][1]++, !_vm.streamOptions.end) ? (cov_lsyw1a7bv.b[18][0]++, _c('span', {
275429
+ }, [_c('pre', [_vm._v(" " + _vm._s(_vm.content) + "\n "), _vm._v("\n "), (cov_lsyw1a7bv.b[19][0]++, _vm.content) && (cov_lsyw1a7bv.b[19][1]++, _vm.content.split('\n').length >= 200) ? (cov_lsyw1a7bv.b[18][0]++, _c('span', [_vm._v("\n "), !_vm.streamOptions.end ? (cov_lsyw1a7bv.b[20][0]++, _c('span', {
275465
275430
  staticClass: "stream-message grey--text lighten-2"
275466
- }, [_vm._v("\n ... Loading more rows\n ")])) : (cov_lsyw1a7bv.b[18][1]++, _vm._e()), _vm._v("\n "), (cov_lsyw1a7bv.b[21][0]++, !_vm.loading) && (cov_lsyw1a7bv.b[21][1]++, _vm.streamOptions.end) ? (cov_lsyw1a7bv.b[20][0]++, _c('span', {
275431
+ }, [_vm._v("\n ... Loading more rows\n ")])) : (cov_lsyw1a7bv.b[20][1]++, _vm._e()), _vm._v("\n "), _vm.streamOptions.end ? (cov_lsyw1a7bv.b[21][0]++, _c('span', {
275467
275432
  staticClass: "stream-message grey--text"
275468
- }, [_vm._v("\n *** End of file. ***\n ")])) : (cov_lsyw1a7bv.b[20][1]++, _vm._e()), _vm._v("\n ")])])) : (cov_lsyw1a7bv.b[17][1]++, _vm.resultType === 'table' ? (cov_lsyw1a7bv.b[22][0]++, _c('div', {
275433
+ }, [_vm._v("\n *** End of file. ***\n ")])) : (cov_lsyw1a7bv.b[21][1]++, _vm._e()), _vm._v("\n ")])) : (cov_lsyw1a7bv.b[18][1]++, _vm._e()), _vm._v("\n ")])])) : (cov_lsyw1a7bv.b[17][1]++, _vm.resultType === 'table' ? (cov_lsyw1a7bv.b[22][0]++, _c('div', {
275469
275434
  ref: "table",
275470
275435
  staticClass: "tsv-table"
275471
275436
  }, [_c('v-data-table', {
@@ -275505,13 +275470,13 @@ var ResultsGalleryvue_type_template_id_1140a7e3_render = function render() {
275505
275470
  }], null, false, 3434796515)
275506
275471
  }), _c('div', {
275507
275472
  staticClass: "text-center stream-message"
275508
- }, [(cov_lsyw1a7bv.b[25][0]++, _vm.content) && (cov_lsyw1a7bv.b[25][1]++, !_vm.streamOptions.end) ? (cov_lsyw1a7bv.b[24][0]++, _c('span', [_vm._v("... Loading more rows")])) : (cov_lsyw1a7bv.b[24][1]++, _vm._e()), (cov_lsyw1a7bv.b[27][0]++, !_vm.loading) && (cov_lsyw1a7bv.b[27][1]++, _vm.streamOptions.end) ? (cov_lsyw1a7bv.b[26][0]++, _c('span', [_vm._v("End of file.")])) : (cov_lsyw1a7bv.b[26][1]++, _vm._e())])], 1)) : (cov_lsyw1a7bv.b[22][1]++, _vm.resultType === 'image' ? (cov_lsyw1a7bv.b[28][0]++, _c('img', {
275473
+ }, [(cov_lsyw1a7bv.b[25][0]++, _vm.content) && (cov_lsyw1a7bv.b[25][1]++, _vm.content.split('\n').length >= 200) ? (cov_lsyw1a7bv.b[24][0]++, _c('span', [!_vm.streamOptions.end ? (cov_lsyw1a7bv.b[26][0]++, _c('span', [_vm._v("... Loading more rows")])) : (cov_lsyw1a7bv.b[26][1]++, _c('span', [_vm._v("End of file.")]))])) : (cov_lsyw1a7bv.b[24][1]++, _vm._e())])], 1)) : (cov_lsyw1a7bv.b[22][1]++, _vm.resultType === 'image' ? (cov_lsyw1a7bv.b[27][0]++, _c('img', {
275509
275474
  staticClass: "results-image",
275510
275475
  attrs: {
275511
275476
  "src": _vm.$store.getters.getBlobUrl(_vm.result.downloadUrl),
275512
275477
  "alt": _vm.result.verboseName
275513
275478
  }
275514
- })) : (cov_lsyw1a7bv.b[28][1]++, ['html', 'pdf'].includes(_vm.resultType) ? (cov_lsyw1a7bv.b[29][0]++, _c('iframe', {
275479
+ })) : (cov_lsyw1a7bv.b[27][1]++, ['html', 'pdf'].includes(_vm.resultType) ? (cov_lsyw1a7bv.b[28][0]++, _c('iframe', {
275515
275480
  staticClass: "results-iframe",
275516
275481
  staticStyle: {
275517
275482
  "width": "100%",
@@ -275522,7 +275487,7 @@ var ResultsGalleryvue_type_template_id_1140a7e3_render = function render() {
275522
275487
  "src": _vm.$store.getters.getBlobUrl(_vm.result.downloadUrl, ''),
275523
275488
  "frameborder": "0"
275524
275489
  }
275525
- })) : (cov_lsyw1a7bv.b[29][1]++, _vm.resultType === 'igv_bam' ? (cov_lsyw1a7bv.b[30][0]++, _c('iframe', {
275490
+ })) : (cov_lsyw1a7bv.b[28][1]++, _vm.resultType === 'igv_bam' ? (cov_lsyw1a7bv.b[29][0]++, _c('iframe', {
275526
275491
  staticClass: "results-iframe",
275527
275492
  staticStyle: {
275528
275493
  "width": "100%",
@@ -275533,23 +275498,23 @@ var ResultsGalleryvue_type_template_id_1140a7e3_render = function render() {
275533
275498
  "src": _vm.result.downloadUrl,
275534
275499
  "frameborder": "0"
275535
275500
  }
275536
- })) : (cov_lsyw1a7bv.b[30][1]++, _vm.resultType === 'number' ? (cov_lsyw1a7bv.b[31][0]++, _c('code', {
275501
+ })) : (cov_lsyw1a7bv.b[29][1]++, _vm.resultType === 'number' ? (cov_lsyw1a7bv.b[30][0]++, _c('code', {
275537
275502
  staticClass: "v-markup"
275538
275503
  }, [_c('span', {
275539
275504
  attrs: {
275540
275505
  "size": "100px"
275541
275506
  }
275542
- }, [_vm._v(_vm._s(_vm._f("round")(_vm.result.value, 3)))])])) : (cov_lsyw1a7bv.b[31][1]++, ['string', 'url-link'].includes(_vm.resultType) ? (cov_lsyw1a7bv.b[32][0]++, _c('code', {
275507
+ }, [_vm._v(_vm._s(_vm._f("round")(_vm.result.value, 3)))])])) : (cov_lsyw1a7bv.b[30][1]++, ['string', 'url-link'].includes(_vm.resultType) ? (cov_lsyw1a7bv.b[31][0]++, _c('code', {
275543
275508
  staticClass: "v-markup"
275544
275509
  }, [_c('span', {
275545
275510
  attrs: {
275546
275511
  "size": "100px"
275547
275512
  }
275548
- }, [_vm._v(_vm._s(_vm.result.value))])])) : (cov_lsyw1a7bv.b[32][1]++, _vm._e())))))))))], 1)], 1)], 1)) : (cov_lsyw1a7bv.b[0][1]++, _vm._e());
275513
+ }, [_vm._v(_vm._s(_vm.result.value))])])) : (cov_lsyw1a7bv.b[31][1]++, _vm._e())))))))))], 1)], 1)], 1)) : (cov_lsyw1a7bv.b[0][1]++, _vm._e());
275549
275514
  };
275550
- var ResultsGalleryvue_type_template_id_1140a7e3_staticRenderFns = (cov_lsyw1a7bv.s[16]++, []);
275515
+ var ResultsGalleryvue_type_template_id_b464b2ba_staticRenderFns = (cov_lsyw1a7bv.s[16]++, []);
275551
275516
 
275552
- ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue?vue&type=template&id=1140a7e3&
275517
+ ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue?vue&type=template&id=b464b2ba&
275553
275518
 
275554
275519
  // EXTERNAL MODULE: ./node_modules/detect-csv/index.js
275555
275520
  var detect_csv = __webpack_require__(99935);
@@ -275557,7 +275522,7 @@ var detect_csv_default = /*#__PURE__*/__webpack_require__.n(detect_csv);
275557
275522
  ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/analyses/ResultsGallery.vue?vue&type=script&lang=js&
275558
275523
  var ResultsGalleryvue_type_script_lang_js_cov_lsyw1a7bv = function () {
275559
275524
  var path = "/Users/arangooj/papaemme/isabl_web/src/components/analyses/ResultsGallery.vue";
275560
- var hash = "68d228565d6b6c5100fcb14e924652ac345880c1";
275525
+ var hash = "5d444039a2a8e9894579cef12c5354c23ba58df6";
275561
275526
  var global = new Function("return this")();
275562
275527
  var gcv = "__coverage__";
275563
275528
  var coverageData = {
@@ -279159,13 +279124,13 @@ var ResultsGalleryvue_type_script_lang_js_cov_lsyw1a7bv = function () {
279159
279124
  version: 3,
279160
279125
  sources: ["ResultsGallery.vue"],
279161
279126
  names: [],
279162
- mappings: ";AA+QA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA",
279127
+ mappings: ";AAqRA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA",
279163
279128
  file: "ResultsGallery.vue",
279164
279129
  sourceRoot: "src/components/analyses",
279165
- sourcesContent: ["<template>\n <v-dialog\n v-hotkey=\"keymap\"\n v-if=\"showDialog\"\n v-model=\"showDialog\"\n :fullscreen=\"isResultModalFullScreen\"\n scrollable\n class=\"gallery-dialog\"\n >\n <v-card flat class=\"gallery-card\">\n <v-card-title class=\"pa-2\">\n <v-row>\n <v-col cols=\"6\">\n <h3 class=\"font-weight-thin primary--text\">\n {{ result.verboseName }}\n </h3>\n </v-col>\n\n <v-col cols=\"6\" class=\"d-flex justify-end align-center panel-slot-actions\">\n\n <!-- toggle raw text -->\n <v-tooltip\n v-if=\"result.frontendType === 'tsv-file' && tsvHeaders.length\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"displayRawText = !displayRawText\"\n v-on=\"on\"\n >\n {{ displayRawText ? 'table_chart' : 'text_fields' }}\n </v-icon>\n </template>\n {{ displayRawText ? 'Display Tabulated Content' : 'Display Raw Content' }}\n </v-tooltip>\n\n <!-- download result -->\n <v-tooltip\n v-if=\"result.download\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.download\"\n v-on=\"on\"\n >\n {{ result.downloadIcon }}\n </v-icon>\n </template>\n {{ result.downloadIcon === 'open_in_new' ? 'Open in new tab' : 'Download Result' }}\n </v-tooltip>\n\n <!-- copy to clipboard -->\n <v-tooltip\n v-if=\"result.copyToClipBoard\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.copyToClipBoard\"\n v-on=\"on\"\n >\n file_copy\n </v-icon>\n </template>\n Copy to clipboard!\n </v-tooltip>\n\n <!-- external link -->\n <v-tooltip\n v-if=\"result.openExternalLink\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.openExternalLink\"\n v-on=\"on\"\n >\n info\n </v-icon>\n </template>\n Learn more!\n </v-tooltip>\n\n <!-- show from bottom -->\n <v-tooltip\n v-if=\"['raw'].includes(resultType)\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"reverseContent\"\n v-on=\"on\"\n >\n {{ streamOptions.reverse ? 'vertical_align_bottom' : 'vertical_align_top'}}\n </v-icon>\n </template>\n <span>\n Show content from {{ streamOptions.reverse ? 'top' : 'bottom' }}\n </span>\n </v-tooltip>\n\n <!-- show fullscreen -->\n <v-tooltip\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"toggleFullScreen\"\n v-on=\"on\"\n >\n {{ isResultModalFullScreen ? 'fullscreen_exit' : 'fullscreen'}}\n </v-icon>\n </template>\n <span>\n Toggle Full Screen\n </span>\n </v-tooltip>\n\n <!-- close dialog -->\n <v-tooltip top>\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"hideDialog\"\n v-on=\"on\"\n >\n close\n </v-icon>\n </template>\n Close file\n </v-tooltip>\n </v-col>\n </v-row>\n </v-card-title>\n\n <v-row class=\"pa-0 ma-0 gallery-content\" style=\"height: 85vh\">\n <v-progress-linear\n v-if=\"loading\"\n class=\"panel-loader\"\n indeterminate\n height=\"2\"\n color=\"primary\"\n />\n\n <pre\n v-highlightjs=\"content\"\n v-if=\"resultType === 'raw' && resultKey === 'command_script'\"\n ref=\"raw\"\n class=\"v-markup pre-wrap\"\n >\n <code class=\"bash\" />\n </pre>\n\n <code\n v-else-if=\"isAnsi\"\n ref=\"raw\"\n class=\"v-markup\"\n >\n <pre v-html=\"content\" />\n </code>\n\n <code\n v-else-if=\"resultType === 'raw'\"\n ref=\"raw\"\n class=\"v-markup\"\n >\n <pre>\n {{ content }}\n <span v-if=\"content && !streamOptions.end\" class=\"stream-message grey--text lighten-2\">\n ... Loading more rows\n </span>\n <span v-if=\"!loading && streamOptions.end\" class=\"stream-message grey--text\">\n *** End of file. ***\n </span>\n </pre>\n </code>\n\n <div\n v-else-if=\"resultType === 'table'\"\n ref=\"table\"\n class=\"tsv-table\"\n >\n <v-data-table\n :headers=\"tsvHeaders\"\n :items=\"tsvItems\"\n :items-per-page=\"tsvItems.length\"\n hide-default-footer\n multi-sort\n fixed-header\n dense\n >\n <template v-slot:body=\"{ items }\">\n <tbody>\n <tr\n v-for=\"item in items\"\n :key=\"item.name\"\n >\n <td\n v-for=\"(header, index) in tsvHeaders\"\n :key=\"index + header.value\"\n :class=\"[header.value === 'index' ? 'line-column text' : '']\"\n v-html=\"parseTsvCell($get(item, header.value))\"\n />\n </tr>\n </tbody>\n </template>\n </v-data-table>\n\n <div class=\"text-center stream-message\">\n <span v-if=\"content && !streamOptions.end\">... Loading more rows</span>\n <span v-if=\"!loading && streamOptions.end\">End of file.</span>\n </div>\n </div>\n\n <img\n v-else-if=\"resultType === 'image'\"\n :src=\"$store.getters.getBlobUrl(result.downloadUrl)\"\n :alt=\"result.verboseName\"\n class=\"results-image\"\n >\n\n <iframe\n v-else-if=\"['html', 'pdf'].includes(resultType)\"\n :src=\"$store.getters.getBlobUrl(result.downloadUrl, '')\"\n frameborder=\"0\"\n class=\"results-iframe\"\n style=\"width: 100%; height: 100%; min-height: 80vh;\"\n />\n\n <iframe\n v-else-if=\"resultType === 'igv_bam'\"\n :src=\"result.downloadUrl\"\n frameborder=\"0\"\n class=\"results-iframe\"\n style=\"width: 100%; height: 100%; min-height: 80vh;\"\n />\n\n <code\n v-else-if=\"resultType === 'number'\"\n class=\"v-markup\"\n >\n <span size=\"100px\">{{ result.value | round(3) }}</span>\n </code>\n\n <code\n v-else-if=\"['string', 'url-link'].includes(resultType)\"\n class=\"v-markup\"\n >\n <span size=\"100px\">{{ result.value }}</span>\n </code>\n </v-row>\n\n </v-card>\n </v-dialog>\n</template>\n\n<script>\nimport { loadResult } from '@/utils/api'\nimport { HIDE_PANEL, SHOW_PANEL } from '@/store/actions/panels'\nimport { TOGGLE_RESULT_FULLSCREEN } from '@/store/actions/user'\nimport { GET_FILE } from '@/store/actions/files'\nimport { mapGetters } from 'vuex'\nimport detect from 'detect-csv'\n\nexport default {\n name: 'ResultsGallery',\n props: {\n resultIndex: {\n type: Number,\n },\n results: {\n type: Array,\n },\n },\n data() {\n return {\n content: '',\n displayRawText: false,\n isBottomScrolled: false,\n loading: false,\n showDialog: false,\n tsvItems: [],\n tsvHeaders: [],\n streamOptions: {\n lines: 200,\n offset: 0,\n reverse: false,\n previous: '',\n end: false,\n },\n }\n },\n computed: {\n ...mapGetters(['resultKey', 'isResultModalFullScreen']),\n keymap() {\n return {\n right: this.increaseIndex,\n left: this.decreaseIndex,\n esc: this.hideDialog,\n }\n },\n result() {\n return this.results[this.resultIndex] || {}\n },\n isAnsi() {\n return this.result && this.result.frontendType === 'ansi'\n },\n resultType() {\n if (this.result.frontendType === 'ansi') {\n return 'raw'\n } else if (this.result.frontendType === 'text-file') {\n return 'raw'\n } else if (this.result.frontendType === 'tsv-file') {\n if (\n !this.displayRawText &&\n this.tsvItems.length &&\n this.tsvHeaders.length\n ) {\n return 'table'\n } else {\n return 'raw'\n }\n } else {\n return this.result.frontendType\n }\n },\n },\n watch: {\n showDialog(value) {\n if (!value) {\n this.$store.dispatch(HIDE_PANEL, 'result')\n this.$emit('display-result', null)\n }\n },\n resultIndex(value) {\n this.showDialog = Number.isInteger(value) && value < this.results.length\n if (this.showDialog && ['raw', 'table'].includes(this.resultType)) {\n this.resetStreamEvents()\n this.loadFileContents()\n }\n },\n resultKey: {\n handler() {\n this.updateResultIndex()\n },\n immediate: true,\n },\n result(value) {\n if (value && value.resultKey) {\n this.$store.dispatch(SHOW_PANEL, {\n result: value.resultKey,\n })\n if (['html', 'pdf'].includes(value.frontendType)) {\n this.$store.dispatch(GET_FILE, value.downloadUrl)\n }\n // Track result viewed\n window.analytics.track('Result Previewed', value.analytics)\n }\n this.updateResultIndex()\n },\n isBottomScrolled(value) {\n if (value) {\n this.loadFileContents()\n }\n },\n displayRawText() {\n this.addScrollListener()\n },\n },\n methods: {\n resetStreamEvents() {\n // Reset content\n this.content = ''\n this.streamOptions = {\n lines: 200,\n offset: 0,\n reverse: false,\n previous: '',\n end: false,\n }\n // Remove listeners\n this.$nextTick(() => {\n if (this.$refs.raw) {\n this.$refs.raw.removeEventListener('scroll', this.isBottomVisible)\n }\n if (this.$refs.table) {\n this.$refs.table.removeEventListener('scroll', this.isBottomVisible)\n }\n })\n },\n addScrollListener() {\n this.$nextTick(() => {\n this.isBottomVisible()\n if (!this.isBottomScrolled) {\n if (this.$refs.raw) {\n this.$refs.raw.addEventListener('scroll', this.isBottomVisible)\n }\n if (this.$refs.table) {\n this.$refs.table.addEventListener('scroll', this.isBottomVisible)\n }\n }\n })\n },\n updateResultIndex() {\n if (this.resultKey !== this.result.resultKey) {\n this.results.forEach((result, index) => {\n if (result.resultKey === this.resultKey) {\n this.showDialog = true\n this.$emit('display-result', index)\n }\n })\n }\n },\n hideDialog() {\n if (this.showDialog) {\n this.showDialog = false\n }\n },\n increaseIndex() {\n if (this.showDialog) {\n if (this.resultIndex < this.results.length - 1) {\n this.$emit('display-result', this.resultIndex + 1)\n this.content = ''\n } else {\n this.$emit('display-result', 0)\n this.content = ''\n }\n }\n },\n decreaseIndex() {\n if (this.showDialog) {\n if (this.resultIndex > 0) {\n this.$emit('display-result', this.resultIndex - 1)\n } else {\n this.$emit('display-result', this.results.length - 1)\n }\n }\n },\n async loadFileContents() {\n const { lines, offset, reverse, end, previous } = this.streamOptions\n if (!end) {\n this.loading = true\n let content = await loadResult(\n this.result.analysis.pk,\n this.result.resultKey,\n lines,\n offset,\n reverse\n )\n this.loading = false\n\n if (content && previous !== content) {\n this.streamOptions.previous = content\n this.streamOptions.offset += lines\n this.content += content\n this.setTsvItems(this.content)\n this.addScrollListener()\n } else {\n this.streamOptions.end = true\n this.setTsvItems(this.content)\n }\n\n }\n },\n setTsvItems(content) {\n const isTsv = this.result.frontendType === 'tsv-file'\n const detectHandler = (\n detect(content.slice(0, 1000)) || { newline: '\\n', delimiter: '\\t'}\n )\n\n // csv to list of lists\n const dataRows =\n content && isTsv\n ? this.csvToArray(content.trim(), detectHandler.delimiter)\n .filter((row) => row.length)\n .filter((row) => row[0][0] !== '#' || row[0].includes('#CHROM'))\n : []\n\n // Headers\n this.tsvHeaders = dataRows.length\n ? dataRows[0].map((header, index) => {\n return {\n text: header,\n value: `index${index}`,\n sortable: this.streamOptions.end,\n }\n })\n : []\n\n this.tsvHeaders.unshift({\n text: 1,\n value: 'index',\n sortable: false,\n align: 'end',\n class: 'line-column text'\n })\n\n // Content rows\n this.tsvItems = dataRows.length\n ? dataRows.slice(1)\n .map((row, index) => {\n let dictRow = { index: index + 2 }\n row.forEach((value, index) => {\n dictRow[`index${index}`] = value\n })\n return dictRow\n })\n : []\n\n if (!isTsv || (isTsv && !this.tsvHeaders.length)) {\n this.displayRawText = true\n }\n },\n reverseContent() {\n const reverse = this.streamOptions.reverse\n this.resetStreamEvents()\n this.streamOptions.reverse = !reverse\n this.loadFileContents()\n },\n isBottomVisible() {\n const divElement = this.$refs[this.resultType]\n const scrollTop = divElement.scrollTop\n const visible = divElement.clientHeight\n const pageHeight = divElement.scrollHeight\n const bottomOfPage = visible + scrollTop >= pageHeight\n this.isBottomScrolled = bottomOfPage || pageHeight < visible\n },\n toggleFullScreen() {\n this.$store.dispatch(TOGGLE_RESULT_FULLSCREEN, {\n value: !this.isResultModalFullScreen\n })\n },\n parseTsvCell(value) {\n let pattern = /^((http|https|ftp):\\/\\/)/\n if (pattern.test(value)) {\n return `<a href=\"${value}\" target=\"_blank\">Open link</a>`\n } else {\n return value\n }\n },\n\n csvToArray(strData, strDelimiter=\",\") {\n // See: https://stackoverflow.com/a/1293163/3949081\n const objPattern = new RegExp(\n (\n // Delimiters.\n \"(\\\\\" + strDelimiter + \"|\\\\r?\\\\n|\\\\r|^)\" +\n // Quoted fields.\n \"(?:\\\"([^\\\"]*(?:\\\"\\\"[^\\\"]*)*)\\\"|\" +\n // Standard fields.\n \"([^\\\"\\\\\" + strDelimiter + \"\\\\r\\\\n]*))\"\n ),\n \"gi\"\n )\n const arrData = [[]]\n let arrMatches = null\n\n while (arrMatches = objPattern.exec(strData)) {\n // If not delimiter, an end of row has been reached\n const strMatchedDelimiter = arrMatches[1]\n if (\n strMatchedDelimiter.length &&\n strMatchedDelimiter !== strDelimiter\n ){\n arrData.push([])\n }\n\n let strMatchedValue\n if (arrMatches[2]){\n // Quoted value, Unescape any double quotes.\n strMatchedValue = arrMatches[2].replace(\n new RegExp( \"\\\"\\\"\", \"g\" ),\n \"\\\"\"\n )\n } else {\n // Non-quoted value.\n strMatchedValue = arrMatches[3]\n }\n arrData[arrData.length - 1].push(strMatchedValue)\n }\n return arrData\n }\n },\n}\n</script>\n\n<style lang=\"scss\">\n.tsv-table {\n max-width: 100%;\n max-height: 100%;\n margin: 0px auto;\n overflow: auto;\n}\n.v-dialog {\n overflow-y: visible !important; // truly important for iframe performance, dont remove!\n &:not(.v-dialog--fullscreen) {\n max-height: 100% !important;\n max-width: calc(100% - 48px);\n }\n iframe.results-iframe {\n height: 100% !important;\n }\n &.gallery-dialog {\n height: calc(100vh - 60px);\n }\n}\n.results-image {\n max-width: 100%;\n max-height: 85vh;\n margin: auto;\n max-height: 100%;\n width: auto;\n}\n.gallery-card {\n ::-webkit-scrollbar {\n width: 0px;\n height: 0px;\n }\n}\n.v-application .gallery-card {\n .gallery-content {\n background: var(--v-background-base);\n }\n\n pre {\n white-space: pre-line;\n &.pre-wrap {\n white-space: pre-wrap;\n }\n code {\n font-size: 12px;\n font-weight: 600;\n }\n }\n\n &.theme--dark code {\n background-color: rgba(0,0,0,.05);\n }\n\n code.v-markup,\n pre.v-markup {\n padding: 10px;\n width: 100%;\n height: 100%;\n text-align: start;\n box-shadow: none;\n text-shadow: none;\n display: flex;\n position: relative;\n overflow-x: auto;\n overflow-y: auto;\n margin: 0px;\n top: 0px;\n color: rgb(255, 255, 255);\n border-radius: 0px;\n background: rgb(0, 0, 0);\n font-size: 12px;\n font-weight: 600;\n\n code.hljs {\n font-size: 12px;\n padding: 0px;\n\n .hljs-string,\n .hljs-bullet,\n .hljs-subst,\n .hljs-title,\n .hljs-section,\n .hljs-emphasis,\n .hljs-type,\n .hljs-built_in,\n .hljs-builtin-name,\n .hljs-selector-attr,\n .hljs-selector-pseudo,\n .hljs-addition,\n .hljs-variable,\n .hljs-template-tag,\n .hljs-template-variable {\n color: var(--v-warning-base);\n }\n }\n }\n\n .tsv-table {\n border: thin solid rgba(0,0,0,.12);\n margin-left: 0;\n\n .theme--dark {\n thead tr th {\n background: var(--v-surface-darken1);\n span {\n color: #9e9e9e;\n }\n }\n tbody tr td {\n background: var(--v-background-base);\n span {\n color: #9e9e9e;\n }\n }\n }\n\n thead tr {\n th {\n background: var(--v-background-base);\n max-width: 250px;\n white-space: nowrap;\n span {\n font-size: 12px;\n font-family: Roboto;\n color: #333333;\n }\n }\n }\n tbody tr {\n td {\n font-size: 12px;\n font-family: Roboto;\n overflow-x: auto;\n white-space: nowrap;\n max-width: 250px;\n }\n }\n\n thead tr th, tbody tr td {\n &.line-column {\n background: var(--v-surface-darken1);\n width: 50px;\n text-align: right;\n font-weight: normal;\n // Make line-column sticky\n position: sticky !important;\n left: 0;\n z-index: 9998;\n }\n }\n\n thead tr th .line-column {\n z-index: 9999;\n }\n }\n\n\n .stream-message {\n font-size: 12px;\n font-style: italic;\n margin: 20px 0px;\n }\n}\n</style>\n"]
279130
+ sourcesContent: ["<template>\n <v-dialog\n v-hotkey=\"keymap\"\n v-if=\"showDialog\"\n v-model=\"showDialog\"\n :fullscreen=\"isResultModalFullScreen\"\n scrollable\n class=\"gallery-dialog\"\n >\n <v-card flat class=\"gallery-card\">\n <v-card-title class=\"pa-2\">\n <v-row>\n <v-col cols=\"6\">\n <h3 class=\"font-weight-thin primary--text\">\n {{ result.verboseName }}\n </h3>\n </v-col>\n\n <v-col cols=\"6\" class=\"d-flex justify-end align-center panel-slot-actions\">\n\n <!-- toggle raw text -->\n <v-tooltip\n v-if=\"result.frontendType === 'tsv-file' && tsvHeaders.length\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"displayRawText = !displayRawText\"\n v-on=\"on\"\n >\n {{ displayRawText ? 'table_chart' : 'text_fields' }}\n </v-icon>\n </template>\n {{ displayRawText ? 'Display Tabulated Content' : 'Display Raw Content' }}\n </v-tooltip>\n\n <!-- download result -->\n <v-tooltip\n v-if=\"result.download\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.download\"\n v-on=\"on\"\n >\n {{ result.downloadIcon }}\n </v-icon>\n </template>\n {{ result.downloadIcon === 'open_in_new' ? 'Open in new tab' : 'Download Result' }}\n </v-tooltip>\n\n <!-- copy to clipboard -->\n <v-tooltip\n v-if=\"result.copyToClipBoard\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.copyToClipBoard\"\n v-on=\"on\"\n >\n file_copy\n </v-icon>\n </template>\n Copy to clipboard!\n </v-tooltip>\n\n <!-- external link -->\n <v-tooltip\n v-if=\"result.openExternalLink\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"result.openExternalLink\"\n v-on=\"on\"\n >\n info\n </v-icon>\n </template>\n Learn more!\n </v-tooltip>\n\n <!-- show from bottom -->\n <v-tooltip\n v-if=\"['raw'].includes(resultType)\"\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"reverseContent\"\n v-on=\"on\"\n >\n {{ streamOptions.reverse ? 'vertical_align_bottom' : 'vertical_align_top'}}\n </v-icon>\n </template>\n <span>\n Show content from {{ streamOptions.reverse ? 'top' : 'bottom' }}\n </span>\n </v-tooltip>\n\n <!-- show fullscreen -->\n <v-tooltip\n top\n >\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"toggleFullScreen\"\n v-on=\"on\"\n >\n {{ isResultModalFullScreen ? 'fullscreen_exit' : 'fullscreen'}}\n </v-icon>\n </template>\n <span>\n Toggle Full Screen\n </span>\n </v-tooltip>\n\n <!-- close dialog -->\n <v-tooltip top>\n <template v-slot:activator=\"{ on }\">\n <v-icon\n class=\"primary--text ml-4\"\n small\n @click=\"hideDialog\"\n v-on=\"on\"\n >\n close\n </v-icon>\n </template>\n Close file\n </v-tooltip>\n </v-col>\n </v-row>\n </v-card-title>\n\n <v-row class=\"pa-0 ma-0 gallery-content\" style=\"height: 85vh\">\n <v-progress-linear\n v-if=\"loading\"\n class=\"panel-loader\"\n indeterminate\n height=\"2\"\n color=\"primary\"\n />\n\n <pre\n v-highlightjs=\"content\"\n v-if=\"resultType === 'raw' && resultKey === 'command_script'\"\n ref=\"raw\"\n class=\"v-markup pre-wrap\"\n >\n <code class=\"bash\" />\n </pre>\n\n <code\n v-else-if=\"isAnsi\"\n ref=\"raw\"\n class=\"v-markup\"\n >\n <pre v-html=\"content\" />\n </code>\n\n <code\n v-else-if=\"resultType === 'raw'\"\n ref=\"raw\"\n class=\"v-markup\"\n >\n <pre>\n {{ content }}\n <!-- Footer showing if more content can be loaded -->\n <span v-if=\"content && content.split('\\n').length >= 200\">\n <span v-if=\"!streamOptions.end\" class=\"stream-message grey--text lighten-2\">\n ... Loading more rows\n </span>\n <span v-if=\"streamOptions.end\" class=\"stream-message grey--text\">\n *** End of file. ***\n </span>\n </span>\n </pre>\n </code>\n\n <div\n v-else-if=\"resultType === 'table'\"\n ref=\"table\"\n class=\"tsv-table\"\n >\n <v-data-table\n :headers=\"tsvHeaders\"\n :items=\"tsvItems\"\n :items-per-page=\"tsvItems.length\"\n hide-default-footer\n multi-sort\n fixed-header\n dense\n >\n <template v-slot:body=\"{ items }\">\n <tbody>\n <tr\n v-for=\"item in items\"\n :key=\"item.name\"\n >\n <td\n v-for=\"(header, index) in tsvHeaders\"\n :key=\"index + header.value\"\n :class=\"[header.value === 'index' ? 'line-column text' : '']\"\n v-html=\"parseTsvCell($get(item, header.value))\"\n />\n </tr>\n </tbody>\n </template>\n </v-data-table>\n\n <div class=\"text-center stream-message\">\n <!-- Footer showing if more content can be loaded -->\n <span v-if=\"content && content.split('\\n').length >= 200\">\n <span v-if=\"!streamOptions.end\">... Loading more rows</span>\n <span v-else>End of file.</span>\n </span>\n </div>\n </div>\n\n <img\n v-else-if=\"resultType === 'image'\"\n :src=\"$store.getters.getBlobUrl(result.downloadUrl)\"\n :alt=\"result.verboseName\"\n class=\"results-image\"\n >\n\n <iframe\n v-else-if=\"['html', 'pdf'].includes(resultType)\"\n :src=\"$store.getters.getBlobUrl(result.downloadUrl, '')\"\n frameborder=\"0\"\n class=\"results-iframe\"\n style=\"width: 100%; height: 100%; min-height: 80vh;\"\n />\n\n <iframe\n v-else-if=\"resultType === 'igv_bam'\"\n :src=\"result.downloadUrl\"\n frameborder=\"0\"\n class=\"results-iframe\"\n style=\"width: 100%; height: 100%; min-height: 80vh;\"\n />\n\n <code\n v-else-if=\"resultType === 'number'\"\n class=\"v-markup\"\n >\n <span size=\"100px\">{{ result.value | round(3) }}</span>\n </code>\n\n <code\n v-else-if=\"['string', 'url-link'].includes(resultType)\"\n class=\"v-markup\"\n >\n <span size=\"100px\">{{ result.value }}</span>\n </code>\n </v-row>\n\n </v-card>\n </v-dialog>\n</template>\n\n<script>\nimport { loadResult } from '@/utils/api'\nimport { HIDE_PANEL, SHOW_PANEL } from '@/store/actions/panels'\nimport { TOGGLE_RESULT_FULLSCREEN } from '@/store/actions/user'\nimport { GET_FILE } from '@/store/actions/files'\nimport { mapGetters } from 'vuex'\nimport detect from 'detect-csv'\n\nexport default {\n name: 'ResultsGallery',\n props: {\n resultIndex: {\n type: Number,\n },\n results: {\n type: Array,\n },\n },\n data() {\n return {\n content: '',\n displayRawText: false,\n isBottomScrolled: false,\n loading: false,\n showDialog: false,\n tsvItems: [],\n tsvHeaders: [],\n streamOptions: {\n lines: 200,\n offset: 0,\n reverse: false,\n previous: '',\n end: false,\n },\n }\n },\n computed: {\n ...mapGetters(['resultKey', 'isResultModalFullScreen']),\n keymap() {\n return {\n right: this.increaseIndex,\n left: this.decreaseIndex,\n esc: this.hideDialog,\n }\n },\n result() {\n return this.results[this.resultIndex] || {}\n },\n isAnsi() {\n return this.result && this.result.frontendType === 'ansi'\n },\n resultType() {\n if (this.result.frontendType === 'ansi') {\n return 'raw'\n } else if (this.result.frontendType === 'text-file') {\n return 'raw'\n } else if (this.result.frontendType === 'tsv-file') {\n if (\n !this.displayRawText &&\n this.tsvItems.length &&\n this.tsvHeaders.length\n ) {\n return 'table'\n } else {\n return 'raw'\n }\n } else {\n return this.result.frontendType\n }\n },\n },\n watch: {\n showDialog(value) {\n if (!value) {\n this.$store.dispatch(HIDE_PANEL, 'result')\n this.$emit('display-result', null)\n }\n },\n resultIndex(value) {\n this.showDialog = Number.isInteger(value) && value < this.results.length\n if (this.showDialog && ['raw', 'table'].includes(this.resultType)) {\n this.resetStreamEvents()\n this.loadFileContents()\n }\n },\n resultKey: {\n handler() {\n this.updateResultIndex()\n },\n immediate: true,\n },\n result(value) {\n if (value && value.resultKey) {\n this.$store.dispatch(SHOW_PANEL, {\n result: value.resultKey,\n })\n if (['html', 'pdf'].includes(value.frontendType)) {\n this.$store.dispatch(GET_FILE, value.downloadUrl)\n }\n // Track result viewed\n window.analytics.track('Result Previewed', value.analytics)\n }\n this.updateResultIndex()\n },\n isBottomScrolled(value) {\n if (value) {\n this.loadFileContents()\n }\n },\n displayRawText() {\n this.addScrollListener()\n },\n },\n methods: {\n resetStreamEvents() {\n // Reset content\n this.content = ''\n this.streamOptions = {\n lines: 200,\n offset: 0,\n reverse: false,\n previous: '',\n end: false,\n }\n // Remove listeners\n this.$nextTick(() => {\n if (this.$refs.raw) {\n this.$refs.raw.removeEventListener('scroll', this.isBottomVisible)\n }\n if (this.$refs.table) {\n this.$refs.table.removeEventListener('scroll', this.isBottomVisible)\n }\n })\n },\n addScrollListener() {\n this.$nextTick(() => {\n this.isBottomVisible()\n if (!this.isBottomScrolled) {\n if (this.$refs.raw) {\n this.$refs.raw.addEventListener('scroll', this.isBottomVisible)\n }\n if (this.$refs.table) {\n this.$refs.table.addEventListener('scroll', this.isBottomVisible)\n }\n }\n })\n },\n updateResultIndex() {\n if (this.resultKey !== this.result.resultKey) {\n this.results.forEach((result, index) => {\n if (result.resultKey === this.resultKey) {\n this.showDialog = true\n this.$emit('display-result', index)\n }\n })\n }\n },\n hideDialog() {\n if (this.showDialog) {\n this.showDialog = false\n }\n },\n increaseIndex() {\n if (this.showDialog) {\n if (this.resultIndex < this.results.length - 1) {\n this.$emit('display-result', this.resultIndex + 1)\n this.content = ''\n } else {\n this.$emit('display-result', 0)\n this.content = ''\n }\n }\n },\n decreaseIndex() {\n if (this.showDialog) {\n if (this.resultIndex > 0) {\n this.$emit('display-result', this.resultIndex - 1)\n } else {\n this.$emit('display-result', this.results.length - 1)\n }\n }\n },\n async loadFileContents() {\n const { lines, offset, reverse, end, previous } = this.streamOptions\n if (!end) {\n this.loading = true\n let content = await loadResult(\n this.result.analysis.pk,\n this.result.resultKey,\n lines,\n offset,\n reverse\n )\n this.loading = false\n\n if (content && previous !== content) {\n this.streamOptions.previous = content\n this.streamOptions.offset += lines\n this.content += content\n this.setTsvItems(this.content)\n this.addScrollListener()\n } else {\n this.streamOptions.end = true\n this.setTsvItems(this.content)\n }\n\n }\n },\n setTsvItems(content) {\n const isTsv = this.result.frontendType === 'tsv-file'\n const detectHandler = (\n detect(content.slice(0, 1000)) || { newline: '\\n', delimiter: '\\t'}\n )\n\n // csv to list of lists\n const dataRows =\n content && isTsv\n ? this.csvToArray(content.trim(), detectHandler.delimiter)\n .filter((row) => row.length)\n .filter((row) => row[0][0] !== '#' || row[0].includes('#CHROM'))\n : []\n\n // Headers\n this.tsvHeaders = dataRows.length\n ? dataRows[0].map((header, index) => {\n return {\n text: header,\n value: `index${index}`,\n sortable: this.streamOptions.end,\n }\n })\n : []\n\n this.tsvHeaders.unshift({\n text: 1,\n value: 'index',\n sortable: false,\n align: 'end',\n class: 'line-column text'\n })\n\n // Content rows\n this.tsvItems = dataRows.length\n ? dataRows.slice(1)\n .map((row, index) => {\n let dictRow = { index: index + 2 }\n row.forEach((value, index) => {\n dictRow[`index${index}`] = value\n })\n return dictRow\n })\n : []\n\n if (!isTsv || (isTsv && !this.tsvHeaders.length)) {\n this.displayRawText = true\n }\n },\n reverseContent() {\n const reverse = this.streamOptions.reverse\n this.resetStreamEvents()\n this.streamOptions.reverse = !reverse\n this.loadFileContents()\n },\n isBottomVisible() {\n const divElement = this.$refs[this.resultType]\n const scrollTop = divElement.scrollTop\n const visible = divElement.clientHeight\n const pageHeight = divElement.scrollHeight\n const bottomOfPage = visible + scrollTop >= pageHeight\n this.isBottomScrolled = bottomOfPage || pageHeight < visible\n },\n toggleFullScreen() {\n this.$store.dispatch(TOGGLE_RESULT_FULLSCREEN, {\n value: !this.isResultModalFullScreen\n })\n },\n parseTsvCell(value) {\n let pattern = /^((http|https|ftp):\\/\\/)/\n if (pattern.test(value)) {\n return `<a href=\"${value}\" target=\"_blank\">Open link</a>`\n } else {\n return value\n }\n },\n\n csvToArray(strData, strDelimiter=\",\") {\n // See: https://stackoverflow.com/a/1293163/3949081\n const objPattern = new RegExp(\n (\n // Delimiters.\n \"(\\\\\" + strDelimiter + \"|\\\\r?\\\\n|\\\\r|^)\" +\n // Quoted fields.\n \"(?:\\\"([^\\\"]*(?:\\\"\\\"[^\\\"]*)*)\\\"|\" +\n // Standard fields.\n \"([^\\\"\\\\\" + strDelimiter + \"\\\\r\\\\n]*))\"\n ),\n \"gi\"\n )\n const arrData = [[]]\n let arrMatches = null\n\n while (arrMatches = objPattern.exec(strData)) {\n // If not delimiter, an end of row has been reached\n const strMatchedDelimiter = arrMatches[1]\n if (\n strMatchedDelimiter.length &&\n strMatchedDelimiter !== strDelimiter\n ){\n arrData.push([])\n }\n\n let strMatchedValue\n if (arrMatches[2]){\n // Quoted value, Unescape any double quotes.\n strMatchedValue = arrMatches[2].replace(\n new RegExp( \"\\\"\\\"\", \"g\" ),\n \"\\\"\"\n )\n } else {\n // Non-quoted value.\n strMatchedValue = arrMatches[3]\n }\n arrData[arrData.length - 1].push(strMatchedValue)\n }\n return arrData\n }\n },\n}\n</script>\n\n<style lang=\"scss\">\n.tsv-table {\n max-width: 100%;\n max-height: 100%;\n margin: 0px auto;\n overflow: auto;\n}\n.v-dialog {\n overflow-y: visible !important; // truly important for iframe performance, dont remove!\n &:not(.v-dialog--fullscreen) {\n max-height: 100% !important;\n max-width: calc(100% - 48px);\n }\n iframe.results-iframe {\n height: 100% !important;\n }\n &.gallery-dialog {\n height: calc(100vh - 60px);\n }\n}\n.results-image {\n max-width: 100%;\n max-height: 85vh;\n margin: auto;\n max-height: 100%;\n width: auto;\n}\n.gallery-card {\n ::-webkit-scrollbar {\n width: 0px;\n height: 0px;\n }\n}\n.v-application .gallery-card {\n .gallery-content {\n background: var(--v-background-base);\n }\n\n pre {\n white-space: pre-line;\n &.pre-wrap {\n white-space: pre-wrap;\n }\n code {\n font-size: 12px;\n font-weight: 600;\n }\n }\n\n &.theme--dark code {\n background-color: rgba(0,0,0,.05);\n }\n\n code.v-markup,\n pre.v-markup {\n padding: 10px;\n width: 100%;\n height: 100%;\n text-align: start;\n box-shadow: none;\n text-shadow: none;\n display: flex;\n position: relative;\n overflow-x: auto;\n overflow-y: auto;\n margin: 0px;\n top: 0px;\n color: rgb(255, 255, 255);\n border-radius: 0px;\n background: rgb(0, 0, 0);\n font-size: 12px;\n font-weight: 600;\n\n code.hljs {\n font-size: 12px;\n padding: 0px;\n\n .hljs-string,\n .hljs-bullet,\n .hljs-subst,\n .hljs-title,\n .hljs-section,\n .hljs-emphasis,\n .hljs-type,\n .hljs-built_in,\n .hljs-builtin-name,\n .hljs-selector-attr,\n .hljs-selector-pseudo,\n .hljs-addition,\n .hljs-variable,\n .hljs-template-tag,\n .hljs-template-variable {\n color: var(--v-warning-base);\n }\n }\n }\n\n .tsv-table {\n border: thin solid rgba(0,0,0,.12);\n margin-left: 0;\n\n .theme--dark {\n thead tr th {\n background: var(--v-surface-darken1);\n span {\n color: #9e9e9e;\n }\n }\n tbody tr td {\n background: var(--v-background-base);\n span {\n color: #9e9e9e;\n }\n }\n }\n\n thead tr {\n th {\n background: var(--v-background-base);\n max-width: 250px;\n white-space: nowrap;\n span {\n font-size: 12px;\n font-family: Roboto;\n color: #333333;\n }\n }\n }\n tbody tr {\n td {\n font-size: 12px;\n font-family: Roboto;\n overflow-x: auto;\n white-space: nowrap;\n max-width: 250px;\n }\n }\n\n thead tr th, tbody tr td {\n &.line-column {\n background: var(--v-surface-darken1);\n width: 50px;\n text-align: right;\n font-weight: normal;\n // Make line-column sticky\n position: sticky !important;\n left: 0;\n z-index: 9998;\n }\n }\n\n thead tr th .line-column {\n z-index: 9999;\n }\n }\n\n\n .stream-message {\n font-size: 12px;\n font-style: italic;\n margin: 20px 0px;\n }\n}\n</style>\n"]
279166
279131
  },
279167
279132
  _coverageSchema: "43e27e138ebf9cfc5966b082cf9a028302ed4184",
279168
- hash: "68d228565d6b6c5100fcb14e924652ac345880c1"
279133
+ hash: "5d444039a2a8e9894579cef12c5354c23ba58df6"
279169
279134
  };
279170
279135
  var coverage = global[gcv] || (global[gcv] = {});
279171
279136
  if (coverage[path] && coverage[path].hash === hash) {
@@ -279711,9 +279676,9 @@ function ResultsGalleryvue_type_script_lang_js_toPrimitive(input, hint) { if (Re
279711
279676
  });
279712
279677
  ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue?vue&type=script&lang=js&
279713
279678
  /* harmony default export */ var analyses_ResultsGalleryvue_type_script_lang_js_ = (ResultsGalleryvue_type_script_lang_js_);
279714
- // EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/analyses/ResultsGallery.vue?vue&type=style&index=0&id=1140a7e3&prod&lang=scss&
279715
- var ResultsGalleryvue_type_style_index_0_id_1140a7e3_prod_lang_scss_ = __webpack_require__(43344);
279716
- ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue?vue&type=style&index=0&id=1140a7e3&prod&lang=scss&
279679
+ // EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/analyses/ResultsGallery.vue?vue&type=style&index=0&id=b464b2ba&prod&lang=scss&
279680
+ var ResultsGalleryvue_type_style_index_0_id_b464b2ba_prod_lang_scss_ = __webpack_require__(89181);
279681
+ ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue?vue&type=style&index=0&id=b464b2ba&prod&lang=scss&
279717
279682
 
279718
279683
  ;// CONCATENATED MODULE: ./src/components/analyses/ResultsGallery.vue
279719
279684
 
@@ -279726,8 +279691,8 @@ var ResultsGalleryvue_type_style_index_0_id_1140a7e3_prod_lang_scss_ = __webpack
279726
279691
 
279727
279692
  var ResultsGallery_component = normalizeComponent(
279728
279693
  analyses_ResultsGalleryvue_type_script_lang_js_,
279729
- ResultsGalleryvue_type_template_id_1140a7e3_render,
279730
- ResultsGalleryvue_type_template_id_1140a7e3_staticRenderFns,
279694
+ ResultsGalleryvue_type_template_id_b464b2ba_render,
279695
+ ResultsGalleryvue_type_template_id_b464b2ba_staticRenderFns,
279731
279696
  false,
279732
279697
  null,
279733
279698
  null,
@@ -328967,7 +328932,7 @@ var BioModelPanelvue_type_template_id_3ac4385c_staticRenderFns = (cov_1tpnym9o7k
328967
328932
 
328968
328933
  ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelPanel.vue?vue&type=template&id=3ac4385c&
328969
328934
 
328970
- ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/bioModels/BioModelTree.vue?vue&type=template&id=2e68a456&
328935
+ ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/bioModels/BioModelTree.vue?vue&type=template&id=337f42f6&
328971
328936
  var cov_2f0u9tmiep = function () {
328972
328937
  var path = "/Users/arangooj/papaemme/isabl_web/src/components/bioModels/BioModelTree.vue";
328973
328938
  var hash = "f7765366ebb3c7a640aaf82703057afe08ae5056";
@@ -329334,7 +329299,7 @@ var cov_2f0u9tmiep = function () {
329334
329299
  return coverage[path] = coverageData;
329335
329300
  }();
329336
329301
  cov_2f0u9tmiep.s[0]++;
329337
- var BioModelTreevue_type_template_id_2e68a456_render = function render() {
329302
+ var BioModelTreevue_type_template_id_337f42f6_render = function render() {
329338
329303
  cov_2f0u9tmiep.f[0]++;
329339
329304
  var _vm = (cov_2f0u9tmiep.s[1]++, this),
329340
329305
  _c = (cov_2f0u9tmiep.s[2]++, _vm._self._c);
@@ -329409,14 +329374,14 @@ var BioModelTreevue_type_template_id_2e68a456_render = function render() {
329409
329374
  staticClass: "individual-tree text-center pa-0 ma-0"
329410
329375
  })], 1)], 1);
329411
329376
  };
329412
- var BioModelTreevue_type_template_id_2e68a456_staticRenderFns = (cov_2f0u9tmiep.s[9]++, []);
329377
+ var BioModelTreevue_type_template_id_337f42f6_staticRenderFns = (cov_2f0u9tmiep.s[9]++, []);
329413
329378
 
329414
- ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue?vue&type=template&id=2e68a456&
329379
+ ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue?vue&type=template&id=337f42f6&
329415
329380
 
329416
329381
  ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/bioModels/BioModelTree.vue?vue&type=script&lang=js&
329417
329382
  var BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep = function () {
329418
329383
  var path = "/Users/arangooj/papaemme/isabl_web/src/components/bioModels/BioModelTree.vue";
329419
- var hash = "59e08d1c64c25cb454a3e5dffce258dc15f4d5b9";
329384
+ var hash = "be336c38506a643b71832f44cd825ff3c922878c";
329420
329385
  var global = new Function("return this")();
329421
329386
  var gcv = "__coverage__";
329422
329387
  var coverageData = {
@@ -334936,10 +334901,10 @@ var BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep = function () {
334936
334901
  mappings: ";AA4CA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA",
334937
334902
  file: "BioModelTree.vue",
334938
334903
  sourceRoot: "src/components/bioModels",
334939
- sourcesContent: ["<template>\n <v-card\n flat\n class=\"isabl-base-card\"\n data-test=\"biomodel-tree\"\n >\n <base-section-title\n :show-more=\"showTree\"\n @toggle-show-more=\"showTree = !showTree\"\n >\n <template v-slot:title>Samples Tree</template>\n <template v-slot:actions>\n <div>\n <v-btn\n v-if=\"isBigTree\"\n class=\"table-action-btn pull-right ma-0\"\n fab\n outlined\n color=\"primary\"\n @click=\"\n showFullHeight = !showFullHeight\n scrollToCurrentNode()\n \"\n >\n <v-icon color=\"primary\">{{ showFullHeight ? 'expand_less' : 'expand_more' }}</v-icon>\n </v-btn>\n </div>\n </template>\n </base-section-title>\n\n <!-- Graph -->\n <v-row\n v-show=\"showTree\"\n id=\"tree-div\"\n :style=\"showFullHeight ? '' : 'max-height: 300px;'\"\n class=\"individual-tree-div ma-0\"\n >\n <v-col class=\"individual-tree text-center pa-0 ma-0\" />\n </v-row>\n\n </v-card>\n</template>\n\n<script>\n/*\n Vue implementation of D3 Tree from:\n https://beta.observablehq.com/@asktree/interactive-tree-diagram-d3v4-v5\n*/\n\nimport { fetchIndividualTree } from '@/utils/api'\nimport { mapGetters } from 'vuex'\nimport { SHOW_ALERT } from '@/store/actions/alert'\nimport { SHOW_PANEL } from '@/store/actions/panels'\nimport BasePanel from '@/components/base/BasePanel.vue'\nimport BaseSectionTitle from '@/components/base/BaseSectionTitle'\nimport {\n tree as d3Tree,\n event as d3Event,\n select as d3Select,\n hierarchy as d3Hierarchy,\n linkHorizontal as d3linkHorizontal\n} from 'd3'\n\nexport default {\n name: 'BioModelTree',\n components: {\n BasePanel,\n BaseSectionTitle\n },\n data() {\n const { treeIcons } = this.$settings\n return {\n loading: false,\n duration: 0,\n data: null,\n root: null,\n tree: null,\n graph: null,\n species: null,\n dataNodes: null,\n showTree: true,\n isBigTree: false,\n showFullHeight: true,\n skipToScrollNode: false,\n currentNode: null,\n nodeSize: Object.keys(treeIcons).length ? 15 : 5,\n margin: { top: 20, bottom: 20, right: 0, left: 105 },\n diagonal: d3linkHorizontal()\n .x(d => d.y)\n .y(d => d.x),\n treeIcons\n }\n },\n computed: {\n ...mapGetters({\n currentModel: 'bioModelId',\n individual: 'individualId'\n })\n },\n watch: {\n individual(value, oldValue) {\n if (value !== oldValue) {\n this.fetchData()\n }\n },\n currentModel() {\n this.data && this.update(this.data)\n }\n },\n mounted() {\n this.fetchData()\n },\n methods: {\n buildTree() {\n let dx = Object.keys(this.treeIcons).length ? this.nodeSize + 4 : 18\n let dy = 0\n let iconSize = this.nodeSize\n\n // set width\n this.width = 540 - this.margin.right - this.margin.left\n this.tree = d3Tree()\n .nodeSize([dx, dy])\n .separation((a, b) => (a.parent == b.parent ? 1.75 : 2.5))\n\n // clear div\n let div = d3Select(this.$el).select('.individual-tree')\n div.selectAll('svg').remove()\n\n // create svg\n this.svg = div\n .append('svg')\n .attr('width', this.width)\n .attr('height', dx)\n .attr('viewBox', [-this.margin.left, -this.margin.top, this.width, dx])\n .style('font', '10px sans-serif')\n .style('user-select', 'none')\n\n // create filters\n this.svg\n .append('svg:filter')\n .attr('id', 'invertColor')\n .append('feColorMatrix')\n .attr('in', 'SourceGraphic')\n .attr('type', 'matrix')\n .attr('values', '-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0')\n\n // create image definitions\n const defs = this.svg.append('svg:defs')\n Object.keys(this.treeIcons).forEach(model => {\n const pattern = defs\n .append('svg:pattern')\n .attr('id', `icon-${model}`)\n .attr('width', iconSize)\n .attr('height', iconSize)\n .attr('patternUnits', 'objectBoundingBox')\n\n pattern\n .append('rect')\n .attr('width', '100%')\n .attr('height', '100%')\n .attr('fill', 'var(--v-primary-base)')\n\n pattern\n .append('svg:image')\n .attr('xlink:href', this.treeIcons[model])\n .attr('width', iconSize)\n .attr('height', iconSize)\n .attr('x', iconSize / 2)\n .attr('y', iconSize / 2)\n .attr('filter', 'url(#invertColor)')\n })\n\n // create links\n this.gLink = this.svg\n .append('g')\n .attr('fill', 'none')\n .attr('stroke', '#555')\n .attr('stroke-opacity', 0.4)\n .attr('stroke-width', 1.5)\n\n // create tooltip\n this.tooltip = d3Select('body')\n .append('div')\n .style('position', 'absolute')\n .style('z-index', '9999')\n .style('visibility', 'hidden')\n\n // create nodes\n this.gNode = this.svg.append('g')\n\n // build root\n this.root = d3Hierarchy(this.data, d => d.children)\n this.root.x0 = dy\n this.root.y0 = 0\n this.root.descendants().forEach((d, i) => {\n d.id = i\n d.collapsed = false\n d._children = d.children\n\n // collapse samples with too many experiments\n if (d.depth !== 0 && d.children ? d.children.length > 10 : false) {\n d.children = null\n d.collapsed = true\n }\n\n // by default hide tree if too many samples\n if (d.depth === 0 && d.children && d.children.length > 10) {\n this.showFullHeight = false\n this.isBigTree = true\n }\n })\n\n this.update(this.root)\n },\n async fetchData() {\n if (this.individual) {\n this.loading = true\n let individual = await fetchIndividualTree(this.individual)\n this.species = individual.species\n\n // Format Individual Tree\n let individualNode = {}\n individualNode.id = individual.system_id\n individualNode.uuid = individual.uuid\n individualNode.name = individual.system_id\n individualNode.parent = null\n individualNode.individual = individual\n individualNode.class = 'individual'\n if (individual.species === 'MOUSE') {\n individualNode.img = 'mouse'\n } else if (individual.species === 'HUMAN') {\n if (individual.gender === 'FEMALE') {\n individualNode.img = 'female'\n } else {\n individualNode.img = 'male'\n }\n } else {\n individualNode.img = 'alien'\n }\n individualNode.children = individual.sample_set.map(sample => {\n // Samples Children\n let sampleNode = {}\n sampleNode.id = sample.system_id\n sampleNode.uuid = sample.uuid\n sampleNode.name = sample.system_id.split('_')\n sampleNode.name = sampleNode.name[sampleNode.name.length - 1]\n sampleNode.parent = individual.system_id\n sampleNode.sample = sample\n sampleNode.individual = individual\n sampleNode.class = 'sample'\n\n if (sample.category === 'TUMOR') {\n sampleNode.img = 'tumor'\n } else {\n sampleNode.img = 'normal'\n }\n\n let aliquots_ids = [\n ...new Set(sample.experiment_set.map(e => e.aliquot_id))\n ]\n\n sampleNode.children = aliquots_ids\n .map(aliquot_id => {\n // Aliquot children\n let aliquotNode = {}\n aliquotNode.aliquot_id = aliquot_id\n aliquotNode.name = ''\n aliquotNode.parent = sample.system_id\n aliquotNode.sample = sample\n aliquotNode.sampleNode = sampleNode\n aliquotNode.individual = individual\n aliquotNode.class = 'aliquot'\n aliquotNode.img = 'aliquot'\n aliquotNode.children = []\n\n sample.experiment_set.map(experiment => {\n // Experiment Children\n if (experiment.aliquot_id === aliquot_id) {\n let experimentNode = {}\n experimentNode.parent = sample.system_id\n experimentNode.sample = sample\n experimentNode.individual = individual\n experimentNode.aliquot_id = experiment.aliquot_id\n experimentNode.id = experiment.system_id\n experimentNode.uuid = experiment.uuid\n experimentNode.class = 'experiment'\n experimentNode.experiment = experiment\n\n let name = experiment.system_id.split('_')\n experimentNode.name = name[name.length - 1]\n\n if (experiment.custom_fields.is_pdx) {\n experimentNode.img = 'mouse'\n } else {\n if (experiment.technique.category === 'IMG') {\n experimentNode.img = 'image'\n } else if (experiment.technique.category === 'TISSUE') {\n experimentNode.img = 'tissue'\n if (experiment.technique.method === 'CG') {\n experimentNode.img = 'chromosome'\n }\n if (experiment.technique.method === 'HP') {\n experimentNode.img = 'tissue'\n }\n if (experiment.technique.method === 'FC') {\n experimentNode.img = 'cells'\n }\n } else if (experiment.technique.category === 'RNA') {\n experimentNode.img = 'rna'\n } else if (experiment.technique.category === 'DNA') {\n experimentNode.img = 'dna'\n } else {\n experimentNode.img = 'dna'\n }\n }\n\n // legacy leukgen ID\n if (experiment.system_id.split('-').length === 7) {\n aliquotNode.name = experiment.system_id.split('-')[4]\n experimentNode.name = experiment.system_id\n .split('-')\n .slice(5, 7)\n .join('-')\n } else {\n aliquotNode.name = experiment.system_id.split('_')\n aliquotNode.name = parseInt(\n aliquotNode.name[aliquotNode.name.length - 2]\n )\n }\n aliquotNode.children.push(experimentNode)\n }\n })\n return aliquotNode\n })\n .sort((a, b) => a.name - b.name)\n return sampleNode\n })\n\n this.data = individualNode\n this.dataNodes = individualNode.children.reduce(\n (totalNodes, nodeInChildren) => {\n return totalNodes + nodeInChildren.children.length\n },\n 0\n )\n\n this.buildTree()\n this.loading = false\n }\n },\n update(source) {\n const duration = d3Event && d3Event.altKey ? 2500 : 250\n const nodes = this.root.descendants().reverse()\n const links = this.root.links()\n\n // Compute the new tree layout.\n this.tree(this.root)\n\n let left = this.root\n let right = this.root\n this.root.eachBefore(node => {\n if (node.x < left.x) left = node\n if (node.x > right.x) right = node\n })\n\n const height = right.x - left.x + this.margin.top + this.margin.bottom\n\n this.svg\n .transition()\n .duration(duration)\n .attr('height', height)\n .attr('viewBox', [\n -this.margin.left,\n left.x - this.margin.top,\n this.width,\n height\n ])\n .tween(\n 'resize',\n window.ResizeObserver ? null : () => () => this.svg.dispatch('toggle')\n )\n\n // Normalize for fixed-depth.\n nodes.forEach(d => {\n d.y = {\n individual: 0,\n sample: 135,\n aliquot: 200,\n experiment: 300\n }[d.data.class]\n })\n\n // ****************** Nodes section ***************************\n\n // Update the nodes...\n let node = this.gNode.selectAll('g').data(nodes, d => d.id)\n\n // Enter any new modes at the parent's previous position.\n let nodeEnter = node\n .enter()\n .append('g')\n .attr('class', d => `node ${d.data.class}`)\n .attr('transform', () => `translate(${source.y0},${source.x0})`)\n\n const circles = nodeEnter\n .append('circle')\n .attr('cursor', d => (d.data.class !== 'aliquot' ? 'pointer' : null))\n .attr('class', 'node shades--text')\n\n circles.style('fill', d =>\n this.treeIcons[d.data.img] ? `url(#icon-${d.data.img})` : ''\n )\n\n nodeEnter\n .on('click', this.changeModel)\n // tooltip, see https://stackoverflow.com/questions/10805184\n .on('mouseover', d => {\n if (d.data.class === 'aliquot' && d.parent.children.length < 2) return\n\n let leftPaddings = { experiment: 300, individual: 120, sample: 200 }\n this.tooltip\n .html(this.getTooltip(d))\n .style('visibility', 'visible')\n .attr('transform', `translate(${d.y},${d.x})`)\n .style('top', `${d3Event.pageY + 20}px`)\n .style('left', `${d3Event.pageX - leftPaddings[d.data.class]}px`)\n })\n .on('mouseout', () => this.tooltip.style('visibility', 'hidden'))\n\n // Add labels for the nodes\n nodeEnter\n .append('text')\n .on('click', this.onTextClick)\n .attr('dy', '.35em')\n .attr('x', -13)\n .attr('text-anchor', d => (d.children || d._children ? 'end' : 'end'))\n .text(d =>\n d.data.class === 'aliquot' && d.parent.children.length < 2\n ? ''\n : d.data.name\n )\n\n // Add collapse text to indicate node can be opened\n nodeEnter\n .append('text')\n .attr('dy', 0)\n .attr('x', 26)\n .text('...')\n .attr('class', 'collapse-text')\n\n // UPDATE\n let nodeUpdate = nodeEnter.merge(node)\n\n // Transition to the proper position for the node\n nodeUpdate\n .transition()\n .duration(this.duration)\n .attr('transform', d => `translate(${d.y},${d.x})`)\n\n // Update the node attributes and style\n nodeUpdate\n .select('.node')\n .attr('r', d => (d.data.class !== 'aliquot' ? this.nodeSize : 5))\n .attr('cx', this.nodeSize / 2)\n .attr('cy', 0)\n .attr('data-intercom-target', d => `tree-node-circle-${d.data.id}`)\n .attr('fill', d =>\n d._children && !d.children ? 'gray' : 'var(--v-primary-base)'\n )\n .attr('opacity', d =>\n d.data.class === 'aliquot' && d.parent.children.length < 2 ? 0 : 1\n )\n .style('stroke', d => {\n if (\n d.data.id === this.currentModel ||\n d.data.uuid === this.currentModel\n ) {\n this.currentNode = d\n if (!this.skipToScrollNode) {\n this.scrollToCurrentNode()\n }\n this.skipToScrollNode = false\n return 'var(--v-secondary-base)'\n }\n return 'transparent'\n })\n\n // Only show dots for collapsed and collapsible nodes\n nodeUpdate\n .select('text.collapse-text')\n .attr('visibility', d =>\n d.collapsed && d._children ? 'visible' : 'hidden'\n )\n\n // Remove any exiting nodes\n let nodeExit = node\n .exit()\n .transition()\n .duration(this.duration)\n .attr('transform', `translate(${source.y},${source.x})`)\n .remove()\n\n // On exit reduce the node circles size to 0\n nodeExit.select('.node').attr('r', 1e-6)\n\n // On exit reduce the opacity of text labels\n nodeExit.select('text').style('fill-opacity', 1e-6)\n\n // ================ links section ================\n\n // Update the links\n let link = this.gLink.selectAll('path.link').data(links, d => d.id)\n\n // Enter any new links at the parent's previous position.\n let linkEnter = link\n .enter()\n .insert('path', 'g')\n .attr('class', 'link')\n\n // UPDATE\n let linkUpdate = linkEnter.merge(link)\n\n // Transition back to the parent element position\n linkUpdate\n .transition()\n .duration(this.duration)\n .attr('d', this.diagonal)\n\n // Remove any exiting links\n link\n .exit()\n .transition()\n .duration(this.duration)\n .remove()\n\n // Store the old positions for transition.\n nodes.forEach(d => {\n d.x0 = d.x\n d.y0 = d.y\n })\n\n this.$emit('update-size')\n },\n onTextClick(d) {\n this.collapseBranch(d)\n if (!d._children && d.data.id) {\n this.$copyText(d.data.id).then(\n () => {\n this.$store.dispatch(SHOW_ALERT, {\n message: 'Copied System ID to clipboard!'\n })\n },\n () => {\n this.$store.dispatch(SHOW_ALERT, {\n error: 'System ID could not be copied to clipboard'\n })\n }\n )\n }\n },\n collapseBranch(d) {\n d.children = d.children ? null : d._children\n d.collapsed = !d.collapsed\n this.update(d)\n },\n changeModel(d) {\n if (d.data.id) {\n this.skipToScrollNode = true // don't scroll to node when click\n\n // Track individual tree usage\n window.analytics.track('Browsed Individual Tree', {\n model: d.data.class,\n record: d.data.id\n })\n\n this.tooltip.style('visibility', 'hidden')\n\n this.$store.dispatch(SHOW_PANEL, {\n bioModel: d.data.id\n })\n }\n },\n scrollToCurrentNode() {\n this.$nextTick(() => {\n if (!this.showFullHeight)\n setTimeout(() => {\n document.getElementById('tree-div').scrollTop =\n this.currentNode.x0 + 395 // 395 is a function of the max height\n }, 100) // this delay was determined kind of experimentally\n })\n },\n getTooltip(d) {\n const keyValue = (key, verboseName) => {\n let value = this.$get(d.data, key, null)\n return value === null\n ? ''\n : `\n <div class=\"layout row ma-3\" style=\"max-width: 100%\"\">\n <div class=\"flex xs5\" style=\"width: 100%\">${verboseName}</div>\n <div class=\"flex xs7\" style=\"width: 100%\"><b>${value}</b></div>\n </div>\n `\n }\n return `\n <div class=\"v-tooltip__content tree-tooltip\" style=\"min-width: 350px;\">\n ${keyValue('experiment.system_id', 'System ID')}\n ${keyValue('experiment.identifier', 'Experiment ID')}\n ${keyValue('aliquot_id', 'Aliquot ID')}\n ${keyValue('sample.identifier', 'Sample ID')}\n ${keyValue('individual.identifier', 'Individual ID')}\n ${keyValue('experiment.technique.method', 'Method')}\n ${keyValue('experiment.technique.name', 'Technique Name')}\n ${keyValue('sample.disease.acronym', 'Disease')}\n ${keyValue('individual.species', 'Species')}\n ${keyValue('individual.center.acronym', 'Center')}\n </div>\n `\n }\n }\n}\n</script>\n\n<style lang=\"scss\">\n.tree-tooltip.v-tooltip__content {\n color: white;\n padding: 20px;\n opacity: 1;\n font-size: 12px;\n overflow: hidden;\n}\n.node-tooltip {\n background: rgba($color: #000000, $alpha: 0.8);\n}\n.individual-tree-div {\n overflow-x: scroll;\n margin: auto;\n .node {\n stroke-width: 3px;\n text {\n font-size: 14px;\n font-weight: 300;\n fill: black !important;\n cursor: pointer;\n &.collapse-text {\n font-size: 20px;\n font-weight: 200;\n cursor: default;\n }\n }\n &.experiment text {\n cursor: default;\n }\n }\n .link {\n fill: none;\n stroke-width: 1.5px;\n stroke: #aaa;\n }\n}\n</style>\n"]
334904
+ sourcesContent: ["<template>\n <v-card\n flat\n class=\"isabl-base-card\"\n data-test=\"biomodel-tree\"\n >\n <base-section-title\n :show-more=\"showTree\"\n @toggle-show-more=\"showTree = !showTree\"\n >\n <template v-slot:title>Samples Tree</template>\n <template v-slot:actions>\n <div>\n <v-btn\n v-if=\"isBigTree\"\n class=\"table-action-btn pull-right ma-0\"\n fab\n outlined\n color=\"primary\"\n @click=\"\n showFullHeight = !showFullHeight\n scrollToCurrentNode()\n \"\n >\n <v-icon color=\"primary\">{{ showFullHeight ? 'expand_less' : 'expand_more' }}</v-icon>\n </v-btn>\n </div>\n </template>\n </base-section-title>\n\n <!-- Graph -->\n <v-row\n v-show=\"showTree\"\n id=\"tree-div\"\n :style=\"showFullHeight ? '' : 'max-height: 300px;'\"\n class=\"individual-tree-div ma-0\"\n >\n <v-col class=\"individual-tree text-center pa-0 ma-0\" />\n </v-row>\n\n </v-card>\n</template>\n\n<script>\n/*\n Vue implementation of D3 Tree from:\n https://beta.observablehq.com/@asktree/interactive-tree-diagram-d3v4-v5\n*/\n\nimport { fetchIndividualTree } from '@/utils/api'\nimport { mapGetters } from 'vuex'\nimport { SHOW_ALERT } from '@/store/actions/alert'\nimport { SHOW_PANEL } from '@/store/actions/panels'\nimport BasePanel from '@/components/base/BasePanel.vue'\nimport BaseSectionTitle from '@/components/base/BaseSectionTitle'\nimport {\n tree as d3Tree,\n event as d3Event,\n select as d3Select,\n hierarchy as d3Hierarchy,\n linkHorizontal as d3linkHorizontal\n} from 'd3'\n\nexport default {\n name: 'BioModelTree',\n components: {\n BasePanel,\n BaseSectionTitle\n },\n data() {\n const { treeIcons } = this.$settings\n return {\n loading: false,\n duration: 0,\n data: null,\n root: null,\n tree: null,\n graph: null,\n species: null,\n dataNodes: null,\n showTree: true,\n isBigTree: false,\n showFullHeight: true,\n skipToScrollNode: false,\n currentNode: null,\n nodeSize: Object.keys(treeIcons).length ? 15 : 5,\n margin: { top: 20, bottom: 20, right: 0, left: 105 },\n diagonal: d3linkHorizontal()\n .x(d => d.y)\n .y(d => d.x),\n treeIcons\n }\n },\n computed: {\n ...mapGetters({\n currentModel: 'bioModelId',\n individual: 'individualId'\n })\n },\n watch: {\n individual(value, oldValue) {\n if (value !== oldValue) {\n this.fetchData()\n }\n },\n currentModel() {\n this.data && this.update(this.data)\n }\n },\n mounted() {\n this.fetchData()\n },\n methods: {\n buildTree() {\n let dx = Object.keys(this.treeIcons).length ? this.nodeSize + 4 : 18\n let dy = 0\n let iconSize = this.nodeSize\n\n // set width\n this.width = 600 - this.margin.right - this.margin.left\n this.tree = d3Tree()\n .nodeSize([dx, dy])\n .separation((a, b) => (a.parent == b.parent ? 1.75 : 2.5))\n\n // clear div\n let div = d3Select(this.$el).select('.individual-tree')\n div.selectAll('svg').remove()\n\n // create svg\n this.svg = div\n .append('svg')\n .attr('width', this.width)\n .attr('height', dx)\n .attr('viewBox', [-this.margin.left, -this.margin.top, this.width, dx])\n .style('font', '10px sans-serif')\n .style('user-select', 'none')\n\n // create filters\n this.svg\n .append('svg:filter')\n .attr('id', 'invertColor')\n .append('feColorMatrix')\n .attr('in', 'SourceGraphic')\n .attr('type', 'matrix')\n .attr('values', '-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0')\n\n // create image definitions\n const defs = this.svg.append('svg:defs')\n Object.keys(this.treeIcons).forEach(model => {\n const pattern = defs\n .append('svg:pattern')\n .attr('id', `icon-${model}`)\n .attr('width', iconSize)\n .attr('height', iconSize)\n .attr('patternUnits', 'objectBoundingBox')\n\n pattern\n .append('rect')\n .attr('width', '100%')\n .attr('height', '100%')\n .attr('fill', 'var(--v-primary-base)')\n\n pattern\n .append('svg:image')\n .attr('xlink:href', this.treeIcons[model])\n .attr('width', iconSize)\n .attr('height', iconSize)\n .attr('x', iconSize / 2)\n .attr('y', iconSize / 2)\n .attr('filter', 'url(#invertColor)')\n })\n\n // create links\n this.gLink = this.svg\n .append('g')\n .attr('fill', 'none')\n .attr('stroke', '#555')\n .attr('stroke-opacity', 0.4)\n .attr('stroke-width', 1.5)\n\n // create tooltip\n this.tooltip = d3Select('body')\n .append('div')\n .style('position', 'absolute')\n .style('z-index', '9999')\n .style('visibility', 'hidden')\n\n // create nodes\n this.gNode = this.svg.append('g')\n\n // build root\n this.root = d3Hierarchy(this.data, d => d.children)\n this.root.x0 = dy\n this.root.y0 = 0\n this.root.descendants().forEach((d, i) => {\n d.id = i\n d.collapsed = false\n d._children = d.children\n\n // collapse samples with too many experiments\n if (d.depth !== 0 && d.children ? d.children.length > 10 : false) {\n d.children = null\n d.collapsed = true\n }\n\n // by default hide tree if too many samples\n if (d.depth === 0 && d.children && d.children.length > 10) {\n this.showFullHeight = false\n this.isBigTree = true\n }\n })\n\n this.update(this.root)\n },\n async fetchData() {\n if (this.individual) {\n this.loading = true\n let individual = await fetchIndividualTree(this.individual)\n this.species = individual.species\n\n // Format Individual Tree\n let individualNode = {}\n individualNode.id = individual.system_id\n individualNode.uuid = individual.uuid\n individualNode.name = individual.system_id\n individualNode.parent = null\n individualNode.individual = individual\n individualNode.class = 'individual'\n if (individual.species === 'MOUSE') {\n individualNode.img = 'mouse'\n } else if (individual.species === 'HUMAN') {\n if (individual.gender === 'FEMALE') {\n individualNode.img = 'female'\n } else {\n individualNode.img = 'male'\n }\n } else {\n individualNode.img = 'alien'\n }\n individualNode.children = individual.sample_set.map(sample => {\n // Samples Children\n let sampleNode = {}\n sampleNode.id = sample.system_id\n sampleNode.uuid = sample.uuid\n sampleNode.name = sample.system_id.split('_')\n sampleNode.name = sampleNode.name[sampleNode.name.length - 1]\n sampleNode.parent = individual.system_id\n sampleNode.sample = sample\n sampleNode.individual = individual\n sampleNode.class = 'sample'\n\n if (sample.category === 'TUMOR') {\n sampleNode.img = 'tumor'\n } else {\n sampleNode.img = 'normal'\n }\n\n let aliquots_ids = [\n ...new Set(sample.experiment_set.map(e => e.aliquot_id))\n ]\n\n sampleNode.children = aliquots_ids\n .map(aliquot_id => {\n // Aliquot children\n let aliquotNode = {}\n aliquotNode.aliquot_id = aliquot_id\n aliquotNode.name = ''\n aliquotNode.parent = sample.system_id\n aliquotNode.sample = sample\n aliquotNode.sampleNode = sampleNode\n aliquotNode.individual = individual\n aliquotNode.class = 'aliquot'\n aliquotNode.img = 'aliquot'\n aliquotNode.children = []\n\n sample.experiment_set.map(experiment => {\n // Experiment Children\n if (experiment.aliquot_id === aliquot_id) {\n let experimentNode = {}\n experimentNode.parent = sample.system_id\n experimentNode.sample = sample\n experimentNode.individual = individual\n experimentNode.aliquot_id = experiment.aliquot_id\n experimentNode.id = experiment.system_id\n experimentNode.uuid = experiment.uuid\n experimentNode.class = 'experiment'\n experimentNode.experiment = experiment\n\n let name = experiment.system_id.split('_')\n experimentNode.name = name[name.length - 1]\n\n if (experiment.custom_fields.is_pdx) {\n experimentNode.img = 'mouse'\n } else {\n if (experiment.technique.category === 'IMG') {\n experimentNode.img = 'image'\n } else if (experiment.technique.category === 'TISSUE') {\n experimentNode.img = 'tissue'\n if (experiment.technique.method === 'CG') {\n experimentNode.img = 'chromosome'\n }\n if (experiment.technique.method === 'HP') {\n experimentNode.img = 'tissue'\n }\n if (experiment.technique.method === 'FC') {\n experimentNode.img = 'cells'\n }\n } else if (experiment.technique.category === 'RNA') {\n experimentNode.img = 'rna'\n } else if (experiment.technique.category === 'DNA') {\n experimentNode.img = 'dna'\n } else {\n experimentNode.img = 'dna'\n }\n }\n\n // legacy leukgen ID\n if (experiment.system_id.split('-').length === 7) {\n aliquotNode.name = experiment.system_id.split('-')[4]\n experimentNode.name = experiment.system_id\n .split('-')\n .slice(5, 7)\n .join('-')\n } else {\n aliquotNode.name = experiment.system_id.split('_')\n aliquotNode.name = parseInt(\n aliquotNode.name[aliquotNode.name.length - 2]\n )\n }\n aliquotNode.children.push(experimentNode)\n }\n })\n return aliquotNode\n })\n .sort((a, b) => a.name - b.name)\n return sampleNode\n })\n\n this.data = individualNode\n this.dataNodes = individualNode.children.reduce(\n (totalNodes, nodeInChildren) => {\n return totalNodes + nodeInChildren.children.length\n },\n 0\n )\n\n this.buildTree()\n this.loading = false\n }\n },\n update(source) {\n const duration = d3Event && d3Event.altKey ? 2500 : 250\n const nodes = this.root.descendants().reverse()\n const links = this.root.links()\n\n // Compute the new tree layout.\n this.tree(this.root)\n\n let left = this.root\n let right = this.root\n this.root.eachBefore(node => {\n if (node.x < left.x) left = node\n if (node.x > right.x) right = node\n })\n\n const height = right.x - left.x + this.margin.top + this.margin.bottom\n\n this.svg\n .transition()\n .duration(duration)\n .attr('height', height)\n .attr('viewBox', [\n -this.margin.left,\n left.x - this.margin.top,\n this.width,\n height\n ])\n .tween(\n 'resize',\n window.ResizeObserver ? null : () => () => this.svg.dispatch('toggle')\n )\n\n // Normalize for fixed-depth.\n nodes.forEach(d => {\n d.y = {\n individual: 40,\n sample: 135,\n aliquot: 200,\n experiment: 300\n }[d.data.class]\n })\n\n // ****************** Nodes section ***************************\n\n // Update the nodes...\n let node = this.gNode.selectAll('g').data(nodes, d => d.id)\n\n // Enter any new modes at the parent's previous position.\n let nodeEnter = node\n .enter()\n .append('g')\n .attr('class', d => `node ${d.data.class}`)\n .attr('transform', () => `translate(${source.y0},${source.x0})`)\n\n const circles = nodeEnter\n .append('circle')\n .attr('cursor', d => (d.data.class !== 'aliquot' ? 'pointer' : null))\n .attr('class', 'node shades--text')\n\n circles.style('fill', d =>\n this.treeIcons[d.data.img] ? `url(#icon-${d.data.img})` : ''\n )\n\n nodeEnter\n .on('click', this.changeModel)\n // tooltip, see https://stackoverflow.com/questions/10805184\n .on('mouseover', d => {\n if (d.data.class === 'aliquot' && d.parent.children.length < 2) return\n\n let leftPaddings = { experiment: 300, individual: 120, sample: 200 }\n this.tooltip\n .html(this.getTooltip(d))\n .style('visibility', 'visible')\n .attr('transform', `translate(${d.y},${d.x})`)\n .style('top', `${d3Event.pageY + 20}px`)\n .style('left', `${d3Event.pageX - leftPaddings[d.data.class]}px`)\n })\n .on('mouseout', () => this.tooltip.style('visibility', 'hidden'))\n\n // Add labels for the nodes\n nodeEnter\n .append('text')\n .on('click', this.onTextClick)\n .attr('dy', '.35em')\n .attr('x', -13)\n .attr('text-anchor', d => (d.children || d._children ? 'end' : 'end'))\n .text(d =>\n d.data.class === 'aliquot' && d.parent.children.length < 2\n ? ''\n : d.data.name\n )\n\n // Add collapse text to indicate node can be opened\n nodeEnter\n .append('text')\n .attr('dy', 0)\n .attr('x', 26)\n .text('...')\n .attr('class', 'collapse-text')\n\n // UPDATE\n let nodeUpdate = nodeEnter.merge(node)\n\n // Transition to the proper position for the node\n nodeUpdate\n .transition()\n .duration(this.duration)\n .attr('transform', d => `translate(${d.y},${d.x})`)\n\n // Update the node attributes and style\n nodeUpdate\n .select('.node')\n .attr('r', d => (d.data.class !== 'aliquot' ? this.nodeSize : 5))\n .attr('cx', this.nodeSize / 2)\n .attr('cy', 0)\n .attr('data-intercom-target', d => `tree-node-circle-${d.data.id}`)\n .attr('fill', d =>\n d._children && !d.children ? 'gray' : 'var(--v-primary-base)'\n )\n .attr('opacity', d =>\n d.data.class === 'aliquot' && d.parent.children.length < 2 ? 0 : 1\n )\n .style('stroke', d => {\n if (\n d.data.id === this.currentModel ||\n d.data.uuid === this.currentModel\n ) {\n this.currentNode = d\n if (!this.skipToScrollNode) {\n this.scrollToCurrentNode()\n }\n this.skipToScrollNode = false\n return 'var(--v-secondary-base)'\n }\n return 'transparent'\n })\n\n // Only show dots for collapsed and collapsible nodes\n nodeUpdate\n .select('text.collapse-text')\n .attr('visibility', d =>\n d.collapsed && d._children ? 'visible' : 'hidden'\n )\n\n // Remove any exiting nodes\n let nodeExit = node\n .exit()\n .transition()\n .duration(this.duration)\n .attr('transform', `translate(${source.y},${source.x})`)\n .remove()\n\n // On exit reduce the node circles size to 0\n nodeExit.select('.node').attr('r', 1e-6)\n\n // On exit reduce the opacity of text labels\n nodeExit.select('text').style('fill-opacity', 1e-6)\n\n // ================ links section ================\n\n // Update the links\n let link = this.gLink.selectAll('path.link').data(links, d => d.id)\n\n // Enter any new links at the parent's previous position.\n let linkEnter = link\n .enter()\n .insert('path', 'g')\n .attr('class', 'link')\n\n // UPDATE\n let linkUpdate = linkEnter.merge(link)\n\n // Transition back to the parent element position\n linkUpdate\n .transition()\n .duration(this.duration)\n .attr('d', this.diagonal)\n\n // Remove any exiting links\n link\n .exit()\n .transition()\n .duration(this.duration)\n .remove()\n\n // Store the old positions for transition.\n nodes.forEach(d => {\n d.x0 = d.x\n d.y0 = d.y\n })\n\n this.$emit('update-size')\n },\n onTextClick(d) {\n this.collapseBranch(d)\n if (!d._children && d.data.id) {\n this.$copyText(d.data.id).then(\n () => {\n this.$store.dispatch(SHOW_ALERT, {\n message: 'Copied System ID to clipboard!'\n })\n },\n () => {\n this.$store.dispatch(SHOW_ALERT, {\n error: 'System ID could not be copied to clipboard'\n })\n }\n )\n }\n },\n collapseBranch(d) {\n d.children = d.children ? null : d._children\n d.collapsed = !d.collapsed\n this.update(d)\n },\n changeModel(d) {\n if (d.data.id) {\n this.skipToScrollNode = true // don't scroll to node when click\n\n // Track individual tree usage\n window.analytics.track('Browsed Individual Tree', {\n model: d.data.class,\n record: d.data.id\n })\n\n this.tooltip.style('visibility', 'hidden')\n\n this.$store.dispatch(SHOW_PANEL, {\n bioModel: d.data.id\n })\n }\n },\n scrollToCurrentNode() {\n this.$nextTick(() => {\n if (!this.showFullHeight)\n setTimeout(() => {\n document.getElementById('tree-div').scrollTop =\n this.currentNode.x0 + 395 // 395 is a function of the max height\n }, 100) // this delay was determined kind of experimentally\n })\n },\n getTooltip(d) {\n const keyValue = (key, verboseName) => {\n let value = this.$get(d.data, key, null)\n return value === null\n ? ''\n : `\n <div class=\"layout row ma-3\" style=\"max-width: 100%\"\">\n <div class=\"flex xs5\" style=\"width: 100%\">${verboseName}</div>\n <div class=\"flex xs7\" style=\"width: 100%\"><b>${value}</b></div>\n </div>\n `\n }\n return `\n <div class=\"v-tooltip__content tree-tooltip\" style=\"min-width: 350px;\">\n ${keyValue('experiment.system_id', 'System ID')}\n ${keyValue('experiment.identifier', 'Experiment ID')}\n ${keyValue('aliquot_id', 'Aliquot ID')}\n ${keyValue('sample.identifier', 'Sample ID')}\n ${keyValue('individual.identifier', 'Individual ID')}\n ${keyValue('experiment.technique.method', 'Method')}\n ${keyValue('experiment.technique.name', 'Technique Name')}\n ${keyValue('sample.disease.acronym', 'Disease')}\n ${keyValue('individual.species', 'Species')}\n ${keyValue('individual.center.acronym', 'Center')}\n </div>\n `\n }\n }\n}\n</script>\n\n<style lang=\"scss\">\n.tree-tooltip.v-tooltip__content {\n color: white;\n padding: 20px;\n opacity: 1;\n font-size: 12px;\n overflow: hidden;\n}\n.node-tooltip {\n background: rgba($color: #000000, $alpha: 0.8);\n}\n.individual-tree-div {\n overflow-x: scroll;\n margin: auto;\n .node {\n stroke-width: 3px;\n text {\n font-size: 14px;\n font-weight: 300;\n fill: black !important;\n cursor: pointer;\n &.collapse-text {\n font-size: 20px;\n font-weight: 200;\n cursor: default;\n }\n }\n &.experiment text {\n cursor: default;\n }\n }\n .link {\n fill: none;\n stroke-width: 1.5px;\n stroke: #aaa;\n }\n}\n</style>\n"]
334940
334905
  },
334941
334906
  _coverageSchema: "43e27e138ebf9cfc5966b082cf9a028302ed4184",
334942
- hash: "59e08d1c64c25cb454a3e5dffce258dc15f4d5b9"
334907
+ hash: "be336c38506a643b71832f44cd825ff3c922878c"
334943
334908
  };
334944
334909
  var coverage = global[gcv] || (global[gcv] = {});
334945
334910
  if (coverage[path] && coverage[path].hash === hash) {
@@ -335055,7 +335020,7 @@ function BioModelTreevue_type_script_lang_js_toPrimitive(input, hint) { if (BioM
335055
335020
 
335056
335021
  // set width
335057
335022
  BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep.s[11]++;
335058
- this.width = 540 - this.margin.right - this.margin.left;
335023
+ this.width = 600 - this.margin.right - this.margin.left;
335059
335024
  BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep.s[12]++;
335060
335025
  this.tree = (0,d3.tree)().nodeSize([dx, dy]).separation(function (a, b) {
335061
335026
  BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep.f[7]++;
@@ -335469,7 +335434,7 @@ function BioModelTreevue_type_script_lang_js_toPrimitive(input, hint) { if (BioM
335469
335434
  BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep.f[22]++;
335470
335435
  BioModelTreevue_type_script_lang_js_cov_2f0u9tmiep.s[145]++;
335471
335436
  d.y = {
335472
- individual: 0,
335437
+ individual: 40,
335473
335438
  sample: 135,
335474
335439
  aliquot: 200,
335475
335440
  experiment: 300
@@ -335753,9 +335718,9 @@ function BioModelTreevue_type_script_lang_js_toPrimitive(input, hint) { if (BioM
335753
335718
  });
335754
335719
  ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue?vue&type=script&lang=js&
335755
335720
  /* harmony default export */ var bioModels_BioModelTreevue_type_script_lang_js_ = (BioModelTreevue_type_script_lang_js_);
335756
- // EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/bioModels/BioModelTree.vue?vue&type=style&index=0&id=2e68a456&prod&lang=scss&
335757
- var BioModelTreevue_type_style_index_0_id_2e68a456_prod_lang_scss_ = __webpack_require__(6034);
335758
- ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue?vue&type=style&index=0&id=2e68a456&prod&lang=scss&
335721
+ // EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/bioModels/BioModelTree.vue?vue&type=style&index=0&id=337f42f6&prod&lang=scss&
335722
+ var BioModelTreevue_type_style_index_0_id_337f42f6_prod_lang_scss_ = __webpack_require__(9256);
335723
+ ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue?vue&type=style&index=0&id=337f42f6&prod&lang=scss&
335759
335724
 
335760
335725
  ;// CONCATENATED MODULE: ./src/components/bioModels/BioModelTree.vue
335761
335726
 
@@ -335768,8 +335733,8 @@ var BioModelTreevue_type_style_index_0_id_2e68a456_prod_lang_scss_ = __webpack_r
335768
335733
 
335769
335734
  var BioModelTree_component = normalizeComponent(
335770
335735
  bioModels_BioModelTreevue_type_script_lang_js_,
335771
- BioModelTreevue_type_template_id_2e68a456_render,
335772
- BioModelTreevue_type_template_id_2e68a456_staticRenderFns,
335736
+ BioModelTreevue_type_template_id_337f42f6_render,
335737
+ BioModelTreevue_type_template_id_337f42f6_staticRenderFns,
335773
335738
  false,
335774
335739
  null,
335775
335740
  null,