some changes from firesieht

2024-11-21 18:06:33 +03:00 · 2022-11-01 00:44:54 +03:00 · 2022-11-01 00:44:54 +03:00 · 3c9a0462c9
commit 3c9a0462c9
parent f29736c93a 11a5de61be
1 changed files with 133 additions and 39 deletions
--- a/index.js
+++ b/index.js
@ -4,12 +4,13 @@ var app = new dwv.App();

 var circleFactory = new dwv.tool.draw.CircleFactory();
 var roiFactory = new dwv.tool.draw.RoiFactory();
+schema = []


 var tools = {
  Scroll: {},
  Draw: {
-    options: ['Circle', 'Roi'],
+    options: ['Circle', 'Roi', 'Ruler', 'FreeHand'],
    type: 'factory'
  },
  ZoomAndPan: {},
@ -29,6 +30,18 @@ app.addEventListener('load', function () {
  app.setDrawShape('Circle')
 });

+function loadSchema(schema) {
+    console.log(schema, schema.length)
+    urls = []
+    picSchema = new Map()
+    for (var i = 0; i < schema.length; ++i) {
+        console.log(i)
+        picSchema.set(schema[i].url, schema[i].figures)
+        urls.push(schema[i].url)
+    }
+    return [urls, picSchema]
+}
+

 function createCircle(circleData) {
    var point1 = new dwv.math.Point2D(circleData.center.x, circleData.center.y)
@ -53,6 +66,7 @@ function createCircle(circleData) {
    })
    //drawCommand = new dwv.tool.DrawGroupCommand(draw, 'circle-group', app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer()['.position-group'][0], false)
    posGroup = app.getActiveLayerGroup().getActiveDrawLayer().getDrawController().getCurrentPosGroup()
+    console.log(app.getActiveLayerGroup().getActiveDrawLayer().getDrawController())
    posGroup.add(draw)
    app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().listening(true)
    //drawCommand.execute()
@ -100,61 +114,60 @@ function createDraws(drawsData) {


 function postCircles() {
-    circlesAttrs = app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().getChildren().filter(e => e.attrs.name == 'circle-group').map(
-        (e) => {
-            return e.children.filter(
-                (ee) => {
-                    return ee.attrs.name == 'shape'
-                }
-            ).map(e => e.attrs)
-        }
-    )
+
+    setTimeout(() => {
+        console.log(app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().children[0].children)
+    }, 100)
+    // circlesAttrs = app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().getChildren().filter(e => e.attrs.name == 'circle-group').map(
+    //     (e) => {
+    //         //console.log(e)
+    //         return e.children.filter(
+    //             (ee) => {
+    //                 return ee.attrs.name == 'shape'
+    //             }
+    //         ).map(eee => {return {attrs: eee.attrs, parent: e.attrs}})
+    //     }
+    // )
+    circlesAttrs = []
    circlesAttrs = circlesAttrs.concat(app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().children[0].children.filter(e => e.attrs.name == 'circle-group').map((e) => {
-        return e.children.filter((e) => e.attrs.name == 'shape').map(e => e.attrs)
+        return e.children.filter((eee) => eee.attrs.name == 'shape').map(ee => {return {attrs: ee.attrs, parent: e.attrs}})
    }))
    //circleAttrs.concat(app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().children[0])
    return circlesAttrs.flat().map((e) => {
        return {
            type: 'Circle',
            center: {
-                x: e.x,
-                y: e.y
+                x: e.attrs.x,
+                y: e.attrs.y
            },
-            radius: e.radius,
-            id: e.id
+            radius: e.attrs.radius,
+            id: e.parent.id
        }
    })
 }

 function postRois() {
-    roisAttrs = app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().getChildren().filter(e => e.attrs.name == 'roi-group').map(
-        (e) => {
-            return e.children.filter(
-                (ee) => {
-                    return ee.attrs.name == 'shape'
-                }
-            ).map(e => e.attrs)
-        }
-    )
+    roisAttrs = []
    roisAttrs = roisAttrs.concat(app.getActiveLayerGroup().getActiveDrawLayer().getKonvaLayer().children[0].children.filter(e => e.attrs.name == 'roi-group').map((e) => {
-        return e.children.filter((e) => e.attrs.name == 'shape').map(e => e.attrs)
+        return e.children.filter((e) => e.attrs.name == 'shape').map(e => {return {attrs: e.attrs, parent: e.parent.attrs}})
    }))
    return roisAttrs.flat().map((e) => {
+        console.log(e)
        var points = [];
-        for (var i = 0; i < e.points.length; i+=2) {
-            points.push({x: e.points[i], y: e.points[i+1]})
+        for (var i = 0; i < e.attrs.points.length; i+=2) {
+            points.push({x: e.attrs.points[i], y: e.attrs.points[i+1]})
        }
        return {
            type: 'Roi',
            points: points,
-            id: e.id
+            id: e.parent.id
        }
    })
 }

-
 function postDraws() {
-    return postCircles().concat(postRois())
+    console.log(postRois())
+    return JSON.parse(JSON.stringify(postCircles().concat(postRois())))
 }


@ -172,15 +185,15 @@ function receiveMessage(event)
      } else if(data.type == "setTool"){
        if (data.data == "null"){
          app.setTool('Scroll');
-        } else if (data.data == 'Roi' || data.data == 'Circle'){
-          app.setTool('Draw');
-          app.setDrawShape(data.data);
-        }
+        } 
        else if (data.data == 'ZoomAndPan') {
            app.setTool('ZoomAndPan');
        }
        else if (data.data == 'WindowLevel') {
            app.setTool('WindowLevel')
+        }else {
+            app.setTool('Draw');
+            app.setDrawShape(data.data);
        }
      }
      else if (data.type == 'setDraws') {
@ -200,6 +213,9 @@ function receiveMessage(event)
      else if (data.type == 'deleteById') {
        app.getActiveLayerGroup().getActiveDrawLayer().getKonvaStage().find("#"+data.data)[0].destroy()
      }
+      else if (data.type == 'loadSchema') {
+        schema = loadSchema(data.data)
+      }
 }
 window.addEventListener("message", receiveMessage, false);

@ -209,7 +225,6 @@ function findActive() {
        (e) => {
            return e.children.filter(
                (ee) => {
-                    console.log(e)
                    return ee.attrs.name == 'anchor'
                }
            )
@ -227,12 +242,91 @@ app.addEventListener('loadend', function () {
  //range.max = app.getImage(0).getGeometry().getSize().get(2) - 1;
 });

-//app.loadURLs(['https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323851.dcm'])
+
+// schema = [
+//     {
+//         'url': 'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323851.dcm',
+//         'figures': [
+//             {type: 'Circle', center: {x: 10, y: 100}, radius: 10},
+//             {type: 'Roi', points: [{x: 10, y: 20}, {x: 100, y: 50}]}
+//         ]
+//     },
+//     {
+//         'url': 'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323707.dcm',
+//         'figures': [
+//             {type: 'Circle', center: {x: 10, y: 200}, radius: 10},
+//             {type: 'Roi', points: [{x: 10, y: 30}, {x: 100, y: 50}]}
+//         ]
+//     }
+// ]
+
+// schema = loadSchema(schema)
+
+// console.log(schema[0], "0")
+
+
+// app.loadURLs(schema[0])
+
+
+// app.loadURLs([
+//     'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323851.dcm',
+//     'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323707.dcm',
+//     'https://raw.githubusercontent.com/ivmartel/dwv/master/tests/data/bbmri-53323563.dcm'
+// ])
+
+function setFrame(frameNumber) {
+    var lg = app.getLayerGroupById(0);
+    var vc = lg.getActiveViewLayer().getViewController();
+    var index = vc.getCurrentIndex();
+    var values = index.getValues();
+    values[2] = frameNumber;
+    vc.setCurrentIndex(new dwv.math.Index(values));
+    loadPictures(
+        schema[1].get(schema[0][frameNumber])
+    )
+}
+
+function loadPictures(pictures) {
+    // app.deleteDraws()
+    deleteDraws()
+    app.setTool('Draw')
+    pictures.map((e) => {
+        if (e.type == 'Circle') {
+            createCircle(e)
+        }
+        else if (e.type == 'Roi') {
+            createRoi(e)
+        }
+    })
+}
+
+function deleteDraws() {
+    app.getActiveLayerGroup().getActiveDrawLayer().getKonvaStage().find('.circle-group').map((e) => e.destroy())
+    app.getActiveLayerGroup().getActiveDrawLayer().getKonvaStage().find('.roi-group').map((e) => e.destroy())
+}

 app.addEventListener('load', () => {
-    // app.getActiveLayerGroup().getActiveDrawLayer().getKonvaStage().addEventListener('mouseup', () => {
-    //     parent.postMessage({'type': 'returnDraws', data: postDraws()}, "*")
-    // })
+
+    // app.setDrawShape('Roi')
+    app.setTool("Scroll")
+    setFrame(0)
+    // loadPictures([
+    //     {type: 'Circle', center: {x: 10, y: 100}, radius: 10},
+    //     {type: 'Roi', points: [{x: 10, y: 20}, {x: 100, y: 50}]}
+    // ])
+    setTimeout(() => {
+        setFrame(1)
+    }, 1000)
+    var lg = app.getLayerGroupById(0);
+    var vc = lg.getActiveViewLayer().getViewController();
+    console.log(vc.getCurrentScrollIndexValue())
+    //app.getActiveLayerGroup().getActiveViewLayer().getViewController().setCurrentIndex(new dwv.math.Index(1))
+    app.getActiveLayerGroup().getActiveDrawLayer().getKonvaStage().addEventListener('mouseup', () => {
+        setTimeout(() => {
+            parent.postMessage({'type': 'returnDraws', data: postDraws()}, "*")
+            //console.log({'type': 'returnDraws', data: postDraws()})
+        }, 100)
+    })
    // createCircle({
    //     type: 'Circle',
    //     center: {