Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/madebymany/sir-trevor-js

Rich content editing entirely re-imagined for the web
https://github.com/madebymany/sir-trevor-js

Last synced: about 2 months ago
JSON representation

Rich content editing entirely re-imagined for the web

Awesome Lists containing this project

README

        

# Sir Trevor

[![Build Status](https://travis-ci.org/madebymany/sir-trevor-js.png?branch=master)](https://travis-ci.org/madebymany/sir-trevor-js/)

Conceived by [Andrew Sprinz](http://github.com/andrewsprinz). Maintained by [Chris Bell](http://github.com/cjbell88) & [Andrew Walker](http://github.com/ninjabiscuit).

## Upgrade guide from v0.5

- [Changelog](https://github.com/madebymany/sir-trevor-js/blob/master/CHANGELOG.md)
- Migration docs [0.4-0.5](https://github.com/madebymany/sir-trevor-js/blob/master/docs/migrations/0.4-0.5.md), [0.5-0.6](https://github.com/madebymany/sir-trevor-js/blob/master/docs/migrations/0.5-0.6.md)

### Quick start

The recomended way to install Sir Trevor in your project is using npm. This will install all the files required in the `build` directory for the module.

```
npm install sir-trevor
```

Note: Sir Trevor is distributed combined with its dependencies. If you wish to modify Sir Trevor you will want to clone the repository and use the [Compiling instructions](#compiling) below.

HTML

```html

```

Javascript

```js
import SirTrevor from "sir-trevor";

const editor = new SirTrevor.Editor({
el: document.querySelector(".js-st-instance"),
defaultType: "Text",
iconUrl: "build/sir-trevor-icons.svg"
});
```

### Full docs

[http://madebymany.github.io/sir-trevor-js/docs.html]

### Plain JS

- [Download the latest release](https://github.com/madebymany/sir-trevor-js/zipball/master)
- ...or clone the repo: `git clone git://github.com/madebymany/sir-trevor-js.git`

### Implementations

1. [Sir Trevor Rails](http://github.com/madebymany/sir-trevor-rails)
2. [Umbraco 7](https://github.com/mindrevolution/SirTrevor-for-Umbraco), [Umbraco 6](http://our.umbraco.org/projects/backoffice-extensions/skybrud-sir-trevor-editor)
3. [CakePHP](http://github.com/martinbean/cakephp-sir-trevor-plugin)
4. [Wordpress](https://github.com/neyre/sir-trevor-wp), [Wordpress](https://github.com/raffij/sir-trevor-wordpress)
5. [Laravel](https://github.com/caouecs/Laravel4-SirTrevorJS)
6. [Django](https://github.com/philippbosch/django-sirtrevor)
7. [Yii Framework](https://github.com/DrMabuse23/yii2-sir-trevor-js)
8. [Symfony2](https://github.com/EDSI-Tech/SirTrevorBundle)

## Custom blocks

We are keeping a list of [custom block repos here](https://github.com/madebymany/sir-trevor-js/wiki/Custom-blocks). See the documentation to find out more about [adding your own block types](http://madebymany.github.io/sir-trevor-js/docs.html#4).

## Browser support

Sir Trevor is only tested on the following modern browsers:

- IE11+ (https://github.com/madebymany/sir-trevor-js/tree/ie-support)
- Chrome 51+
- Safari 9+
- Firefox 47+

ECMAScript 6 shims are bundled in by default; if the platform you wish to run on doesn't support ECMAScript 5 APIs you'll need to shim those yourself.

Sir Trevor uses [The Guardian's scribe](https://github.com/guardian/scribe) for rich text editing. Double check their [browser support](https://github.com/guardian/scribe#browser-support) if your application relies on full RTE support.

## Contributing

See the [roadmap](https://github.com/madebymany/sir-trevor-js/wiki/Roadmap) and read a little about [the philosophy](https://github.com/madebymany/sir-trevor-js/wiki/Philosophy) guiding development.

### Customising the way it looks

We use [Sass](http://sass-lang.com/) for our styles, if you'd like to change the default styling please fork the repository and make changes to the Sass before recompiling.

### Customising blocks

Block Types can also easily be added to the `SirTrevor.Blocks` object. You can also override the default block types (Text, Image, Tweet, Video, Quote, Heading & List) at any time. See the documentation to find out more about [adding your own block types](http://madebymany.github.io/sir-trevor-js/docs.html#4).

### Compiling

Tests are run as part of compilation process, which require `chromedriver` to be installed on
the machine where you are running the compilation. If you're running Homebrew on OSX this can
be installed via `brew install chromedriver`.

Before getting started please be sure to install the necessary dependencies via npm:

`$ npm install`

When completed, we have a couple of preset scripts:

`$ npm run dev`

This compiles for development, and watches source files to recompile when you change something.

`$ npm test`

Runs the linter and test suite, just like the CI server does.

`$ npm run dist`

Concatenates scripts, compiles the Sass, runs the Jasmine tests and minifies the project.

Please ensure any pull requests have relevant Jasmine tests (where applicable).

## Current browser support tests

matrix:

- BROWSER_NAME='chrome' BROWSER_VERSION='51' PLATFORM='OSX 10.10'
- BROWSER_NAME='chrome' BROWSER_VERSION='51' PLATFORM='Windows 7'
- BROWSER_NAME='firefox' BROWSER_VERSION='46' PLATFORM='OSX 10.10'
- BROWSER_NAME='firefox' BROWSER_VERSION='46' PLATFORM='Windows 7'

## Building gh-pages docs

```
cd website
npm install
bundle exec rake publish PROJECT_ROOT=./ ALLOW_DIRTY=true
```

## License

Sir Trevor is released under the MIT license:
[opensource.org/licenses/MIT](http://opensource.org/licenses/MIT)