slide-selector 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +15 -3
  3. data/lib/slide/selector.rb +19 -8
  4. data/lib/slide/selector/core/version.rb +1 -1
  5. data/slide-selector.gemspec +3 -1
  6. data/vendor/assets/javascripts/slide-selector.js +39 -31
  7. data/vendor/assets/stylesheets/slide-selector.scss +1 -1
  8. metadata +4 -4
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: a86df4775a057eaa276d38f526ee883b17ab837bc79b6473c24168245d746887
4
- data.tar.gz: ee471026758480ffa340b78eb6b7b18a148bba3fa9b8d3e4db054184993da8b0
3
+ metadata.gz: 6ca79a64503e171a4aa6ee21cd13e844a23ca47e3cd3fe4b9935f2333a731795
4
+ data.tar.gz: e636988b7b3e50fcf9b49d38f562f51b8e3e1468d88a8472c8edcf883ef65ea3
5
5
  SHA512:
6
- metadata.gz: 47e3d51df0d90ec3bd88ec9e5f2ca2fbce979c1270418c2e6748e49745f01e6eef5bec37d4db07c5747797bffe65af2f783e9281dc13f117eacb01c4d04ec28e
7
- data.tar.gz: 26b53206704e434441af0549896fe407c89e0b1d2389b807f9173beb2a6afd3e8c239e94f6ebf97d2f3ad03edef6916a7c1e2b39329ca5c57eac9224a6446c66
6
+ metadata.gz: 98551654ae619075b61d9377b942bb10a9095093d1b8683fc7b80352a775b67303cf0c99224fea0b9ef7bf2700040b0ea7a43104c0a869303769077dce205b7c
7
+ data.tar.gz: 270dc5c230601ee8edfffa5ebad23f850243a409a0eb05f2be65f4f0111a257e8890b9e774346561b10bdce35dda3d15033f6973856f9d6450c0dcc170520d84
data/README.md CHANGED
@@ -31,14 +31,26 @@ Some examples of using this tag
31
31
  With form:
32
32
  ```
33
33
  <%= form_for root_path do |f| %>
34
- <%= f.slide_selector [:min_rank, :max_rank], [0, 100], drop_down_options, type: 'amount', selector: false, slider_step: 5 %>
34
+ <%= f.slide_selector [:min_rank, :max_rank], [0, 100], drop_down_options_dollar, type: 'amount', selector: false, slider_step: 5 %>
35
35
  <br><br>
36
- <%= f.slide_selector [:min_rank2, :max_rank2], [0, 10000], drop_down_options2 %>
36
+ <%= f.slide_selector [:min_rank2, :max_rank2], [0, 10000], drop_down_options %>
37
37
  <% end %>
38
38
  ```
39
39
  Without form:
40
40
  ```
41
- <%= slide_selector_tag [:min_rank3, :max_rank3], [0, 10000], drop_down_options2 %>
41
+ <%= slide_selector_tag [:min_rank3, :max_rank3], [0, 10000], drop_down_options %>
42
+ ```
43
+
44
+ In application_helper.rb
45
+ ```
46
+ module ApplicationHelper
47
+ def drop_down_options
48
+ {"$0.01" => 1, "$0.50" => 50, "$1" => 100, "$2" => 200, "$3" => 300, "$4" => 400, "$5" => 500, "$10" => 1000, "$15" => 1500, "$25" => 2500, "$50" => 5000, "$75" => 7500, "$100" => 10000}
49
+ end
50
+ def drop_down_options2
51
+ {"1" => 1, "50" => 50, "100" => 100, "200" => 200, "300" => 300, "400" => 400, "500" => 500, "1000" => 1000, "1500" => 1500, "2500" => 2500, "5000" => 5000, "7500" => 7500, "10000" => 10000}
52
+ end
53
+ end
42
54
  ```
43
55
 
44
56
  ## Development
data/lib/slide/selector.rb CHANGED
@@ -12,27 +12,38 @@ module Slide
12
12
  def slide_selector(selectors, ranges, select_options, options = {})
13
13
  options[:suggestions] = false if options[:suggestions].nil?
14
14
  options[:slider_step] = 1 if options[:slider_step].nil?
