autowidthjs 1.0 → 1.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (6) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +13 -2
  3. data/autowidthjs.gemspec +4 -4
  4. data/lib/autowidthjs/version.rb +1 -1
  5. data/vendor/assets/javascripts/jquery.autowidth.js +53 -61
  6. metadata +15 -13
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 27b22cfa715624c217c513161a641e4da97e0f00
4
- data.tar.gz: 8caa74d5dbb5b77748c762581d84bb339007a692
3
+ metadata.gz: 345c2a8c89751ea94c5f2d1b9d04c9425bcc70c3
4
+ data.tar.gz: d227fb25584fe4dd62a967b6c31d811378ad5539
5
5
  SHA512:
6
- metadata.gz: e1bf3c03a251a1dd2818e83364d1a0eacd9794ccea26dc1738b3a0a3b04ac1ec2609e136c5af913cd7479d8b1506692b1aa9e3520eaf17548d97f91f97aaa84a
7
- data.tar.gz: fad7094e57b86aaaacce33a1b7f30c385d928c7487d6dfd42e3e73bbf5be13e97a1b1e8128e7cd140f04d305caa6399e4751bc68ae09abe641c5bbac0665bea5
6
+ metadata.gz: 4020734cbe4467ec7eced21157a2093509acb05c4cf350d05c70b34b62b130751c16c6c22dc81f230f8c29789a4bfb06308c90f1e2ca54ec6ecbf75e68d4eae7
7
+ data.tar.gz: e2db0d1c6c5f2dd22f18824177d18ece051f6896fa2172c588e6b86cd2dc52ff45945a5422e43a1bd8d90f322c3b2cdc7b78e7bbb8ed0372f4057f7ab6b0577c
data/README.md CHANGED
@@ -1,6 +1,7 @@
1
1
  # Autowidthjs
2
2
 
3
- TODO: Write a gem description
3
+ Automatically adjusts the width of the object *input* to the width of the content.
4
+ DEMO: http://jsbin.com/ahaxe
4
5
 
5
6
  ## Installation
6
7
 
@@ -18,7 +19,17 @@ Or install it yourself as:
18
19
 
19
20
  ## Usage
20
21
 
21
- TODO: Write usage instructions here
22
+ Add to your application.js:
23
+
24
+ //= require jquery.autowidth
25
+
26
+ And to your *.js:
27
+
28
+ $('input#yourinput').autoGrowInput({
29
+ comfortZone: 50, // Zone after text in input
30
+ minWidth: 200, // Minimal input width
31
+ maxWidth: 2000 // Maximal input width
32
+ });
22
33
 
23
34
  ## Contributing
24
35
 
data/autowidthjs.gemspec CHANGED
@@ -6,11 +6,11 @@ require 'autowidthjs/version'
6
6
  Gem::Specification.new do |spec|
7
7
  spec.name = "autowidthjs"
8
8
  spec.version = Autowidthjs::VERSION
9
- spec.authors = ["niki-timofe"]
9
+ spec.authors = ["niki-timofe", "@padolsey"]
10
10
  spec.email = ["niki-timofe@ya.ru"]
11
- spec.description = "Automatically sets input width"
12
- spec.summary = "Automatically sets input width"
13
- spec.homepage = ""
11
+ spec.description = "Automatically adjusts the width of the object *input* to the width of the content."
12
+ spec.summary = "Automatically sets the width of the object *input*."
13
+ spec.homepage = "http://stackoverflow.com/questions/931207/is-there-a-jquery-autogrow-plugin-for-text-fields"
14
14
  spec.license = "MIT"
15
15
 
16
16
  spec.files = `git ls-files`.split($/)
data/lib/autowidthjs/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Autowidthjs
2
- VERSION = "1.0"
2
+ VERSION = "1.1"
3
3
  end
