Skip to content

Commit

Permalink
Merged in ATL-10-bugfixes (pull request #24)
Browse files Browse the repository at this point in the history
ATL-10 bugfixes
  • Loading branch information
Oleg Kuzik authored and alex-odysseus committed Jul 18, 2024
2 parents c02476c + 782065f commit 1e3beb4
Show file tree
Hide file tree
Showing 13 changed files with 139 additions and 72 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ define(function(require, exports){
this.featureAnalyses = ko.observableArray(data.featureAnalyses || []);
data.featureAnalyses && data.featureAnalyses.forEach(fa => {
fa["includeAnnual"] = ko.observable(fa.includeAnnual);
fa['includeTeamporal'] = ko.observable(fa.includeTeamporal);
fa['includeTemporal'] = ko.observable(fa.includeTemporal);
});
this.parameters = ko.observableArray(data.parameters);
this.strataConceptSets = ko.observableArray((data.strataConceptSets && data.strataConceptSets.map(cs => new ConceptSet(cs))) || []);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
isEditPermitted: $component.isEditPermitted
"></linked-entity-list>
<div><input type="checkbox" data-bind="enable: $component.isEditPermitted && $component.isAnnualPrevalenceSupported, checked: $component.includeAnnual"><span data-bind="css: classes('include-annual-option')">Include Prevalence Annual Distribution</span></div>
<div><input type="checkbox" data-bind="enable: $component.isEditPermitted && $component.isTemporalPrevalenceSupported, checked: $component.includeTemporal"><span data-bind="css: classes('include-annual-option')">Include Prevalence Annual Distribution</span></div>
<div><input type="checkbox" data-bind="enable: $component.isEditPermitted && $component.isTemporalPrevalenceSupported, checked: $component.includeTemporal"><span data-bind="css: classes('include-temporal-option')">Include Temporal Distribution</span></div>
</div>
<div data-bind="css: {'linked-entities':true, 'edit-disabled': !$component.isEditPermitted()}, eventListener: [
{ event: 'click', selector: '.conceptset_import', callback:$component.handleConceptSetImport},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -219,6 +219,6 @@ <h4 class="legend-header">Cohort Legend</h4>
temporalData: $component.exploreTemporalData(),
}
">
<explore-temporal params="temporal: temporalData"></explore-temporal>
<explore-temporal-cohort params="temporal: temporalData"></explore-temporal-cohort>
</atlas-modal>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ define([
'utils/ExceptionUtils',
'services/file',
'./explore-prevalence',
'./explore-temporal',
'./explore-temporal-cohort',
'less!./characterization-results.less',
'components/visualizations/filter-panel/filter-panel',
'components/visualizations/line-chart',
Expand Down Expand Up @@ -193,9 +193,9 @@ define([
this.isExplorePrevalenceShown(true);
}

exploreTemporal({temporal, temporalAnnual}, title) {
exploreTemporal({temporal, temporalAnnual, temporalDataByCohort}, title) {
this.exploreTemporalTitle(title);
this.exploreTemporalData({temporal, temporalAnnual});
this.exploreTemporalData({temporal, temporalAnnual, temporalDataByCohort});
this.isTemporalShown(true);
}

Expand Down Expand Up @@ -297,6 +297,7 @@ define([
domainIds: domains,
thresholdValuePct: this.newThresholdValuePct() / 100,
showEmptyResults: !!this.showEmptyResults(),
excludeComparativeResults: true
};

Promise.all([
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
<div class="explore-temporal-cohort">
<div class="upper-tabs" data-bind="foreach: tabs">
<div data-bind="css: { active: $component.selectedTabKey() === key },
click: $component.selectedTabKey.bind($component, key)">
<span data-bind="text: title"></span>
</div>
</div>
<div data-bind="with: $component.tabs.find(t => t.key === $component.selectedTabKey())">
<div data-bind="component: { name: 'explore-temporal', params: componentParams }"></div>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
define([
"knockout",
"utils/CommonUtils",
"components/Component",
"utils/AutoBind",
"text!./explore-temporal-cohort.html",
"less!./explore-temporal-cohort.less",
'components/tabs',
'./explore-temporal',
], function (ko, commonUtils, Component, AutoBind, view, tabs) {

class ExploreTemporalCohort extends AutoBind(Component) {
constructor(params) {
super(params);
const temporal = params.temporal || {};
this.temporalDataByCohort = temporal.temporalDataByCohort || {};

this.tabs = this.temporalDataByCohort.map(cohort => ({
title: cohort.cohortName,
key: cohort.cohortName,
componentParams: { data: cohort.temporalInfo },
}));
this.selectedTabKey = ko.observable(this.tabs.length > 0 ? this.tabs[0].key : null);
}
}

commonUtils.build('explore-temporal-cohort', ExploreTemporalCohort, view);
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.explore-temporal-cohort {
.upper-tabs {
display: flex;
justify-content: space-between;

div {
flex: 1;
border: 1px solid grey;
padding: 5px;
cursor: pointer;

&.active {
background-color: lightgrey;
}
}
}
}
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div data-bind="css: classes()">
<tabs params="
selectedTabKey: $component.selectedTabKey,
tabs: $component.tabs
">
</tabs>
<div class="explore-temporal">
<div data-bind="foreach: tabs">
<div data-bind="css: { active: $component.selectedTabKey() === key }">
<div data-bind="component: { name: componentName, params: componentParams }"></div>
</div>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -1,50 +1,46 @@
define([
"knockout",
"text!./explore-temporal.html",
'components/Component',
'utils/CommonUtils',
'utils/AutoBind',
'components/tabs',
'./temporal/annual',
'./temporal/temporal',
"less!./explore-temporal.less",
],
function (
ko,
view,
Component,
commonUtils,
AutoBind,
tabs,
) {

class ExploreTemporal extends AutoBind(Component) {
constructor(params) {
super(params);
this.selectedTabKey = ko.observable('annual');
const temporal = params.temporal || {};
this.temporalAnnual = temporal.temporalAnnual || [];
this.temporalDaily = temporal.temporal || [];
this.tabs = [
{
title: 'Annual',
key: 'annual',
componentName: 'explore-temporal-annual',
componentParams: {data: this.temporalAnnual},
visible: () => this.temporalAnnual && this.temporalAnnual.length > 0,
},
{
title: 'Daily',
key: 'daily',
componentName: 'explore-temporal-daily',
componentParams: {data: this.temporalDaily},
visible: () => this.temporalDaily && this.temporalDaily.length > 0,
},
].filter(v => v.visible());
}
"knockout",
"text!./explore-temporal.html",
'components/Component',
'utils/CommonUtils',
'utils/AutoBind',
'components/tabs',
'./temporal/annual',
'./temporal/temporal',
"less!./explore-temporal.less",
],
function (
ko,
view,
Component,
commonUtils,
AutoBind,
tabs,
) {

class ExploreTemporal extends AutoBind(Component) {
constructor(params) {
super(params);
this.tabs = [
{
title: 'Annual',
key: 'annual',
componentName: 'explore-temporal-annual',
componentParams: { data: params.data.temporalAnnual },
visible: () => params.data.temporalAnnual && params.data.temporalAnnual.length > 0
},{
title: 'Daily',
key: 'daily',
componentName: 'explore-temporal-daily',
componentParams: { data: params.data.temporalDaily },
visible: () => params.data.temporalDaily && params.data.temporalDaily.length > 0
},
].filter(v => v.visible());
console.log(this.tabs);
this.selectedTabKey = ko.observable(this.tabs.length > 0 ? this.tabs[0].key : null);
}

commonUtils.build('explore-temporal', ExploreTemporal, view);
}

commonUtils.build('explore-temporal', ExploreTemporal, view);
}
);
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
display: flex;
}
&__col-count {
width: 4rem;
display: flex;
}
&__col-pct {
width: 4rem;
display: flex;
}
td&__col-pct {
padding: 0 !important;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
.explore-temporal-daily {
&__col-count {
width: 4rem;
display: flex;
}
&__col-pct {
width: 4rem;
display: flex;
}
td&__col-pct {
padding: 0 !important;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,7 @@ define([
this.cohorts = stat.cohorts || [];
this.count = {};
this.pct = {};
this.temporal = stat.temporal || [];
this.temporalAnnual = stat.temporalAnnual || [];
this.temporalDataByCohort = stat.temporalDataByCohort || [];
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,20 @@ define([
const statName = prefix ? prefix + field.charAt(0).toUpperCase() + field.slice(1) : field;
this.setNestedValue(result, field, strataId, cohortId, stat[statName]);
});

const temporalInfoByCohort = {
cohortName: stat.cohortName,
temporalInfo: {
temporal: stat.temporal || [],
temporalAnnual: stat.temporalAnnual || [],
}
};

if (!result.temporalDataByCohort) {
result.temporalDataByCohort = [];
}

result.temporalDataByCohort.push(temporalInfoByCohort);
}

convertCompareFields(result, strataId, stat) {
Expand Down Expand Up @@ -68,15 +82,16 @@ define([
title: ko.i18n('columns.covariate', 'Covariate'),
data: 'covariateName',
className: this.classes('col-prev-title'),
render: (d, t, { covariateName, faType, covariateId, temporal, temporalAnnual }) => {
const meaningfulName = utils.extractMeaningfulCovName(covariateName, faType);
const hasTemporal = Array.isArray(temporal) && temporal.length > 0;
const hasAnnual = Array.isArray(temporalAnnual) && temporalAnnual.length > 0;
if (hasTemporal || hasAnnual) {
return `<a href="#" data-bind="click: () => $component.exploreTemporal($data, '${meaningfulName}')">${meaningfulName}</a>`;
} else {
return meaningfulName;
}
render: (d, t, r) => {
const meaningfulName = utils.extractMeaningfulCovName(r.covariateName, r.faType);
const hasTemporalData = Array.isArray(r.temporalDataByCohort) && r.temporalDataByCohort.length > 0;
if (hasTemporalData) {
const hasTemporal = r.temporalDataByCohort.some(cohort => Array.isArray(cohort.temporalInfo?.temporal) && cohort.temporalInfo.temporal.length > 0);
const hasAnnual = r.temporalDataByCohort.some(cohort => Array.isArray(cohort.temporalInfo?.temporalAnnual) && cohort.temporalInfo.temporalAnnual.length > 0);
if (hasTemporal || hasAnnual) {
return `<a href="#" data-bind="click: () => $component.exploreTemporal($data, '${meaningfulName}')">${meaningfulName}</a>`;
}
} return meaningfulName;
},
xssSafe:false,
};
Expand Down

0 comments on commit 1e3beb4

Please sign in to comment.