Commit ec975b7e authored by maxchaza's avatar maxchaza
Browse files

Merge branch 'release/3.0.0'

parents fa283b97 302ab19a
......@@ -7,7 +7,7 @@
/**
* The version of the application.
*/
"version": "2.8.16",
"version": "3.0.0
/**
* The relative path to the application's markup file (html, jsp, asp, etc.).
......@@ -298,7 +298,7 @@
"bundle": true
},
{
"path": "resources/lib/model/ColorMapping.js",
"path": "resources/lib/model/ValueMapping.js",
"bundle": true
},
{
......@@ -333,6 +333,14 @@
"path": "resources/lib/functions/NodeStyleForm.js",
"bundle": true
},
{
"path": "resources/lib/functions/GraphColorScaleEditor.js",
"bundle": true
},
{
"path": "resources/lib/functions/GraphNumberScaleEditor.js",
"bundle": true
},
{
"path": "resources/lib/functions/Features.js",
"bundle": true
......
......@@ -9,10 +9,16 @@ Ext.define('metExploreViz.Application', {
name: 'metExploreViz',
stores: [
'metExploreViz.view.form.selectCondition.ConditionStore',
'conditionStore'
// TODO: add global / shared stores here
],
launch: function () {
Ext.create('metExploreViz.view.form.selectCondition.ConditionStore');
// TODO - Launch the application
},
......
......@@ -24,6 +24,9 @@ Ext.define('metExploreViz.view.button.buttonImportMapping.ButtonImportMappingCon
reloadMapping:function(){
view.reset();
},
jsonmapping : function(mappingJSON){
me.addConditions(mappingJSON);
},
scope:me
});
},
......@@ -34,6 +37,7 @@ Ext.define('metExploreViz.view.button.buttonImportMapping.ButtonImportMappingCon
* @param title : file title
*/
loadData : function(tabTxt, title) {
var me=this;
var data = tabTxt;
tabTxt = tabTxt.replace(/\r/g, "");
var lines = tabTxt.split('\n');
......@@ -50,17 +54,47 @@ Ext.define('metExploreViz.view.button.buttonImportMapping.ButtonImportMappingCon
_metExploreViz.addMapping(mapping);
for (var i = lines.length - 1; i >= 0; i--) {
lines[i] = lines[i].split('\t');
lines[i] = lines[i].split('\t').map(function (val) {
return val.replace(",", ".");
});
}
// Launch mapping
metExploreD3.GraphMapping.mapNodeData(mapping, lines);
metExploreD3.fireEventArg('selectMappingVisu', "jsonmapping", mapping);
metExploreD3.fireEventArg('buttonMap', "jsonmapping", mapping);
metExploreD3.fireEventArg('selectMapping', "jsonmapping", mapping);
}
else
{
// Warning for bad syntax file
metExploreD3.displayWarning("Syntaxe error", 'File have bad syntax. See <a target="_blank" href="http://metexplore.toulouse.inra.fr/metexploreViz/doc/documentation.php#import">MetExploreViz documentation</a>.');
}
},
/*****************************************************
* Fill condition store store
* @param mapping : Mapping object
*/
addConditions : function(mapping) {
// Launch mapping
var conditions = mapping.getConditions();
var conditionStore = Ext.getStore("conditionStore");
var newConditions = [];
if(conditions[0]!==undefined){
mapping.getConditions().forEach(function (condition) {
newConditions.push(mapping.getName()+" / "+condition);
});
}
else
newConditions.push(mapping.getName());
newConditions
.filter(function(cond){
return !(cond.includes("PathwayEnrichment") || cond.includes("PathwayCoverage"))
})
.forEach(function (value) { conditionStore.add({name: value, type: 'int'}); });
}
});
......@@ -25,7 +25,9 @@ Ext.define('metExploreViz.view.button.buttonImportToNetwork.ButtonImportToNetwor
}
metExploreD3.GraphUtils.handleFileSelect(view.lookupReference('importNetwork').fileInputEl.dom, function(json){
// Allows to reload the same file
metExploreD3.GraphPanel.refreshPanel(json, view.lookupReference('importNetwork').reset());
metExploreD3.GraphPanel.refreshPanel(json, function(){
view.lookupReference('importNetwork').reset();
});
});
},
scope : me
......
......@@ -13,8 +13,8 @@ Ext.define('metExploreViz.view.form.SelectConditionType', {
data : [
{"name":"Continuous"},
{"name":"Discrete"},
{"name":"Flux"},
{"name":"Suggestion"}
{"name":"As selection"}
//,{"name":"Alias"}
]
},
listeners: {
......@@ -23,11 +23,12 @@ Ext.define('metExploreViz.view.form.SelectConditionType', {
target: c.getEl(),
html: 'Select a type of data'
});
},
change: function(){
var comboCond = Ext.getCmp('selectCondition');
comboCond.clearValue();
}
// ,
// change: function(){
// var comboCond = Ext.getCmp('selectCondition');
// comboCond.clearValue();
// }
},
displayField: 'name',
valueField: 'name',
......
/**
* @author MC
* @description AStyleForm : Display Settings
*/
Ext.define('metExploreViz.view.form.aStyleForm.AStyleForm', {
extend: 'Ext.panel.Panel',
alias: 'widget.aStyleForm',
requires: [
"metExploreViz.view.form.aStyleForm.AStyleFormController"
],
controller: "form-aStyleForm-aStyleForm",
region:'north',
margin :'0 0 5 0',
flex:0,
border:false,
scrollable:true,
cls: "aStyleForm",
layout: {
type: 'vbox'
},
header:{
referenceHolder: true,
style:{
padding:'5px 5px 5px 5px'
},
items:[{
xtype: 'button',
reference: "numberButton",
hidden: true,
cls: "aStyleFormButton",
// text: '2000',
html:"<svg width='30px' height='30px'><text id='textNumberButton' font-family='Verdana' font-size='10' text-anchor='middle' x='46%' y='50%' dominant-baseline='middle'></text></svg>",
height:"30px",
width:"30px"
},{
xtype: 'panel',
reference: "colorButton",
hidden: true,
border: false,
cls: "aStyleFormColor",
height:"30px",
width:"30px",
html: '<input ' +
'type="color" ' +
'id="html5colorpicker" ' +
'value="#1698ff" ' +
'style="width:30px; height:30px;">',
listeners : {
render: function(c) {
var tipColorButton = Ext.create('Ext.tip.ToolTip', {
target: c.getEl(),
html: '"Color : "',
listeners : {
beforeshow: function(tooltip) {
var color = tooltip.target.el.dom.querySelector("#html5colorpicker").getAttribute("value");
tooltip.update(color);
}
}
});
c.tip = tipColorButton;
}
}
},{
xtype: 'button',
reference: "mappingButton",
cls: "aStyleFormButton",
text: '',
height:"30px",
width:"30px"
},{
xtype: 'button',
disabled: false,
cls: "aStyleFormButton",
reference: "bypassButton",
border: "1px",
text: '',
height:"30px",
width:"30px",
listeners : {
render: function(c) {
if(c.isDisabled())
c.setTooltip("To override the visual property, select one or more nodes");
},
disable: function(c) {
c.setTooltip("To override the visual property, select one or more nodes");
},
enable: function(c) {
c.setTooltip("");
}
}
},{
xtype: 'panel',
reference: "colorButtonBypass",
hidden: true,
border: false,
cls: "aStyleFormColor",
height:"30px",
width:"30px",
html: '<input ' +
'type="color" ' +
'id="html5colorpicker" ' +
'value="#1698ff" ' +
'style="width:30px; height:30px;">'
},{
xtype: 'button',
reference: "numberButtonBypass",
hidden: true,
cls: "aStyleFormButton",
// text: '2000',
html:"<svg width='30px' height='30px'><text id='textNumberButton' font-family='Verdana' font-size='10' text-anchor='middle' x='46%' y='50%' dominant-baseline='middle'></text></svg>",
height:"30px",
width:"30px"
}],
titlePosition: 6
},
items: [
{
xtype: 'form',
itemId: 'slider',
bodyStyle: 'background-color:inherit',
width: "100%",
top:'10',
border: false,
items: [
{
reference: "selectConditionForm",
xtype:'selectConditionForm'
}
]
}
]
});
\ No newline at end of file
/**
* @author MC
* @description class to control settings or configs
*/
Ext.define('metExploreViz.view.form.aStyleForm.AStyleFormController', {
extend: 'Ext.app.ViewController',
alias: 'controller.form-aStyleForm-aStyleForm',
/**
* Init function Checks the changes on drawing style
*/
init : function() {
var me = this,
viewModel = me.getViewModel(),
view = me.getView();
if (view.styleType === "int" || view.styleType === "float") {
view.graphNumberScaleEditor = Object.create(metExploreD3.GraphNumberScaleEditor);
}
if (view.styleType === "color") {
view.graphColorScaleEditor = Object.create(metExploreD3.GraphColorScaleEditor);
}
view.on(
{
afterStyleLoading : me.updateFormValues,
updateSelectionSet : me.updateSelectionSet,
afterrender: me.initForm,
expand: function (panel) {
var header = panel.down('header');
header.lookupReference('mappingButton').addCls('focus');
},
collapse: function (panel) {
var header = panel.down('header');
header.lookupReference('mappingButton').removeCls('focus');
},
scope:me
});
},
/**
* Define displayed icons on values in function of selected nodes
*/
updateSelectionSet : function() {
var me = this;
var view = me.getView();
// WARNING Header render is executed afterrender view
// As a result, render and afterrender can't be used on header
var header = view.down('header');
if(header){
var bypassButton = header.lookupReference('bypassButton');
var colorButtonBypass = header.lookupReference('colorButtonBypass');
var colorButtonBypassEl = colorButtonBypass.el.dom.querySelector("#html5colorpicker");
var numberButtonBypass = header.lookupReference('numberButtonBypass');
var activeSession = _metExploreViz.getSessionById(metExploreD3.GraphNode.activePanel);
if(activeSession) {
var mapNodes = activeSession.getSelectedNodes()
.map(function (nodeId) {
return activeSession.getD3Data().getNodeById(nodeId);
})
.filter(function (n) {
return n!==undefined
});
var selectedNodes = mapNodes.filter(function (node) {
return node.getBiologicalType()===view.biologicalType;
});
var selection = d3.select("#"+metExploreD3.GraphNode.activePanel)
.select("#D3viz")
.selectAll("g.node")
.filter(function (n) { return n.getBiologicalType()===view.biologicalType});
if(selectedNodes.length>0) {
bypassButton.enable();
if(selection){
var value = metExploreD3.GraphStyleEdition.getCollectionStyleBypass(view.target, view.attrType, view.attrName, view.biologicalType);
if(value==="multiple" || value==="none") {
bypassButton.show();
numberButtonBypass.hide();
colorButtonBypass.hide();
if(value==="multiple"){
if (view.styleType === "float" || view.styleType === "int") {
numberButtonBypass.fireEvent("setIcon", "mapMultipleNumbers");
}
if (view.styleType === "color")
colorButtonBypass.fireEvent("setIcon", "mapMultipleColors");
}
else
{
numberButtonBypass.fireEvent("setIcon", "noneIcon");
colorButtonBypass.fireEvent("setIcon", "noneIcon");
}
}
else
{
numberButtonBypass.fireEvent("setIcon", "noneIcon");
colorButtonBypass.fireEvent("setIcon", "noneIcon");
if (view.styleType === "float") {
if (parseFloat(view.default) !== parseFloat(value)){
numberButtonBypass.show();
bypassButton.hide();
me.replaceText(numberButtonBypass.el.dom, parseFloat(value));
}
}
if (view.styleType === "int") {
if (parseInt(view.default) !== parseInt(value)){
numberButtonBypass.show();
bypassButton.hide();
me.replaceText(numberButtonBypass.el.dom, parseInt(value));
}
}
if (view.styleType === "color") {
if (view.default !== metExploreD3.GraphUtils.RGBString2Color(value))
{
colorButtonBypass.show();
bypassButton.hide();
colorButtonBypassEl.setAttribute("value", metExploreD3.GraphUtils.RGBString2Color(value));
}
}
}
}
}
else {
bypassButton.show();
numberButtonBypass.hide();
colorButtonBypass.hide();
bypassButton.disable();
}
}
else {
bypassButton.show();
numberButtonBypass.hide();
colorButtonBypass.hide();
bypassButton.disable();
}
}
},
updateContinuousCaption : function(){
var me = this;
var view = me.getView();
if(view.styleType==="float" || view.styleType==="int" ){
var margin = 0;
var width = 190;
var height = 50;
var svg = d3.select(view.lookupReference('selectConditionForm').lookupReference('scaleCaption').el.dom).select("#scaleCaption");
svg.selectAll("*").remove();
svg = d3.select(view.lookupReference('selectConditionForm').lookupReference('scaleCaption').el.dom).select("#scaleCaption");
view.graphNumberScaleEditor.createNumberScaleCaption(svg, width, height, margin, view.scaleRange);
svg.on("click", function(){
var win = Ext.create("metExploreViz.view.form.continuousNumberMappingEditor.ContinuousNumberMappingEditor", {
height : 300,
aStyleFormParent : view
});
win.show();
});
}
if(view.styleType==="color"){
var margin = 0;
var width = 150;
var height = 50;
var svg = d3.select(view.lookupReference('selectConditionForm').lookupReference('scaleCaption').el.dom).select("#scaleCaption");
svg.selectAll("*").remove();
// var colorRangeCaption = ['#6f867b', '#F6F6F4', '#925D60'];
// var colorPercentCaption = [0, 50, 100];
// var colorDomainCaption = [1,2,3];
svg = d3.select(view.lookupReference('selectConditionForm').lookupReference('scaleCaption').el.dom).select("#scaleCaption");
view.graphColorScaleEditor.createColorScaleCaption(svg, width, height, margin, view.scaleRange);
svg.on("click", function(){
var win = Ext.create("metExploreViz.view.form.continuousColorMappingEditor.ContinuousColorMappingEditor", {
height : 300,
aStyleFormParent : view
});
win.show();
});
}
},
updateContinuousMapping : function(){
var me = this;
var view = me.getView();
if(view.styleType==="float" || view.styleType==="int" ){
var conditionName = view.lookupReference('selectConditionForm').lookupReference('selectCondition').getValue();
metExploreD3.GraphMapping.graphMappingContinuousData(conditionName, view);
}
if(view.styleType==="color"){
var conditionName = view.lookupReference('selectConditionForm').lookupReference('selectCondition').getValue();
metExploreD3.GraphMapping.graphMappingContinuousData(conditionName, view);
}
},
updateDiscreteMapping : function(){
var me = this;
var view = me.getView();
var conditionName = view.lookupReference('selectConditionForm').lookupReference('selectCondition').getValue();
var selectConditionType = view.lookupReference('selectConditionForm').lookupReference('selectConditionType');
var dataType = selectConditionType.getValue();
var session = _metExploreViz.getSessionById("viz");
if(dataType==="Alias"){
session.setMappingDataType(dataType);
metExploreD3.GraphMapping.graphMappingDiscreteData(conditionName, view);
}
if(dataType==="Discrete"){
session.setMappingDataType(dataType);
metExploreD3.GraphMapping.graphMappingDiscreteData(conditionName, view);
}
if(dataType==="As selection"){
session.setMappingDataType(dataType);
metExploreD3.GraphMapping.graphMappingAsSelectionData(conditionName, view);
}
},
updateFormValues : function(){
var me = this;
var view = me.getView();
var styleToUse;
if(view.biologicalType==="metabolite")
styleToUse = metExploreD3.getMetaboliteStyle();
if(view.biologicalType==="reaction")
styleToUse = metExploreD3.getReactionStyle();
if(view.biologicalType==="link")
styleToUse = metExploreD3.getLinkStyle();
if(!view.default)
view.default = styleToUse[view.access];
// WARNING Header render is executed afterrender view
// As a result, render and afterrender can't be used on header
var header = view.down('header');
me.updateSelectionSet();
header.lookupReference('mappingButton').fireEvent("setIcon", "continue");
if(view.styleType==="float" || view.styleType==="int" ){
var numberButton = header.lookupReference('numberButton');
numberButton.show();
me.replaceText(numberButton.el.dom, view.default);
var margin = 0;
var width = 190;
var height = 50;
var svg = d3.select(view.lookupReference('scaleCaption').el.dom).select("#scaleCaption");
view.graphNumberScaleEditor.createNumberScaleCaption(svg, width, height, margin, view.scaleRange);
svg.on("click", function(){