Launchlet is a simple way to run customize web sites with JavaScript and CSS.

Inspired by Quicksilver, it lets you run commands via the keyboard.

Recipes: A Thinking Tutorial

A Recipe is a format for expressing how functions will run in Launchlet.

Command

A Command is the simplest kind of Recipe. It has a Name and Callback:

Name

Say Hello

Callback

alert('Hello')

This can be run by Launchlet directly as it has no input.

Procedure

A Procedure has a Signature and Callback, and optionally Arguments:

Signature

Greet

Arguments

message

Callback

alert(message)

This can be called from any other Recipe using the API this.api['Greet'] or this.api.Greet. In this way, the previous example could be changed to:

Name

Say Hello

Callback

this.api.Greet('Hello')

Pipe mode: Subject

A Subject has a Name, Output Type and Callback:

Name

Salutation

Output Type

String

Callback

return 'Yo'

In Pipe mode, this can be used as input for any Action that takes a String.

Pipe mode: Action

An Action has a Name, Input Types and Callback:

Name

Shout

Input Types

String

Arguments

message

Callback

alert(message.toUppercase())

In Pipe mode, this can be used on any Subject that returns a String. Although a Recipe can have multiple inputs, an Action will generally have only one.

Safety

Running arbitrary JavaScript can be dangerous, and this project comes with no guarantees of safety from malicious code, but there are a few things that the composer will try to flag and ignore:

• dynamic code such as eval or new Function()
• stateful code that calls document.cookie, localStorage, sessionStorage, XMLHttpRequest, fetch

Anyone with security expertise and ideas on how to improve safety in the project is welcome to add a GitHub Issue.

It is best to run code that is concise and easy to read.

Recipes from the current page

Optionally, Launchlet can include Recipes from any page that sets LCHPageRecipes on the window object to an Array. This allows pages to expose their functionality in a way that is accessible to 3rd parties:

window.LCHPageRecipes = [{
 LCHRecipeName: "Say Hello",
 LCHRecipeCallback: function () {
  alert('Hello');
 }
}];

For example, when running Launchlet on rosano.ca, it is possible to choose a 'Send a message' Command that originates from the page.

Shortcuts

List of recipes
Create new recipe	AccessKey+n
Select previous or next card, if filter field is focused	Up or Down
Clear filter text and selected card, focus filter field	Escape
Close, if filter field is focused	Escape
Clone recipe	Launcher
Import JSON (beta)	Launcher
Export JSON (beta)	Launcher

Global
Open access link	Launcher
Reload	Launcher
Force update	Launcher
Launcher	Alt+Enter

Global (when storage is connected)
Copy private access link	Launcher
Enter confirmation code	Launcher
Clear authorization	Launcher
Flush data	Launcher

What is remoteStorage?

remoteStorage is an incredible open-source technology for synchronizing data between multiple devices and making it available offline.

It allows the same data to be used in different ways by multiple apps. You could think of it as a USB key for your documents that you can plug into websites to work on your stuff.

You can get one for free from 5apps.

Launchlet package

The Launchlet package can be added to your own project as a module to quickly present a 'Jump to' functionality.

Setup

https://unpkg.com/launchlet/__compiled/launchlet.js https://unpkg.com/launchlet/__compiled/launchlet.css

npm install launchlet

<link rel="stylesheet" href="https://launchlet.dev/launchlet.css" />
<script src="https://launchlet.dev/launchlet.js"></script>

Usage

Commit Mode

Launchlet.LCHSingletonCreate({
  LCHOptionRecipes: [{
    LCHRecipeName: 'Alfa',
    LCHRecipeCallback () {
      alert('Alfa');
    },
  }],
  LCHOptionMode: Launchlet.LCHModeCommit,
});

Preview Mode

Launchlet.LCHSingletonCreate({
  LCHOptionRecipes: [{
    LCHRecipeName: 'Bravo',
    LCHRecipeCallback () {
      console.log('Bravo');
    },
  }, {
    LCHRecipeName: 'Charlie',
    LCHRecipeCallback () {
      console.log('Charlie');
    },
  }],
  LCHOptionMode: Launchlet.LCHModePreview,
});

Pipe Mode

Launchlet.LCHSingletonCreate({
  LCHOptionRecipes: [{
    LCHRecipeName: 'Delta',
    LCHRecipeCallback () {
      alert('Delta');
    },
  }],
  LCHOptionMode: Launchlet.LCHModePipe,
});

If you have keyboard shortcuts on the page

Ignore keydown events if Launchlet is active:

window.addEventListener('keydown', function (event) {
  if (Launchlet.LCHSingletonExists()) {
    return;
  }

  // ...
});

API

Launchlet.LCHSingletonCreate

Creates a singleton instance of the launcher. Destroys existing instance if there is one. Takes an optional configuration object.

Options

• LCHOptionRecipes (array) – []

  • Recipe objects

• LCHOptionMode (identifier) – Launchlet.LCHModeCommit

  • Launchlet.LCHModeCommit
  • Launchlet.LCHModePreview
  • Launchlet.LCHModePipe

• LCHOptionIncludePageRecipes (boolean) – false

• LCHOptionRunAutomaticRecipes (boolean) – false

• LCHOptionCompletionHandler (function) – undefined

• LCHOptionLanguage (string) – 'en'

  • 'en'
  • 'fr'
  • 'es'

Launchlet.LCHSingletonExists

Returns true if there is a singleton instance of the launcher.

Launchlet.LCHSingletonDestroy

Destroys a singleton instance of the launcher.

Launchlet.LCHTasksRun

Runs each Task that matches the current URL unless LCHRecipeIsExcluded returns true.

---