1231433127

Build Type

github

Committed by GitHub

Commit Message

<a href="https://github.com/vanvalenlab/deepcell-label/commit/<a class=hub.com/vanvalenlab/deepcell-label/commit/3ead76533d01a6aade46a421618119656d3ec03a">3ead76533<a href="https://github.com/vanvalenlab/deepcell-label/commit/3ead76533d01a6aade46a421618119656d3ec03a">">Merge </a><a class="double-link" href="https://github.com/vanvalenlab/deepcell-label/commit/<a class="double-link" href="https://github.com/vanvalenlab/deepcell-label/commit/d3f3fb6cb9ce5388c881cef717c64dcbac3804ba">d3f3fb6cb</a>">d3f3fb6cb</a><a href="https://github.com/vanvalenlab/deepcell-label/commit/3ead76533d01a6aade46a421618119656d3ec03a"> into b8cbbaeaf">b8cbbaeaf</a>

Pull Request Pull Request #259: Merge refactors and improvements from tracking branches

Run Details

43 of 234 branches covered (18.38%)

Branch coverage included in aggregate %.

307 of 713 new or added lines in 58 files covered. (43.06%)

1553 of 3052 relevant lines covered (50.88%)

2.15 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

2.08

/visualizer/src/service/raw/channelMachine.js

import quickselect from 'quickselect';
import { assign, Machine, sendParent } from 'xstate';

function fetchRaw(context) {
  const { projectId, channel, loadingFrame: frame } = context;
  const pathToRaw = `/api/raw/${projectId}/${channel}/${frame}`;

  return (
    fetch(pathToRaw)
      // .then(validateResponse)
      .then(readResponseAsBlob)
      .then(makeImageURL)
      .then(showImage)
  );
  // .catch(logError);
}

function readResponseAsBlob(response) {
  return response.blob();
}

function makeImageURL(responseAsBlob) {
  return URL.createObjectURL(responseAsBlob);
}

function showImage(imgUrl) {
  return new Promise(resolve => {
    const img = new Image();
    img.onload = () => resolve(img);
    img.src = imgUrl;
  });
}

