Browser add-on: Greasemonkey user script to add FlightAware callsign lookup function to ADS-B Exchange

[BethanyFerrell]

The Origin​

I've been using ADS-B Exchange a lot to get a better idea how various types of aircraft behave under various conditions. I'm often curious about where a particular aircraft came from, is going, or both. For a while I'd:

• click the aircraft's icon on the map, or select its row in the listing on the right side
• double-click the callsign at upper left corner of the aircraft info panel that appears on the left side, then copy the selected text
• in another browser tab, paste the copied callsign into a search
• locate flightaware.com in the results, and click the link to go to the flight info page

Works, but cumbersome. What I wanted was for the callsign to have a link to flightaware or similar service, and skip all the faffing about.

As a prototype I wrote a bare-bones Firefox browser extension. Very easy but this is much too specialized a task to bother with a whole plug-in just for it.

The Solution​

Better to use the Greasemonkey extension (or one of the alternatives such as Violentmonkey or Tampermonkey, which leads to a debate I won't get into here). Once installed in your browser Greasemonkey allows you to load one or more "user scripts", which operate when URLs that the author/user defines are visited.

My user script is nearly identical to the JavaScript portion of the prototype Firefox extension, with some Greasemonkey-specific comments added to the top.

// ==UserScript==
// @name          ADS-B to FlightAware
// @version       0.1
// @namespace     pony-pasture-aviation/gm-scripts
// @grant         GM.openInTab
// @match         https://globe.adsbexchange.com/*
// ==/UserScript==

'use strict';

// Get the element (it's a <span>) that displays the callsign at upper left of the aircraft info panel.
let callsignElement = document.getElementById('selected_callsign');
// Apply styling to simulate a link — underline the callsign and set the mouse pointer to pointing hand
// when mousing over the element.
callsignElement.style.textDecoration = 'underline';
callsignElement.style.cursor = 'pointer';
// When the callsign is clicked, open FlightAware in a new browser tab, with a lookup for the callsign,
// and switch to view that tab.
callsignElement.onclick = function(e) {
    GM.openInTab('https://flightaware.com/live/flight/'+callsignElement.textContent, false);
};

That's all there is to it. If you prefer a different provider instead of flightaware.com, as long as their URL ends in or includes the callsign you can modify the first argument to GM.openInTab() to suit.

How To​

To use it, first install Greasemonkey. Click the monkey-face icon in your browser's extensions toolbar, choose "New user script…" from the drop-down menu, copy the JavaScript text above, and paste it in. Save it, go to ADS-B Exchange - tracking thousands of aircraft, click an aircraft icon or select a row in the listing, and the callsign at upper left should underlined. Click it to do a lookup on flightaware.com.

Hope this helps someone else. If it doesn't work for you please tell me what you expected to happen and what you got instead; a screenshot might be helpful.