Skip to content

Commit

Permalink
Merge pull request #63 from onursumer/data-filter-mvc
Browse files Browse the repository at this point in the history 
MVC refactoring for mutation data
  • Loading branch information
@onursumer
onursumer authored Nov 18, 2016
2 parents 0991b84 + 061b72d commit cf1364b
Show file tree
Hide file tree
Showing 18 changed files with 794 additions and 579 deletions.
3 changes: 3 additions & 0 deletions debug/debug.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@
<script type="text/javascript" src="../src/js/util/PymolScriptGenerator.js"></script>
<script type="text/javascript" src="../src/js/util/Mol3DScriptGenerator.js"></script>
<script type="text/javascript" src="../src/js/util/MutationInputParser.js"></script>
<script type="text/javascript" src="../src/js/util/MutationDataConverter.js"></script>
<script type="text/javascript" src="../src/js/util/DataTableUtil.js"></script>
<script type="text/javascript" src="../src/js/util/BackboneTemplateCache.js"></script>
<script type="text/javascript" src="../src/js/util/PancanMutationDataUtil.js"></script>
Expand All @@ -115,6 +116,7 @@
<script type="text/javascript" src="../src/js/data/VariantAnnotationDataProxy.js"></script>
<script type="text/javascript" src="../src/js/data/ClinicalDataProxy.js"></script>
<script type="text/javascript" src="../src/js/data/MutationDataManager.js"></script>
<script type="text/javascript" src="../src/js/data/MutationData.js"></script>

<script type="text/javascript" src="../src/js/controller/MutationDetailsEvents.js"></script>
<script type="text/javascript" src="../src/js/controller/MainMutationController.js"></script>
Expand All @@ -123,6 +125,7 @@
<script type="text/javascript" src="../src/js/controller/MutationDiagramController.js"></script>
<script type="text/javascript" src="../src/js/controller/MutationInfoController.js"></script>
<script type="text/javascript" src="../src/js/controller/MutationDetailsController.js"></script>
<script type="text/javascript" src="../src/js/controller/MutationDataFilterController.js"></script>

<script type="text/javascript" src="../src/js/view/Mutation3dView.js"></script>
<script type="text/javascript" src="../src/js/view/Mutation3dVisView.js"></script>
Expand Down
7 changes: 4 additions & 3 deletions src/js/component/MutationDetailsTable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1335,6 +1335,7 @@ function MutationDetailsTable(options, gene, mutationUtil, dataProxies, dataMana
_prevSearch != currSearch)
{
// trigger corresponding event
// TODO attach self instead of selector to the event
_dispatcher.trigger(
MutationDetailsEvents.MUTATION_TABLE_FILTERED,
tableSelector);
Expand All @@ -1350,7 +1351,7 @@ function MutationDetailsTable(options, gene, mutationUtil, dataProxies, dataMana
// trigger redraw event
_dispatcher.trigger(
MutationDetailsEvents.MUTATION_TABLE_REDRAWN,
tableSelector);
self);

// get the unique number of samples for the current visible data
var rowData = $(tableSelector).DataTable().rows({filter: "applied"}).data();
Expand Down Expand Up @@ -1403,7 +1404,7 @@ function MutationDetailsTable(options, gene, mutationUtil, dataProxies, dataMana
// trigger corresponding event
_dispatcher.trigger(
MutationDetailsEvents.MUTATION_TABLE_INITIALIZED,
tableSelector);
self);
},
"fnHeaderCallback": function(nHead, aData, iStart, iEnd, aiDisplay) {
$(nHead).find('th').addClass("mutation-details-table-header");
Expand All @@ -1412,7 +1413,7 @@ function MutationDetailsTable(options, gene, mutationUtil, dataProxies, dataMana
//Trigger fnHeader callback function
_dispatcher.trigger(
MutationDetailsEvents.MUTATION_TABLE_HEADER_CREATED,
tableSelector);
self);
}
// "fnFooterCallback": function(nFoot, aData, iStart, iEnd, aiDisplay) {
// addFooterTooltips(nFoot, nameMap);
Expand Down
54 changes: 7 additions & 47 deletions src/js/component/MutationDiagram.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1611,16 +1611,8 @@ MutationDiagram.prototype.addDefaultListeners = function()

