ajax-autocomplete-rails 0.1.0 → 0.1.1

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 8ab6a28c74c259650b7cf0aeade1f6115e6b6ba4
4
- data.tar.gz: e664d537de45a62cb1eaf7ac58fe508dd63cb1ff
3
+ metadata.gz: 662a53f76bf349e54971d22699ce2af08f74991a
4
+ data.tar.gz: d01f54ee74fb892406d49486142c5a7b5313f353
5
5
  SHA512:
6
- metadata.gz: 65d80c3d93993e3b91f64a8fdc2e1dcdce9f974f23357f7a345f573bef02e926d81f98eb218b06f91cd83a44b099af3eb7409e837f319a0785d3e822473e6360
7
- data.tar.gz: 3cb01fded3859787419002c61b34d7f2f39940aa21070d6433f5e4da1581afbdf0323958bc2f7375f6e23cad8e1766f4ed08c3d11b1e97b69a31f1f9369d07f8
6
+ metadata.gz: bc12c551a0648ececcf48457850194c0be0a6df10f2efea074df2f84e465ba481167f83791473ad8d14e4dde7a2e7024dad5f42991a1c36b38df174af21da881
7
+ data.tar.gz: fa5b90b652df1e699241ba247f8df1786ad7a5a0fb3cd995c6146ee4a5e8be35b7e17eaee60842ff588b29738cfbcf51ac8030e2d4db8960e69c4b52d2754e99
@@ -10,17 +10,8 @@ Gem::Specification.new do |spec|
10
10
  spec.email = ["meneliktucker@gmail.com"]
11
11
 
12
12
  spec.summary = "Ajax autocompleter"
13
- # spec.description = %q{TODO: Write a longer description or delete this line.}
14
13
  spec.homepage = "https://github.com/mtuck063/ajax-autocomplete-rails"
15
14
 
16
- # Prevent pushing this gem to RubyGems.org by setting 'allowed_push_host', or
17
- # delete this section to allow pushing this gem to any host.
18
- # if spec.respond_to?(:metadata)
19
- # spec.metadata['allowed_push_host'] = "TODO: Set to 'http://mygemserver.com'"
20
- # else
21
- # raise "RubyGems 2.0 or newer is required to protect against public gem pushes."
22
- # end
23
-
24
15
  spec.files = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
25
16
  spec.bindir = "exe"
26
17
  spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
@@ -1,7 +1,7 @@
1
1
  module Ajax
2
2
  module Autocomplete
3
3
  module Rails
4
- VERSION = "0.1.0"
4
+ VERSION = "0.1.1"
5
5
  end
6
6
  end
7
7
  end
