version update

browserify

.gitignore

@@ -1,2 +1,2 @@
 .idea/
-node_modules/
+node_modules/

.npmignore

@@ -0,0 +1,3 @@
+node_modules
+examples
+bower.json

CanvasTextWrapper.js

@@ -1,3 +1,10 @@
+/*! CanvasTextWrapper
+ *  https://github.com/namniak/CanvasTextWrapper
+ *  Version:  0.4.0
+ *  MIT License (http://www.opensource.org/licenses/mit-license.html)
+ */
+
+
 (function (root) {
 
 	function CanvasTextWrapper(canvas, text, options) {

CanvasTextWrapper.min.js

@@ -0,0 +1,6 @@
+/*! CanvasTextWrapper
+ *  https://github.com/namniak/CanvasTextWrapper
+ *  Version:  0.4.0
+ *  MIT License (http://www.opensource.org/licenses/mit-license.html)
+ */
+!function(a){function b(a,b,c){"use strict";function d(){t=q.font.match(/\d+(px|em|%)/g)?+q.font.match(/\d+(px|em|%)/g)[0].match(/\d+/g):18,u=0,v=[],w=[],x={x:0,y:0},f(t),g(),o(),e()}function e(){if(q.sizeToFill){var a=b.trim().split(/\s+/).length,c=0;do f(++c),y=c,h();while(C>u&&v.join(" ").split(/\s+/).length==a);f(--c),y=c,h()}else h();q.justifyLines&&"auto"===q.lineBreak&&k(),n(),l()}function f(a){var b=q.sizeToFill?s.font.split(/\b\d+px\b/i):q.font.split(/\b\d+px\b/i);s.font=b[0]+a+"px"+b[1]}function g(){isNaN(q.lineHeight)?-1!==q.lineHeight.toString().indexOf("px")?y=parseInt(q.lineHeight):-1!==q.lineHeight.toString().indexOf("%")&&(y=parseInt(q.lineHeight)/100*t):y=t*q.lineHeight}function h(){if(q.allowNewLine)for(var a=b.trim().split("\n"),c=0,d=0;c<a.length-1;c++)d+=a[c].trim().split(/\s+/).length,w.push(d);var e=b.trim().split(/\s+/);i(e),j(e),u=v.length*y}function i(a){for(var b,c,d,e,f=0;f<a.length;f++)if(b="",c=s.measureText(a[f]).width,c>B){for(var g=0;s.measureText(b+a[f][g]).width<=B&&g<a[f].length;g++)b+=a[f][g];d=a[f].slice(0,g),e=a[f].slice(g),a.splice(f,1,d,e)}}function j(a){for(var b=0,c=0;b<a.length;c++)if(v[c]="","auto"===q.lineBreak){for(;s.measureText(v[c]+a[b]).width<=B&&b<a.length;)if(v[c]+=a[b]+" ",b++,q.allowNewLine)for(var d=0;d<w.length;d++)if(w[d]===b){c++,v[c]="";break}v[c]=v[c].trim()}else v[c]=a[b],b++}function k(){for(var a,b,c,d=0;d<v.length;d++)c=s.measureText(v[d]).width,(!a||c>a)&&(a=c,b=d);var e,f,g,h,i,j=" ";for(d=0;d<v.length;d++)if(d!==b&&(e=v[d].trim().split(/\s+/).length,!(1>=e))){v[d]=v[d].trim().split(/\s+/).join(j),f=s.measureText(j).width,g=(a-s.measureText(v[d]).width)/f,h=g/(e-1),i="";for(var k=0;h>k;k++)i+=j;v[d]=v[d].trim().split(j).join(i)}}function l(){for(var a=0;a<v.length;a++)m(v[a]),x.y=parseInt(x.y)+y,s.fillText(v[a],x.x,x.y),q.strokeText&&s.strokeText(v[a],x.x,x.y)}function m(a){"center"==q.textAlign?x.x=(z-s.measureText(a).width)/2:"right"==q.textAlign?x.x=z-s.measureText(a).width-q.paddingX:x.x=q.paddingX}function n(){"middle"==q.verticalAlign?x.y=(A-u)/2:"bottom"==q.verticalAlign?x.y=A-u-q.paddingY:x.y=q.paddingY}function o(){if(!(a instanceof HTMLCanvasElement))throw new TypeError("The first parameter must be an instance of HTMLCanvasElement.");if("string"!=typeof b)throw new TypeError("The second parameter must be a string.");if(isNaN(t))throw new TypeError('Cannot parse "font".');if(isNaN(y))throw new TypeError('Cannot parse "lineHeight".');if("left"!==q.textAlign.toLocaleLowerCase()&&"center"!==q.textAlign.toLocaleLowerCase()&&"right"!==q.textAlign.toLocaleLowerCase())throw new TypeError('Property "textAlign" must be set to either "left", "center", or "right".');if("top"!==q.verticalAlign.toLocaleLowerCase()&&"middle"!==q.verticalAlign.toLocaleLowerCase()&&"bottom"!==q.verticalAlign.toLocaleLowerCase())throw new TypeError('Property "verticalAlign" must be set to either "top", "middle", or "bottom".');if("boolean"!=typeof q.justifyLines)throw new TypeError('Property "justifyLines" must be set to a Boolean.');if(isNaN(q.paddingX))throw new TypeError('Property "paddingX" must be set to a Number.');if(isNaN(q.paddingY))throw new TypeError('Property "paddingY" must be set to a Number.');if("boolean"!=typeof q.fitParent)throw new TypeError('Property "fitParent" must be set to a Boolean.');if("auto"!==q.lineBreak.toLocaleLowerCase()&&"word"!==q.lineBreak.toLocaleLowerCase())throw new TypeError('Property "lineBreak" must be set to either "auto" or "word".');if("boolean"!=typeof q.sizeToFill)throw new TypeError('Property "sizeToFill" must be set to a Boolean.');if("boolean"!=typeof q.strokeText)throw new TypeError('Property "strokeText" must be set to a Boolean.')}var p={font:"18px Arial, sans-serif",sizeToFill:!1,lineHeight:1,allowNewLine:!0,lineBreak:"auto",textAlign:"left",verticalAlign:"top",justifyLines:!1,paddingX:0,paddingY:0,fitParent:!1,strokeText:!1},q={};for(var r in p)p.hasOwnProperty(r)&&(q[r]=c&&c[r]?c[r]:p[r]);var s=a.getContext("2d");s.font=q.font,s.textBaseline="bottom";var t,u,v,w,x,y,z=q.fitParent===!1?a.width:a.parentNode.clientWidth,A=q.fitParent===!1?a.height:a.parentNode.clientHeight,B=z-2*q.paddingX,C=A-2*q.paddingY;d()}"module"in a&&"exports"in module?module.exports=b:a.CanvasTextWrapper=b}(this);

Gruntfile.js

@@ -0,0 +1,27 @@
+module.exports = function (grunt) {
+
+    var saveLicense = require('uglify-save-license');
+    // project configuration
+    grunt.initConfig({
+        pkg: grunt.file.readJSON('package.json'),
+
+        uglify: {
+            my_target: {
+                options: {
+                    preserveComments: saveLicense
+                },    
+                src: ['CanvasTextWrapper.js'],
+                dest: 'CanvasTextWrapper.min.js' 
+            }
+        }
+    });
+
+    // load plugins
+    grunt.loadNpmTasks('uglify-save-license');
+    grunt.loadNpmTasks('grunt-contrib-uglify');
+
+    // default tasks.
+    grunt.registerTask('default', [
+        'uglify'
+    ]);
+};

LICENSE.md

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+Copyright (c) 2015 Vadim Namniak
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
+DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
+OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
+OR OTHER DEALINGS IN THE SOFTWARE.

README.md

@@ -0,0 +1,70 @@
+CanvasTextWrapper
+=================
+
+## Syntax
+```
+CanvasTextWrapper(HTMLCanvasElement, String [, options]);
+```
+
+```options``` - is an object with the following available properties and values:
+
+- ```font:``` (String) - text style that includes font size in px, font weight, font family, etc. Similar to CSS font shorthand property
+- ```lineHeight:``` (String or Number) - Number means n times font size where 1 is equivalent to '100%'. Also the property can be set in "%" or "px" using String
+- ```textAlign: "left" | "center" | "right"``` - horizontal alignment of each line
+- ```verticalAlign: "top" | "middle" | "bottom"``` - vertical alignment of the whole text block
+- ```paddingX:``` (Number) - horizontal padding (in px) set equally on both, left and right sides
+- ```paddingY:``` (Number) - vertical padding (in px) set equally on both, top and bottom sides
+- ```fitParent:``` (Boolean) - if enabled, text will fit canvas container's width instead of canvas own width
+- ```lineBreak: "auto" | "word"``` - text split rule. When using ```"auto"```, text goes to a next line on a whole word when there's no more room. If ```"word"``` is set as value, each next word will be placed on a new line.
+- ```sizeToFill:``` (Boolean) - ignore given font size and line height and resize text to fill its padded container
+- ```strokeText:``` (Boolean) - outline text based on context configuration
+- ```justifyLines:``` (Boolean) - if enabled, all lines match the same width with flexed spaces between words (one-word lines are ignored).
+- ```allowNewLine:``` (Boolean) if enabled, the text breaks on every new line character "\n" otherwise it'll be considered as a space
+
+NOTE: if a single word is too long to fit the width with specified font size, it will break on any letter unless ```sizeToFill``` option is enabled.
+
+## Default options
+``` 
+   { 
+        font: "18px Arial, sans-serif",
+        lineHeight: 1,
+        textAlign: "left",
+        verticalAlign: "top",
+        paddingX: 0,
+        paddingY: 0,
+        fitParent: false,
+        lineBreak: "auto",
+        strokeText: false
+        sizeToFill: false,
+        allowNewLine: true,
+        justifyLines: false
+    }
+```
+
+## Usage
+Configure context settings properties such as "fillStyle", "lineWidth" or "strokeStyle" before using CanvasTextWrapper like so:
+
+```
+var CanvasTextWrapper = require('canvas-text-wrapper').CanvasTextWrapper;
+
+var canvas = document.getElementById("#canvasText");
+canvas.width = 200;
+canvas.height = 200;
+context = canvas.getContext("2d");
+context.lineWidth = 2;
+context.strokeStyle = "#ff0000";
+CanvasTextWrapper(canvas,"Hello");    //default options will apply
+```
+
+## Test
+In terminal go to CanvasTextWrapper folder and run ```npm t```
+
+
+## Examples
+[Demo](http://namniak.github.io/CanvasTextWrapper/)
+
+## Installation
+```
+bower install canvas-text-wrapper
+npm i canvas-text-wrapper --save
+```

bower.json

@@ -0,0 +1,18 @@
+{
+  "name": "canvas-text-wrapper",
+  "version": "0.4.4",
+  "ignore": [
+    "**/.*",
+    "**/*.log",
+    "**/*.json",
+    "Gruntfile.js",
+    "examples",
+    "node_modules",
+    "README.md"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/namniak/CanvasTextWrapper.git"
+  },
+  "homepage": "http://namniak.github.io/CanvasTextWrapper/"
+}

css/reset.css

@@ -1,48 +0,0 @@
-/* http://meyerweb.com/eric/tools/css/reset/
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-    margin: 0;
-    padding: 0;
-    border: 0;
-    font-size: 100%;
-    font: inherit;
-    vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-    display: block;
-}
-body {
-    line-height: 1;
-}
-ol, ul {
-    list-style: none;
-}
-blockquote, q {
-    quotes: none;
-}
-blockquote:before, blockquote:after,
-q:before, q:after {
-    content: '';
-    content: none;
-}
-table {
-    border-collapse: collapse;
-    border-spacing: 0;
-}

css/styles.css

@@ -1,159 +0,0 @@
-body {
-    width: 960px;
-    margin: auto;
-    font-family: 'Open Sans', sans-serif;
-    color: #fff;
-    line-height: 140%;
-}
-
-div, header, footer, article {
-    box-sizing: border-box;
-}
-
-header, footer, article {
-    width: 930px;
-    margin: auto;
-    background-color: #3299af;
-    padding: 20px;
-}
-
-header {
-    font-size: 60px;
-    font-weight: 700;
-}
-
-.description {
-    width: 800px;
-    margin-top: 20px;
-    font-size: 22px;
-    font-weight: normal;
-}
-
-footer {
-    margin-top: 40px;
-}
-
-a {
-    font-size: 20px;
-    font-weight: normal;
-    color: #fff;
-    text-decoration: none;
-}
-
-a:hover {
-    text-decoration: underline;
-}
-
-article {
-    border-top: 1px solid #fff;
-}
-
-.white-block {
-    display: table-cell;
-    height: 30px;
-    padding: 20px;
-    vertical-align: middle;
-    background-color: #fff;
-    font-weight: 100;
-    color: #2E6571;
-    line-height: 120%;
-}
-
-pre.white-block {
-    padding-left: 0;
-    padding-bottom: 0;
-}
-
-p {
-    margin: 10px 0;
-    line-height: 120%;
-}
-
-h2 {
-    font-size: 30px;
-    padding-top: 40px;
-}
-
-h2:first-of-type {
-    padding-top: 10px;
-}
-
-h6 {
-    font-weight: 700;
-    text-decoration: underline;
-    display: inline;
-}
-
-.syntax {
-    padding: 10px 10px 0 20px;
-}
-
-.syntax > li {
-    list-style: none;
-    margin-bottom: 15px;
-}
-
-.syntax p {
-    margin-bottom: 0;
-}
-
-.values li {
-    text-indent: 20px;
-    list-style: inside circle;
-    line-height: 120%;
-}
-
-section {
-    margin-top: 40px;
-}
-
-section > div {
-    display: inline-block;
-    position: relative;
-    width: 450px;
-    margin: 15px;
-    border: 1px solid #3299af;
-    overflow: hidden;
-}
-
-section h2 {
-    color: #3299af;
-    text-indent: 30px;
-    margin-bottom: 20px;
-}
-
-section > div div {
-    width: 100%;
-    height: 240px;
-    background-color: #3299af;
-    margin-top: 250px;
-    padding: 20px;
-}
-
-canvas, img {
-    position: absolute;
-    top: 0;
-    left: 0;
-}
-
-img {
-    width: 100%;
-    z-index: -1;
-}
-
-span {
-    margin-left: 20px;
-    margin-right: 5px;
-}
-
-span, .emph {
-    font-weight: 600;
-    display: inline;
-}
-
-strong {
-    background: #fff;
-    color: #3299af;
-    font-weight: bold;
-    padding: 0 5px;
-}

index.html

@@ -1,160 +0,0 @@
-<!DOCTYPE HTML>
-<html>
-<head>
-    <meta charset="utf-8">
-    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,600' rel='stylesheet' type='text/css'>
-    <link rel="stylesheet" href="css/reset.css">
-    <link rel="stylesheet" href="css/styles.css">
-    <script src="js/CanvasTextWrapper.js"></script>
-    <script src="js/options.js"></script>
-    <script src="js/examples.js"></script>
-    <title>CanvasTextWrapper</title>
-</head>
-<body>
-<header>
-    <p>CanvasTextWrapper</p>
-
-    <p class="description">
-        Pure JavaScript canvas text wrapper that automatically splits a string into lines on specified rule with
-        alignment and padding.
-    </p>
-</header>
-<article>
-    <h2>Syntax</h2><br/>
-
-    <p class="white-block">CanvasTextWrapper(HTMLCanvasElement, String [, Options]);</p><br/>
-
-    <div>
-        <div class="emph">Options</div>
-        - is an object with the following available properties and values:
-    </div>
-    <ul class="syntax">
-        <li>
-            <div class="emph">font</div>
-            (String) - text style that includes font size in px, weight, font family, etc. Similar to CSS font shorthand
-            property
-        </li>
-        <li>
-            <div class="emph">lineHeight</div>
-            (Number or String)
-            <ul class="values">
-                <li>number - n times font size where 1 is equivalent to '100%'</li>
-                <li>"%"</li>
-                <li>"px"</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">textAlign</div>
-            (String) - horizontal alignment of each line
-            <ul class="values">
-                <li>"left"</li>
-                <li>"center"</li>
-                <li>"right"</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">verticalAlign</div>
-            (String) - vertical alignment of the whole text block
-            <ul class="values">
-                <li>"top"</li>
-                <li>"middle"</li>
-                <li>"bottom"</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">paddingX</div>
-            (Number) - horizontal padding (in px) set equally on both, left and right sides
-        </li>
-        <li>
-            <div class="emph">paddingY</div>
-            (Number) - vertical padding (in px) set equally on both, top and bottom sides
-        </li>
-        <li>
-            <div class="emph">fitParent</div>
-            (Boolean) - parameter that controls which element to fit
-            <ul class="values">
-                <li>true - fit canvas parent's width instead of canvas own width</li>
-                <li>false - fit canvas width</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">lineBreak</div>
-            (String) - text split rule
-            <ul class="values">
-                <li>"auto" - text fills padded container going to a next line on a whole word</li>
-                <li>"word" - each next word will be placed on a new line</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">sizeToFill</div>
-            (Boolean) - auto font size to fill text container
-            <ul class="values">
-                <li>true - ignore given font size/line height and resize text to fill its padded container</li>
-                <li>false - use specified or default font size</li>
-            </ul>
-        </li>
-        <li>
-            <div class="emph">strokeText</div>
-            (Boolean) - if enabled, all lines match the same width with flexed spaces between words (one-word lines are
-            ignored)
-        </li>
-        <li>
-            <div class="emph">justifyLines</div>
-            (Boolean) - if enabled, text breaks on every new line character "\n"
-        </li>
-        <p>
-            NOTE: if a single word is too long to fit the width with specified font size, it will break on any letter
-            unless "sizeToFill" option is enabled.
-        </p>
-    </ul>
-
-    <h2>Default Options</h2><br/>
-    <pre class="white-block">
-    { 
-        <strong>font</strong>: "18px Arial, sans-serif",
-        <strong>lineHeight</strong>: 1,
-        <strong>textAlign</strong>: "left",
-        <strong>verticalAlign</strong>: "top",
-        <strong>paddingX</strong>: 0,
-        <strong>paddingY</strong>: 0,
-        <strong>fitParent</strong>: false,
-        <strong>lineBreak</strong>: "auto",
-        <strong>sizeToFill</strong>: false,
-        <strong>allowNewLine</strong>: true,
-        <strong>justifyLines</strong>: false,
-        <strong>strokeText</strong>: false
-    }
-    </pre>
-
-    <h2>Usage</h2><br/>
-
-    <p>
-        Configure context settings properties such as "fillStyle", "lineWidth" or "strokeStyle" before using
-        CanvasTextWrapper like so:
-    </p>
-
-    <pre class="white-block">
-        var canvas = document.getElementById("#canvasText");
-        canvas.width = 200;
-        canvas.height = 200;
-        context = canvas.getContext("2d");
-        context.lineWidth = 2;
-        context.strokeStyle = "#ff0000";
-        CanvasTextWrapper(canvas,"Hello");    //default options will apply
-    </pre>
-
-    <h2>Installation</h2><br/>
-
-    <p class="white-block">
-        bower install canvas-text-wrapper<br/>
-        npm install canvas-text-wrapper
-    </p>
-</article>
-<section>
-    <h2>Examples</h2>
-</section>
-<footer>
-    &larr;&nbsp;<a href="https://github.com/namniak/CanvasTextWrapper">View on GitHub</a>
-</footer>
-</body>
-</html>

js/examples.js

@@ -1,51 +0,0 @@
-document.onreadystatechange = function() {
-	'use strict';
-	if (document.readyState === 'complete') {
-		(function() {
-			var container = document.getElementsByTagName('section')[0];
-			var w = 448;
-			var h = 250;
-			var options = model;
-
-			createExamples();
-
-			function createExamples() {
-				var fragment = new DocumentFragment();
-				var context;
-
-				for (var i = 0; i < options.length; i++) {
-					var exampleItem = document.createElement('div');
-					fragment.appendChild(exampleItem);
-
-					var canvas = document.createElement('canvas');
-					exampleItem.appendChild(canvas);
-					canvas.width = w;
-					canvas.height = h;
-					context = canvas.getContext('2d');
-					context.lineWidth = 1;
-					context.strokeStyle = 'yellow';
-					CanvasTextWrapper(canvas,(options[i].txt),options[i]);
-
-					var hint = document.createElement('div');
-					exampleItem.appendChild(hint);
-					var optionsData = '';
-
-					for (var property in options[i]) {
-						if (options[i].hasOwnProperty(property)) {
-							if (property == 'txt') continue;
-							var stringWrapper = (property == 'paddingX' || property == 'paddingY' || property == 'sizeToFill' || property === 'justifyLines' || property === 'allowNewLine' || property === 'strokeText') ? '' : '"';
-							optionsData += '         <span>' + property + ':</span> ' +
-							stringWrapper + options[i][property] + stringWrapper + ',<br/>';
-						}
-					}
-
-					hint.innerHTML = '<h6>CODE:</h6><p>' +
-					'CanvasTextWrapper(canvas, str, {<br/>' + optionsData + '});' +
-					'</p>';
-				}
-
-				container.appendChild(fragment);
-			}
-		})();
-	}
-};

js/options.js

@@ -1,47 +0,0 @@
-var model = [
-	{
-		txt: 'Break text on every next word',
-		font: 'italic 800 25px Arial, sans-serif',
-		textAlign: 'center',
-		lineBreak: 'word',
-		lineHeight: "160%"
-	},
-	{
-		txt: 'Center text block horizontally and vertically',
-		font: 'bold 35px Arial, sans-serif',
-		textAlign: 'center',
-		verticalAlign: 'middle'
-	},
-	{
-		txt: 'Resize text automatically to fill its padded container. Given "font" and "lineHeight" properties are ignored',
-		textAlign: 'center',
-		verticalAlign: 'middle',
-		sizeToFill: true,
-		paddingX: 10,
-		paddingY: 30
-	},
-	{
-		txt: 'Justify text lines takes effect only with "auto" break line. Single word lines are skipped',
-		font: 'bold 40px Arial, sans-serif',
-		paddingX: 20,
-		paddingY: 20,
-		verticalAlign: 'middle',
-		textAlign: 'center',
-		justifyLines: true
-	},
-	{
-		txt: 'Apply text stroke is based on context settings',
-		font: 'bold 40px Arial, sans-serif',
-		textAlign: 'right',
-		paddingX: 25,
-		strokeText: true,
-		lineHeight: '60px'
-	},
-	{
-		txt: 'Use\n new line character "\\n"\n to break lines\nwhere needed',
-		font: 'bold 30px Arial, sans-serif',
-		verticalAlign: 'bottom',
-		allowNewLine: true,
-		lineHeight: '200%'
-	}
-];

package.json

@@ -0,0 +1,24 @@
+{
+  "name": "canvas-text-wrapper",
+  "description": "Pure JavaScript canvas text wrapper that automatically splits a string into lines on specified rule with alignment and padding.",
+  "version": "0.4.4",
+  "license": "MIT",
+  "main": "CanvasTextWrapper.min.js",
+  "keywords": ["canvas", "canvas text", " text", "split"],
+  "homepage": "http://namniak.github.io/CanvasTextWrapper/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/namniak/CanvasTextWrapper"
+  },
+  "author": "Vadim Namniak <vnamnyak@gmail.com> (https://github.com/namniak)",
+  "bugs": {
+    "url": "https://github.com/namniak/CanvasTextWrapper/issues"
+  },
+  "scripts": {
+    "test": "beefy test/test.js --live --open"
+  },
+  "devDependencies": {
+    "grunt-contrib-uglify": "^0.9.1",
+    "uglify-save-license": "^0.4.1"
+  }
+}

test/test.js

@@ -0,0 +1,29 @@
+var CanvasTextWrapper = require('../CanvasTextWrapper').CanvasTextWrapper;
+
+var body = document.getElementsByTagName('body')[0];
+body.style.margin = 0;
+
+var canvas = document.createElement('canvas');
+canvas.width = 600;
+canvas.height = 600;
+canvas.style.position = 'absolute';
+canvas.style.left = '50%';
+canvas.style.top = '50%';
+canvas.style.transform = 'translateX(-50%) translateY(-50%)';
+
+body.appendChild(canvas);
+
+var ctx = canvas.getContext('2d');
+var gradient = ctx.createLinearGradient(0, 0, canvas.width, 0);
+gradient.addColorStop('0.2', 'magenta');
+gradient.addColorStop('0.5', 'blue');
+gradient.addColorStop('0.7', 'purple');
+ctx.fillStyle = gradient;
+
+var opts = {
+	sizeToFill: true,
+	textAlign: 'center',
+	verticalAlign: 'middle'
+};
+
+CanvasTextWrapper(canvas, 'What an awesome library!', opts);