Home

Welcome to the LongDistance wiki!

Just some notes to help you get started.

Lifecycle

There are two parts to this application, the client extension and the server. The extension is located in the extension/ subdirectory, and the server is located mainly in server.js, importing some other files from shared/.

Extension

The extension begins with ldn.js. This is the background page of the Chrome extension.

constructor() {
    this.user = new User();
    this.ws = null;
    this.tabListener = new TabListener();
    chrome.runtime.onMessage.addListener((msg, sender, sendResponse) =>
      this._onRuntimeMessage(msg, sender, sendResponse)
    );
    console.log('<LDN> LDN has been started!');
}

Some things about ldn.js:

• keeps a local variable user which is just a model that I use to hold user data
• keeps a local ws reference to the websocket client
• tabListener listens to tab events to inject loader.js into the Netflix watch page (a viewing page)
• loader.js is a script that injects controller.js into the DOM

Popup

The popup is created via page_action in manifest.json.

• Uses a map of constant keys to jQuery elements to control view state
• We can get a reference to our background page using getClient(), which uses chrome.extension.getBackgroundPage() to get our background context

Server

The server begins with server.js. A simple WebSocket server, it keeps a map of lobbies and sockets.

Shared

There is a shared/ folder which contains code that is used by both the client and the server. The most important files here are the shared/model/ objects and constants.js.