const createChannelMachine = (projectId, channel, numFrames) =>
  Machine(
    {
      id: `channel${channel}`,
      context: {
        projectId,
        channel,
        numFrames,
        frame: 0,
        loadingFrame: null,
        frames: {},
        rawImage: new Image(),
        // layer settings for grayscale mode
        invert: false,
        range: [0, 255],
        brightness: 0,
        contrast: 0,
      },
      initial: 'idle',
      states: {
        idle: {
          on: {
            PRELOAD: {
              cond: 'canPreload',
              target: 'loading',
              actions: 'loadNextFrame',
            },
          },
        },
        checkLoaded: {
          always: [
            { cond: 'loadedFrame', target: 'idle', actions: 'sendRawLoaded' },
            { target: 'loading' },
          ],
        },
        loading: {
          invoke: {
            src: fetchRaw,
            onDone: { target: 'idle', actions: ['saveFrame', 'sendRawLoaded'] },
            onError: {
              target: 'idle',
              actions: (context, event) => console.log(event),
            },
          },
        },
      },
      on: {
        // fetching
        LOAD_FRAME: {
          target: 'checkLoaded',
          actions: assign({ loadingFrame: (_, { frame }) => frame }),
        },
        FRAME: { actions: 'useFrame' },
        TOGGLE_INVERT: { actions: 'toggleInvert' },
        SET_RANGE: { actions: 'setRange' },
        SET_BRIGHTNESS: { actions: 'setBrightness' },
        SET_CONTRAST: { actions: 'setContrast' },
        RESET: { actions: 'reset' },
      },
    },
    {
      guards: {
        loadedFrame: ({ frames, loadingFrame }) => loadingFrame in frames,
        canPreload: ({ frames, numFrames }) => Object.keys(frames).length !== numFrames,
      },
      actions: {
        // fetching
        sendRawLoaded: sendParent(({ loadingFrame, channel }) => ({
          type: 'CHANNEL_LOADED',
          frame: loadingFrame,
          channel,
        })),
        saveFrame: assign({
          frames: ({ frames, loadingFrame }, { data }) => ({
            ...frames,
            [loadingFrame]: data,
          }),
        }),
        useFrame: assign({
          frame: (_, { frame }) => frame,
          rawImage: ({ frames }, { frame }) => frames[frame],
        }),
        loadNextFrame: assign({
          loadingFrame: ({ numFrames, frame, frames }) => {
            const allFrames = [...Array(numFrames).keys()];
            return (
              allFrames
                // remove loaded frames
                .filter(frame => !(frame in frames))
                // load the closest unloaded frame to the current frame
                .reduce((prev, curr) =>
                  Math.abs(curr - frame) < Math.abs(prev - frame) ? curr : prev
                )
            );
          },
        }),
        toggleInvert: assign({ invert: ({ invert }) => !invert }),
        setRange: assign({
          range: (_, { range }) => [
            Math.max(0, Math.min(255, range[0])),
            Math.max(0, Math.min(255, range[1])),
          ],
        }),
        setBrightness: assign({
          brightness: (_, { brightness }) => Math.max(-1, Math.min(1, brightness)),
        }),
        setContrast: assign({
          contrast: (_, { contrast }) => Math.max(-1, Math.min(1, contrast)),
        }),
        reset: assign({
          range: [0, 255],
          brightness: 0,
          contrast: 0,
        }),
        setAutoRange: assign({
          range: ({ rawImage: img }) => {
            // modified from https://github.com/hms-dbmi/viv
            // get ImageData from rawImage
            const canvas = document.createElement('canvas');
            canvas.width = img.width;
            canvas.height = img.height;
            const ctx = canvas.getContext('2d');
            ctx.drawImage(img, 0, 0);
            const imageData = ctx.getImageData(0, 0, img.width, img.height);
            const array = imageData.data
              .filter((v, i) => i % 4 === 1) // take only the first channel
              .filter(v => v > 0); // ignore the background
            const cutoffPercentile = 0.01;
            const topCutoffLocation = Math.floor(array.length * (1 - cutoffPercentile));
            const bottomCutoffLocation = Math.floor(array.length * cutoffPercentile);
            quickselect(array, topCutoffLocation);
            quickselect(array, bottomCutoffLocation, 0, topCutoffLocation);
            return [array[bottomCutoffLocation] || 0, array[topCutoffLocation] || 255];
          },
        }),
      },
    }
  );

export default createChannelMachine;

