Add maximized and custom frames options in new tiled webui

This commit is contained in:
pancake 2014-01-21 03:05:27 +01:00
parent 99a6dec209
commit 3b3e44361e
5 changed files with 136 additions and 65 deletions

View File

@ -197,3 +197,5 @@ This should be documented, since it's not that obvious
It's working! Look at the door!
This is an unacceptable milion year dungeon.
The Hard ROP Cafe
Please remove pregnant women, pregnant children and pregnant pets from the monitor
Fill the bug. Fill it with love. With the creamy and hot sauce of love.

View File

@ -1,4 +1,4 @@
/* radare - LGPL - Copyright 2006-2013 - pancake */
/* radare - LGPL - Copyright 2006-2014 - pancake */
#include <errno.h>
#include <r_types.h>
@ -219,7 +219,7 @@ R_API int r_socket_connect (RSocket *s, const char *host, const char *port, int
}
freeaddrinfo (res);
if (rp == NULL) {
eprintf ("Could not resolve address\n");
eprintf ("Could not resolve address '%s'\n", host);
return R_FALSE;
}
}

View File

@ -1,19 +1,27 @@
<html>
<meta charset="utf-8"> </meta>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
<link rel=Stylesheet href="style.css" type="text/css" />
<script src="tiled.js"></script>
<script src="r2.js"></script>
<script src="main.js"></script>
<body id=body>
<div id="canvas" class='canvas'>
<div style="right:15px;position:absolute;">
<div style="right:15px;position:absolute;background-color:#d0d0d0">
<a style='text-decoration:none' href='#' id='maximize'>[^]</a>
<a style='text-decoration:none' href='#' id='add-column'>[|]</a>
<a style='text-decoration:none' href='#' id='add-row'>[-]</a>
&nbsp;
<a style='text-decoration:none' href='#' id='open-dis'>[d]</a>
<a style='text-decoration:none' href='#' id='open-hex'>[x]</a>
<a style='text-decoration:none' href='#' id='open-fla'>[f]</a>
<!--
<a style='text-decoration:none' href='#' id='maximize'>[^]</a>
<a style='text-decoration:none' href='#' id='maximize'>[v]</a>
-->
</div>
&nbsp;
<a href='#'>File</a> Edit Analyze Help
<a href='#'>Menu</a>
</div>
</body>

View File

