diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..10728c0 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +node_modules/* +test/* +publish.js \ No newline at end of file diff --git a/bower.json b/bower.json index e6dfa05..00b4742 100644 --- a/bower.json +++ b/bower.json @@ -1,16 +1,12 @@ { - "name": "jquery-autosize", - "description": "Automatically adjust textarea height based on user input.", - "version": "1.18.18", - "dependencies": { - "jquery": ">=1.7" - }, + "name": "autosize", + "description": "Autosize is a small, stand-alone script to automatically adjust textarea height to fit text.", + "version": "2.0.0", + "dependencies": {}, "keywords": [ - "form", "textarea", - "ui", - "jQuery", - "jquery-plugin" + "form", + "ui" ], "authors": [ { @@ -19,12 +15,12 @@ "email": "hello@jacklmoore.com" } ], - "licenses": [ - { - "type": "MIT", - "url": "http://www.opensource.org/licenses/mit-license.php" - } - ], + "license": "MIT", "homepage": "http://www.jacklmoore.com/autosize", - "main": "jquery.autosize.js" + "ignore": [], + "repository": { + "type": "git", + "url": "http://github.com/jackmoore/autosize.git" + }, + "main": "dest/autosize.js" } \ No newline at end of file diff --git a/build.js b/build.js new file mode 100644 index 0000000..1bf40d5 --- /dev/null +++ b/build.js @@ -0,0 +1,68 @@ +var pkg = require('./package.json'); +var fs = require('fs'); +var ugly = require("uglify-js"); +var jshint = require("jshint").JSHINT; + +function writeBower() { + var bower = { + name: pkg.config.bower.name, + description: pkg.description, + version: pkg.version, + dependencies: pkg.dependencies, + keywords: pkg.keywords, + authors: [pkg.author], + license: pkg.license, + homepage: pkg.homepage, + ignore: pkg.config.bower.ignore, + repository: pkg.repository, + main: pkg.config.bower.main, + }; + fs.writeFile('bower.json', JSON.stringify(bower, null, '\t')); + return true; +} + +function build(full) { + var mini = ugly.minify(full, {fromString: true}).code; + var header = [ + "/*!", + " "+pkg.config.title+" "+pkg.version, + " license: MIT", + " "+pkg.homepage, + "*/", + "" + ].join("\n"); + + fs.writeFile('dest/'+pkg.config.fileName+'.js', header+full); + fs.writeFile('dest/'+pkg.config.fileName+'.min.js', header+mini); + + return true; +} + +function lint(full) { + jshint(full.toString(), { + browser: true, + undef: true, + unused: true, + immed: true, + eqeqeq: true, + eqnull: true, + noarg: true, + predef: ['define', 'module'] + }); + + if (jshint.errors.length) { + jshint.errors.forEach(function (err) { + console.log(err.line+':'+err.character+' '+err.reason); + }); + } else { + return true; + } +} + +fs.readFile('src/'+pkg.config.fileName+'.js', 'utf8', function (err,data) { + if (err) { + return console.log(err); + } else { + lint(data) && build(data) && writeBower(); + } +}); \ No newline at end of file diff --git a/changelog.md b/changelog.md new file mode 100644 index 0000000..f16c67f --- /dev/null +++ b/changelog.md @@ -0,0 +1,13 @@ +## Changelog + +##### v.2.0.0 - 2015-02-25 + +* smaller, simplier code-base +* new API. Example usage: + + autosize(document.querySelectorAll(textarea)); + +* dropped jQuery dependency +* dropped IE7-IE8 support +* dropped optional parameters +* closes #98, closes #106, closes #123, fixes #129, fixes #132, fixes #139, closes #140, closes #166, closes #168, closes #192, closes #193, closes #197 \ No newline at end of file diff --git a/demo.html b/demo.html deleted file mode 100644 index c2751b6..0000000 --- a/demo.html +++ /dev/null @@ -1,36 +0,0 @@ - - - - - Textarea Autosize Demo - - - - - - - - - - - diff --git a/dest/autosize.js b/dest/autosize.js new file mode 100644 index 0000000..54fe82b --- /dev/null +++ b/dest/autosize.js @@ -0,0 +1,146 @@ +/*! + Autosize 2.0.0 + license: MIT + http://www.jacklmoore.com/autosize +*/ +(function (root, factory) { + 'use strict'; + + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define([], factory); + } else if (typeof exports === 'object') { + // Node. Does not work with strict CommonJS, but + // only CommonJS-like environments that support module.exports, + // like Node. + module.exports = factory(); + } else { + // Browser globals (root is window) + root.autosize = factory(); + } +}(this, function () { + function main(ta) { + if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || ta.hasAttribute('data-autosize-on')) { return; } + + var maxHeight; + var heightOffset; + + function init() { + var style = window.getComputedStyle(ta, null); + + if (style.resize === 'vertical') { + ta.style.resize = 'none'; + } else if (style.resize === 'both') { + ta.style.resize = 'horizontal'; + } + + // horizontal overflow is hidden, so break-word is necessary for handling words longer than the textarea width + ta.style.wordWrap = 'break-word'; + + // Chrome/Safari-specific fix: + // When the textarea y-overflow is hidden, Chrome/Safari doesn't reflow the text to account for the space + // made available by removing the scrollbar. This workaround will cause the text to reflow. + var width = ta.style.width; + ta.style.width = '0px'; + // Force reflow: + /* jshint ignore:start */ + ta.offsetWidth; + /* jshint ignore:end */ + ta.style.width = width; + + maxHeight = style.maxHeight !== 'none' ? parseFloat(style.maxHeight) : false; + + if (style.boxSizing === 'content-box') { + heightOffset = -(parseFloat(style.paddingTop)+parseFloat(style.paddingBottom)); + } else { + heightOffset = parseFloat(style.borderTopWidth)+parseFloat(style.borderBottomWidth); + } + + adjust(); + } + + function adjust() { + var startHeight = ta.style.height; + var htmlTop = document.documentElement.scrollTop; + var bodyTop = document.body.scrollTop; + + ta.style.height = 'auto'; + + var endHeight = ta.scrollHeight+heightOffset; + + if (maxHeight !== false && maxHeight < endHeight) { + endHeight = maxHeight; + if (ta.style.overflowY !== 'scroll') { + ta.style.overflowY = 'scroll'; + } + } else if (ta.style.overflowY !== 'hidden') { + ta.style.overflowY = 'hidden'; + } + + ta.style.height = endHeight+'px'; + + // prevents scroll-position jumping + document.documentElement.scrollTop = htmlTop; + document.body.scrollTop = bodyTop; + + if (startHeight !== ta.style.height) { + var evt = document.createEvent('Event'); + evt.initEvent('autosize.resized', true, false); + ta.dispatchEvent(evt); + } + } + + // IE9 does not fire onpropertychange or oninput for deletions, + // so binding to onkeyup to catch most of those events. + // There is no way that I know of to detect something like 'cut' in IE9. + if ('onpropertychange' in ta && 'oninput' in ta) { + ta.addEventListener('keyup', adjust); + } + + window.addEventListener('resize', adjust); + ta.addEventListener('input', adjust); + + ta.addEventListener('autosize.update', adjust); + + ta.addEventListener('autosize.destroy', function(style){ + window.removeEventListener('resize', adjust); + ta.removeEventListener('input', adjust); + ta.removeEventListener('keyup', adjust); + ta.removeEventListener('autosize.destroy'); + + Object.keys(style).forEach(function(key){ + ta.style[key] = style[key]; + }); + + ta.removeAttribute('data-autosize-on'); + }.bind(ta, { + height: ta.style.height, + overflow: ta.style.overflow, + overflowY: ta.style.overflowY, + wordWrap: ta.style.wordWrap, + resize: ta.style.resize + })); + + ta.setAttribute('data-autosize-on', true); + ta.style.overflow = 'hidden'; + ta.style.overflowY = 'hidden'; + + init(); + } + + // Do nothing in IE8 or lower + if (typeof window.getComputedStyle !== 'function') { + return function(elements) { + return elements; + }; + } else { + return function(elements) { + if (elements && elements.length) { + Array.prototype.forEach.call(elements, main); + } else if (elements && elements.nodeName) { + main(elements); + } + return elements; + }; + } +})); diff --git a/dest/autosize.min.js b/dest/autosize.min.js new file mode 100644 index 0000000..c289310 --- /dev/null +++ b/dest/autosize.min.js @@ -0,0 +1,6 @@ +/*! + Autosize 2.0.0 + license: MIT + http://www.jacklmoore.com/autosize +*/ +!function(e,t){"use strict";"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?module.exports=t():e.autosize=t()}(this,function(){function e(e){function t(){var t=window.getComputedStyle(e,null);"vertical"===t.resize?e.style.resize="none":"both"===t.resize&&(e.style.resize="horizontal"),e.style.wordWrap="break-word";var i=e.style.width;e.style.width="0px",e.offsetWidth,e.style.width=i,n="none"!==t.maxHeight?parseFloat(t.maxHeight):!1,r="content-box"===t.boxSizing?-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)):parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth),o()}function o(){var t=e.style.height,o=document.documentElement.scrollTop,i=document.body.scrollTop;e.style.height="auto";var s=e.scrollHeight+r;if(n!==!1&&s>n?(s=n,"scroll"!==e.style.overflowY&&(e.style.overflowY="scroll")):"hidden"!==e.style.overflowY&&(e.style.overflowY="hidden"),e.style.height=s+"px",document.documentElement.scrollTop=o,document.body.scrollTop=i,t!==e.style.height){var d=document.createEvent("Event");d.initEvent("autosize.resized",!0,!1),e.dispatchEvent(d)}}if(e&&e.nodeName&&"TEXTAREA"===e.nodeName&&!e.hasAttribute("data-autosize-on")){var n,r;"onpropertychange"in e&&"oninput"in e&&e.addEventListener("keyup",o),window.addEventListener("resize",o),e.addEventListener("input",o),e.addEventListener("autosize.update",o),e.addEventListener("autosize.destroy",function(t){window.removeEventListener("resize",o),e.removeEventListener("input",o),e.removeEventListener("keyup",o),e.removeEventListener("autosize.destroy"),Object.keys(t).forEach(function(o){e.style[o]=t[o]}),e.removeAttribute("data-autosize-on")}.bind(e,{height:e.style.height,overflow:e.style.overflow,overflowY:e.style.overflowY,wordWrap:e.style.wordWrap,resize:e.style.resize})),e.setAttribute("data-autosize-on",!0),e.style.overflow="hidden",e.style.overflowY="hidden",t()}}return"function"!=typeof window.getComputedStyle?function(e){return e}:function(t){return t&&t.length?Array.prototype.forEach.call(t,e):t&&t.nodeName&&e(t),t}}); \ No newline at end of file diff --git a/example/index.html b/example/index.html new file mode 100644 index 0000000..5f5e199 --- /dev/null +++ b/example/index.html @@ -0,0 +1,25 @@ + + + + + Simple Autosize for textareas + + + +

max-height 300px

+ + +

no max-height

+ + + + + diff --git a/jquery.autosize.js b/jquery.autosize.js deleted file mode 100644 index 4e96699..0000000 --- a/jquery.autosize.js +++ /dev/null @@ -1,273 +0,0 @@ -/*! - Autosize 1.18.18 - license: MIT - http://www.jacklmoore.com/autosize -*/ -(function ($) { - var - defaults = { - className: 'autosizejs', - id: 'autosizejs', - append: '\n', - callback: false, - resizeDelay: 10, - placeholder: true - }, - - // line-height is conditionally included because IE7/IE8/old Opera do not return the correct value. - typographyStyles = [ - 'fontFamily', - 'fontSize', - 'fontWeight', - 'fontStyle', - 'letterSpacing', - 'textTransform', - 'wordSpacing', - 'textIndent', - 'whiteSpace' - ], - - // to keep track which textarea is being mirrored when adjust() is called. - mirrored, - - // the mirror element, which is used to calculate what size the mirrored element should be. - mirror = $('