"+
"
"+title+"
"+
@@ -458,6 +495,12 @@ inspectorUtilities.handleSBGNInspector = function () {
addCollapsibleSection("biogene", "Properties from EntrezGene", true);
fillBioGeneContainer(selectedEles[0]);
}
+ if (geneClass === 'simple chemical')
+ {
+
+ addCollapsibleSection("chemical", "Properties from ChEBI", true);
+ fillChemicalContainer(selectedEles[0]);
+ }
// annotations handling part
addCollapsibleSection("annotations", "Custom Properties", false);
@@ -477,6 +520,176 @@ inspectorUtilities.handleSBGNInspector = function () {
$('#inspector-is-clone-marker').attr('checked', true);
}
+ if(imageFromURL){
+ $('#inspector-image-from-url').attr('checked', true);
+ }
+
+ function updateBackgroundDeleteInfo(){
+ hasBackgroundImage = chiseInstance.elementUtilities.hasBackgroundImage(selectedEles[0]);
+
+ if(!hasBackgroundImage){
+ $('#inspector-delete-bg').hide();
+ $('#inspector-fit-selector').hide();
+ $('#inspector-image-url').val('');
+ }
+ else{
+ $('#inspector-delete-bg').show();
+ $('#inspector-fit-selector').show();
+ imageURL = chiseInstance.elementUtilities.getBackgroundImageURL(selectedEles[0]);
+ imageURL = imageURL ? imageURL : "";
+ $('#inspector-image-url').val(imageURL);
+ }
+ }
+
+ function promptInvalidImage(msg){
+ appUtilities.promptInvalidImageWarning.render(msg);
+ }
+
+ $('#inspector-image-from-url').on('click', function() {
+ imageFromURL = !imageFromURL;
+ if(imageFromURL){
+ imageURL = chiseInstance.elementUtilities.getBackgroundImageURL(selectedEles[0]);
+ imageURL = imageURL ? imageURL : "";
+
+ $('#inspector-image-url').val(imageURL);
+ $('#inspector-image-url').show();
+ $('#inspector-image-file').hide();
+ }
+ else{
+ $('#inspector-image-url').hide();
+ $('#inspector-image-file').show();
+ }
+ });
+
+ $('#inspector-delete-bg').on('click', function () {
+ var bgObj = chiseInstance.elementUtilities.getBackgroundImageObj(selectedEles[0]);
+ chiseInstance.removeBackgroundImage(selectedEles, bgObj);
+ updateBackgroundDeleteInfo();
+ });
+
+ $('#inspector-fit-selector').on('change', function () {
+ var fit = $("#inspector-fit-selector").val();
+ if(!fit){
+ return;
+ }
+
+ var bgObj = chiseInstance.elementUtilities.getBackgroundImageObj(selectedEles[0]);
+ if(!bgObj || bgObj === {}){
+ return;
+ }
+
+ var bgWidth = "auto";
+ var bgHeight = "auto";
+ var bgFit = "none";
+
+ if(fit === "fit"){
+ bgWidth = "100%";
+ bgHeight = "100%";
+ bgFit = "none"
+ }
+ else if(fit){
+ bgFit = fit;
+ }
+
+ bgObj['background-fit'] = bgFit;
+ bgObj['background-width'] = bgWidth;
+ bgObj['background-height'] = bgHeight;
+ chiseInstance.updateBackgroundImage(selectedEles, bgObj);
+ updateBackgroundDeleteInfo();
+ });
+
+ $("#inspector-image-url").on('change', function () {
+ var url = $(this).val().trim();
+ imageURL = chiseInstance.elementUtilities.getBackgroundImageURL(selectedEles[0]);
+
+ if (url && imageURL !== url){
+ var fit = $("#inspector-fit-selector").val();
+ var bgWidth = "auto";
+ var bgHeight = "auto";
+ var bgFit = "none";
+
+ if(fit === "fit"){
+ bgWidth = "100%";
+ bgHeight = "100%";
+ bgFit = "none"
+ }
+ else if(fit){
+ bgFit = fit;
+ }
+
+ var bgObj = {
+ 'background-image' : url,
+ 'background-fit' : bgFit,
+ 'background-image-opacity' : '1',
+ 'background-position-x' : '50%',
+ 'background-position-y' : '50%',
+ 'background-width' : bgWidth,
+ 'background-height' : bgHeight,
+ 'fromFile' : false
+ };
+
+ // If there is a background image change it, don't add
+ if(chiseInstance.elementUtilities.hasBackgroundImage(selectedEles[0])){
+ var oldObj = chiseInstance.elementUtilities.getBackgroundImageObj(selectedEles[0]);
+ chiseInstance.changeBackgroundImage(selectedEles, oldObj, bgObj, true);
+ }
+ else{
+ chiseInstance.addBackgroundImage(selectedEles, bgObj, updateBackgroundDeleteInfo, promptInvalidImage);
+ }
+ }
+ });
+
+ $("#inspector-image-url").on('keydown', function (e) {
+ if (e.keyCode == 13 ){
+ $(this).trigger("change");
+ }
+ });
+
+ $("#inspector-image-file").on('click', function () {
+ $('#inspector-image-load').trigger('click');
+ });
+
+ $('#inspector-image-load').on('change', function (e, fileObject) {
+
+ if ($(this).val() != "" || fileObject) {
+ var file = this.files[0] || fileObject;
+ var fit = $("#inspector-fit-selector").val();
+ var bgWidth = "auto";
+ var bgHeight = "auto";
+ var bgFit = "none";
+
+ if(fit === "fit"){
+ bgWidth = "100%";
+ bgHeight = "100%";
+ bgFit = "none"
+ }
+ else if(fit){
+ bgFit = fit;
+ }
+
+ var bgObj = {
+ 'background-image' : file,
+ 'background-fit' : bgFit,
+ 'background-image-opacity' : '1',
+ 'background-position-x' : '50%',
+ 'background-position-y' : '50%',
+ 'background-width' : bgWidth,
+ 'background-height' : bgHeight,
+ 'fromFile' : true
+ };
+
+ // If there is a background image change it, don't add
+ if(chiseInstance.elementUtilities.hasBackgroundImage(selectedEles[0])){
+ var oldObj = chiseInstance.elementUtilities.getBackgroundImageObj(selectedEles[0]);
+ chiseInstance.changeBackgroundImage(selectedEles, oldObj, bgObj, true);
+ }
+ else{
+ chiseInstance.addBackgroundImage(selectedEles, bgObj, updateBackgroundDeleteInfo, promptInvalidImage);
+ }
+ $(this).val("");
+ }
+ });
+
$('#inspector-set-as-default-button').on('click', function () {
var multimer;
var selected = selectedEles[0];
@@ -492,24 +705,24 @@ inspectorUtilities.handleSBGNInspector = function () {
if (appUtilities.undoable) {
var ur = cy.undoRedo();
var actions = [];
-
+
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'width', value: selected.width()}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'height', value: selected.height()}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'border-width', value: selected.data('border-width')}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'border-color', value: selected.data('border-color')}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'background-color', value: selected.data('background-color')}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'background-opacity', value: selected.data('background-opacity')}});
-
+
// Push this action if the node can be multimer
if (chiseInstance.elementUtilities.canBeMultimer(sbgnclass)) {
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'multimer', value: multimer}});
}
-
+
// Push this action if the node can be cloned
if (chiseInstance.elementUtilities.canBeCloned(sbgnclass)) {
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'clonemarker', value: selected._private.data.clonemarker}});
}
-
+
// Push this action if the node can have label
if (chiseInstance.elementUtilities.canHaveSBGNLabel(sbgnclass)) {
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'font-size', value: selected.data('font-size')}});
@@ -517,12 +730,12 @@ inspectorUtilities.handleSBGNInspector = function () {
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'font-weight', value: selected.data('font-weight')}});
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'font-style', value: selected.data('font-style')}});
}
-
+
// Push this action if the node can have ports
if (chiseInstance.elementUtilities.canHavePorts(selected)) {
actions.push({name: "setDefaultProperty", param: {class: sbgnclass, name: 'ports-ordering', value: chiseInstance.elementUtilities.getPortsOrdering(selected)}});
}
-
+
ur.do("batch", actions);
}
else {
@@ -538,12 +751,12 @@ inspectorUtilities.handleSBGNInspector = function () {
if (chiseInstance.elementUtilities.canBeMultimer(sbgnclass)) {
defaults['multimer'] = multimer;
}
-
+
// Set this if the node can be cloned
if (chiseInstance.elementUtilities.canBeCloned(sbgnclass)) {
defaults['clonemarker'] = selected._private.data.clonemarker;
}
-
+
// Set this if the node can have label
if (chiseInstance.elementUtilities.canHaveSBGNLabel(sbgnclass)) {
defaults['font-size'] = selected.data('font-size');
@@ -551,7 +764,7 @@ inspectorUtilities.handleSBGNInspector = function () {
defaults['font-weight'] = selected.data('font-weight');
defaults['font-style'] = selected.data('font-style');
}
-
+
// Set this if the node can have ports
if (chiseInstance.elementUtilities.canHavePorts(selected)) {
defaults['ports-ordering'] = chiseInstance.elementUtilities.getPortsOrdering(selected);
@@ -567,16 +780,16 @@ inspectorUtilities.handleSBGNInspector = function () {
$("#inspector-node-width, #inspector-node-height").change( function () {
var w = parseFloat($("#inspector-node-width").val());
var h = parseFloat($("#inspector-node-height").val());
-
+
if( $(this).attr('id') === 'inspector-node-width' ) {
h = undefined;
}
else {
w = undefined;
}
-
+
var useAspectRatio = appUtilities.nodeResizeUseAspectRatio;
-
+
// trigger resize event accordingly
selectedEles.forEach(function(node) {
cy.trigger('noderesize.resizestart', [null, node]);
@@ -607,9 +820,9 @@ inspectorUtilities.handleSBGNInspector = function () {
if(appUtilities.nodeResizeUseAspectRatio == null) {
appUtilities.nodeResizeUseAspectRatio = false;
}
-
+
appUtilities.nodeResizeUseAspectRatio = !appUtilities.nodeResizeUseAspectRatio;
-
+
// refresh image
if (appUtilities.nodeResizeUseAspectRatio) {
imageName = "lock.svg";
@@ -619,9 +832,12 @@ inspectorUtilities.handleSBGNInspector = function () {
imageName = "open-lock.svg";
title = "Lock aspect ratio";
}
-
+
$(this).attr('src', 'app/img/' + imageName);
$(this).attr('title', title);
+
+ //Refresh grapples when the lock icon is clicked
+ cy.nodeResize('get').refreshGrapples();
});
$('#inspector-is-multimer').on('click', function () {
@@ -677,7 +893,7 @@ inspectorUtilities.handleSBGNInspector = function () {
$("#inspector-border-width").change( function () {
chiseInstance.changeData(selectedEles, "border-width", $("#inspector-border-width").val());
});
-
+
// Open font properties dialog
$("#inspector-font").on('click', function () {
appUtilities.fontPropertiesView.render(selectedEles);
diff --git a/app/main.js b/app/main.js
index c611ca5f2..78a577895 100644
--- a/app/main.js
+++ b/app/main.js
@@ -37,7 +37,7 @@ cyExpandCollapse( cytoscape, $ );
cyEdgeBendEditing( cytoscape, $ );
cyViewUtilities( cytoscape, $ );
cyEdgehandles( cytoscape );
-cyGridGuide( cytoscape );
+cyGridGuide( cytoscape, $ );
cyAutopanOnDrag( cytoscape );
cyNodeResize( cytoscape, $, konva );
diff --git a/index.html b/index.html
index 0f2a27792..b681bc472 100644
--- a/index.html
+++ b/index.html
@@ -61,14 +61,14 @@
Insulin-like growth factor (IGF) signaling
PolyQ proteins interference
Glycolysis
-
MAPK cascade
+
MAPK cascade
AF
Transforming growth factor beta (TGFB) signaling
Repressilator
Epidermal growth factor receptor
-
Regulation of TGF-beta induced metastasis
+
Regulation of TGF-beta induced metastasis
Save...
@@ -81,21 +81,22 @@
-
- -->
+
+
@@ -302,6 +318,7 @@
+
@@ -559,10 +576,25 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -594,17 +626,25 @@
-
+
+
+
+
+
+
+
+
+
-
+
@@ -657,7 +697,7 @@
About
-
+
@@ -1134,26 +1174,27 @@
Layout Properties
-->
-
+
+
+
+
+
+
@@ -1384,7 +1568,7 @@
Warning
|
- Length limit can be at most 3.
+ Length limit can be at most 3.
|
@@ -1464,6 +1648,37 @@ Error
+
+
+
-
+
+
+
+
+