data/vendor/assets/javascripts/jquery.autowidth.js CHANGED
@@ -1,62 +1,54 @@
1
- (function($){
2
-
3
- // jQuery autoGrowInput plugin by James Padolsey
4
- // See related thread: http://stackoverflow.com/questions/931207/is-there-a-jquery-autogrow-plugin-for-text-fields
5
-
6
- $.fn.autoGrowInput = function(o) {
7
-
8
- o = $.extend({
9
- maxWidth: 1000,
10
- minWidth: 0,
11
- comfortZone: 70
12
- }, o);
13
-
14
- this.filter('input:text').each(function(){
15
-
16
- var minWidth = o.minWidth || $(this).width(),
17
- val = '',
18
- input = $(this),
19
- testSubject = $('<tester/>').css({
20
- position: 'absolute',
21
- top: -9999,
22
- left: -9999,
23
- width: 'auto',
24
- fontSize: input.css('fontSize'),
25
- fontFamily: input.css('fontFamily'),
26
- fontWeight: input.css('fontWeight'),
27
- letterSpacing: input.css('letterSpacing'),
28
- whiteSpace: 'nowrap'
29
- }),
30
- check = function() {
31
-
32
- if (val === (val = input.val())) {return;}
33
-
34
- // Enter new content into testSubject
35
- var escaped = val.replace(/&/g, '&amp;').replace(/\s/g,'&nbsp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
36
- testSubject.html(escaped);
37
-
38
- // Calculate new width + whether to change
39
- var testerWidth = testSubject.width(),
40
- newWidth = (testerWidth + o.comfortZone) >= minWidth ? testerWidth + o.comfortZone : minWidth,
41
- currentWidth = input.width(),
42
- isValidWidthChange = (newWidth < currentWidth && newWidth >= minWidth)
43
- || (newWidth > minWidth && newWidth < o.maxWidth);
44
-
45
- // Animate width
46
- if (isValidWidthChange) {
47
- input.width(newWidth);
48
- }
49
-
50
- };
51
-
52
- testSubject.insertAfter(input);
53
-
54
- check();
55
-
56
- });
57
-
58
- return this;
59
-
60
- };
61
-
1
+ // jQuery autoGrowInput plugin by James Padolsey
2
+ // See related thread: http://stackoverflow.com/questions/931207/is-there-a-jquery-autogrow-plugin-for-text-fields
3
+
4
+
5
+ (function($) {
6
+ $.fn.autoGrowInput = function(o) {
7
+ o = $.extend({
8
+ maxWidth: 1000,
9
+ minWidth: 10,
10
+ comfortZone: 0
11
+ }, o);
12
+
13
+ this.filter('input:text').each(function() {
14
+ var minWidth = o.minWidth || $(this).width(),
15
+ val = '',
16
+ input = $(this),
17
+ testSubject = $('<tester/>').css({
18
+ position: 'absolute',
19
+ top: -9999,
20
+ left: -9999,
21
+ width: 'auto',
22
+ fontSize: input.css('fontSize'),
23
+ fontFamily: input.css('fontFamily'),
24
+ fontWeight: input.css('fontWeight'),
25
+ letterSpacing: input.css('letterSpacing'),
26
+ whiteSpace: 'nowrap'
27
+ }),
28
+ check = function() {
29
+ if (val === (val = input.val())) {
30
+ return;
31
+ }
32
+
33
+ // Enter new content into testSubject
34
+ var escaped = val.replace(/&/g, '&amp;').replace(/\s/g, '&nbsp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
35
+ testSubject.html(escaped);
36
+
37
+ // Calculate new width + whether to change
38
+ var testerWidth = testSubject.width(),
39
+ newWidth = (testerWidth + o.comfortZone) >= minWidth ? testerWidth + o.comfortZone : minWidth,
40
+ currentWidth = input.width(),
41
+ isValidWidthChange = (newWidth < currentWidth && newWidth >= minWidth) || (newWidth > minWidth && newWidth < o.maxWidth);
42
+
43
+ // Animate width
44
+ if (isValidWidthChange) {
45
+ input.width(newWidth);
46
+ }
47
+ };
48
+ testSubject.insertAfter(input);
49
+ $(this).bind('keyup keydown blur update', check);
50
+ check();
51
+ });
52
+ return this;
53
+ };
62
54
  })(jQuery);
metadata CHANGED
@@ -1,51 +1,53 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: autowidthjs
3
3
  version: !ruby/object:Gem::Version
4
- version: '1.0'
4
+ version: '1.1'
5
5
  platform: ruby
6
6
  authors:
7
7
  - niki-timofe
8
+ - "@padolsey"
8
9
  autorequire:
9
10
  bindir: bin
10
11
  cert_chain: []
11
- date: 2014-01-25 00:00:00.000000000 Z
12
+ date: 2014-01-27 00:00:00.000000000 Z
12
13
  dependencies:
13
14
  - !ruby/object:Gem::Dependency
14
15
  name: bundler
15
16
  requirement: !ruby/object:Gem::Requirement
16
17
  requirements:
17
- - - ~>
18
+ - - "~>"
18
19
  - !ruby/object:Gem::Version
19
20
  version: '1.3'
20
21
  type: :development
21
22
  prerelease: false
22
23
  version_requirements: !ruby/object:Gem::Requirement
23
24
  requirements:
24
- - - ~>
25
+ - - "~>"
25
26
  - !ruby/object:Gem::Version
26
27
  version: '1.3'
27
28
  - !ruby/object:Gem::Dependency
28
29
  name: rake
29
30
  requirement: !ruby/object:Gem::Requirement
30
31
  requirements:
31
- - - '>='
32
+ - - ">="
32
33
  - !ruby/object:Gem::Version
33
34
  version: '0'
34
35
  type: :development
35
36
  prerelease: false
36
37
  version_requirements: !ruby/object:Gem::Requirement
37
38
  requirements:
38
- - - '>='
39
+ - - ">="
39
40
  - !ruby/object:Gem::Version
40
41
  version: '0'
41
- description: Automatically sets input width
42
+ description: Automatically adjusts the width of the object *input* to the width of
43
+ the content.
42
44
  email:
43
45
  - niki-timofe@ya.ru
44
46
  executables: []
45
47
  extensions: []
46
48
  extra_rdoc_files: []
47
49
  files:
48
- - .gitignore
50
+ - ".gitignore"
49
51
  - Gemfile
50
52
  - LICENSE.txt
51
53
  - README.md
@@ -54,7 +56,7 @@ files:
54
56
  - lib/autowidthjs.rb
55
57
  - lib/autowidthjs/version.rb
56
58
  - vendor/assets/javascripts/jquery.autowidth.js
57
- homepage: ''
59
+ homepage: http://stackoverflow.com/questions/931207/is-there-a-jquery-autogrow-plugin-for-text-fields
58
60
  licenses:
59
61
  - MIT
60
62
  metadata: {}
@@ -64,18 +66,18 @@ require_paths:
64
66
  - lib
65
67
  required_ruby_version: !ruby/object:Gem::Requirement
66
68
  requirements:
67
- - - '>='
69
+ - - ">="
68
70
  - !ruby/object:Gem::Version
69
71
  version: '0'
70
72
  required_rubygems_version: !ruby/object:Gem::Requirement
71
73
  requirements:
72
- - - '>='
74
+ - - ">="
73
75
  - !ruby/object:Gem::Version
74
76
  version: '0'
75
77
  requirements: []
76
78
  rubyforge_project:
77
- rubygems_version: 2.0.5
79
+ rubygems_version: 2.2.1
78
80
  signing_key:
79
81
  specification_version: 4
80
- summary: Automatically sets input width
82
+ summary: Automatically sets the width of the object *input*.
81
83
  test_files: []