comparison Applications/StoneWebViewer/WebApplication/app.js @ 2014:a7b5cb068fb8

click-drag is available on the vertical slider
author Sebastien Jodogne <s.jodogne@gmail.com>
date Sat, 03 Dec 2022 07:44:09 +0100
parents dbafd535136e
children d0e68dd335dd
comparison
equal deleted inserted replaced
2013:dbafd535136e 2014:a7b5cb068fb8
136 container: 'body', 136 container: 'body',
137 trigger: 'hover' 137 trigger: 'hover'
138 }); 138 });
139 } 139 }
140 140
141
142 /**
143 * The "mousemove" and "mouseup" events were added in Stone Web viewer
144 * 2.5 to allow click/drag on the vertical scrollbar.
145 **/
146 var activeVerticalScrollbarViewport = null;
147 var activeVerticalScrollbarTarget = null;
148
149 window.addEventListener('mousemove', function(event) {
150 if (activeVerticalScrollbarViewport !== null) {
151 activeVerticalScrollbarViewport.ClickVerticalScrollbar(event, activeVerticalScrollbarTarget);
152 event.preventDefault();
153 }
154 });
155
156 window.addEventListener('mouseup', function(event) {
157 activeVerticalScrollbarViewport = null;
158 });
141 159
142 160
143 Vue.component('viewport', { 161 Vue.component('viewport', {
144 props: [ 'left', 'top', 'width', 'height', 'canvasId', 'active', 'content', 'viewportIndex', 162 props: [ 'left', 'top', 'width', 'height', 'canvasId', 'active', 'content', 'viewportIndex',
145 'showInfo', 'globalConfiguration' ], 163 'showInfo', 'globalConfiguration' ],
410 428
411 if (reschedule) { 429 if (reschedule) {
412 this.cineTimeoutId = setTimeout(this.CineCallback, 1000.0 / this.cineFramesPerSecond); 430 this.cineTimeoutId = setTimeout(this.CineCallback, 1000.0 / this.cineFramesPerSecond);
413 } 431 }
414 }, 432 },
415 ClickVerticalScrollbar: function(event) { 433 ClickVerticalScrollbar: function(event, target) {
416 var offset = event.currentTarget.getClientRects()[0]; 434 if (target == undefined) {
435 target = event.currentTarget;
436 activeVerticalScrollbarViewport = this;
437 activeVerticalScrollbarTarget = target;
438 }
439
440 var offset = target.getClientRects()[0];
417 var y = event.clientY - offset.top; 441 var y = event.clientY - offset.top;
418 var height = event.currentTarget.offsetHeight; 442 var height = target.offsetHeight;
419 this.currentFrame = Math.min(this.numberOfFrames - 1, Math.floor(y * this.numberOfFrames / (height - 1))); 443 var frame = Math.min(this.numberOfFrames - 1, Math.floor(y * this.numberOfFrames / (height - 1)));
444
445 if (frame >= 0 &&
446 frame < this.numberOfFrames) {
447 this.currentFrame = frame;
448 }
420 } 449 }
421 } 450 }
422 }); 451 });
423 452
424 453