Commit 9cc00a1b authored by Jean-Karim Heriche's avatar Jean-Karim Heriche

Updated image viewer help. Fixed image_viewer.js (previous commit had wrong file).

parent 2ef491fa
......@@ -26,9 +26,11 @@ explore_image_server2 <-function(input, output, session, rv){
## Deal with eventual Windows-style paths
## Not sure if necessary, not fully tested
rootDir <- file.path(strsplit(rv$imgRoot,'\\\\'))
if(!is.null(rv$imgPath2) && !is.null(rv$fileCol2) && rv$fileCol2 != ""){
if(!is.null(rv$imgPath1) && length(unique(rv$imgPath1)) == 1 &&
length(unique(rv$selectedFrame)) <= 1 &&
!is.null(rv$fileCol1) && rv$fileCol1 != ""){
rv$imgPath2 <- gsub("[[:space:]]", "", rv$imgPath2)
filePath2 <- file.path(rootDir, strsplit(rv$imgPath2, '\\\\'))
filePath2 <- file.path(rootDir, strsplit(rv$imgPath2[1], '\\\\'))
validate(need(filePath2 != "" && file.exists(filePath2), "File not found. Check that you selected the correct image root directory."))
slice.def <- list()
rv$metadataImg2 <- read.metadata(filePath2)
......
......@@ -73,8 +73,8 @@
.imageViewer-help {
position: relative;
margin: auto;
top: 50px;
width: 360px;
top: 5px;
width: 410px;
border-radius: 10px;
overflow: auto;
border: 1px solid #eeeeee;
......
......@@ -381,11 +381,11 @@ function Viewer(parent){
image.style.cursor = cursor;
previousMousePosition = getMouseXY(event);
if(event.shiftKey) {
console.log("shift pressed");
if(!document.getElementsByClassName("imageViewer-drawingLayer")[0]) {
drawingLayer = createElement('canvas', 'drawingLayer', canvas);
drawingLayer.width = canvas.offsetWidth;
drawingLayer.height = canvas.offsetHeight;
pixelPosArray = [];
} else {
drawingLayer = document.getElementsByClassName("imageViewer-drawingLayer")[0];
var ctx = drawingLayer.getContext('2d');
......@@ -393,16 +393,17 @@ function Viewer(parent){
var mouseCoords = getMouseXY(event);
var imageCoords = getObjectXY(canvas);
coords = [Math.floor(mouseCoords[0]-imageCoords[0]) + 1, Math.floor(mouseCoords[1]-imageCoords[1]) + 1];
console.log("Mouse at: "+coords[0]+"x"+coords[1]);
var radius = 10;
var radius = 5;
ctx.moveTo(coords[0], coords[1]);
ctx.arc(coords[0], coords[1], radius, 0, Math.PI * 2, false);
ctx.fill();
pixelPosArray.push(viewer.getPixelPosition(event));
}
} else {
if(document.getElementsByClassName("imageViewer-drawingLayer")[0]) {
document.getElementsByClassName("imageViewer-drawingLayer")[0].remove();
Shiny.setInputValue("explore_module-image-pixelPosition", pixelPosArray);
pixelPosArray = [];
} else {
Shiny.setInputValue("explore_module-image-pixelPosition", viewer.getPixelPosition(event));
}
......@@ -615,7 +616,7 @@ function Viewer(parent){
// create help
help = createElement('div', 'help imageViewer', canvas)
help.innerHTML = '<table class="imageViewer-help-table"><tr><td colspan="3" class="imageViewer-help-topic">Browsing</td></tr><tr><td colspan="3">Use toolbar buttons or the following keys to change between the frames:</td></tr><tr><td>Next frame</td><td class="imageViewer-help-key">PAGE UP</td><td class="imageViewer-help-key">&gt</td></tr><tr><td>Previous frame</td><td class="imageViewer-help-key">PAGE DOWN</td><td class="imageViewer-help-key">&lt</td></tr><tr><td>First frame</td><td class="imageViewer-help-key">HOME</td><td class="imageViewer-help-key">M</td></tr><tr><td>Last frame</td><td class="imageViewer-help-key">END</td><td class="imageViewer-help-key">?</td></tr><tr><td colspan="3" class="imageViewer-help-topic">Zooming</td></tr><tr><td colspan="3">To zoom the image in/out use the mouse wheel, the toolbar buttons, or the following keyboard shortcuts:</td></tr><tr><td>Zoom in</td><td class="imageViewer-help-key">+</td><td class="imageViewer-help-key">x</td></tr><tr><td>Zoom out</td><td class="imageViewer-help-key">-</td><td class="imageViewer-help-key">z</td></tr><tr><td>Reset to 100%</td><td class="imageViewer-help-key">BACKSPACE</td><td class="imageViewer-help-key">R</td></tr><tr><td>Fit-in</td><td class="imageViewer-help-key">SPACE</td><td class="imageViewer-help-key">ENTER</td></tr><tr><td colspan="3" class="imageViewer-help-topic">Panning</td></tr><tr><td colspan="3">To pan the image click on it and drag it with your mouse. Alternatively, use the arrow keys on your keyboard.</td></tr><tr><td colspan="3" class="imageViewer-help-close">Press ESC or Q to close this window.</td></tr></table>'
help.innerHTML = '<table class="imageViewer-help-table"><tr><td colspan="3" class="imageViewer-help-topic">Browsing</td></tr><tr><td colspan="3">Use toolbar buttons or the following keys to change between the frames:</td></tr><tr><td>Next frame</td><td class="imageViewer-help-key">PAGE UP</td><td class="imageViewer-help-key">&gt</td></tr><tr><td>Previous frame</td><td class="imageViewer-help-key">PAGE DOWN</td><td class="imageViewer-help-key">&lt</td></tr><tr><td>First frame</td><td class="imageViewer-help-key">HOME</td><td class="imageViewer-help-key">M</td></tr><tr><td>Last frame</td><td class="imageViewer-help-key">END</td><td class="imageViewer-help-key">?</td></tr><tr><td colspan="3" class="imageViewer-help-topic">Zooming</td></tr><tr><td colspan="3">To zoom the image in/out use the mouse wheel, the toolbar buttons, or the following keyboard shortcuts:</td></tr><tr><td>Zoom in</td><td class="imageViewer-help-key">+</td><td class="imageViewer-help-key">x</td></tr><tr><td>Zoom out</td><td class="imageViewer-help-key">-</td><td class="imageViewer-help-key">z</td></tr><tr><td>Reset to 100%</td><td class="imageViewer-help-key">BACKSPACE</td><td class="imageViewer-help-key">R</td></tr><tr><td>Fit-in</td><td class="imageViewer-help-key">SPACE</td><td class="imageViewer-help-key">ENTER</td></tr><tr><td colspan="3" class="imageViewer-help-topic">Panning</td></tr><tr><td colspan="3">To pan the image, use the arrow keys on your keyboard.</td></tr><tr><td colspan="3" class="imageViewer-help-topic">Object selection</td></tr><tr><td colspan="3">Clicking on the image selects the nearest object. To select multiple objects, first enter multiple selection mode by pressing the shift key and clicking on the image then shift-click on the objects to select. When done, release the shift key and click once on the image.</td></tr><tr><td colspan="3" class="imageViewer-help-close">Press ESC or Q to close this window.</td></tr></table>'
// create image
image = createElement('img', 'image imageViewer', canvas);
......
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