Mercurial > hg > orthanc-stone
changeset 2019:fe9999d6a636
handling of left, right, and space keys
author | Sebastien Jodogne <s.jodogne@gmail.com> |
---|---|
date | Sat, 03 Dec 2022 09:22:19 +0100 |
parents | 6099c7925202 |
children | 88673f50d7b9 |
files | Applications/StoneWebViewer/WebApplication/app.js Applications/StoneWebViewer/WebApplication/index.html |
diffstat | 2 files changed, 56 insertions(+), 4 deletions(-) [+] |
line wrap: on
line diff
--- a/Applications/StoneWebViewer/WebApplication/app.js Sat Dec 03 08:45:36 2022 +0100 +++ b/Applications/StoneWebViewer/WebApplication/app.js Sat Dec 03 09:22:19 2022 +0100 @@ -350,6 +350,12 @@ that.windowingWidth = args.detail.windowingWidth; } }); + + window.addEventListener('CineSwitch', function(args) { + if (that.active) { + that.CineSwitch(); + } + }); }, methods: { DragDrop: function(event) { @@ -372,7 +378,7 @@ }, CinePlay: function() { this.cineControls = true; - this.cineIncrement = 1; + this.cineIncrement = -1; this.UpdateCine(); }, CinePause: function() { @@ -386,9 +392,16 @@ }, CineBackward: function() { this.cineControls = true; - this.cineIncrement = -1; + this.cineIncrement = 1; this.UpdateCine(); }, + CineSwitch: function() { + if (this.cineIncrement != 0) { + this.CinePause(); + } else { + this.CinePlay(); + } + }, UpdateCine: function() { // Cancel the previous cine loop, if any if (this.cineTimeoutId !== null) { @@ -751,6 +764,9 @@ virtualSeriesId: info.virtualSeriesId }; } + + // Give the focus to this viewport (new in Stone Web viewer 2.5) + this.activeViewport = viewportIndex; }, ClickSeries: function(seriesIndex) { @@ -1241,6 +1257,42 @@ args.detail.labelX, args.detail.labelY); } }); + + window.addEventListener('keydown', function(event) { + var canvas = that.GetActiveCanvas(); + if (canvas != '') { + switch (event.key) { + case 'Left': + case 'ArrowLeft': + stone.DecrementFrame(canvas, false); + event.preventDefault(); + break; + + case 'Right': + case 'ArrowRight': + stone.IncrementFrame(canvas, false); + event.preventDefault(); + break; + + case 'Up': + case 'ArrowUp': + break; + + case 'Down': + case 'ArrowDown': + break; + + case ' ': + case 'Space': + dispatchEvent(new CustomEvent('CineSwitch', { })); + event.preventDefault(); + break; + + default: + break; + } + } + }); } });
--- a/Applications/StoneWebViewer/WebApplication/index.html Sat Dec 03 08:45:36 2022 +0100 +++ b/Applications/StoneWebViewer/WebApplication/index.html Sat Dec 03 09:22:19 2022 +0100 @@ -816,13 +816,13 @@ </button> </div> <div class="btn-group btn-group-sm" role="group"> - <button type="button" class="btn btn-primary" @click="CinePlay()"> + <button type="button" class="btn btn-primary" @click="CineBackward()"> <i class="fas fa-play fa-flip-horizontal"></i> </button> <button type="button" class="btn btn-primary" @click="CinePause()"> <i class="fas fa-pause"></i> </button> - <button type="button" class="btn btn-primary" @click="CineBackward()"> + <button type="button" class="btn btn-primary" @click="CinePlay()"> <i class="fas fa-play"></i> </button> </div>