@@ -1,9 +1,11 @@
1
1
  (function($) {
2
- "use strict";
2
+ 'use strict';
3
3
 
4
4
  function Autocomplete(options){
5
5
  options = $.extend({
6
- data : null
6
+ callback : null,
7
+ data : [],
8
+ theme : ''
7
9
  }, options);
8
10
 
9
11
  $(this).each(function(){
@@ -42,45 +44,45 @@
42
44
  if(e.which === 40){
43
45
  if($autocomplete.highlighted.length === 0){
44
46
  $autocomplete.highlighted = $autocomplete.dropdown.children().first();
45
- $autocomplete.highlighted.toggleClass("highlighted");
47
+ $autocomplete.highlighted.toggleClass('highlighted');
46
48
  return;
47
49
  }
48
50
 
49
- $autocomplete.highlighted.toggleClass("highlighted");
50
- $autocomplete.highlighted = $autocomplete.highlighted.next().toggleClass("highlighted");
51
+ $autocomplete.highlighted.toggleClass('highlighted');
52
+ $autocomplete.highlighted = $autocomplete.highlighted.next().toggleClass('highlighted');
51
53
  }
52
54
 
53
55
  // ARROW UP
54
56
  if(e.which === 38){
55
57
  if($autocomplete.highlighted.length === 0){
56
58
  $autocomplete.highlighted = $autocomplete.dropdown.children().last();
57
- $autocomplete.highlighted.toggleClass("highlighted");
59
+ $autocomplete.highlighted.toggleClass('highlighted');
58
60
  return;
59
61
  }
60
62
 
61
- $autocomplete.highlighted.toggleClass("highlighted");
62
- $autocomplete.highlighted = $autocomplete.highlighted.prev().toggleClass("highlighted");
63
+ $autocomplete.highlighted.toggleClass('highlighted');
64
+ $autocomplete.highlighted = $autocomplete.highlighted.prev().toggleClass('highlighted');
63
65
  }
64
66
  }
65
67
 
66
68
  $autocomplete.on({
67
69
  'keyup focus click' : function(e){
68
- if([9,13,27,38,40].indexOf(e.which) !== -1 || $autocomplete.val() === "") return;
70
+ if([9,13,27,38,40].indexOf(e.which) !== -1 || $autocomplete.val() === '') return;
69
71
  var autocompleteValue = $autocomplete.val();
70
72
 
71
- if(typeof $autocomplete.options.data === "function"){
72
- $autocomplete.options.data.call($autocomplete, autocompleteValue);
73
+ if(typeof $autocomplete.options.callback === 'function'){
74
+ $autocomplete.options.callback.call($autocomplete, autocompleteValue);
73
75
  }
74
76
  },
75
77
  'open' : function(){
76
- $autocomplete.wrapper.toggleClass('active');
78
+ $autocomplete.wrapper.addClass('active');
77
79
  $autocomplete.active = true;
78
80
  $(document).on('click.close-autocomplete', function(e){
79
81
  if(e.target !== $autocomplete[0] && e.target !== $autocomplete.dropdown[0]) $autocomplete.trigger('close');
80
82
  });
81
83
  },
82
84
  'close' : function(){
83
- $autocomplete.wrapper.toggleClass('active');
85
+ $autocomplete.wrapper.removeClass('active');
84
86
  $autocomplete.active = false;
85
87
  $autocomplete.dropdown.empty();
86
88
  $(document).off('click.close-autocomplete');
@@ -92,13 +94,14 @@
92
94
 
93
95
  $autocomplete.wrap('<div class="autocomplete-wrapper">');
94
96
  $autocomplete.wrapper = $autocomplete.parent();
97
+ $autocomplete.wrapper.addClass($autocomplete.options.theme);
95
98
  $autocomplete.addClass('autocomplete-textfield');
96
99
  $autocomplete.wrapper.append('<ul class="autocomplete-dropdown">');
97
100
  $autocomplete.dropdown = $autocomplete.wrapper.find('.autocomplete-dropdown');
98
101
  },
99
102
  'populate:dropdown' : function(){
100
- var dropdownOptions = "";
101
- $.each($autocomplete.options.results, function(){
103
+ var dropdownOptions = '';
104
+ $.each($autocomplete.options.data, function(){
102
105
  dropdownOptions += '<li>'+ this +'</li>';
103
106
  });
104
107
  $autocomplete.dropdown
@@ -120,12 +123,8 @@
120
123
  $autocomplete[0].dispatchEvent(event);
121
124
  }
122
125
 
123
- $autocomplete.parseData = function(){
124
-
125
- }
126
-
127
126
  $autocomplete.setData = function(data){
128
- $autocomplete.options.results = data;
127
+ $autocomplete.options.data = data;
129
128
  $autocomplete.trigger('populate:dropdown');
130
129
  if(!$autocomplete.active) $autocomplete.trigger('open');
131
130
  }
@@ -0,0 +1,56 @@
1
+ /* BOOTSTRAP AUTOCOMPLETE STYLING */
2
+
3
+ input[type="search"]::-webkit-search-decoration,
4
+ input[type="search"]::-webkit-search-cancel-button,
5
+ input[type="search"]::-webkit-search-results-button,
6
+ input[type="search"]::-webkit-search-results-decoration { display: none; }
7
+
8
+ .bootstrap.autocomplete-wrapper{
9
+ width: 100%;
10
+ position: relative;
11
+ }
12
+
13
+ .bootstrap.autocomplete-wrapper.active .autocomplete-textfield + .autocomplete-dropdown{
14
+ display: block;
15
+ }
16
+
17
+ .bootstrap .autocomplete-textfield{
18
+ box-sizing: border-box;
19
+ }
20
+
21
+ .bootstrap .autocomplete-textfield + .autocomplete-dropdown{
22
+ width: 100%;
23
+ list-style-type: none;
24
+ margin: 0;
25
+ padding: 0;
26
+ box-sizing: border-box;
27
+ border: none;
28
+ position: absolute;
29
+ top: calc(100% - 3px);
30
+ left: 0px;
31
+ border: 1px solid #66afe9;
32
+ border-top: none;
33
+ display: none;
34
+ }
35
+
36
+ .bootstrap .autocomplete-textfield + .autocomplete-dropdown li{
37
+ padding: 6px;
38
+ box-sizing: border-box;
39
+ cursor: pointer;
40
+ font-size: 14px;
41
+ background-color: #fff;
42
+ color: #555;
43
+ }
44
+
45
+ .bootstrap .autocomplete-textfield + .autocomplete-dropdown li:last-child{
46
+ border-bottom-left-radius: 4px;
47
+ border-bottom-right-radius: 4px;
48
+ }
49
+
50
+ .bootstrap .autocomplete-textfield + .autocomplete-dropdown li:hover{
51
+ background-color: #eee;
52
+ }
53
+
54
+ .bootstrap .autocomplete-textfield + .autocomplete-dropdown li.highlighted{
55
+ background-color: #eee;
56
+ }
@@ -0,0 +1,51 @@
1
+ /* FOUNDATION AUTOCOMPLETE STYLING */
2
+
3
+ input[type="search"]::-webkit-search-decoration,
4
+ input[type="search"]::-webkit-search-cancel-button,
5
+ input[type="search"]::-webkit-search-results-button,
6
+ input[type="search"]::-webkit-search-results-decoration { display: none; }
7
+
8
+ .foundation.autocomplete-wrapper{
9
+ width: 100%;
10
+ position: relative;
11
+ }
12
+
13
+ .foundation.autocomplete-wrapper.active .autocomplete-textfield + .autocomplete-dropdown{
14
+ display: block;
15
+ }
16
+
17
+ .foundation .autocomplete-textfield{
18
+ box-sizing: border-box;
19
+ }
20
+
21
+ .foundation .autocomplete-textfield + .autocomplete-dropdown{
22
+ width: 100%;
23
+ list-style-type: none;
24
+ margin: 0;
25
+ padding: 0;
26
+ box-sizing: border-box;
27
+ border: none;
28
+ position: absolute;
29
+ top: calc(100% - 3px);
30
+ left: 0px;
31
+ border: 1px solid #8a8a8a;
32
+ border-top: none;
33
+ display: none;
34
+ }
35
+
36
+ .foundation .autocomplete-textfield + .autocomplete-dropdown li{
37
+ padding: 6px;
38
+ box-sizing: border-box;
39
+ cursor: pointer;
40
+ background-color: #fff;
41
+ color: #0a0a0a;
42
+ font-size: 14px;
43
+ }
44
+
45
+ .foundation .autocomplete-textfield + .autocomplete-dropdown li:hover{
46
+ background-color: #eee;
47
+ }
48
+
49
+ .foundation .autocomplete-textfield + .autocomplete-dropdown li.highlighted{
50
+ background-color: #eee;
51
+ }
@@ -0,0 +1,50 @@
1
+ /* MATERIALIZE AUTOCOMPLETE STYLING */
2
+
3
+ input[type="search"]::-webkit-search-decoration,
4
+ input[type="search"]::-webkit-search-cancel-button,
5
+ input[type="search"]::-webkit-search-results-button,
6
+ input[type="search"]::-webkit-search-results-decoration { display: none; }
7
+
8
+ .materialize.autocomplete-wrapper{
9
+ width: 100%;
10
+ position: relative;
11
+ }
12
+
13
+ .materialize.autocomplete-wrapper.active .autocomplete-textfield + .autocomplete-dropdown{
14
+ display: block;
15
+ }
16
+
17
+ .materialize .autocomplete-textfield{
18
+ box-sizing: border-box;
19
+ }
20
+
21
+ .materialize .autocomplete-textfield + .autocomplete-dropdown{
22
+ width: 100%;
23
+ list-style-type: none;
24
+ margin: 0;
25
+ padding: 0;
26
+ box-sizing: border-box;
27
+ border: none;
28
+ position: absolute;
29
+ top: calc(100% - 14px);
30
+ left: 0px;
31
+ box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
32
+ display: none;
33
+ }
34
+
35
+ .materialize .autocomplete-textfield + .autocomplete-dropdown li{
36
+ padding: 15px 10px;
37
+ box-sizing: border-box;
38
+ cursor: pointer;
39
+ background-color: #fff;
40
+ color: #0a0a0a;
41
+ font-size: 14px;
42
+ }
43
+
44
+ .materialize .autocomplete-textfield + .autocomplete-dropdown li:hover{
45
+ background-color: #eee;
46
+ }
47
+
48
+ .materialize .autocomplete-textfield + .autocomplete-dropdown li.highlighted{
49
+ background-color: #eee;
50
+ }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: ajax-autocomplete-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.0
4
+ version: 0.1.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - mtuck063
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2016-06-17 00:00:00.000000000 Z
11
+ date: 2016-06-19 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -49,12 +49,16 @@ files:
49
49
  - Gemfile
50
50
  - README.md
51
51
  - Rakefile
52
+ - ajax-autocomplete-rails-0.1.0.gem
52
53
  - ajax-autocomplete-rails.gemspec
53
54
  - bin/console
54
55
  - bin/setup
55
56
  - lib/ajax/autocomplete/rails.rb
56
57
  - lib/ajax/autocomplete/rails/version.rb
57
58
  - vendor/assets/javascripts/ajax.autocomplete.js
59
+ - vendor/assets/stylesheets/autocomplete.bootstrap.css
60
+ - vendor/assets/stylesheets/autocomplete.foundation.css
61
+ - vendor/assets/stylesheets/autocomplete.materialize.css
58
62
  homepage: https://github.com/mtuck063/ajax-autocomplete-rails
59
63
  licenses: []
60
64
  metadata: {}