Skip to content

Commit

Permalink
Merge pull request #14 from nih-sparc/feature_image-select-api
Browse files Browse the repository at this point in the history
Feature image select api
  • Loading branch information
SamanthaKraft authored Jul 9, 2024
2 parents c2e0aab + 2234015 commit f65d284
Show file tree
Hide file tree
Showing 8 changed files with 204 additions and 18 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "sparc-dashboard-beta",
"version": "0.2.1",
"version": "0.2.2",
"author": "Sam Kraft (https://Sparc.Science)",
"private": false,
"type": "module",
Expand Down
5 changes: 3 additions & 2 deletions src/assets/Model.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,9 @@ class Img
export class Dataset
{
constructor(dataset){
this.Imgs = [];
dataset.forEach((img)=>this.Imgs.push(new Img(img)));
this.name = dataset.ImgName,
this.size = "...",
this.path = dataset.Path
}
}

Expand Down
49 changes: 45 additions & 4 deletions src/components/FlatmapViewer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,13 @@
import { ref, inject, nextTick} from "vue";
import {FlatmapVuer, MultiFlatmapVuer} from '@abi-software/flatmapvuer';
import { useOpenerStore } from "../stores/opener";
import { useLocationStore} from "../stores/locationSelect";
FlatmapVuer.props.flatmapAPI.default="https://mapcore-demo.org/devel/flatmap/v4/";
const disableFlatmapUI = true;
let FlatmapReady = false;
const locationStore = useLocationStore();
locationStore.init()
const emit = defineEmits(['setTitle']);
emit('setTitle','Flatmap Selector');
Expand All @@ -31,11 +33,50 @@ function FlatmapSelected(data){
if(locationId===data.feature.featureId){return;}
locationId = data.feature.featureId;
locationLabel.value = data.label;
const locationMinMax = tempMapToMinMax(locationId);
//send to image selector
emitter.emit("anatomical-location-selected",locationId)
emitter.emit("anatomical-location-selected",locationMinMax)
}
//this function is my temp work around to not having the map return anything useful
function tempMapToMinMax(id){
switch(id) {
case 3:
return {
min: 0.0,
max: 0.1
}
case 6:
return {
min: 0.1,
max: 0.2
}
case 11:
return {
min: 0.2,
max: 0.3
}
case 11:
return {
min: 0.3,
max: 0.4
}
case 14:
return {
min: 0.4,
max: 0.5
}
case 50:
return {
min: 0.5,
max: 0.7
}
default:
return {
min:0.7,
max:0.8
};
}
}
</script>
<style scoped lang="scss">
Expand Down
28 changes: 18 additions & 10 deletions src/components/ImageSelector.vue
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
<script setup>
import { ref, inject, nextTick } from "vue";
import { useOpenerStore } from "../stores/opener";
import {Dataset} from '../assets/Model';
import { TableObject} from "../devComponents/ImageSelector/ImageModel"
import { Api } from "../services";
const emitter = inject('emitter');
Expand All @@ -29,21 +29,25 @@
})
import imageMod from "../assets/imgs/imgInfo.png"
let imgPath = ref(null);
let TableData = ref();
const imgPath = ref(null);
const imageArray = ref(null);
const imageType = ref("");
const TableData = ref();
const emit = defineEmits(['setTitle'])
emit('setTitle','MUSE Image Selector');
function selectImage(index){
let img = TableData.value[index].path;
emitter.emit("mbf-image-selected",img);
// opener.openWidget("BiolucidaViewer", [{key:"mbfLink",value:img}])
}
emitter.on('anatomical-location-selected',(location)=>{
getImagesFromDataset(location);
emitter.on('MBFImageArray-Update',(imageArray)=>{
//buildDataTable
//imageArray.value = new TableObject(imageArray);
//TableData.value = imageArray.value.buildTableMBF();
getImagesFromDataset();
});
//on update
const getImagesFromDataset = async (datasetId)=>{
Expand All @@ -57,16 +61,20 @@ const getImagesFromDataset = async (datasetId)=>{
})
if (_response.status === 200) {
_biolucidaImageData = _response;
buildDataTable(Object.assign(new Dataset(_biolucidaImageData.data.dataset_images)).Imgs);
//buildTable needs to belong to ImageModel/s
imageArray.value = new TableObject(_biolucidaImageData.data.dataset_images);
TableData.value = imageArray.value.buildTableSPARC();
//buildDataTable(Object.assign(new TableObject(_biolucidaImageData.data.dataset_images)));
}
}catch(e){
console.error("couldn't fetch images from dataset");
}
}
function buildDataTable(Imgs){
function buildDataTable(tbleObj){
const imgs = tbleObj.SparcImageArray;
let _tempArr=[];
Imgs.forEach((img)=>{
imgs.forEach((img)=>{
let column = {
name:img.ImgName,
size: "...",
Expand Down
1 change: 1 addition & 0 deletions src/components/QDBGraph.vue
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@
//called by Graph Settings component
function updateChart(data){
//graphSettingsObject needs to be entirely new obj in order for chartData to update on the DOM
graphSettingsObject = data.clone();
chartData.value = graphSettingsObject.returnSettingsData();
visualizationComponent.value=VisualizationMap.get(graphSettingsObject.visualization);
Expand Down
52 changes: 52 additions & 0 deletions src/devComponents/ImageSelector/ImageModel.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
class MBFImageObject {
constructor(imageObj = {}){
this.id = imageObj.id || "";
}

clone() {
const clonedObject = new MBFImageObject();
clonedObject.id = this.id;
return clonedObject;
}
}
class SparcImageObject
{
constructor(data){
this.id = data.image_id;
this.name = data.image_id,
this.size = "...",
this.path = data.share_link
}
}
export class TableObject{
constructor(array = {}){
this.SparcImageArray = [];
array.forEach((img)=>this.SparcImageArray.push(new SparcImageObject(img)))
this.MBFImageObject = [];
array.forEach((img)=>this.MBFImageObject.push(new MBFImageObject(img)))
}
buildTableMBF(){
let _tempArr=[];
this.MBFImageObject.forEach((img)=>{
let column = {
name:img.id,
size: "...",
path: ""
}
_tempArr.push(column);
})
return _tempArr;
}
buildTableSPARC(){
let _tempArr=[];
this.SparcImageArray.forEach((img)=>{
let column = {
name:img.id,
size: "...",
path: img.path
}
_tempArr.push(column);
})
return _tempArr;
}
}
4 changes: 3 additions & 1 deletion src/services/qdb.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ const CreateBaseApiService = () => {
// Get a list of classes qdb contains
getClasses: () => axios.get(`${base}classes`),
getAspectsFromMetric: (metric) => axios.get(`${base}aspects?desc-inst=${metric}`),
getDataByAspect: (metric, aspect)=> axios.get(`${base}values/quant?aspect=${aspect}&desc-inst=${metric}`)
getDataByAspect: (metric, aspect)=> axios.get(`${base}values/quant?aspect=${aspect}&desc-inst=${metric}`),
getLocationMinMax:(min, max, subject)=>axios.get(`${base}values/quant?aspect=distance-via-reva-ft-sample-id-normalized-v1&subject=${subject}&value-quant-min=${min}&value-quant-max=${max}`),
getImagesByInstance:(dataset,instance)=>axios.get(`${base}objects?dataset=${dataset}&inst=${instance}`)
};
};

Expand Down
81 changes: 81 additions & 0 deletions src/stores/locationSelect.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
import { ref, inject } from 'vue'
import { defineStore } from 'pinia'
import { Api } from "../services";


export const useLocationStore = defineStore('locationSelected', () => {
const emitter = inject('emitter');
function init(){

emitter.on('anatomical-location-selected',(location)=>{
if(location && location.min && location.max){
getRegionMinMax(location.min,location.max);
}
});
}

//call for min/max
const getRegionMinMax = async(min, max, subject)=>{
subject = "sub-f001";
let _instance_list = {};
let _response = {};
try{
await Api.qdb.getLocationMinMax(min,max,subject).then(response =>{
_response = response;
})
if (_response.status === 200) {
_instance_list = _response.data.result;
handleMinMaxRequest(_instance_list);
}
}catch(e){
console.error("couldn't get min max region "+subject+" from QDB /n min: "+min +" max: "+ max);
console.log(e)
}
}
function handleMinMaxRequest(results){
const instances =results.filter(y => y.agg_type ==="instance");
getPackageIds(instances)
}

//call for min/max

const getPackageIds = async(instances)=>{
let ImagesArray = [];
for(var i=0;i<instances.length;i++){
let _image_list = {};
let _response = {};
const instance = instances[i].inst || null;
const dataset = instances[i].dataset || null;
try{
await Api.qdb.getImagesByInstance(dataset,instance).then(response =>{
_response = response;
})
if (_response.status === 200) {
_image_list = _response.data.result;
ImagesArray = [...ImagesArray, ..._image_list]
}
}catch(e){
console.error("couldn't get images from instance "+instance+" and dataset "+dataset+" from QDB");
console.log(e)
}
}
ImagesArray = ImagesArray.filter(x=>x.id_type!=="quantdb"&& x.id);
emitter.emit('MBFImageArray-Update',ImagesArray);
}
//https://services.scicrunch.io/quantdb/api/1/values/quant?aspect=distance-via-reva-ft-sample-id-normalized-v1&subject=sub-f001&value-quant-min=0.0&value-quant-max=0.1

// call for each dataset and instance/segment
//https://services.scicrunch.io/quantdb/api/1/objects?dataset=aa43eda8-b29a-4c25-9840-ecbd57598afc&inst=sam-c-seg-15c
//check for unique inst and dataset... and later clarify what the min/max ones are

//if you get all of those then you will have a package id for each one that is associated with one jpg2000 (hopefully)
//user clicks on image
//that's when you need this call to get an image
//https://sparc.biolucida.net/api/v1/imagemap/sharelink/N:package:ad977506-77bf-4f3b-93b3-41f6426c0b44/268
//package id and dataset id... but need to clarify dataset id.
//then you get biolucida image path... uhg.

const componentList = ref([""]);
const navigatorType = ref("LocationNav");//default
return { init, navigatorType }
})

0 comments on commit f65d284

Please sign in to comment.