GithubHelp home page GithubHelp logo

gina's Introduction

Gina: A Glitch CLI

This is (an experimental) command line tool to upload a project to Glitch (based on an undocumented API) and return a URL to the live server.

gina example

Installation & usage

Note: requires node 8 to run.

Via npm to install the gina command line tool:

npm install --gobal @remy/gina

Now from inside a node project:

gina

This will take a few minutes depending on the size and complexity of the project. By default the user will be anonymous. To assign to your own Glitch account, find your

Connecting to your Glitch account

You'll need your Glitch token. There's a few ways to get this, but it's not super easy. I recommend using Chrome and opening the developer tools.

Head to glitch.com and sign in. From the developer tools' console panel, run the following code:

JSON.parse(localStorage.cachedUser).persistentToken

This should print a string that looks like a series of letters and numbers separated by dashes.

You can use the token on the command line like this:

GLITCH_TOKEN=xxxxx-xxxx-xxxx-xxxxx gina

Or you can add it to your terminal profile by adding the following line to your .bashrc (or .profile or whichever file you use):

GLITCH_TOKEN=xxxxx-xxxx-xxxx-xxxxx

Then run the source command on that file (.bashrc or which file you edited), like this:

source /Users/remy/.bashrc

Now you can run gina without the token defined (as above).

Internals

  1. Anon user (or token from existing account) POST https://api.glitch.com/users/anon => JSON { persistentToken }
  2. Create a project: POST https://api.glitch.com/projects?authorization=${ persistentToken } => JSON { id, name }
  3. Create secure socket: wss://api.glitch.com/hushed-frog/ot?token=${ persistentToken }
  4. Delete original files in project
  5. Glob all local files (ignoring based on .gitignore) and upload
  6. Listen to the glitch log and wait for dep install and listening

WebSocket API

init

{"command":"broadcast","message":{"user":{"avatarUrl":null,"awaitingInvite":false,"id":553215,"name":null,"login":null,"color":"#80f289","utcOffset":0,"branchName":"Live","readOnly":false,"thanksReceived":false,"tabId":"49017","projectPermission":{"userId":0000,"projectId":"55d4fb6f-gggg-4a70-a214-292ba452bbb2","accessLevel":30},"invited":false,"left":false,"stopAsking":false}}}

Documents down:

[{"response_type":"document","id":"15107826537bca4ee0-e18c-gggg-99fa-fa696c5c7e86","path":"server.js","content":"...","version":1,"broadcast":{}}]

Delete file

{"command":"document","id":"15107826534933af4b-c5f0-4b06-gggg-a7aacb923b97","path":""}

Delete all the files:

const path = '';
files.filter(_ => _.path !== '.glitch-assets').map(({ id }) => {
  wss.send(JSON.stringify({
    command: "document",
    id,
    path // empty string deletes
  }))
})

Create file

const path = "my-file.js";
const id = uuid.v4();
const document = { command: "document", id, path }
wss.send(JSON.stringify(document));

// then send contents via a transform
const submit = { id, "command":"submit","transform":{"position":0,"insert": contents ,"num_delete":0,"version":2} };
wss.send(JSON.stringify(submit));

The name

I've decided to follow the UK weather system naming approach, in that they use names of women and men cycling their way through the alphabet. In my case, I'm taking the first letter from the project of interest, i.e. Glitch.

I'm kind on the bench about whether it works. I like that it's short and catchy, but I also have a niggle that it might be a bit weird. Ping me an issue if you think it needs changing (either offline via email or an open issue).

TODO

  • Asset files
  • Detect package name and re-use
  • Better error handling

Licence

gina's People

Contributors

remy avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.