Can now click on minimap to scroll, not using Draggabilly

This commit is contained in:
mattpass
2020-03-07 09:11:32 +00:00
parent 545271d74b
commit 05ddbf33ef
2 changed files with 24 additions and 39 deletions

View File

@@ -351,7 +351,7 @@ $t = $text['index'];
</div>
<div class="docExplorer" id="docExplorer">
<div class="miniMap" id="miniMap"><div class="miniMapContainer" id="miniMapContainer"></div><div class="miniMapContent" id="miniMapContent" onmousedown="ICEcoder.mouseDownMinimap = true; ICEcoder.jumpMinimapPositon(event);" onmousemove="ICEcoder.jumpMinimapPositon(event)" onmouseup="ICEcoder.mouseDownMinimap = false"></div></div>
<div class="miniMap" id="miniMap"><div class="miniMapContainer" id="miniMapContainer"></div><div class="miniMapContent" id="miniMapContent" onmousedown="ICEcoder.mouseDownMinimap = true; ICEcoder.jumpMinimapPositon(event)" onmousemove="ICEcoder.jumpMinimapPositon(event)" onmouseup="ICEcoder.mouseDownMinimap = false"></div></div>
<div class="functionClassList" id="functionClassList"></div>
</div>

View File

@@ -1492,29 +1492,7 @@ var ICEcoder = {
get('miniMapContainer').innerHTML = '<div style="position: absolute; display: inline-block; top: '+
this.miniMapBoxTop+
'px; left: 0; width: 200px; height: '+
this.miniMapBoxHeight+'px; background: rgba(0,198,255,0.1); z-index: 1; cursor: pointer" id="miniMapBox"></div>';
var elem = get('miniMapBox');
var draggie = new Draggabilly( elem, {
axis: 'y',
containment: true
});
draggie.on( 'dragMove', function( event, pointer, moveVector ) {
yPos = this.position.y;
maxHeight = parseInt(get('docExplorer').style.height,10) <= parseInt(get('miniMapContent').getBoundingClientRect().height,10)
? parseInt(get('docExplorer').style.height,10)
: parseInt(get('miniMapContent').getBoundingClientRect().height,10);
newPerc = (this.position.y/(maxHeight-ICEcoder.miniMapBoxHeight));
yPos = (cM.getScrollInfo().height-cM.getScrollInfo().clientHeight)*newPerc;
cM.scrollTo(0,yPos); // this.position.y
});
draggie.on( 'pointerDown', function( event, pointer ) {
ICEcoder.mouseDownMinimap = true;
});
draggie.on( 'pointerUp', function( event, pointer ) {
ICEcoder.mouseDownMinimap = false;
});
this.miniMapBoxHeight+'px; background: rgba(0,198,255,0.1); pointer-events: none; z-index: 1" id="miniMapBox"></div>';
this.setMinimapLayout(cM);
@@ -1527,11 +1505,9 @@ var ICEcoder = {
// If we've got a minimap box ready
if (get('miniMapBox') && thisCM) {
// Get CM instance and percentage through document
cM = this.getcMInstance();
percThru = thisCM.getScrollInfo().top/(thisCM.getScrollInfo().height-thisCM.getScrollInfo().clientHeight);
// If content to display has a greater height than docExplorer
if (parseInt(get('miniMapContent').getBoundingClientRect().height,10) > parseInt(get('docExplorer').style.height,10)) {
// Set the minimap container to same height
@@ -1555,25 +1531,34 @@ var ICEcoder = {
// Set the minimap position to 0
get('miniMapContent').style.marginTop = 0;
}
// Can set the Minimap nav position if not dragging it (let Draggabilly handle that)
if (!this.mouseDownMinimap) {
get('miniMapBox').style.top = this.miniMapBoxTop + "px";
}
}
},
jumpMinimapPositon: function(e) {
var cM, mmPosY;
cM = this.getcMInstance();
mmPosY = e.y - get('miniMapContent').getBoundingClientRect().top - (get('miniMapBox').getBoundingClientRect().height / 2);
get("miniMapBox").style.top = mmPosY + "px";
maxHeight = parseInt(get('docExplorer').style.height, 10) <= parseInt(get('miniMapContent').getBoundingClientRect().height, 10)
? parseInt(get('docExplorer').style.height, 10)
: parseInt(get('miniMapContent').getBoundingClientRect().height, 10);
newPerc = (mmPosY / (maxHeight - ICEcoder.miniMapBoxHeight));
yPos = (cM.getScrollInfo().height - cM.getScrollInfo().clientHeight) * newPerc;
cM.scrollTo(0, yPos); // this.position.y
if (ICEcoder.mouseDownMinimap) {
// console.log(Date.now() - ICEcoder.lastScrollTS);
cM = this.getcMInstance();
mmPosY = e.y - get('miniMapContainer').getBoundingClientRect().top - (get('miniMapBox').getBoundingClientRect().height / 2);
if (mmPosY > get('miniMapContainer').getBoundingClientRect().height - get('miniMapBox').getBoundingClientRect().height) {
// console.log("YES");
mmPosY = get('miniMapContainer').getBoundingClientRect().height - get('miniMapBox').getBoundingClientRect().height;
}
if (mmPosY < 0) {
mmPosY = 0;
}
get("miniMapBox").style.top = mmPosY + "px";
maxHeight = parseInt(get('docExplorer').style.height, 10) <= parseInt(get('miniMapContainer').getBoundingClientRect().height, 10)
? parseInt(get('docExplorer').style.height, 10)
: parseInt(get('miniMapContainer').getBoundingClientRect().height, 10);
newPerc = (mmPosY / (maxHeight - ICEcoder.miniMapBoxHeight));
yPos = (cM.getScrollInfo().height - cM.getScrollInfo().clientHeight) * newPerc;
cM.scrollTo(0, yPos); // this.position.y
}
if (e.buttons === 0) {
ICEcoder.mouseDownMinimap = false;
}
},
// Autocomplete