Commit b19b6675 authored by maxchaza's avatar maxchaza

Merge branch 'hotfix/linkStyles'

parents 5e9f7a17 eb034670
......@@ -7,7 +7,7 @@
/**
* The version of the application.
*/
"version": "3.0.9",
"version": "3.0.10",
/**
* The relative path to the application's markup file (html, jsp, asp, etc.).
......
......@@ -7,7 +7,9 @@
Ext.define('metExploreViz.view.form.aStyleForm.AStyleFormController', {
extend: 'Ext.app.ViewController',
alias: 'controller.form-aStyleForm-aStyleForm',
requires: [
"metExploreViz.view.form.label.Label"
],
/**
* Init function Checks the changes on drawing style
*/
......@@ -502,6 +504,114 @@ Ext.define('metExploreViz.view.form.aStyleForm.AStyleFormController', {
});
}
if(view.styleType==="string"){
var numberButton = header.lookupReference('numberButton');
var numberButtonBypass = header.lookupReference('numberButtonBypass');
var numberButtonBypassEl = numberButtonBypass.el.dom.querySelector("#textNumberButton");
numberButton.show();
me.replaceText(numberButton.el.dom, view.default);
numberButton.setTooltip(view.default);
numberButton.on({
click: function(){
var viewAStyleForm = view;
// var bioStyleForm = Ext.getCmp(viewAStyleForm.biologicalType+"StyleForm");
// if(bioStyleForm.linkStylesWin===false)
// {
var win = Ext.create("metExploreViz.view.form.label.Label", {
title : "Label for " + viewAStyleForm.title,
height : 20,
aStyleFormParent : viewAStyleForm,
listeners :{
afterrender : function(){
win.lookupReference('okButton').on({
click : function(){
var val = win.lookupReference('selectLabel').getValue();
styleToUse[view.access] = val;
view.default = val;
me.replaceText(numberButton.el.dom, val);
numberButton.setTooltip(val);
var bypass = false;
metExploreD3.GraphStyleEdition.setCollectionLabel(view.target, view.attrType, view.attrName, view.biologicalType, val, bypass);
win.close();
},
scope:me
});
win.lookupReference('cancelButton').on({
click : function(that){
win.close();
},
scope:me
});
}
}
});
win.show();
// bioStyleForm.linkStylesWin=win;
// }
// else
// {
// var el = bioStyleForm.linkStylesWin.getEl();
// el
// .fadeIn({ x: el.getBox().x-10, duration: 10})
// .fadeIn({ x: el.getBox().x, duration: 10})
// .fadeIn({ x: el.getBox().x-10, duration: 10})
// .fadeIn({ x: el.getBox().x, duration: 10})
// .fadeIn({ x: el.getBox().x-10, duration: 10})
// .fadeIn({ x: el.getBox().x, duration: 10})
// }
// me.numberPrompt(numberButton.el.dom, function(text){
// var val = text;
//
// metExploreD3.GraphStyleEdition.setCollectionLabel(view.target, view.attrType, view.attrName, view.biologicalType, val);
// styleToUse[view.access] = val;
// view.default = val;
// });
},
scope : me
});
function setValueWithPrompt(){
me.textPrompt(numberButtonBypass.el.dom, function(text){
var val = text;
var bypass = true;
metExploreD3.GraphStyleEdition.setCollectionLabelBypass(view.target, view.attrType, view.attrName, view.biologicalType, val, bypass);
});
}
numberButtonBypass.on({
click: function(){
setValueWithPrompt();
},
setIcon: function(type){
bypassButton.removeCls('mapMultipleNumbers');
if(type!=="noneIcon") bypassButton.addCls("mapMultipleNumbers");
},
scope : me
});
bypassButton.on({
click: function(target){
target.hide();
numberButtonBypass.show();
setValueWithPrompt();
},
scope : me
});
}
if(view.styleType==="color"){
var colorButton = header.lookupReference('colorButton');
......@@ -556,6 +666,22 @@ Ext.define('metExploreViz.view.form.aStyleForm.AStyleFormController', {
textPrompt : function(target, func){
var me = this;
var view = me.getView();
Ext.Msg.prompt(view.title, 'Enter text :',
function(btn, text){
if (btn == 'ok'){
if(text!="") {
me.replaceText(target, text);
func(text);
}
}
}, this, false);
},
numberPrompt : function(target, func){
var me = this;
var view = me.getView();
......
......@@ -16,12 +16,14 @@ Ext.define('metExploreViz.view.form.allStylesByTypeForm.AllStylesByTypeFormContr
viewModel = me.getViewModel(),
view = me.getView();
view.linkStylesWin = false;
view.store.data.forEach(function (styleBar) {
var myPanel = Ext.create('metExploreViz.view.form.aStyleForm.AStyleForm', {
title: styleBar.title,
access: styleBar.access,
linkedStyles: [],
biologicalType: styleBar.biologicalType,
styleType: styleBar.type,
default: styleBar.default,
......
......@@ -52,6 +52,7 @@ Ext.define('metExploreViz.view.form.allStylesForm.AllStylesFormController', {
.map(function (aStyleForm) {
return {
biologicalType:aStyleForm.biologicalType,
linkedStyles:aStyleForm.linkedStyles,
title:aStyleForm.title,
default : aStyleForm.default,
scaleRange : aStyleForm.scaleRange,
......@@ -91,6 +92,9 @@ Ext.define('metExploreViz.view.form.allStylesForm.AllStylesFormController', {
metExploreD3.GraphStyleEdition.setCollectionStyle(theStyleForm.target, theStyleForm.attrType, theStyleForm.attrName, theStyleForm.biologicalType, scale.default);
}
}
if (scale.linkedStyles){
theStyleForm.linkedStyles=scale.linkedStyles;
}
if (scale.scaleRange){
if(scale.scaleRange!==theStyleForm.scaleRange){
......
/**
* @author MC
* (a)description combobox to select condition in mapping
* label
*/
Ext.define('metExploreViz.view.form.label.Label', {
extend: 'Ext.window.Window',
alias: 'widget.label',
requires: [
"metExploreViz.view.form.label.LabelController"
],
controller: "form-label-label",
height: "200px",
maxWidth: 600,
minWidth: 600,
x: 100,
y: 100,
maxHeight: 200,
minHeight: 200,
layout:{
type:'vbox',
align:'stretch'
},
items: [
{
xtype: "combobox",
reference: "selectLabel",
displayField: 'name',
valueField: 'name',
width: 150,
queryMode: 'local',
multiSelect:false,
editable:false,
emptyText:'-- Select label --',
margin:'5 5 5 5'
},
{
xtype: "panel",
layout:{
type:'hbox',
pack : 'end'
},
items:[
{
margin: "5 5 5 5",
xtype: 'button',
reference: 'okButton',
text : 'OK'
},
{
margin: "5 15 5 5",
xtype: 'button',
reference: 'cancelButton',
text : 'Cancel'
}
]
}
]
});
\ No newline at end of file
/**
* @author MC
* (a)description class to control contion selection panel and to draw mapping in the mapping story
*/
Ext.define('metExploreViz.view.form.label.LabelController', {
extend: 'Ext.app.ViewController',
alias: 'controller.form-label-label',
/**
* Aplies event linsteners to the view
*/
init:function(){
var me = this,
viewModel = me.getViewModel(),
view = me.getView();
view.lookupReference('selectLabel').on({
beforerender: function(c) {
var session = _metExploreViz.getSessionById('viz');
var metabKeys=Object.keys(session.getD3Data().getNodes().filter(n => n.getBiologicalType() === "metabolite")[0]);
view.lookupReference('selectLabel').setStore(metabKeys);
if(metabKeys.length>0) {
view.lookupReference('selectLabel').setValue(view.aStyleFormParent.default);
}
},
scope:me
});
},
updateFocus : function(aStyleForm){
var me = this,
view = me.getView();
var linkedStyles = aStyleForm.linkedStyles;
if(linkedStyles.length>0){
aStyleForm.lookupReference('selectConditionForm').lookupReference('label').addCls('focus');
aStyleForm.lookupReference('selectConditionForm').lookupReference('label').setIconCls('link');
}
else
{
aStyleForm.lookupReference('selectConditionForm').lookupReference('label').setIconCls('unlink');
aStyleForm.lookupReference('selectConditionForm').lookupReference('label').removeCls('focus');
}
},
setLinkedStyles:function(arrayStyles){
var me = this,
view = me.getView();
var oldIncludesNew = view.aStyleFormParent.linkedStyles.every(function(item){ return arrayStyles.includes(item)});
var newIncludesOld = arrayStyles.every(function(item){ return view.aStyleFormParent.linkedStyles.includes(item)});
var removedStylesTitle = view.aStyleFormParent.linkedStyles.filter(function(item){ return !arrayStyles.includes(item)});
if(!(oldIncludesNew && newIncludesOld)){
view.aStyleFormParent.linkedStyles=arrayStyles;
var bioStyleForm = Ext.getCmp(view.aStyleFormParent.biologicalType+"StyleForm");
var partOfAllStyles = bioStyleForm.query("aStyleForm")
.filter(function (aStyleForm) {
return view.aStyleFormParent.linkedStyles.includes(aStyleForm.title);
});
partOfAllStyles.forEach(function(styleForm){
styleForm.expand();
var mappingNameToPropagate = view.aStyleFormParent.lookupReference('selectConditionForm').lookupReference('selectCondition').getValue();
var dataTypeToPropagate = view.aStyleFormParent.lookupReference('selectConditionForm').lookupReference('selectConditionType').getValue();
styleForm.lookupReference('selectConditionForm').lookupReference('selectCondition').setValue(mappingNameToPropagate);
styleForm.lookupReference('selectConditionForm').lookupReference('selectConditionType').setValue(dataTypeToPropagate);
styleForm.linkedStyles.push(view.aStyleFormParent.title);
me.updateFocus(styleForm);
});
var removedStyles = bioStyleForm.query("aStyleForm")
.filter(function (aStyleForm) {
return removedStylesTitle.includes(aStyleForm.title);
});
removedStyles.forEach(function(styleForm){
styleForm.linkedStyles = styleForm.linkedStyles.filter(function (title) {
return view.aStyleFormParent.title !== title
});
console.log(styleForm.linkedStyles);
me.updateFocus(styleForm);
});
me.updateFocus(view.aStyleFormParent);
}
}
});
\ No newline at end of file
/**
* @author MC
* (a)description combobox to select condition in mapping
* linkStyles
*/
Ext.define('metExploreViz.view.form.linkStyles.LinkStyles', {
extend: 'Ext.window.Window',
alias: 'widget.linkStyles',
requires: [
"metExploreViz.view.form.linkStyles.LinkStylesController"
],
controller: "form-linkStyles-linkStyles",
height: "400px",
maxWidth: 600,
minWidth: 600,
x: 100,
y: 100,
maxHeight: 460,
minHeight: 460,
layout:{
type:'vbox',
align:'stretch'
},
items: [
{
xtype: "combobox",
reference: "selectStyles",
displayField: 'name',
valueField: 'name',
width: 150,
queryMode: 'local',
multiSelect:true,
editable:false,
emptyText:'-- Select styles to link --',
margin:'5 5 5 5'
},
{
xtype: "panel",
layout:{
type:'hbox',
pack : 'end'
},
items:[
{
margin: "5 5 5 5",
xtype: 'button',
reference: 'okButton',
text : 'OK'
},
{
margin: "5 15 5 5",
xtype: 'button',
reference: 'cancelButton',
text : 'Cancel'
}
]
}
]
});
\ No newline at end of file
/**
* @author MC
* (a)description class to control contion selection panel and to draw mapping in the mapping story
*/
Ext.define('metExploreViz.view.form.linkStyles.LinkStylesController', {
extend: 'Ext.app.ViewController',
alias: 'controller.form-linkStyles-linkStyles',
/**
* Aplies event linsteners to the view
*/
init:function(){
var me = this,
viewModel = me.getViewModel(),
view = me.getView();
view.lookupReference('okButton').on({
click : function(){
me.setLinkedStyles(view.lookupReference('selectStyles').getValue());
view.close();
},
scope:me
});
view.lookupReference('cancelButton').on({
click : function(that){
view.close();
},
scope:me
});
view.lookupReference('selectStyles').on({
beforerender: function(c) {
var bioStyleForm = Ext.getCmp(view.aStyleFormParent.biologicalType+"StyleForm");
var scales = [];
var partOfAllScales = bioStyleForm.query("aStyleForm")
.map(function (aStyleForm) {
return aStyleForm.title;
})
.filter(function (aStyleFormTitle) {
return aStyleFormTitle!==view.aStyleFormParent.title;
});
scales = scales.concat(partOfAllScales);
view.lookupReference('selectStyles').setStore(scales);
var linkedStyles = view.aStyleFormParent.linkedStyles;
if(linkedStyles.length>0) {
view.lookupReference('selectStyles').setValue(linkedStyles);
}
},
scope:me
});
},
updateFocus : function(aStyleForm){
var me = this,
view = me.getView();
var linkedStyles = aStyleForm.linkedStyles;
if(linkedStyles.length>0){
aStyleForm.lookupReference('selectConditionForm').lookupReference('linkStyles').addCls('focus');
aStyleForm.lookupReference('selectConditionForm').lookupReference('linkStyles').setIconCls('link');
}
else
{
aStyleForm.lookupReference('selectConditionForm').lookupReference('linkStyles').setIconCls('unlink');
aStyleForm.lookupReference('selectConditionForm').lookupReference('linkStyles').removeCls('focus');
}
},
setLinkedStyles:function(arrayStyles){
var me = this,
view = me.getView();
var oldIncludesNew = view.aStyleFormParent.linkedStyles.every(function(item){ return arrayStyles.includes(item)});
var newIncludesOld = arrayStyles.every(function(item){ return view.aStyleFormParent.linkedStyles.includes(item)});
var removedStylesTitle = view.aStyleFormParent.linkedStyles.filter(function(item){ return !arrayStyles.includes(item)});
if(!(oldIncludesNew && newIncludesOld)){
view.aStyleFormParent.linkedStyles=arrayStyles;
var bioStyleForm = Ext.getCmp(view.aStyleFormParent.biologicalType+"StyleForm");
var partOfAllStyles = bioStyleForm.query("aStyleForm")
.filter(function (aStyleForm) {
return view.aStyleFormParent.linkedStyles.includes(aStyleForm.title);
});
partOfAllStyles.forEach(function(styleForm){
styleForm.expand();
var mappingNameToPropagate = view.aStyleFormParent.lookupReference('selectConditionForm').lookupReference('selectCondition').getValue();
var dataTypeToPropagate = view.aStyleFormParent.lookupReference('selectConditionForm').lookupReference('selectConditionType').getValue();
styleForm.lookupReference('selectConditionForm').lookupReference('selectCondition').setValue(mappingNameToPropagate);
styleForm.lookupReference('selectConditionForm').lookupReference('selectConditionType').setValue(dataTypeToPropagate);
styleForm.linkedStyles.push(view.aStyleFormParent.title);
me.updateFocus(styleForm);
});
var removedStyles = bioStyleForm.query("aStyleForm")
.filter(function (aStyleForm) {
return removedStylesTitle.includes(aStyleForm.title);
});
removedStyles.forEach(function(styleForm){
styleForm.linkedStyles = styleForm.linkedStyles.filter(function (title) {
return view.aStyleFormParent.title !== title
});
console.log(styleForm.linkedStyles);
me.updateFocus(styleForm);
});
me.updateFocus(view.aStyleFormParent);
}
}
});
\ No newline at end of file
......@@ -102,17 +102,17 @@ Ext.define('metExploreViz.view.form.metaboliteStyleForm.MetaboliteStyleForm', {
"max": 50,
"default": 1
},
// {
// "type": "string",
// "target": ["text.metabolite"],
// "attrType": "style",
// "attr": "font-size",
// "access": "fontSize",
// "biologicalType":"metabolite",
// "title": "Label",
// "choices":"",
// "default":"name"
// },
{
"type": "string",
"target": ["text.metabolite"],
"attrType": "style",
"attr": "label",
"access": "label",
"biologicalType":"metabolite",
"title": "Label",
"choices":"",
"default":"name"
},
{
"type": "color",
"target": ["text.metabolite"],
......
......@@ -98,8 +98,17 @@ Ext.define('metExploreViz.view.form.reactionStyleForm.ReactionStyleForm', {
"min": 0,
"max": 50,
"default": 1
}
,{
}, {
"type": "string",
"target": ["text.reaction"],
"attrType": "style",
"attr": "label",
"access": "label",
"biologicalType":"reaction",
"title": "Label",
"choices":"",
"default":"name"
}, {
"type": "color",
"target": ["text.reaction"],
"attrType": "attr",
......
......@@ -60,6 +60,15 @@ Ext.define('metExploreViz.view.form.selectConditionForm.SelectConditionForm', {
margins:'0 0 0 0',
bbar: [
'->',//spliter to shift next component up to end of right
{
xtype: 'button',
iconCls:'unlink',
align:"right",
scale : 'small',
margin:'5 5 5 0',
reference: 'linkStyles',
tooltip: "Link styles"
},
{
xtype: 'button',
iconCls:'download',
......
......@@ -7,7 +7,8 @@ Ext.define('metExploreViz.view.form.selectConditionForm.SelectConditionFormContr
extend: 'Ext.app.ViewController',
alias: 'controller.form-selectConditionForm-selectConditionForm',
requires: [
"metExploreViz.view.form.continuousColorMappingEditor.ContinuousColorMappingEditor"
"metExploreViz.view.form.continuousColorMappingEditor.ContinuousColorMappingEditor",
"metExploreViz.view.form.linkStyles.LinkStyles"
],
/**
* Aplies event linsteners to the view
......@@ -16,55 +17,38 @@ Ext.define('metExploreViz.view.form.selectConditionForm.SelectConditionFormContr
var me = this,
view = me.getView();
me.regexpPanel=/[.>< ,\/=()]/g;
me.regexpPanel=/[.>< ,\/=()]/g;
// Action to launch mapping on the visualization
view.on({
afterDiscreteMapping : this.addMappingCaptionForm,
scope:me
});
view.on({
afterContinuousMapping : this.addMappingCaptionForm,
scope:me
});
view.on({
afterSuggestionMapping : this.addMappingCaptionForm,
scope:me
});
view.on({
closeMapping : function(newMapping){
me.closeMapping(newMapping);
},
scope:me
});
view.on({
resetMapping : function(){
me.resetMapping();
},
scope:me
});
view.on({
removeMapping : function(removedMapping){
me.removeMapping(removedMapping);
},
scope:me
});
view.on({
reset : function(newMapping){
},
scope:me
});
view.lookupReference('selectConditionType').on({
afterrender : function(){
var aStyleFormParent = me.getAStyleFormParent();
if(aStyleFormParent.styleType==="string"){
view.lookupReference('selectConditionType').hide();
}
},
change : function(that, newVal, old){
var viewAStyleForm = me.getAStyleFormParent();
this.map(newVal, old, viewAStyleForm);
this.applyToLinkedStyles( viewAStyleForm);
},
scope:me
});
......@@ -87,12 +71,6 @@ Ext.define('metExploreViz.view.form.selectConditionForm.SelectConditionFormContr
var dataType = view.lookupReference('selectConditionType').getValue();
if(dataType==="Continuous"){
}
if(dataType==="Discrete" || dataType==="As selection" || dataType==="Alias"){
metExploreD3.GraphUtils.saveStyles(viewAStyleForm.valueMappings);
}
switch (dataType) {
case 'Continuous':
metExploreD3.GraphUtils.saveStyles(viewAStyleForm.scaleRange);
......@@ -113,6 +91,42 @@ Ext.define('metExploreViz.view.form.selectConditionForm.SelectConditionFormContr
scope:me
});
view.lookupReference('linkStyles').on({
click : function(){
var viewAStyleForm = me.getAStyleFormParent();
var bioStyleForm = Ext.getCmp(viewAStyleForm.biologicalType+"StyleForm");
if(