Commit 28747523 authored by David Hoksza's avatar David Hoksza
Browse files

Fully working version of visualization (still some issues with litemol not releasing webgl)

parent 981d9a9f
......@@ -36,6 +36,7 @@
"log4js-memory-appender": "1.0.5",
"mkdirp": "^0.5.1",
"mocha": "^3.5.3",
"protestant": "git://github.com/davidhoksza/protestant.git",
"uglifyjs": "^2.4.10"
},
"dependencies": {
......
......@@ -631,3 +631,41 @@ table.dataTable tbody td.no_padding, table.dataTable thead th.no_padding {
padding-right: 3px;
}
.dropdown-menu a.disabled-link, .dropdown-menu a.disabled-link:hover {
color: darkgrey;
}
.minerva-protestant-container {
position: absolute;
left:0;
top: 0;
width: 100%;
height: 100vh;
background-color: white;
border: 30px solid rgba(0,0,0,0.5);
-moz-background-clip: padding; /* Firefox 3.6 */
-webkit-background-clip: padding; /* Safari 4? Chrome 6? */
background-clip: padding-box;
z-index: 100;
display: none;
}
.minerva-protestant-close-button {
position: absolute;
left: 3px;
top: 3px;
font-size: 17px;
padding-top: 2px;
background:rgba(0, 0, 0, 0.2);
cursor: pointer;
width: 30px;
height: 30px;
border-radius: 3px;
text-align: center;
z-index: 101
}
.minerva-protestant-close-button:hover{
background:rgba(0, 0, 0, 0.4);
}
......@@ -29,7 +29,8 @@ function ContextMenu(params) {
ContextMenu.prototype = Object.create(AbstractGuiElement.prototype);
ContextMenu.prototype.constructor = ContextMenu;
ContextMenu.prototype.addOption = function (name, handler) {
ContextMenu.prototype.addOption = function (name, handler, disabled) {
if (!disabled) disabled = false;
var self = this;
if (name instanceof SubMenu) {
self.getElement().appendChild(name.getElement());
......@@ -38,10 +39,14 @@ ContextMenu.prototype.addOption = function (name, handler) {
type: "li"
});
var link = Functions.createElement({
type: "a",
href: "#",
type: "a",
content: name
});
if (!disabled) {
link.href = "#";
} else {
link.className = 'disabled-link';
}
$(link).data("handler", handler);
option.appendChild(link);
self.getElement().appendChild(option);
......
......@@ -11,6 +11,7 @@ function MapContextMenu(params) {
var self = this;
self._createMapContextMenuGui();
self.setProtestant(params.protestant);
}
MapContextMenu.prototype = Object.create(ContextMenu.prototype);
......@@ -24,7 +25,7 @@ MapContextMenu.prototype._createMapContextMenuGui = function() {
});
self.addOption("Select mode", function() {
return self.getMap().turnOnOffDrawing();
});
});
};
MapContextMenu.prototype.init = function() {
......@@ -37,4 +38,12 @@ MapContextMenu.prototype.init = function() {
});
};
MapContextMenu.prototype.setProtestant = function(protestant){
this._protestant = protestant;
}
MapContextMenu.prototype.getProtestant = function(){
return this._protestant;
}
module.exports = MapContextMenu;
......@@ -371,7 +371,9 @@ AbstractCustomMap.prototype.registerMapClickEvents = function () {
// select last clicked map
google.maps.event.addListener(this.getGoogleMap(), 'rightclick', function (mouseEvent) {
customMap.setActiveSubmapId(self.getId());
customMap.setActiveSubmapClickCoordinates(self.fromLatLngToPoint(mouseEvent.latLng));
var coordinates = self.fromLatLngToPoint(mouseEvent.latLng)
customMap.setActiveSubmapClickCoordinates(coordinates);
activateProtestantLink(coordinates, self);
});
// prepare for image export
......@@ -407,6 +409,29 @@ AbstractCustomMap.prototype.registerMapClickEvents = function () {
});
};
function activateProtestantLink(coordinates, map){
ServerConnector.getClosestElementsByCoordinates({
modelId: map.getId(),
coordinates: coordinates,
count: 1
}).then(function(identifiedElements) {
if (identifiedElements[0].type !== 'ALIAS') return Promise.reject(new Error());
return map.getModel().getAliasById(identifiedElements[0].id, true)
}).then (function(element){
for (var i =0; i < element.references.length; i++) {
var ref = element.references[i];
if (ref.constructor.name === 'Annotation' && ref.getType() === 'UNIPROT') {
var uniprotId = ref.getResource();
map.getContextMenu().getProtestant().activateInContextMenu(uniprotId);
return;
}
}
map.getContextMenu().getProtestant().deactivateInContextMenu();
}, function(){
map.getContextMenu().getProtestant().deactivateInContextMenu();
});
}
/**
* It toggle drawing manager used on the map: if it's on then it will turn it
* off, if it's off it will turn it on
......
var functions = require('../../Functions');
var ProtestantPlugin = require('protestant');
function Protestant(containerParentElement, customMap) {
var protestantDiv = functions.createElement({
type: "div",
id: "minervaProtestantContainer",
className: "minerva-protestant-container"
});
containerParentElement.appendChild(protestantDiv);
this.setContainerElement(protestantDiv);
this._customMap = customMap;
}
Protestant.prototype.setContainerElement = function (containerElement) {
this._containerElement = containerElement;
}
Protestant.prototype.getContainerElement = function () {
return this._containerElement;
}
function removeFromContextMenu(menu){
$(menu.getElement()).find('li:contains("PROTESTANT")').remove();
}
Protestant.prototype.activateInContextMenu = function(uniprotId) {
var self = this;
var menu = this._customMap.getContextMenu();
removeFromContextMenu(menu);
menu.addOption("Open PROTESTANT (" + uniprotId + ")", function() {
uniprotId ? self._activate(uniprotId) : self._activate('O60260');
}, false);
}
Protestant.prototype.deactivateInContextMenu = function() {
var menu = this._customMap.getContextMenu();
removeFromContextMenu(menu);
menu.addOption("Open PROTESTANT", null, true);
}
Protestant.prototype._deactivate = function () {
var container = this.getContainerElement();
container.style.display = 'none';
$(container).empty();
this.protestant = undefined;
}
Protestant.prototype._activate = function (uniprotId) {
var self = this;
var container = this.getContainerElement();
if (!container) return;
var protestantCloseButton = functions.createElement({
type: "div",
className: "minerva-protestant-close-button",
content: 'x'
});
protestantCloseButton.addEventListener('click', function(){
self._deactivate();
return false;
});
container.appendChild(protestantCloseButton);
this.protestant = new ProtestantPlugin({
uniprotId: uniprotId,
containerId: container.id
});
container.style.display = 'block';
}
module.exports = Protestant;
\ No newline at end of file
......@@ -22,6 +22,8 @@ var SelectionContextMenu = require('./gui/SelectionContextMenu');
var GuiConnector = require('./GuiConnector');
var OriginalServerConnector = require('./ServerConnector');
var Protestant = require('./map/structure/Protestant');
var Promise = require("bluebird");
var logger = require('./logger');
......@@ -82,7 +84,7 @@ function insertGoogleAnalyticsCode() {
});
}
function createDivStructure(element) {
function createDivStructure(element) {
var tableDiv = functions.createElement({
type: "div",
style: "display: table; width:100%; height: 100%"
......@@ -299,7 +301,8 @@ function create(params) {
mapContextMenu = new MapContextMenu({
element: functions.getElementByName(element, "contextMenu"),
customMap: customMap
customMap: customMap,
protestant: new Protestant(element, customMap)
});
customMap.setContextMenu(mapContextMenu);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment