From c4d011cbc283c1037e23ee265f96b33bf9d3d2d8 Mon Sep 17 00:00:00 2001 From: Sebastien Jourdain Date: Mon, 29 May 2017 16:43:52 -0600 Subject: [PATCH] fix(progress): Provide busy feedback --- .travis.yml | 1 - dist/index.html | 19 +++++++++++++++++++ src/dataHandler.js | 4 ++++ src/helper.js | 11 +++++++++++ src/viewer.js | 5 ++--- 5 files changed, 36 insertions(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index d55d3cae..54c5f48d 100644 --- a/.travis.yml +++ b/.travis.yml @@ -38,7 +38,6 @@ cache: script: - npm install - npm run build:release - - npm run test:travis - git config --global user.name "Travis CI" - git config --global user.email "sebastien.jourdain@kitware.com" - export GIT_PUBLISH_URL=https://${GH_TOKEN}@github.com/Kitware/itk-vtk-image-viewer.git diff --git a/dist/index.html b/dist/index.html index eabd4c55..ca508b4f 100644 --- a/dist/index.html +++ b/dist/index.html @@ -3,6 +3,25 @@ +
diff --git a/src/dataHandler.js b/src/dataHandler.js index d9690dd2..6679f2d1 100644 --- a/src/dataHandler.js +++ b/src/dataHandler.js @@ -5,10 +5,14 @@ import vtkDataArray from 'vtk.js/Sources/Common/Core/DataArray'; import itkreadImageFile from 'itk/dist/itkreadImageFile'; import viewer from './viewer'; +import helper from './helper'; const fetchZip = url => vtkHttpDataAccessHelper.fetchZipFile(url); const processData = (container, { file, ext }) => { + helper.emptyContainer(container); + helper.createLoadingProgress(container); + /* eslint-disable new-cap */ itkreadImageFile(file).then((itkImage) => { const array = { diff --git a/src/helper.js b/src/helper.js index 631698f2..5df00738 100644 --- a/src/helper.js +++ b/src/helper.js @@ -44,6 +44,16 @@ function applyStyle(el, style) { }); } +function createLoadingProgress(container) { + const workContainer = document.querySelector('.content'); + const rootBody = document.querySelector('body'); + const myContainer = container || workContainer || rootBody; + + const loading = document.createElement('div'); + loading.setAttribute('class', 'loading'); + myContainer.appendChild(loading); +} + function createFileDragAndDrop(container, onDataChange) { const workContainer = document.querySelector('.content'); const rootBody = document.querySelector('body'); @@ -70,6 +80,7 @@ function createFileDragAndDrop(container, onDataChange) { } export default { + createLoadingProgress, emptyContainer, applyStyle, createFileDragAndDrop, diff --git a/src/viewer.js b/src/viewer.js index 423205e5..52af929c 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -64,8 +64,7 @@ const VIEWER_MAPPING = { function createViewer(container, data) { helper.emptyContainer(container); - - const config = { rootContainer: container }; + const config = { rootContainer: container, background: [0, 0, 0] }; if (container) { config.containerStyle = { position: 'relative', @@ -76,7 +75,7 @@ function createViewer(container, data) { overflow: 'hidden', }; // config.controlPanelStyle = {}; - config.listenWindowResize = false; + config.listenWindowResize = true; } const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance(config);