seng-canvas-text

Based on canvas-text. Refactored and written in typescript.

Parse html to canvas text

Installation

npm

npm i -S seng-canvas-text

other

We also have browser, amd, commonjs, umd, systemjs and es6 versions of this module available attached to the Github Releases.

manual

Check the build section below to see your you can build for all the targets yourself.

Usage

import SengCanvasText from 'seng-canvas-text';
// import SengCanvasText from 'seng-canvas-text/lib/classname';

// do something with SengCanvasText

Documentation

View the generated documentation.

Building

In order to build seng-canvas-text, ensure that you have Git and Node.js installed.

Clone a copy of the repo:

git clone https://github.com/mediamonks/seng-canvas-text.git

Change to the seng-canvas-text directory:

cd seng-canvas-text

Install typings cli utility:

npm install typings --global

Install dev dependencies:

npm install

Use one of the following main scripts:

npm run build   		# build this project
npm run generate   		# generate all artifacts (compiles ts, webpack, docs and coverage)
npm run typings			# install .d.ts dependencies (done on install)
npm run test-unit    	# run the unit tests
npm run validate		# runs validation scripts, including test, lint and coverage check
npm run lint			# run tslint on this project
npm run doc				# generate typedoc documentation
npm run typescript-npm	# just compile the typescript output used in the npm module

When installing this module, it adds a pre-push hook, that runs the validate script before committing, so you can be sure that everything checks out.

If you want to create the distribution files yourself, you can run the build-dist script, and the following files will get generated in the dist folder:

/dist/seng-canvas-text.js: bundled with webpack, can be loaded from a script tag, available as window.SengCanvasText
/dist/seng-canvas-text.min.js: same as above, but minified
/dist/seng-canvas-text-amd.js: bundled with webpack, can be used with e.g. requirejs
/dist/seng-canvas-text-commonjs.js: bundled with webpack, can be used in systems that support commonjs, but you should just use npm
/dist/seng-canvas-text-umd.js: bundled with webpack, works in the browser, with requirejs, and in a commonjs system
/dist/seng-canvas-text-umd.min.js: same as above, but minified
/dist/seng-canvas-text-system.js: bundled with typescript, can be used in systems that support systemjs
/dist/seng-canvas-text-es6.zip: transpiled with typescript, only types are removed from the source files

Contribute

View CONTRIBUTING.md

Changelog

View CHANGELOG.md

Authors

View AUTHORS.md

LICENSE

MIT © MediaMonks

TypeScript

Todo: describe TypeScript configuration and usage.

Karma

Todo: describe Karma configuration and usage.

TSLint

Todo: describe TSLint configuration and usage.

TypeDoc

Todo: describe TypeDoc configuration and usage.

Travis

This project uses Travis to build, test and publish its code to npm. Travis is free for public Github repositories.

It runs on all commits, shows the build status for pull requests, and publishes to npm when a new tag/release is created.

Travis only runs the npm test script, so have configured that script to run everything we want Travis to check. Besides the unit tests, we also run our validations and linters.

The travis configuration is placed in a .travis.yml file, consisting of multiple sections.

Defines the node_js language, and tells travis on which node versions to run the process.
Before running, it needs to install some global dependencies, and when it processes some coverage results.
It can do a npm deploy, telling it to keep the generated artifacts and only publish when run on node 4 and when a tag was committed. It also contains the email address and api key of the npm user.
Code Climate has a travis plugin that automatically uploads the code coverage results.

Because we want to keep the npm api key secret, we generate a secure token with the Travis Client, a CLI written in ruby.

Before we can do this, we must make sure that the repository is added to Travis, because Travis needs the repository owner/name info to make sure the encrypted values only work for that repository.

First you need to login with your travis account:
```
$ travis login
```
To verify that you are logged in correctly you can check:
```
$ travis whoami
```
Then make sure you are logged in to your npm account with the adduser command:
```
$ npm adduser
```
To verify that you are logged in correctly you can check:
```
$ npm whoami
```

Now we need to grab your auth token so we can encrypt it:

$ cat ~/.npmrc

# outputs:
//registry.npmjs.org/:_authToken=<your_auth_token>

Then let's encrypt that token using the travis encrypt command:

$ travis encrypt <your_auth_token>
Detected repository as mediamonks/seng-boilerplate, is this correct? |yes|
Please add the following to your .travis.yml file:

  secure: "YcN...Zb="

Now copy that last line, paste it into your .travis.yml, and make sure it looks something like this:

deploy:
  provider: npm
  email: "john@doe.com"
  api_key:
    secure: "YcN...Zb="

Code Climate

Todo: describe Code Climate configuration and usage.

Coverall

Todo: describe Coverall configuration and usage.

NPM

Todo: describe NPM configuration and usage.

VictorGa/seng-canvas-text