/deepword

Web editor based on Monaco
  1. JavaScript 93.0%
  2. HTML 6.1%
  3. CSS 0.9%
JavaScript HTML CSS

Clone with HTTPS

Use Git or checkout with SVN using the web URL.

Open in Desktop Download ZIP
Find file
Switch branches/tags
Nothing to show
Latest commit efce411 May 25, 2017 coderaiser chore(story) rm " "
Permalink
Failed to load latest commit information.
bin chore(deepword) rm " " Oct 13, 2016
client chore(story) rm " " May 25, 2017
common chore(mode-for-ext) rm comment Apr 25, 2017
html feature(html) add title Oct 13, 2016
img feature(img) make image smaller Oct 13, 2016
server feature(package) storage -> fullstore May 22, 2017
.babelrc feature(package) pify -> es6-promisify: es5 support Oct 18, 2016
.client.eslintrc feature(deepword) add setMode Apr 25, 2017
.gitignore feature(package) legacy:index: server -> ../server_ Oct 12, 2016
.npmignore feature(img) add screenshot Oct 13, 2016
.rollup.js feature(package) babel-preset-es2015-rollup v3.0.0 Dec 13, 2016
.server.eslintrc chore(eslint) ecmaVersion Oct 11, 2016
.socket.io.rollup.js feature(deepword) make minified bundle with socket.io Oct 25, 2016
.travis.yml feature(travis) node_js: add 7 Oct 26, 2016
ChangeLog chore(package) v1.4.13 May 23, 2017
LICENSE docs(license) add Oct 13, 2016
README.md docs(readme) rm "\n" Oct 13, 2016
package.json chore(package) v1.4.13 May 23, 2017

README.md

Deepword License NPM version Dependency Status Build Status Coverage Status

Web editor used in Cloud Commander based on Monaco.

Deepword

Features

  • Syntax highlighting based on extension of file for over 30 languages.
  • Built-in beautifier (with options in json/beautify.json, could be overriden by ~/.beautify.json)

Install

npm i deepword -g

NPM_INFO

Command line parameters

Usage: deepword [filename]

Parameter Operation
-h, --help display help and exit
-v, --version output version information and exit

Hot keys

Key Operation
Ctrl + s save
Ctrl + f find
Ctrl + h replace
Ctrl + g go to line
Ctrl + b beautify js, css or html
Ctrl + m minify js, css or html
Ctrl + e evaluate (JavaScript only supported)

For more details see Ace keyboard shortcuts.

API

Deepword could be used as middleware for express. For this purpuse API could be used.

Server

deepword(options)

Middleware of deepword. Options could be omitted.

const deepword = require('deepword');
const express = require('express');
const app = express();

app.use(deepword({
    diff: true,  /* default */
    zip : true,  /* default */
    authCheck: (socket, success) => { /* optional */
    }
}));

app.listen(31337);

deepword.listen(socket)

Could be used with socket.io to handle editor events with.

const io = require('socket.io'),
const socket = io.listen(server);

deepword.listen(socket);

Client

Deepword uses Monaco on client side, so API is similar. All you need is put minimal html, css, and js into your page.

Minimal html:

<div class="edit" data-name="js-edit"></div>
<script src="/deepword/deepword.js"></script>

Minimal css:

html, body, .edit {
    height: 100%;
    width: 100%;
}

body {
    margin: 0;
}

.edit {
    overflow: hidden;
}

Minimal js:

deepword('[data-name="js-edit"]', (editor) => {
    editor.setValue('Hello deepword!');
});

For more information you could always look into html and bin directory.

Environments

In old node.js environments that supports es5 only, deepword could be used with:

var deepword = require('deepword/legacy');

Related

License

MIT