@ -1,23 +1,23 @@
function newHexdumpFrame(name) {
function newHexdumpFrame_html(name) {
// TODO: disas_code id
setTimeout (function () {
r2.cmd ("px 1024", function (x) {
document.getElementById(name+"_code").innerHTML="<pre>"+x+"</pre>";
});
}, 1);
return "<h2>Hexdump</h2>"
return "" //"<h2>Hexdump</h2>"
+"<div id='"+name+"_code' style='background-color:#304050;overflow:scroll;height:100%'></div>";
}
function newDisasmFrame(name) {
function newDisasmFrame_html(name) {
// TODO: disas_code id
setTimeout (function () {
r2.cmd ("pd 512", function (x) {
document.getElementById(name+"_code").innerHTML="<pre>"+x+"</pre>";
});
}, 1);
return "<h2>Disassembler</h2>"
return "" // "<h2>Disassembler</h2>"
+"<div id='"+name+"_code' style='background-color:#304050;overflow:scroll;height:100%'></div>";
}
@ -37,66 +37,100 @@ function findPos(obj) {
window.onload = function() {
var t = new Tiled ('canvas');
var ctr = 0;
function newFlagsFrame () {
var n = t.defname ("flags");
function newthing(name) {
// TODO: disas_code id
setTimeout (function () {
r2.cmd ("fs *;f", function (x) {
document.getElementById(name+"_flags").innerHTML="<pre>"+x+"</pre>";
});
}, 1);
return "<h2>Flags</h2>"
+"<div id='"+name+"_flags' style='background-color:#304050;overflow:scroll;height:100%'></div>";
}
t.new_frame (n, newthing (n), function(obj) {
var flags = _(n+'flags');
if (flags) {
var top = flags.style.offsetTop;
var pos = findPos (flags);
flags.style.height = obj.offsetHeight - pos[1]+20;
flags.style.width = obj.style.width - pos[0];
}
});
}
function newHexdumpFrame () {
var n = t.defname ("hexdump");
t.new_frame (n, newHexdumpFrame_html (n), function(obj) {
var code = _(n+'code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
}
function newDisasmFrame() {
var n = t.defname ('disas');
t.new_frame (n, newDisasmFrame_html (n), function(obj) {
var code = _(n+'_code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
}
_('maximize').onclick = function() { t.maximize = !!!t.maximize; t.run(); }
_('open-hex').onclick = function() { newHexdumpFrame(); }
_('open-dis').onclick = function() { newDisasmFrame(); }
_('open-fla').onclick = function() { newFlagsFrame(); }
_('add-column').onclick = function() {
ctr++;
t.new_frame ('disas'+ctr, "test", "right");
t.run();
t.new_frame ('window_'+ctr, "<div id='div_"+ctr+"'><a href='#' id='cmd_"+ctr+"'>cmd</a></div>", "right");
t.run ();
t.update = function() {
r2.cmd (t.cmd, function(x) {
_(t.key).innerHTML =
"<div style='background-color:#304050;overflow:scroll;height:100%'><pre>"+x+"</pre></div>";
});
}
_('cmd_'+ctr).onclick = function() {
t.key = 'div_'+ctr;
t.cmd = prompt ();
t.update ();
}
}
_('add-row').onclick = function() {
ctr++;
t.new_frame ('disas'+ctr, "test", "bottom");
t.new_frame ('window_'+ctr, "<div id='div_"+ctr+"'><a href='#' id='cmd_"+ctr+"'>cmd</a></div>", "bottom");
// t.frames[0].push (t.frames.pop ()[0]);
t.run();
t.update = function() {
r2.cmd (t.cmd, function(x) {
_(t.key).innerHTML =
"<div style='background-color:#304050;overflow:scroll;height:100%'><pre>"+x+"</pre></div>";
});
}
_('cmd_'+ctr).onclick = function() {
t.key = 'div_'+ctr;
t.cmd = prompt ();
t.update ();
}
}
t.new_frame ('hexdump', newHexdumpFrame ('hexdump'), function(obj) {
var code = _('hexdump_code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
t.new_frame ('disas', newDisasmFrame ('disas'), function(obj) {
var code = _('disas_code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
t.run();
newHexdumpFrame ();
newDisasmFrame ();
t.run ();
window.onresize = function() {
t.run();
t.run ();
}
_('body').onkeyup = function (e) {
switch (e.keyCode) {
case 'x':
var n = t.defname ("hexdump");
t.new_frame (n, newHexdumpFrame (n), function(obj) {
var code = _(n+'code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
break;
case 'd':
var n = t.defname ('disas');
t.new_frame (n, newDisasmFrame (n), function(obj) {
var code = _(n+'_code');
if (code) {
var top = code.style.offsetTop;
var pos = findPos (code);
code.style.height = obj.offsetHeight - pos[1]+20;
code.style.width = obj.style.width - pos[0];
}
});
break;
case 'x': newHexdumpFrame (); break;
case 'd': newDisasmFrame (); break;
case 'h': t.move_frame ('left'); break;
case 'j': t.move_frame ('down'); break;
case 'k': t.move_frame ('up'); break;

View File

@ -30,7 +30,29 @@ var Tiled = function(id) {
this.curframe[0].mh = set;
}
}
this.update_frames = function () {
this.ctr2 = 0;
this.tile = function () {
if (this.maximize && this.curframe) {
var mtop = topmargin;
var left = 0;
var width = w;
var height = h-mtop;
var f = this.curframe[0];
f.obj.style.position = 'absolute';
f.obj.style.top = mtop;
f.obj.style.left = left;
// always on top.. or hide all the frames
f.obj.style.zIndex = 99999+this.ctr2++;
// TODO: add proportions
f.obj.style.width = width;
f.obj.style.height = height;
//f.obj.style.backgroundColor = "green";
//f.obj.innerHTML =" FUCK";
if (f.update)
f.update (f.obj);
return;
}
function getmaxh (self,col) {
if (self.frames[col]) {
for (var row in self.frames[col]) {
@ -143,7 +165,7 @@ var Tiled = function(id) {
}
for (var i = 0; i<d.length; i++)
this.frames.push (d[i]);
this.update_frames ();
this.tile ();
break;
case 'left':
break;
@ -155,6 +177,7 @@ var Tiled = function(id) {
if (!name && this.curframe) {
name = this.curframe[0].name;
}
this.oldframe = this.curframe;
for (var col in this.frames) {
for (var row in this.frames[col]) {
var f = this.frames[col][row];
@ -170,7 +193,7 @@ f.mw = false;
}
}
}
this.update_frames ();
this.tile ();
return ret;
}
this.new_frame = function(name, body, update, pos) {
@ -179,10 +202,13 @@ this.update_frames ();
var obj_title = document.createElement ('div');
obj_title.className = 'frame_title';
obj_title.id = 'frame_'+name;
var d = document.createElement ('div');
d.style.backgroundColor = '#d0a090';
var a = document.createElement ('a');
a.innerHTML = name;
a.href='#';
obj_title.appendChild (a);
d.appendChild (a);
obj_title.appendChild (d);
(function(self,name) {
a.onclick = function() {
//alert ("clicked "+name);
@ -241,6 +267,10 @@ this.update_frames ();
for (var row in this.frames[col]) {
var x = this.frames[col][row];
if (x.name==name) {
if (x != this.curframe[0])
return;
if (this.curframe[0] != this.oldframe[0])
return;
if (this.frames[col].length>1) {
// remove row
var a = this.frames[col].splice (row).slice (1);
@ -263,16 +293,13 @@ this.update_frames ();
// select next frame
}
this.select_frame (prev);
//this.update_frames ();
//this.tile ();
return x;
}
prev = x.name;
}
}
this.update_frames ();
}
this.tile = function () {
// TODO
this.tile ();
}
this.run = function () {
this.update_size ();
@ -282,6 +309,6 @@ this.update_frames ();
obj.style.width = w;
obj.style.height = h;
obj.style.backgroundColor = '#a0a0a0';
this.update_frames();
this.tile ();
}
}