Commit 91b3e9a7 authored by David Hoksza's avatar David Hoksza
Browse files

semi-correctly handled situtation when plugin is started from a given step

parent b61ad21b
Pipeline #8668 passed with stage
in 42 seconds
const introJs = require('intro.js');
const selections = require('./selections');
let guideGlobalState;
const initializeStory = function(params) {
guideGlobalState = params.guideGlobalState;
const id = 'drug_targets';
const $introContainer = params.initializeIntroJsStoryHtml(id, 'Drug targets', 'See what drugs target specific elements of the map');
const intro = initializeStoryContet($introContainer, params);
......@@ -91,16 +94,25 @@ function initializeStoryContet($introContainer, params){
params.cleanMinerva();
$(selections.drugTabLink).click();
$(selections.drugTabInput).val("");
guideGlobalState.val = 1;
}
if (steps.indexOf(1) >= 0) {
guideGlobalState.val = 2;
}
if (steps.indexOf(2) >= 0) {
$(selections.drugTabSearchLink)[0].click();
$(selections.drugTabInput).val("levodopa;carbidopa");
guideGlobalState.val = 3;
}
if (steps.indexOf(3) >= 0) {
$(selections.drugTabLink).click();
$(selections.drugTabSearchLink)[0].click();
guideGlobalState.val = 4;
}
if (steps.indexOf(4) >= 0) {
guideGlobalState.val = 5;
}
}
let stepsToCarryOut = [];
......
......@@ -26,6 +26,8 @@ let pluginContainer;
let pluginContainerId;
let mainModelId = undefined;
let guideGlobalState = {val:undefined};
const register = function(_minerva) {
......@@ -36,7 +38,7 @@ const register = function(_minerva) {
minervaProxy = _minerva;
pluginContainer = $(minervaProxy.element);
pluginContainerId = pluginContainer.attr('id');
console.log('pluginContainer', pluginContainer);
// console.log('pluginContainer', pluginContainer);
// console.log('minerva object ', minervaProxy);
// console.log('project id: ', minervaProxy.project.data.getProjectId());
......@@ -226,11 +228,31 @@ function startIntro($introContainer, intro, step = 0) {
// for (let i = 0; i < step; i++) {
// intro.nextStep();
// }
let chain = new Promise(resolve=> {intro.start(); setTimeout(()=>resolve(), 200)});
for (let i = 0; i < step; i++) {
chain.then(function () {
return new Promise(resolve=> {intro.nextStep(); setTimeout(()=>resolve(), 200)});
})
// let chain = new Promise(resolve=> {intro.start(); setTimeout(()=>resolve(), 300)});
// for (let i = 0; i < step; i++) {
// chain.then(function () {
// console.log(i);
// return new Promise(resolve=> {intro.nextStep(); setTimeout(()=>resolve(), 300)});
// })
// }
// the following had to be implemented in order for the steps, which contain asynchronous code (setTimeout),
// to run i sequence. Without this, part of step, e.g., 3 could run only after step, e.g., 5
guideGlobalState.val = 0;
intro.start();
for (let i = 1; i <= step; i++) {
callWithValidState(i, (()=>{intro.nextStep()}))
}
}
function callWithValidState(state, callback) {
if (state === guideGlobalState.val) {
callback();
} else {
setTimeout(()=>callWithValidState(state, callback), 50);
}
}
......@@ -246,6 +268,7 @@ function intializeIntroJs(){
, settings: settings
, minervaProxy: minervaProxy
, mainModelId: mainModelId
,guideGlobalState:guideGlobalState
};
[
......
......@@ -2,6 +2,7 @@ const introJs = require('intro.js');
const selections = require('./selections');
let guideGlobalState;
const synapseImgCoords = [[4960,1971],[5241,1971],[5241,2163],[4960,2163]];
const toMapImgCoords = [[5188,107], [5536,107 ],[5536,245], [5188,245]];
......@@ -9,6 +10,8 @@ const toMapImgCoords = [[5188,107], [5536,107 ],[5536,245], [5188,245]];
let re1338 = undefined;
function getRelativePosition(pos) {
// Obtaining relative position of a point in the overview image which has resolution 5776x4040
return [pos[0]/5776, pos[1]/4040];
......@@ -16,6 +19,8 @@ function getRelativePosition(pos) {
const initializeStory = function(params) {
guideGlobalState = params.guideGlobalState;
// TODO the follosing needs to be here in order to load image into overview so that selections.overview
// is valid. This needs to be removed after the overview box becomes identifiable
$(selections.showOverviewButton).click();
......@@ -139,15 +144,25 @@ function initializeStoryContet($introContainer, params){
});
});
intro.onbeforechange(function (target) {
function getRelPos(rect){
return getRelativePosition([rect[0][0] + (rect[1][0] - rect[0][0]) / 2 , rect[1][1]+(rect[2][1] - rect[1][1]) / 2]);
}
function getRelPos(rect){
return getRelativePosition([rect[0][0] + (rect[1][0] - rect[0][0]) / 2 , rect[1][1]+(rect[2][1] - rect[1][1]) / 2]);
}
intro.onbeforechange(function (target) {
function carryOutStep(steps) {
if (steps.indexOf(0) >= 0) {
guideGlobalState.val = 1;
}
if (steps.indexOf(1) >= 0) {
guideGlobalState.val = 2;
}
if (steps.indexOf(2) >= 0) {
$(selections.showOverviewButton).click();
guideGlobalState.val = 3;
}
if (steps.indexOf(3) >= 0) {
$(selections.showOverviewButton).click();
......@@ -160,6 +175,7 @@ function initializeStoryContet($introContainer, params){
event.clientX = $img.width() * relPos[0];
event.clientY = $img.height() * relPos[1];
$img.trigger(event);
guideGlobalState.val = 4;
}, 30);
}
if (steps.indexOf(4) >= 0) {
......@@ -173,31 +189,41 @@ function initializeStoryContet($introContainer, params){
event.clientX = $img.width() * relPos[0];
event.clientY = $img.height() * relPos[1];
$img.trigger(event);
}, 30);
guideGlobalState.val = 5;
}, 100);
}
if (steps.indexOf(5) >= 0) {
$(selections.genericSearchInput).val("reaction:re1338");
$(selections.genericSearchLink).click();
$(selections.genericSearchInput).val("");
guideGlobalState.val = 6;
}
if (steps.indexOf(6) >= 0) {
guideGlobalState.val = 7;
}
if (steps.indexOf(7) >= 0) {
$(selections.clearButton).click();
$(selections.centerMapLink)[0].click();
guideGlobalState.val = 8;
}
if (steps.indexOf(8) >= 0) {
// $(selections.clearButton).trigger('click', function(){
// $(selections.genericSearchInput).val("PINK1,Parkin");
// });
$(selections.clearButton).click();
setTimeout(()=>$(selections.genericSearchInput).val("PINK1,Parkin"), 100);
setTimeout(()=> {
$(selections.genericSearchInput).val("PINK1,Parkin")
guideGlobalState.val = 9;
}, 100);
}
if (steps.indexOf(9) >= 0) {
$(selections.genericSearchLink).click();
guideGlobalState.val = 10;
}
if (steps.indexOf(10) >= 0) {
params.cleanMinerva();
guideGlobalState.val = 11;
}
}
......@@ -222,48 +248,6 @@ function initializeStoryContet($introContainer, params){
stepsToCarryOut.push(this._currentStep);
carryOutStep(stepsToCarryOut);
// if (this._currentStep == 2) {
// $(selections.showOverviewButton).click();
// }
// if (this._currentStep == 3) {
// $(selections.showOverviewButton).click();
//
// let $img = $(selections.overviewImg);
// let relPos = getRelPos(synapseImgCoords);
// let event = $.Event('click');
// event.clientX = $img.width() * relPos[0];
// event.clientY = $img.height() * relPos[1];
// $img.trigger(event);
// }
// if (this._currentStep == 4) {
// let $img = $(selections.overviewImg);
// let relPos = getRelPos(toMapImgCoords);
// let event = $.Event('click');
// event.clientX = $img.width() * relPos[0];
// event.clientY = $img.height() * relPos[1];
// $img.trigger(event);
//
// }
// if(this._currentStep == 5){
// $(selections.genericSearchInput).val("reaction:re1338");
// $(selections.genericSearchLink).click();
// $(selections.genericSearchInput).val("");
// }
// if(this._currentStep == 7){
// $(selections.clearButton).click();
// $(selections.centerMapLink)[0].click();
// }
// if(this._currentStep == 8){
// $(selections.genericSearchInput).val("PINK1,Parkin")
// }
// if(this._currentStep == 9){
// $(selections.genericSearchLink).click();
// }
// if(this._currentStep == 10){
// params.cleanMinerva();
// }
// }
});
......@@ -271,12 +255,6 @@ function initializeStoryContet($introContainer, params){
params.addDisabledInteractionMessage();
// if (this._currentStep == 7){
// $(selections.genericSearchInput).val("PRKN")
// } else if (this._currentStep == 8){
// $(selections.genericSearchLink).click();
// }
});
return intro;
......
......@@ -4,6 +4,7 @@ let prknCoords = undefined;
const zoomLevel = 9;
const selections = require('./selections');
let guideGlobalState;
function getPrknCoordinates(params){
let compartmentId = undefined;
......@@ -31,6 +32,8 @@ function getPrknCoordinates(params){
const initializeStory = function(params) {
guideGlobalState = params.guideGlobalState;
const id = 'protein_structures';
const $introContainer = params.initializeIntroJsStoryHtml(id, 'View protein structures', 'How to visualize annotated 3D structures');
const intro = initializeStoryContet($introContainer, params);
......@@ -110,9 +113,16 @@ function initializeStoryContet($introContainer, params){
intro.onbeforechange(function (target) {
function carryOutStep(steps) {
if (steps.indexOf(0) >= 0) {
guideGlobalState.val = 1;
}
if (steps.indexOf(1) >= 0) {
params.minervaProxy.project.map.setCenter({modelId:params.mainModelId, x:prknCoords[0], y:prknCoords[1]});
params.minervaProxy.project.map.setZoom({modelId:params.mainModelId, zoom: zoomLevel});
setTimeout(function() {
guideGlobalState.val = 2;
}, 500);
}
if (steps.indexOf(2) >= 0) {
//TODO: remove setTimeout
......@@ -125,15 +135,24 @@ function initializeStoryContet($introContainer, params){
$canvas.parent()[0].dispatchEvent(event);
//TODO remove setTimeout
setTimeout(function() {
$(selections.contextMenuMolArt).parent().find('ul').css('display', 'block')
}, 150);
$(selections.contextMenuMolArt).parent().find('ul').css('display', 'block');
guideGlobalState.val = 3;
}, 200);
}
if (steps.indexOf(3) >= 0) {
params.minervaProxy.project.map.setCenter({modelId:params.mainModelId, x:prknCoords[0], y:prknCoords[1]});
params.minervaProxy.project.map.setZoom({modelId:params.mainModelId, zoom: zoomLevel});
$(selections.prknMolArtLink).click();
setTimeout(function() {
guideGlobalState.val = 4;
}, 2000);
}
if (steps.indexOf(4) >= 0) {
$(selections.molArtCloseButton).click();
params.cleanMinerva();
guideGlobalState.val = 5;
}
}
......@@ -144,6 +163,7 @@ function initializeStoryContet($introContainer, params){
$(selections.centerMapLink).click()
}
if (this._currentStep === 2) {
stepsToCarryOut.push(1);
$(selections.molArtCloseButton).click();
}
......
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