Category Archives: Web

It Is Our Time

June 18, 2013Webroot

I’m American. I’m not afraid. I’m more likely to die by furniture than terrorism. I can’t say that the news of the extensive NSA snooping is shocking, and frankly not totally surprising. What I can say, is that it’s time for a change. We must consider how America has changed, and if it is what we want it to be.

America can be great. In fact, America is great. What America needs now is to be better — to be a true leader. I am compelled to take to writing because I am positive that we can be better. I know we live in trying times, I know there are no easy decisions. I also know that now is the time to take the right path. It is time to take the high road, and lead the world into a new era. It is our time. We’ve spent more than a decade being afraid. We’ve written a blank check for the War on Terror, and it’s due time that we reassess whether all of those decisions are in our best longterm interest. I realize this is a sensitive subject — I know that there are many smart and hardworking people doing the best they can to protect us. Do not confuse me with being “soft on terror”, I’ve come to these realizations exactly because I am strong on America.

In 1933 Franklin D. Roosevelt famously said —

So, first of all, let me assert my firm belief that the only thing we have to fear is…fear itself — nameless, unreasoning, unjustified terror which paralyzes needed efforts to convert retreat into advance.

America has faced massive adversity in the past dozen years. However, it is becoming painful apparent that our inability to accurately judge the cost of the War on Terror is slowly draining us of what it is to be American. You could take a look at how Associated Press reporters call records are being targeted. Or how every day that Guantanamo Bay is open and we have fathers, brothers, and family members locked away — is a day that we tarnish our reputation, alienate the world and endanger all Americans. Collateral damage of military conflicts is burning an image of violence and American aggression into the witnesses and survivors. We measure our costs in American dollars and American lives, and this view is limiting us. The 9/11 attacks cost roughly $500,000. If our response is an arms race where we outspend 1,000:1, our only destination is bankruptcy.

The world is not us vs them, it’s not good guys and bad guys. This view can be extremely toxic and risks de-humanizing other nations and people. We’re all human — we share the same needs and the same planet. The world is shades of grey and overzealous reactions risk alienating huge swaths of the world, not just for today but for decades.

I’ve grown up surrounded by this “new reality” and it’s admittedly difficult to come to understand that the intention of terrorism is to terrorize, to get within ones mind and fears. Viewed with this understanding, our reactions have largely played directly into the hands of the September 11 attackers. We haven’t destroyed them, we’ve created tributes in the form of the Patriot Act and security checkpoints, secret court orders, disallowing photography, and barring liquids on planes. There is little more core to the American belief than “Checks and Balances”. It seems blindingly obvious that intentionally shielding programs like PRISM from the American public, and decisions made in secret validated through secret approvals and courts run diametrically opposed to this foundation in what America is.

This doesn’t affect me

You might be thinking “if you have nothing to hide, don’t worry”. I can’t blame you for thinking this, it certainly would be easier, but sadly it’s not true. I’d like to point out that Hoover and the FBI tapped Martin Luther King Jr, and told him to kill himself. The ability to systemically profile on a large scale is not good for anyone. I like this description of why “metadata” matters.

The glacial turn — Call to Action

I do not believe that these changes will happen overnight. Nor do I believe that we have a perfect solution. I know that we need a course-adjustment, that we need to return to what makes us great. I believe that programs like PRISM need to be made transparent to and evaluated by the American taxpayers who fund it. I believe that transparency has to be the default, and that as long as large scale secrecy exists, it will be exploited. Let’s change, starting today.

Today

Seriously reflect on what you think and why. Write about it.
Talk about it, this is a mainstream problem, it impacts everyone whether we like it or not.
Donate to the EFF (I have)
sign this petition asking for pardon of Edward Snowden
Adopt encryption
- RedPhone for Android
- TextSecure for Android
- Mailvelope for the web
- Mymail-crypt (disclosure: my extension)
Tomorrow

Put whatever your skills are to use. The privacy problems we face are not insurmountable and virtually everyone can do something about it.
- Become an advocate, volunteer time to help
- If you make web applications think about architectures that are engrained with user privacy
- Contribute to Open Source projects however you can (self plug: OpenPGP.js)
- Don’t give up

Restaurant Week DC!

August 14, 2012Computers, design, Hacking, Webroot

