fixed 1st example

This reverts commit 19f8e538f6.

.gitignore

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

.npmignore

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

CanvasTextWrapper.min.js

@@ -1,6 +0,0 @@
-/*! 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}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

@@ -1,27 +0,0 @@
-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

@@ -1,20 +0,0 @@
-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

@@ -1,67 +0,0 @@
-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.
-
-##Defaults
-``` 
-   { 
-        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
-```
-
-##Examples
-http://namniak.github.io/CanvasTextWrapper/
-
-##Installation
-
-```
-bower install canvas-text-wrapper
-
-npm install canvas-text-wrapper
-```

bower.json

@@ -1,18 +0,0 @@
-{
-  "name": "canvas-text-wrapper",
-  "version": "0.4.0",
-  "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

@@ -0,0 +1,48 @@
+/* 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

@@ -0,0 +1,159 @@
+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;
+}

example.html

@@ -1,18 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8"/>
-    <script src="CanvasTextWrapper.js"></script>
-    <script >
-      var ctx = document.createElement('canvas').getContext('2d');
-      ctx.canvas.width = ctx.canvas.height = 200;
-      CanvasTextWrapper(ctx.canvas, "hello world how long can this be????");
-      document.addEventListener('DOMContentLoaded', function () {
-        document.body.appendChild(ctx.canvas);
-      });
-    </script>
-  </head>
-  <body>
-  </body>
-</html>
-

index.html

@@ -0,0 +1,160 @@
+<!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/CanvasTextWrapper.js

@@ -1,10 +1,3 @@
-/*! 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) {
@@ -73,6 +66,7 @@
 
 				setFont(--fontSize);
 				lineHeight = fontSize;
+				wrap();
 			} else {
 				wrap();
 			}

js/examples.js

@@ -0,0 +1,51 @@
+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

@@ -0,0 +1,47 @@
+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

@@ -1,20 +0,0 @@
-{
-  "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.0",
-  "license": "MIT",
-  "main": "CanvasTextWrapper.min.js",
-  "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"
-  },
-  "devDependencies": {
-    "grunt-contrib-uglify": "^0.9.1",
-    "uglify-save-license": "^0.4.1"
-  }
-}