15
- options[:value] = [select_options.keys.first, select_options.keys.last] if options[:value].nil?
16
- options[:type] = options[:type] == 'amount' ? '$' : ''
17
15
  options[:selector] = true if options[:selector].nil?
16
+ options[:value] = [select_options.keys.first, select_options.keys.last] if options[:value].nil? && options[:selector]
17
+ options[:type] = options[:type] == 'amount' ? '$' : ''
18
18
  selectors = selectors.map &:to_s
19
+ get_select_field = lambda { |selector, select_type|
20
+ result = self.hidden_field(selector)
21
+ if result.include?('value')
22
+ result = Hash.from_xml(result)['input']
23
+ selected = {result['value'] => result['value']}
24
+ return self.select(selector, options_for_select(select_options.merge(selected), selected.to_a.last))
25
+ else
26
+ selected = select_type == 'min' ? select_options.first : select_options.to_a.last
27
+ return self.select(selector, options_for_select(select_options, selected))
28
+ end
29
+ }
19
30
  (if options[:selector]
20
- select_tag(selectors[0], options_for_select(select_options), value: options[:value][0])
31
+ get_select_field.call(selectors[0], 'min')
21
32
  else
22
- text_field_tag(selectors[0], nil, value: options[:value][0])
33
+ self.text_field(selectors[0])
23
34
  end)+
24
35
  text_field_tag(selectors[0]+'_'+selectors[1], nil, data: {'slider-step': options[:slider_step]})+
25
36
  (if options[:selector]
26
- select_tag(selectors[1], options_for_select(select_options), value: options[:value][1])
37
+ get_select_field.call(selectors[1], 'max')
27
38
  else
28
- text_field_tag(selectors[1], nil, value: options[:value][1])
39
+ self.text_field(selectors[1])
29
40
  end)+
30
41
  generate_script(selectors, ranges, options).html_safe
31
42
  end
32
43
  def generate_script(selectors, ranges, options)
33
44
  return <<-SCRIPT
34
45
  <script type='text/javascript'>
