mirror of
https://github.com/rizinorg/cutter.git
synced 2024-12-18 19:06:10 +00:00
Add minimap to graph view
This commit is contained in:
parent
fd80443b7e
commit
512f6134aa
@ -3,6 +3,7 @@
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
|
||||
<meta name="language" content="en" />
|
||||
|
||||
<title>radare2</title>
|
||||
|
@ -91,12 +91,10 @@ input:focus {outline: none; }
|
||||
}
|
||||
|
||||
#minimap {
|
||||
border: 1px solid black;
|
||||
position:absolute;
|
||||
width:200px;
|
||||
height:200px;
|
||||
z-index: -10;
|
||||
background: #EAF9FF;
|
||||
z-index: +10;
|
||||
opacity: 0.8;
|
||||
filter: alpha(opacity=80); /* For IE8 and earlier */
|
||||
}
|
||||
@ -122,10 +120,6 @@ input:focus {outline: none; }
|
||||
filter: alpha(opacity=20); /* For IE8 and earlier */
|
||||
}
|
||||
|
||||
#radareApp_mp_panels_pageDisassembler {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
#main_panel {
|
||||
overflow: auto;
|
||||
}
|
||||
|
@ -40,3 +40,12 @@
|
||||
|
||||
.autohighlight { background-color: #8AFF77 !important; }
|
||||
.autohighlighti { background-color: #8AFF77; }
|
||||
|
||||
#minimap {
|
||||
background: #E9EAEA;
|
||||
border: 1px solid black;
|
||||
}
|
||||
#minimap_area {
|
||||
border: 1px solid black;
|
||||
background: black;
|
||||
}
|
||||
|
@ -40,3 +40,11 @@
|
||||
|
||||
.autohighlight { background-color: #8AFF77 !important; }
|
||||
.autohighlighti { background-color: #8AFF77; }
|
||||
|
||||
#minimap {
|
||||
background: #A4C5D2;
|
||||
}
|
||||
#minimap_area {
|
||||
border: 1px solid black;
|
||||
background: black;
|
||||
}
|
||||
|
@ -178,7 +178,17 @@ BBGraph.prototype.render = function() {
|
||||
|
||||
$("#minimap").css("left", $("#main_panel").width() - minimap_width);
|
||||
$("#minimap").css("top", $("#center_panel").position().top - 40);
|
||||
//$("#center_panel").bind('scroll', update_minimap);
|
||||
// $("#center_panel").bind('scroll', update_minimap);
|
||||
// $("#main_panel").bind('scroll', update_minimap);
|
||||
// $("#disasm_tab").bind('scroll', update_minimap);
|
||||
// $("#minimap").bind('scroll', update_minimap);
|
||||
// $("#canvas").bind('scroll', update_minimap);
|
||||
document.addEventListener('scroll', function (event) {
|
||||
//if (event.target.id === 'idOfUl') { // or any other filtering condition
|
||||
console.log('scrolling', event.target);
|
||||
update_minimap();
|
||||
//}
|
||||
}, true /*Capture event*/);
|
||||
|
||||
paper.on( "cell:pointerup", function( cellview, evt, x, y) {
|
||||
var model = cellview.model;
|
||||
@ -199,29 +209,29 @@ BBGraph.prototype.render = function() {
|
||||
}
|
||||
});
|
||||
|
||||
// if (r2ui.graph_panel.minimap) {
|
||||
// update_minimap();
|
||||
// $("#minimap_area").draggable({
|
||||
// containment: "parent",
|
||||
// stop: function( event, ui ) {
|
||||
// var delta_x = ui.position.left/scale;
|
||||
// var delta_y = ui.position.top/scale;
|
||||
// if (delta_x < 0) delta_x = 0;
|
||||
// if (delta_y < 0) delta_y = 0;
|
||||
// if ($("#radareApp_mp").length) {
|
||||
// //$("#main_panel").scrollTo({ top:delta_y, left:delta_x - delta/scale } );
|
||||
// console.log(1);
|
||||
// } else {
|
||||
// //$('#center_panel').scrollTo({ top:delta_y, left:delta_x - delta/scale } );
|
||||
// console.log('debug:');
|
||||
// console.log(delta_y, delta_x, scale);
|
||||
// console.log($('#center_panel'));
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// $("#minimap").hide();
|
||||
// }
|
||||
if (r2ui.graph_panel.minimap) {
|
||||
update_minimap();
|
||||
// $("#minimap_area").draggable({
|
||||
// containment: "parent",
|
||||
// stop: function( event, ui ) {
|
||||
// var delta_x = ui.position.left/scale;
|
||||
// var delta_y = ui.position.top/scale;
|
||||
// if (delta_x < 0) delta_x = 0;
|
||||
// if (delta_y < 0) delta_y = 0;
|
||||
// if ($("#radareApp_mp").length) {
|
||||
// //$("#main_panel").scrollTo({ top:delta_y, left:delta_x - delta/scale } );
|
||||
// console.log(1);
|
||||
// } else {
|
||||
// //$('#center_panel').scrollTo({ top:delta_y, left:delta_x - delta/scale } );
|
||||
// console.log('debug:');
|
||||
// console.log(delta_y, delta_x, scale);
|
||||
// console.log($('#center_panel'));
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
} else {
|
||||
$("#minimap").hide();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
@ -250,21 +260,24 @@ function update_minimap() {
|
||||
var scale = 1/Math.max(ws, hs);
|
||||
var delta = 0;
|
||||
if (hs > ws) delta = (minimap_width/2) - svg_width*scale/2;
|
||||
var el = null;
|
||||
// panel layout
|
||||
|
||||
// Update MiniMap area position
|
||||
var el = $('#main_panel');
|
||||
var mma_width = el.width()*scale;
|
||||
var mma_height = el.height()*scale - delta;
|
||||
var top_offset = el.scrollTop()*scale
|
||||
var left_offset = el.scrollLeft()*scale + delta;
|
||||
if (mma_width > minimap_width - left_offset) mma_width = minimap_width - left_offset;
|
||||
if (mma_height > minimap_height - top_offset) mma_height = minimap_height - top_offset;
|
||||
$("#minimap_area").width(mma_width);
|
||||
$("#minimap_area").height(mma_height);
|
||||
$("#minimap_area").css("top", top_offset);
|
||||
$("#minimap_area").css("left", left_offset);
|
||||
|
||||
// Update MiniMap position
|
||||
el = $('#center_panel');
|
||||
if (el.scrollTop() < svg_height) {
|
||||
$("#minimap_area").width(el.width()*scale);
|
||||
$("#minimap_area").height(el.height()*scale);
|
||||
if (el.scrollTop()*scale <= minimap_height - el.height()*scale)
|
||||
$("#minimap_area").css("top", el.scrollTop()*scale);
|
||||
$("#minimap_area").css("left", delta + el.scrollLeft()*scale);
|
||||
}
|
||||
el = $('#center_panel');
|
||||
$("#minimap").css("left", el.scrollLeft() + $("#main_panel").width() - minimap_width);
|
||||
$("#minimap").css("left", el.scrollLeft() + el.width() - minimap_width);
|
||||
$("#minimap").css("top", el.scrollTop());
|
||||
$("#minimap").css("border", "1px solid " + r2ui.colors['.ec_gui_background']);
|
||||
$("#minimap_area").css("background", r2ui.colors['.ec_gui_background']);
|
||||
}
|
||||
}
|
||||
|
||||
@ -297,6 +310,7 @@ function render_graph(x) {
|
||||
obj = JSON.parse(x.replace(/\\l/g,'\\n'));
|
||||
} catch (e) {
|
||||
console.log("Cannot parse JSON data");
|
||||
return false
|
||||
}
|
||||
if (obj[0] === undefined) return false;
|
||||
if (obj[0].blocks === undefined) return false;
|
||||
|
@ -27,7 +27,7 @@ GraphPanel.prototype.init_handlers = function() {
|
||||
|
||||
// Bind custom functions to mouse and key events
|
||||
//$("#center_panel").scroll(on_scroll);
|
||||
$(document).keypress(handleKeypress);
|
||||
//$(document).keypress(handleKeypress);
|
||||
$(document).click(handleClick);
|
||||
$(document).dblclick(handleDoubleClick);
|
||||
};
|
||||
@ -177,7 +177,7 @@ GraphPanel.prototype.render = function(theme) {
|
||||
// Show graph and seek to entrypoint
|
||||
$("#main_panel").removeClass("ec_gui_background");
|
||||
$("#main_panel").addClass("ec_gui_alt_background");
|
||||
if ($('#minimap').length) $('#minimap')[0].innerHTML = "";
|
||||
//if ($('#minimap').length) $('#minimap')[0].innerHTML = "";
|
||||
|
||||
var addr = null;
|
||||
if (this.selected_offset !== null) {
|
||||
@ -344,6 +344,7 @@ function handleDoubleClick (inEvent) {
|
||||
}
|
||||
|
||||
// key handler
|
||||
/*
|
||||
function handleKeypress(inEvent) {
|
||||
console.log("KEYPRESS!")
|
||||
var keynum = inEvent.keyCode || inEvent.charCode || inEvent.which || 0;
|
||||
@ -553,3 +554,4 @@ function do_define(element) {
|
||||
//scroll_to_address(address);
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
Loading…
Reference in New Issue
Block a user