https://github.com/g1eb/cli-plugin

🖥 CLI plugin for webapps
https://github.com/g1eb/cli-plugin

cli cli-plugin console shell user-interface vanilla-js

Last synced: 21 days ago
JSON representation

🖥 CLI plugin for webapps

• Host: GitHub
• URL: https://github.com/g1eb/cli-plugin
• Owner: g1eb
• Created: 2016-12-11T19:38:39.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2017-02-05T17:41:39.000Z (almost 8 years ago)
• Last Synced: 2024-11-10T11:45:07.649Z (about 1 month ago)
• Topics: cli, cli-plugin, console, shell, user-interface, vanilla-js
• Language: JavaScript
• Homepage: https://rawgit.com/g1eb/cli-plugin/master/
• Size: 67.4 KB
• Stars: 7
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# CLI Plugin

This project is a simple and easy to use command-line interface (CLI) for web applications.  

Inspired by minimalistic user interfaces that are rich in functionality.  

Designed for simplicity and built to empower.  

Very light weight.  

Features:

- configurable commands

- configurable colorschemes

- keeps history of used commands

## Demo

Click here for a live demo.

[](https://rawgit.com/g1eb/cli-plugin/master/)

## Install

- Install 'cli-plugin' with bower

```

bower install cli-plugin

```

- Install 'cli-plugin' with npm

```

npm install cli-plugin

```

- Or include files directly in your html:

```

```

### Setup

Initialize cliPlugin using a custom colorscheme/config file.

```

cliPlugin.init(config);

```

Config accepts following properties:

|Property        | Usage           | Default  | Required |

|:------------- |:-------------|:-----:|:-----:|

| textColor | text color | #111111 | no |

| cursorColor | cursor color | #111111 | no |

| backgroundColor | background color | whitesmoke | no |

Feel free to use hex, rgb(a) or html5 color names :)

### Register commands

Register your own commands:

```

cliPlugin.bind('list', function () {

  cliPlugin.print('
items on the shopping list:
');

  cliPlugin.print('


milk

bacon

eggs

');

});

```


### Useful functions

Use ```cliPlugin.print(text)``` command to print text on the screen, accepts html.  

Use ```cliPlugin.clear()``` command to clear the screen.

### Example

See [index.html](https://github.com/g1eb/cli-plugin/blob/master/index.html) for an example implementation.