// diagram background click
self.addListener(".mut-dia-background", "click", function(datum, index) {
// ignore the action (do not dispatch an event) if:
// 1) the diagram is already in a graphical transition:
// this is to prevent inconsistency due to fast clicks on the diagram.
// 2) there is no previously highlighted data point
// 3) multi selection mode is on:
// this is to prevent reset due to an accidental click on background
var ignore = !self.isHighlighted() ||
self.multiSelect;

if (!ignore)
// ignore the action (do not dispatch an event) if multi selection mode is on
if (!self.multiSelect)
{
// remove all diagram highlights
self.clearHighlights();
Expand All @@ -1633,51 +1625,24 @@ MutationDiagram.prototype.addDefaultListeners = function()

// lollipop circle click
self.addListener(".mut-dia-data-point", "click", function(datum, index) {
// if already highlighted, remove highlight on a second click
if (self.isHighlighted(this))
if (self.multiSelect)
{
// remove highlight for the target circle
self.removeHighlight(this);

// also clear previous highlights if multiple selection is not active
if (!self.multiSelect)
{
// remove all diagram highlights
self.clearHighlights();
}

// trigger corresponding event
self.dispatcher.trigger(
MutationDetailsEvents.LOLLIPOP_DESELECTED,
MutationDetailsEvents.LOLLIPOP_MULTI_SELECT,
datum, index);
}
else
{
// clear previous highlights if multiple selection is not active
if (!self.multiSelect)
{
// remove all diagram highlights
self.clearHighlights();
}

// highlight the target circle on the diagram
self.highlight(this);

// trigger corresponding event
self.dispatcher.trigger(
MutationDetailsEvents.LOLLIPOP_SELECTED,
MutationDetailsEvents.LOLLIPOP_SINGLE_SELECT,
datum, index);
}
});

// lollipop circle mouse out
self.addListener(".mut-dia-data-point", "mouseout", function(datum, index) {
// if not highlighted, make the lollipop smaller
if (!self.isHighlighted(this))
{
self.resizeLollipop(d3.select(this), self.options.lollipopSize);
}

// trigger corresponding event
self.dispatcher.trigger(
MutationDetailsEvents.LOLLIPOP_MOUSEOUT,
Expand All @@ -1686,13 +1651,6 @@ MutationDiagram.prototype.addDefaultListeners = function()

// lollipop circle mouse over
self.addListener(".mut-dia-data-point", "mouseover", function(datum, index) {
// if not highlighted, make the lollipop bigger
// (if highlighted, it should be already bigger by default)
if (!self.isHighlighted(this))
{
self.resizeLollipop(d3.select(this), self.options.lollipopHighlightSize);
}

// trigger corresponding event
self.dispatcher.trigger(
MutationDetailsEvents.LOLLIPOP_MOUSEOVER,
Expand Down Expand Up @@ -1738,6 +1696,7 @@ MutationDiagram.prototype.addDefaultListeners = function()
*
* @param selector [optional] selector for a specific data point element
* @return {boolean} true if highlighted, false otherwise
* @deprecated
*/
MutationDiagram.prototype.isHighlighted = function(selector)
{
Expand Down Expand Up @@ -1883,6 +1842,7 @@ MutationDiagram.prototype.fadeOut = function(element, callback)
* Returns selected (highlighted) elements as a list of svg elements.
*
* @return {Array} a list of SVG elements
* @deprecated
*/
MutationDiagram.prototype.getSelectedElements = function()
{
Expand Down
101 changes: 34 additions & 67 deletions src/js/controller/MainMutationController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,97 +43,64 @@ function MainMutationController(mainMutationView)

function init()
{
if (mainMutationView.diagramView)
{
diagramInitHandler(mainMutationView.diagramView.mutationDiagram);
}
else
{
mainMutationView.dispatcher.on(
MutationDetailsEvents.DIAGRAM_INIT,
diagramInitHandler);
}

// also init reset link call back
// init reset link call back
mainMutationView.addResetCallback(handleReset);
}

function diagramInitHandler(mutationDiagram)
{
// update class variable
_mutationDiagram = mutationDiagram;

// add listeners to the custom event dispatcher of the diagram
mutationDiagram.dispatcher.on(
MutationDetailsEvents.ALL_LOLLIPOPS_DESELECTED,
allDeselectHandler);

mutationDiagram.dispatcher.on(
MutationDetailsEvents.LOLLIPOP_DESELECTED,
deselectHandler);

mutationDiagram.dispatcher.on(
MutationDetailsEvents.LOLLIPOP_SELECTED,
selectHandler);
var mutationDataDispatcher = $(mainMutationView.model.mutationData.dispatcher);

mutationDiagram.dispatcher.on(
MutationDetailsEvents.DIAGRAM_PLOT_UPDATED,
diagramUpdateHandler);
}
mutationDataDispatcher.on(
MutationDetailsEvents.MUTATION_FILTER,
mutationFilterHandler
);

function handleReset(event)
{
// reset the diagram contents
if (_mutationDiagram)
{
_mutationDiagram.resetPlot();
}
mutationDataDispatcher.on(
MutationDetailsEvents.MUTATION_HIGHLIGHT,
mutationHighlightHandler
);

// hide the filter info text
mainMutationView.hideFilterInfo();
mutationDataDispatcher.on(
MutationDetailsEvents.MUTATION_SELECT,
mutationSelectHandler
);
}

function diagramUpdateHandler()
function mutationSelectHandler(event, params)
{
if (_mutationDiagram &&
_mutationDiagram.isFiltered())
var mutationData = params.mutationData;
// get all selected elements
var selected = mutationData.getState().selected;
var filtered = mutationData.getState().filtered;
var data = mutationData.getData();

// if there are selected or filtered out mutations then show filter info
if (!_.isEmpty(selected) ||
_.size(data) !== _.size(filtered))
{
// display info text
mainMutationView.showFilterInfo();
}
// nothing selected, nothing filtered out, hide filter info
else
{
// hide info text
mainMutationView.hideFilterInfo();
}
}

function allDeselectHandler()
function mutationHighlightHandler(event, params)
{
// hide filter reset info
if (_mutationDiagram &&
!_mutationDiagram.isFiltered())
{
mainMutationView.hideFilterInfo();
}
// no need to handle for now, update if necessary
}

function deselectHandler(datum, index)
function mutationFilterHandler(event, params)
{
// check if all deselected
// (always show text if still there is a selected data point)
if (_mutationDiagram &&
_mutationDiagram.getSelectedElements().length == 0)
{
// hide filter reset info
allDeselectHandler();
}
mutationSelectHandler(event, params);
}

function selectHandler(datum, index)
function handleReset(event)
{
// show filter reset info
mainMutationView.showFilterInfo();
// TODO it might be better to call one function instead of three!
mainMutationView.model.mutationData.unHighlightMutations();
mainMutationView.model.mutationData.unSelectMutations();
mainMutationView.model.mutationData.unfilterMutations();
}

init();
Expand Down
Loading

0 comments on commit cf1364b

Please sign in to comment.