I found out today that it is Restaurant week in DC. I quickly found the official website, and equally quickly found out that it was hard for me to figure out things I wanted to know, like where these restaurants are, and what Yelp thinks of them. The only logical conclusion was to make a website do exactly that. I ended up using my site to find a place to eat for dinner, and it was delicious 🙂

Currently, I’ve overrun my Yelp requests for the day, I’m going to work on getting the Yelp functionality integrated again, ASAP.

Check out the site at r.prometheusx.net, what do you think?

Technical Details

Gathering the information

In order to gather information about all of the restaurants from the official site at first I was a little unsure. Then I realized I could just use jQuery to gather all of the elements and create a json object that I could use directly in this page.

Below is the bulk of my parsing code, I was then able to JSON.stringify an array of these restaurant objects to easily copy the data.

  $('.formfont_black b').each(function (){
    var parentColumn = $(this).closest('td');
    var restaurant = {};
    restaurant.name = $(this).html();
    restaurant.url = $(this).closest('a').attr('href');
    var lineSplit = parentColumn.html().split('<br>');
    restaurant.addr = lineSplit[1];
    restaurant.phone = lineSplit[2];
}

What database?

I thought about setting up a quick Rails application for the backend of this, but then realized that there was really limited value in a database since this information is all static, and there’s not that much of it. Therefore, I’ve dumped most of the content directly into the javascript files. If this were a more serious application this could easily be adjusted.

Third Party Integration

Google – I quickly realized that the geocoding API for Google Maps was severely going to throttle my ability to look up restaurants. It limits you to, I believe, ~11 queries per second. Therefore, in order to map all 250 restaurants, I mapped them once and just saved that data into a JSON map, the same way as the restaurant information.

I’ve pasted my hacked together method to get all of the geocoded information. I was then able to JSON.stringify() the result

      function geocode_address(map, geocoder, restaurant){
        geocoder.geocode( {address:restaurant.address}, function(results, status){
          if (status == google.maps.GeocoderStatus.OK) {
          var marker = new google.maps.Marker({map:map, position:results[0].geometry.location});
          google.maps.event.addListener(marker, 'click', function(){
            yelpRequest(restaurant, marker);
            });
          good++;
          goodAddresses[restaurant.address] = results[0].geometry.location;
          }
          else {
            bad++;
            setTimeout(function(){
              geocode_address(map,geocoder,restaurant);
            }, 100);
          }
        });

Yelp – this integration initially went pretty smoothly other than the fact the Yelp API does not like to let you have users directly authenticate which is a serious problem when I’m running the application without a backend. Now, I’ve run into the problem of hitting the ridiculously small number of daily queries (100). I’m working on getting this upgraded.

Hacking Gmail for Privacy and Profit

June 26, 2012gmail-Crypt, Hacking, mymail-crypt, Reversing, Webroot

My goals for Mymail-Crypt for Gmail have always been to allow everyone to be able to use Gmail to simply, and privately send messages. I’ve recently had time to conquer one of the bigger challenges that I’ve only poked at before: stopping automatic draft saving.

However, the whole process was an exercise in backtracking, frustration, and bursts of satisfaction. This post is going to be very technical, and I write it in hopes that someone attempting to do something similar with Gmail or general extension hacking can find something useful. Feel free to reach out to me with any questions.

No, this is not how to read your ex-girlfriend’s email, and no, I don’t actually profit from this extension.

AJAX Attack!

Ok. Let’s make Gmail stop unloading drafts. These are sent via XHR (ajax), so let’s intercept that from our extension and stop them from uploading:

window.XMLHttpRequest.prototype.open = function(){
    debugger;
}

Nothing. That’s weird. I see in the debugger, XHR calls going back and forth, but my debugger call isn’t registering.

Ok I wonder if this is a limitation of Content Script Chrome extensions. I’ve looked at the Content Script Documentation before but, let’s try some experiments:

$('body').append('<script type="text/javascript">
 alert("here");
</script>');

Ok, I get an ever so pleasant alert popup on page load. JS DOM injection Works.

$('body').append('<script type="text/javascript">
window.XMLHttpRequest.prototype.send = function(){debugger;}
</script>');

Doesn’t work. “Isolated Worlds” are in play. This is the limit of the content script sandbox. Time to take another approach.

Replace the composition box

So, if I can’t intercept the actual XHR messages, I think I’m going to have to change something on the page in order to prevent drafts from being visible. My first thought is to look at the composition form textbox. A quick look in the debugger shows that the code looks like this for the textbox:

<body g_editable="true" hidefocus="true" contenteditable="" class="editable LW-avf" id=":2ak" style="min-width:0;"><br></body>

I try replacing the :2ak with my own personal id. However, even after I make this change, the draft still gets uploaded. I try changing a few parent id values. Same response.

Higher in the DOM I find the form that is being submitted. When I rename this id value I get an error. Yay. My Fuzzing broke the page. I use the debugger to pause on all XHR requests. I confirm that the XHR request contents are essentially blank, as I would expect. This is a good sign.

Now, how do I make the page usable again.

Click hijacking

The first thing I try is to write a new jQuery.click() on things that I think I could click on, notably a elements. However, Gmail doesn’t use a lot of a elements. I seemed to sometimes get into some sort of race condition depending on how I was binding .click() events. There seem to be two things at play here:

jQuery by default will make a queue with event handlers, but this can be overridden
(again) Content Script Chrome extensions have limitations on manipulating the host page javascript

Time to ~~pivot, no, not pivot I’m not a startup~~ change my strategy yet again.

ctrl+z

Let’s try copying our form, I can leave the cloned form blank so Gmail thinks there is an empty message.

form.parent().prepend(form.clone());

Initially, this is looking pretty good. I can change the id values and hide the form I don’t want Gmail to see. However, it quickly becomes apparent there is a serious issue with this approach. The text box is not editable. That’s weird. Uggh, part of the form is an iframe. After wasting an embarrassing amount of time trying to force the iframe html value to be what I want, it becomes apparent my approach isn’t working and the content isn’t loaded when I try to clone it. Duh, what if we just wait until it is loaded.

setTimeout(function(){
  var form = $('#canvas_frame').contents().find('[class="fN"] &gt; form').first();
  form.parent().prepend(form.clone());
}, 500);

Alright, this is looking good. I can edit the text as I would expect. Uggh, new problem, I’m stuck in some sort of weird state where either the drafts are continuing to save or I’m hitting my new favorite Gmail 707 error. I proceed to fiddle with this, changing exactly how I insert or what I do, for quite some time. It continues to not work. Awesome.

Take a break (always undervalued).

ctrl+z

In fiddling with the cloning, I’m somehow slowly drawn back to my previous strategy of just renaming the composition form. Ok, so the major issue with this is that whenever I click any link I get a 707 error unless the form has the proper id. Let’s take a step back and see if somehow we can take advantage of the hierarchical structure of the DOM. What if I bind a mousedown on the main “canvas_frame” iframe object?

$('#canvas_frame').contents().mousedown(function(){
  alert('I'm CLICKING');
});

Boom. This works exactly as I want it to. Anywhere I click, I’m getting the alert. Now let’s try to refine this sledge-hammer approach to make it useful. I target the left hand side of the Gmail window:

Rather than a 707 error, I’m going to go ahead and assume you want to navigate away. If you don’t want drafts to autosave, navigating away means these should not be saved. So let’s rebind this left hand side

$('#canvas_frame').contents().find('[class="nH oy8Mbf nn aeN"]').mousedown(clearAndSave);
function clearAndSave(){
    $('#canvas_frame').contents().find('#gCryptForm').find('iframe').contents().find('body').text('');
    saveDraft();
}
function saveDraft(){
    var form = $('#canvas_frame').contents().find('#gCryptForm');
    form.attr('id', formId);
    $('#canvas_frame').contents().find('div[class="dW E"] &gt; :first-child &gt; :nth-child(2)').click();
}

This works well. I similarly blank out other navigation links. To save drafts, I bind the appropriate button to call the saveDraft function. To send a message I again save a draft and fake click the send button. jQuery provides the powerful ability to generically select the Send button:

$('#canvas_frame').contents().find('div[class="dW E"] > :contains("Send")');

General Approach

You may have notice that I search Gmail page based on class. In my experience (too many hours), these are less likely to change between iterations. I try to make my jQuery selections as generic as possible but still get the exact element I want — it’s often hard to find the appropriate balance.

There’s some other craftiness in my solution, but this article is already far longer than I had anticipated, and shows the points I consider most important.

Thoughts

It works! The Gmail interface is not intended to be manipulated by people. Figuring out how the complex functionality of the application is difficult and takes a lot of guess and check.

I’ve added an experimental option to disable draft autosaving in the latest version of Mymail-Crypt for Gmail (source), (Chrome Web Store extension) using the approach described here.

Newsgraph Updates

January 3, 2012Computers, newsgraph, Webroot

I’ve updated my Newsgraph page with a new url: http://newsgraph.prometheusx.net This should provide better performance.

Additionally, I’ve made a number of changes/bugfixes to make the program more intuitive/easy to use/aesthetically pleasing. Not to say it’s perfect, but this project continues to be a small concept of displaying recent news by popularity and category over a short time period.

Poke around, try it out, click on the different categories, let me know your thoughts..

Technical Changes

I’ve changed the application to use jquery (no, I don’t know why I wasn’t before).

I made fonts scale based on the resolution of the window by using a base font size rather than a constant. Additionally, I’ve added fonts from Typekit.

Since the core of the application is one giant canvas, the way that stories are clicked on is basically looking them up in a map of sorts that is basically represented as a 2-d array that marks that starting points for the various stories. However, since there are objects other than the singular large canvas, the offset of the canvas on the page needed to be considered. This was added by changing the function called on click to depend on “this.offsetTop”, similar functions for other directions are available, but most important in this case was offsetTop. The canvases also resize on window resize.

I think eventually, the page should be either to move away from canvas or to use more of the canvas functionality. I chose canvas originally because I wanted to try them out in a real world application.

gmail-crypt updates (key generation alpha!)

December 2, 2011Computers, gmail-Crypt, Hacking, Webroot

New Version

I’ve released a new version of gmail-crypt, my extension that allows OpenPGP/GPG encryption in Gmail through a Chrome extension. The biggest change in this version of gmail-crypt is the addition of key generation. This is a VERY EARLY stage key generation, the key ID’s are not calculated the same way as GPG, I’m currently not sure what the issue is. This means that it’s possible you’ll have to regenerate your key in the future!

Encrypted Email in 1 minute

The installation process is basically the same as the old version.

Click Here for the extension.
Click “Continue” when warned about the dangers of extensions
Click “Install” when warned about the permissions for this extension
In your browser click the Wrench(upper right hand)->Tools->Extensions
Click “Options” under gmail-crypt
Click “my keys” tab, then “generate a new key”
Fill in your name and email, click submit
Test it out by sending yourself an email in gmail and click the “encrypt me” lock icon, when receiving the message click “decrypt me” by the unlock icon.
Get your friend to install the extension and see if you can send messages. NOTE: as indicated above, these keys may have to be regenerated in the future.

Concering JavaScript and OpenPGP

Since my last post, there have been several major changes regarding the OpenPGP javascript environment. GPG4Browsers was released, which performs a very similar function to what I am aiming to do. Appearance is the only real difference. GPG4Browsers has taken a different approach by having composition be a separate window rather than the integrated experience I am going for. I believe their design reflects a desire to be easily maintainable. In designing gmail-crypt I want encryption to require as few changes to user habits and as few clicks as possible.

GPG4Browsers however has a very strong javascript base for their code. The other major change has been the creation of the OpenPGPJS project. GPG4Browsers creators and most of the contributors I had mentioned previously and myself have decided to team up to work together to bring a unified OpenPGP JavaScript library.

With the looming creation of a unified OpenPGP library, I will perform minimal work for the time being on my js-openpgp code as I believe it will be rolled into the larger project and then used in this project. The extension has other work that needs done (Options page rewrite, stop draft uploading, allow any text to be encrypted/decrypted)

Hope this can help someone! Let me know other ideas you might have..

This doesn’t affect me

The glacial turn — Call to Action

Today

Tomorrow

Technical Details

Gathering the information

What database?

Third Party Integration

AJAX Attack!

Replace the composition box

Click hijacking

ctrl+z

ctrl+z

General Approach

Thoughts

Technical Changes

New Version

Encrypted Email in 1 minute

Concering JavaScript and OpenPGP