1	import quickselect from 'quickselect';
2	import { assign, Machine, sendParent } from 'xstate';
3
4	function fetchRaw(context) {
5	const { projectId, channel, loadingFrame: frame } = context;	×
6	const pathToRaw = `/api/raw/${projectId}/${channel}/${frame}`;	×
7
8	return (	×
9	fetch(pathToRaw)
10	// .then(validateResponse)
11	.then(readResponseAsBlob)
12	.then(makeImageURL)
13	.then(showImage)
14	);
15	// .catch(logError);
16	}
17
18	function readResponseAsBlob(response) {
19	return response.blob();	×
20	}
21
22	function makeImageURL(responseAsBlob) {
23	return URL.createObjectURL(responseAsBlob);	×
24	}
25
26	function showImage(imgUrl) {
27	return new Promise(resolve => {	×
28	const img = new Image();	×
29	img.onload = () => resolve(img);	×
30	img.src = imgUrl;	×
31	});
32	}
33
34	const createChannelMachine = (projectId, channel, numFrames) =>	6✔
35	Machine(	×
36	{
37	id: `channel${channel}`,
38	context: {
39	projectId,
40	channel,
41	numFrames,
42	frame: 0,
43	loadingFrame: null,
44	frames: {},
45	rawImage: new Image(),
46	// layer settings for grayscale mode
47	invert: false,
48	range: [0, 255],
49	brightness: 0,
50	contrast: 0,
51	},
52	initial: 'idle',
53	states: {
54	idle: {
55	on: {
56	PRELOAD: {
57	cond: 'canPreload',
58	target: 'loading',
59	actions: 'loadNextFrame',
60	},
61	},
62	},
63	checkLoaded: {
64	always: [
65	{ cond: 'loadedFrame', target: 'idle', actions: 'sendRawLoaded' },
66	{ target: 'loading' },
67	],
68	},
69	loading: {
70	invoke: {
71	src: fetchRaw,
72	onDone: { target: 'idle', actions: ['saveFrame', 'sendRawLoaded'] },
73	onError: {
74	target: 'idle',
75	actions: (context, event) => console.log(event),	×
76	},
77	},
78	},
79	},
80	on: {
81	// fetching
82	LOAD_FRAME: {
83	target: 'checkLoaded',
84	actions: assign({ loadingFrame: (_, { frame }) => frame }),	×
85	},
86	FRAME: { actions: 'useFrame' },
87	TOGGLE_INVERT: { actions: 'toggleInvert' },
88	SET_RANGE: { actions: 'setRange' },
89	SET_BRIGHTNESS: { actions: 'setBrightness' },
90	SET_CONTRAST: { actions: 'setContrast' },
91	RESET: { actions: 'reset' },
92	},
93	},
94	{
95	guards: {
96	loadedFrame: ({ frames, loadingFrame }) => loadingFrame in frames,	×
NEW 97	canPreload: ({ frames, numFrames }) => Object.keys(frames).length !== numFrames,	×
98	},
99	actions: {
100	// fetching
101	sendRawLoaded: sendParent(({ loadingFrame, channel }) => ({	×
102	type: 'CHANNEL_LOADED',
103	frame: loadingFrame,
104	channel,
105	})),
106	saveFrame: assign({
107	frames: ({ frames, loadingFrame }, { data }) => ({	×
108	...frames,
109	[loadingFrame]: data,
110	}),
111	}),
112	useFrame: assign({
113	frame: (_, { frame }) => frame,	×
114	rawImage: ({ frames }, { frame }) => frames[frame],	×
115	}),
116	loadNextFrame: assign({
117	loadingFrame: ({ numFrames, frame, frames }) => {
118	const allFrames = [...Array(numFrames).keys()];	×
119	return (	×
120	allFrames
121	// remove loaded frames
122	.filter(frame => !(frame in frames))	×
123	// load the closest unloaded frame to the current frame
124	.reduce((prev, curr) =>
125	Math.abs(curr - frame) < Math.abs(prev - frame) ? curr : prev	×
126	)
127	);
128	},
129	}),
130	toggleInvert: assign({ invert: ({ invert }) => !invert }),	×
131	setRange: assign({
132	range: (_, { range }) => [	×
133	Math.max(0, Math.min(255, range[0])),
134	Math.max(0, Math.min(255, range[1])),
135	],
136	}),
137	setBrightness: assign({
NEW 138	brightness: (_, { brightness }) => Math.max(-1, Math.min(1, brightness)),	×
139	}),
140	setContrast: assign({
141	contrast: (_, { contrast }) => Math.max(-1, Math.min(1, contrast)),	×
142	}),
143	reset: assign({
144	range: [0, 255],
145	brightness: 0,
146	contrast: 0,
147	}),
148	setAutoRange: assign({
149	range: ({ rawImage: img }) => {
150	// modified from https://github.com/hms-dbmi/viv
151	// get ImageData from rawImage
152	const canvas = document.createElement('canvas');	×
153	canvas.width = img.width;	×
154	canvas.height = img.height;	×
155	const ctx = canvas.getContext('2d');	×
156	ctx.drawImage(img, 0, 0);	×
157	const imageData = ctx.getImageData(0, 0, img.width, img.height);	×
158	const array = imageData.data	×
159	.filter((v, i) => i % 4 === 1) // take only the first channel	×
160	.filter(v => v > 0); // ignore the background	×
161	const cutoffPercentile = 0.01;	×
NEW 162	const topCutoffLocation = Math.floor(array.length * (1 - cutoffPercentile));	×
NEW 163	const bottomCutoffLocation = Math.floor(array.length * cutoffPercentile);	×
164	quickselect(array, topCutoffLocation);	×
165	quickselect(array, bottomCutoffLocation, 0, topCutoffLocation);	×
NEW 166	return [array[bottomCutoffLocation] \|\| 0, array[topCutoffLocation] \|\| 255];	×
167	},
168	}),
169	},
170	}
171	);
172
173	export default createChannelMachine;

vanvalenlab / deepcell-label / 1231433127

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous