diff --git a/src/html/graph/index.html b/src/html/graph/index.html index e7b70bc8..d8cc71c6 100644 --- a/src/html/graph/index.html +++ b/src/html/graph/index.html @@ -3,6 +3,7 @@ + radare2 diff --git a/src/html/graph/lib/css/graph.css b/src/html/graph/lib/css/graph.css index cfa10080..516c839f 100644 --- a/src/html/graph/lib/css/graph.css +++ b/src/html/graph/lib/css/graph.css @@ -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; } diff --git a/src/html/graph/lib/css/graph_dark.css b/src/html/graph/lib/css/graph_dark.css index af6051ad..9225aaf2 100644 --- a/src/html/graph/lib/css/graph_dark.css +++ b/src/html/graph/lib/css/graph_dark.css @@ -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; +} diff --git a/src/html/graph/lib/css/graph_light.css b/src/html/graph/lib/css/graph_light.css index be4ce36c..7723046e 100644 --- a/src/html/graph/lib/css/graph_light.css +++ b/src/html/graph/lib/css/graph_light.css @@ -40,3 +40,11 @@ .autohighlight { background-color: #8AFF77 !important; } .autohighlighti { background-color: #8AFF77; } + +#minimap { + background: #A4C5D2; +} +#minimap_area { + border: 1px solid black; + background: black; +} diff --git a/src/html/graph/lib/js/disasm.js b/src/html/graph/lib/js/disasm.js index 7faaf001..2107d04f 100644 --- a/src/html/graph/lib/js/disasm.js +++ b/src/html/graph/lib/js/disasm.js @@ -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; diff --git a/src/html/graph/lib/js/graph_panel.js b/src/html/graph/lib/js/graph_panel.js index 5cd823ac..34de133e 100644 --- a/src/html/graph/lib/js/graph_panel.js +++ b/src/html/graph/lib/js/graph_panel.js @@ -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); } } +*/