35
- setSlider(#{selectors.map(&:to_s)}, #{ranges.map(&:to_s)}, #{options.to_json}, '#{selectors[0]+'_'+selectors[1]}')
46
+ setSlider(#{selectors.map{ |field_name| object_name.to_s+'_'+field_name.to_s}}, #{ranges.map(&:to_s)}, #{options.to_json}, '#{selectors[0]+'_'+selectors[1]}')
36
47
  </script>
37
48
  SCRIPT
38
49
  end
@@ -43,4 +54,4 @@ module Slide
43
54
  ::ActionView::Base.send :include, Helpers::HelperMethods
44
55
  end
45
56
  end
46
- end
57
+ end
data/lib/slide/selector/core/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  module Slide
2
2
  module Selector
3
- VERSION = "0.1.1"
3
+ VERSION = "0.1.2"
4
4
  end
5
5
  end
data/slide-selector.gemspec CHANGED
@@ -9,10 +9,12 @@ Gem::Specification.new do |spec|
9
9
  spec.email = ["tqr093@gmail.com"]
10
10
 
11
11
  spec.summary = %q{custom input tag with range-slider & text-field type selectors}
12
- spec.description = %q{https://github.com/Touqeer-tqr/custom-form}
12
+ spec.description = %q{https://github.com/Touqeer-tqr/custom-form contains the sample app}
13
13
  spec.homepage = "https://github.com/Touqeer-tqr/slide-selector"
14
14
  spec.license = "MIT"
15
15
 
16
+ spec.required_ruby_version = '>= 2.0.0'
17
+
16
18
  # Prevent pushing this gem to RubyGems.org. To allow pushes either set the 'allowed_push_host'
17
19
  # to allow pushing to a single host or delete this section to allow pushing to any host.
18
20
  # if spec.respond_to?(:metadata)
data/vendor/assets/javascripts/slide-selector.js CHANGED
@@ -2,6 +2,24 @@
2
2
  formatDigits = function(number, type) {
3
3
  return type + number.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');
4
4
  };
5
+ focusListner = function(class_name, type, range){
6
+ $(class_name).focusin(function() {
7
+ var price_new;
8
+ price_new = $(class_name).val().replace(/[$,]/g, '');
9
+ $(class_name).val(price_new);
10
+ }).focusout(function() {
11
+ if ($(class_name).val() != 'Any'){
12
+ var price_new;
13
+ price_new = $(class_name).val().replace(/[$,]/g, '');
14
+ if (price_new == ""){
15
+ $(class_name).val(formatDigits(parseFloat(range), type));
16
+ $(class_name).trigger("input");
17
+ }else{
18
+ $(class_name).val(formatDigits(parseFloat(price_new), type));
19
+ }
20
+ }
21
+ });
22
+ }
5
23
  setOnChangeListner = function(fields, ranges, slider){
6
24
  $('#'+fields[0]).on('select.editable-select', function(e){
7
25
  max = $('#'+fields[1]);
@@ -9,13 +27,13 @@ setOnChangeListner = function(fields, ranges, slider){
9
27
  max = ranges[1];
10
28
  }
11
29
  else{
12
- max = parseFloat(max.val().replace(/\$/g,''));
30
+ max = parseFloat(max.val().replace(/[$,]/g, ''));
13
31
  }
14
32
  min = $('#'+fields[0]);
15
33
  if(min.val() == 'Any'){
16
34
  min = ranges[0]
17
35
  }else{
18
- min = parseFloat(this.value.replace(/\$/g,''))
36
+ min = parseFloat(this.value.replace(/[$,]/g, ''))
19
37
  }
20
38
  slider.setValue([min, max], false, false);
21
39
  });
@@ -24,13 +42,13 @@ setOnChangeListner = function(fields, ranges, slider){
24
42
  if(this.value == 'Any'){
25
43
  max = ranges[1]
26
44
  }else{
27
- max = parseFloat(this.value.replace(/\$/g,''))
45
+ max = parseFloat(this.value.replace(/[$,]/g, ''))
28
46
  }
29
47
  min = $('#', fields[0]);
30
48
  if(min.val() == 'Any'){
31
49
  min = ranges[0]
32
50
  }else{
33
- min = parseFloat($('#'+fields[0]).val().replace(/\$/g,''))
51
+ min = parseFloat($('#'+fields[0]).val().replace(/[$,]/g, ''))
34
52
  }
35
53
  slider.setValue([min, max], false, false);
36
54
  });
@@ -41,12 +59,12 @@ setOnChangeListner = function(fields, ranges, slider){
41
59
  max = ranges[1];
42
60
  }
43
61
  else{
44
- max = parseFloat(max.val().replace(/\$/g,''));
62
+ max = parseFloat(max.val().replace(/[$,]/g, ''));
45
63
  }
46
64
  if(this.value == 'Any' || this.value == ''){
47
65
  min = ranges[0];
48
66
  }else{
49
- min = parseFloat(this.value.replace(/\$/g,''));
67
+ min = parseFloat(this.value.replace(/[$,]/g, ''));
50
68
  }
51
69
  slider.setValue([min, max], false, false);
52
70
  });
@@ -55,13 +73,13 @@ setOnChangeListner = function(fields, ranges, slider){
55
73
  if(this.value == 'Any' || this.value == ''){
56
74
  max = ranges[1]
57
75
  }else{
58
- max = parseFloat(this.value.replace(/\$/g,''))
76
+ max = parseFloat(this.value.replace(/[$,]/g, ''))
59
77
  }
60
78
  min = $('#'+fields[0]);
61
79
  if(min.val() == 'Any' || min.val() == ''){
62
80
  min = ranges[0];
63
81
  }else{
64
- min = parseFloat(min.val().replace(/\$/g,''));
82
+ min = parseFloat(min.val().replace(/[$,]/g, ''));
65
83
  }
66
84
  slider.setValue([min, max], false, false);
67
85
  });
@@ -71,47 +89,37 @@ setSlider = function(selectors, ranges, options, sliderField){
71
89
  $('#'+selectors[0]).editableSelect({filter: options['suggestions']});
72
90
  $('#'+selectors[1]).editableSelect({filter: options['suggestions']});
73
91
  }
74
- if ($('#'+selectors[1]).val() == options['value'][1]){
75
- slideValue = ranges[1];
76
- }
77
- else{
78
- slideValue = $('#'+selectors[1]).val();
92
+ slideMinValue = $('#'+selectors[0]);
93
+ if(slideMinValue.val() == ""){
94
+ slideMinValue.val(ranges[0]);
79
95
  }
80
- if ($('#'+selectors[0]).val() == options['value'][0]){
81
- slideMinValue = ranges[0];
82
- }
83
- else{
84
- slideMinValue = $('#'+selectors[0]).val();
96
+ slideValue = $('#'+selectors[1]);
97
+ if(slideValue.val() == ""){
98
+ slideValue.val(ranges[1]);
85
99
  }
100
+ sliderRange = [parseFloat(slideMinValue.val().replace(/[$,]/g, '')), parseFloat(slideValue.val().replace(/[$,]/g, ''))];
101
+ console.log(sliderRange);
86
102
  mySlider = new Slider('#'+sliderField, {
87
103
  id: 'slider12c',
88
104
  min: parseFloat(ranges[0]),
89
105
  max: parseFloat(ranges[1]),
90
106
  range: true,
91
- value: [parseFloat(slideMinValue.replace('$', '')), parseFloat(slideValue.replace('$', ''))],
107
+ value: sliderRange,
92
108
  tooltip: 'hide'
93
109
  }).on('slide', function(ev) {
94
110
  $('#'+selectors[0]).text(formatDigits(ev[0], options['type']));
95
111
  $('#'+selectors[0]).val(formatDigits(ev[0], options['type']));
96
112
  $('#'+selectors[1]).text(formatDigits(ev[1], options['type']));
97
113
  $('#'+selectors[1]).val(formatDigits(ev[1], options['type']));
98
- if( ev[0] <= ranges[0] ){
99
- $('#'+selectors[0]).val(options['value'][0]);
100
- }
101
- if( ev[1] >= ranges[1] ){
102
- $('#'+selectors[1]).val(options['value'][1]);
103
- }
104
114
  }).on('slideStop', function(ev) {
105
115
  $('#'+selectors[0]).text(formatDigits(ev[0], options['type']));
106
116
  $('#'+selectors[0]).val(formatDigits(ev[0], options['type']));
107
117
  $('#'+selectors[1]).text(formatDigits(ev[1], options['type']));
108
118
  $('#'+selectors[1]).val(formatDigits(ev[1], options['type']));
109
- if( ev[0] <= ranges[0]){
110
- $('#'+selectors[0]).val(options['value'][0]);
111
- }
112
- if( ev[1] >= ranges[1]){
113
- $('#'+selectors[1]).val(options['value'][1]);
114
- }
115
119
  });
120
+ focusListner('#'+selectors[0], options['type'], ranges[0]);
121
+ focusListner('#'+selectors[1], options['type'], ranges[1]);
122
+ $('#'+selectors[0]).blur();
123
+ $('#'+selectors[1]).blur();
116
124
  setOnChangeListner(selectors, ranges, mySlider);
117
125
  }
data/vendor/assets/stylesheets/slide-selector.scss CHANGED
@@ -1,4 +1,4 @@
1
1
  @import "bootstrap-slider.min.css";
2
2
  @import "jquery-editable-select.min.css";
3
3
  .slider.slider-horizontal{ margin: 0 20px; }
4
- .slider-selection{background: #66abff !important;}
4
+ .slider-selection{background: #66ffce !important;}
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: slide-selector
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.1
4
+ version: 0.1.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Touqeer-tqr
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2019-04-10 00:00:00.000000000 Z
11
+ date: 2019-04-15 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -38,7 +38,7 @@ dependencies:
38
38
  - - "~>"
39
39
  - !ruby/object:Gem::Version
40
40
  version: '10.0'
41
- description: https://github.com/Touqeer-tqr/custom-form
41
+ description: https://github.com/Touqeer-tqr/custom-form contains the sample app
42
42
  email:
43
43
  - tqr093@gmail.com
44
44
  executables: []
@@ -77,7 +77,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
77
77
  requirements:
78
78
  - - ">="
79
79
  - !ruby/object:Gem::Version
80
- version: '0'
80
+ version: 2.0.0
81
81
  required_rubygems_version: !ruby/object:Gem::Requirement
82
82
  requirements:
83
83
  - - ">="