center_image_tag 0.0.3 → 0.0.4
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.
- checksums.yaml +8 -8
- data/lib/center_image_tag/version.rb +1 -1
- data/lib/center_image_tag/view_helper.rb +35 -0
- data/spec/view_helper_spec.rb +66 -15
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,15 +1,15 @@
|
|
1
1
|
---
|
2
2
|
!binary "U0hBMQ==":
|
3
3
|
metadata.gz: !binary |-
|
4
|
-
|
4
|
+
NjYyOTdmZGU4NDRkNjhkYmExNzBlZDNjNGI3YzYzYzE2NjBlNjExMQ==
|
5
5
|
data.tar.gz: !binary |-
|
6
|
-
|
6
|
+
NGI4OGNjZWQzZWZlNjlhYzEwYzk0MDYxODVkYjk1M2Q2NzNiOTA4ZA==
|
7
7
|
SHA512:
|
8
8
|
metadata.gz: !binary |-
|
9
|
-
|
10
|
-
|
11
|
-
|
9
|
+
ZjQ2MmY3NDkyODFmMWE2YzhkOGU4N2YzN2Q1N2FhM2FjODI5NDdjNDFhYjBm
|
10
|
+
ZDM0ZWE1YTlkZjUwMDI5NGFmYjZlMTZjY2Y1NzVkZTVjOTVlNTAyOWEwYjhh
|
11
|
+
YzE1MWI2MTk5ZWRlNDlmOTU0OWFiNWFlYmY2YzRkMGZkMDQyMTI=
|
12
12
|
data.tar.gz: !binary |-
|
13
|
-
|
14
|
-
|
15
|
-
|
13
|
+
ZjA2MjZmZThmOWNjM2JkZDQwMDhhOGI2NDQ3MzdkNDA0NGU2MGI2NDQ3OWRk
|
14
|
+
N2FkODlkNTM4YWI1ZDFiMjg1Y2Q0ZDg0YWNlMDZlYmIzOWNiM2VhZGY2NDNi
|
15
|
+
YzIzMWI3ZWQ0ZGZlMmMwZWY1OTc2MzFjNDZjNzMzN2RmOTZkM2U=
|
@@ -14,6 +14,16 @@ module CenterImageTag
|
|
14
14
|
tag(:span, class: "vertical-align")
|
15
15
|
end
|
16
16
|
end
|
17
|
+
else
|
18
|
+
width, height = dimension(options)
|
19
|
+
if width && height
|
20
|
+
return container_fixed width, height do
|
21
|
+
clip do
|
22
|
+
image_tag(source, rebuild_options(options, width, height)) +
|
23
|
+
tag(:span, class: "vertical-align")
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
17
27
|
end
|
18
28
|
|
19
29
|
image_tag(source, options)
|
@@ -26,15 +36,40 @@ module CenterImageTag
|
|
26
36
|
end
|
27
37
|
end
|
28
38
|
|
39
|
+
def container_fixed(width, height, &block)
|
40
|
+
div class: "standard-thumb", style: "width: #{width}px" do
|
41
|
+
div class: "thumb-default", style: "padding-bottom: #{height}px", &block
|
42
|
+
end
|
43
|
+
end
|
44
|
+
|
29
45
|
def clip(&block)
|
30
46
|
div class: "thumb-clip" do
|
31
47
|
div class: "thumb-clip-inner", &block
|
32
48
|
end
|
33
49
|
end
|
34
50
|
|
51
|
+
def dimension(options)
|
52
|
+
if size = options[:size]
|
53
|
+
width, height = size.split("x") if size =~ %r{\A\d+x\d+\z}
|
54
|
+
width = height = size if size =~ %r{\A\d+\z}
|
55
|
+
else
|
56
|
+
width = options[:width]
|
57
|
+
height = options[:height]
|
58
|
+
end
|
59
|
+
|
60
|
+
[width, height]
|
61
|
+
end
|
62
|
+
|
35
63
|
def div(options = {}, &block)
|
36
64
|
content_tag :div, options, &block
|
37
65
|
end
|
66
|
+
|
67
|
+
def rebuild_options(options, width, height)
|
68
|
+
# rebuild options
|
69
|
+
options.delete(:size)
|
70
|
+
options.delete(:height)
|
71
|
+
options.merge(width: width)
|
72
|
+
end
|
38
73
|
end
|
39
74
|
end
|
40
75
|
|
data/spec/view_helper_spec.rb
CHANGED
@@ -2,25 +2,76 @@ require 'spec_helper'
|
|
2
2
|
|
3
3
|
module CenterImageTag
|
4
4
|
describe ViewHelper do
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
5
|
+
describe 'normal' do
|
6
|
+
it 'renders the image normally if it\'s not fluid or width x height set' do
|
7
|
+
output = View.new.center_image_tag 'image.png'
|
8
|
+
expected = "<img alt=\"Image\" src=\"/images/image.png\" />"
|
9
|
+
expect(output).to eq expected
|
10
|
+
end
|
9
11
|
end
|
10
12
|
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
"<div class=\"thumb-
|
16
|
-
"<div class=\"thumb-clip
|
17
|
-
"<
|
18
|
-
|
13
|
+
describe 'fluid' do
|
14
|
+
it 'renders the fluid image correctly' do
|
15
|
+
output = View.new.center_image_tag 'image.png', fluid: "56.25%"
|
16
|
+
expected = "<div class=\"standard-thumb thumb-fluid\">" +
|
17
|
+
"<div class=\"thumb-default\" style=\"padding-bottom: 56.25%\">" +
|
18
|
+
"<div class=\"thumb-clip\">" +
|
19
|
+
"<div class=\"thumb-clip-inner\">" +
|
20
|
+
"<img alt=\"Image\" src=\"/images/image.png\" />" +
|
21
|
+
"<span class=\"vertical-align\" />" +
|
22
|
+
"</div>" +
|
19
23
|
"</div>" +
|
20
24
|
"</div>" +
|
21
|
-
"</div>"
|
22
|
-
|
23
|
-
|
25
|
+
"</div>"
|
26
|
+
expect(output).to eq expected
|
27
|
+
end
|
28
|
+
end
|
29
|
+
|
30
|
+
describe 'fixed' do
|
31
|
+
it 'renders the fixed image correctly from size options (size = widthxheight)' do
|
32
|
+
output = View.new.center_image_tag 'image.png', size: "200x100"
|
33
|
+
expected = "<div class=\"standard-thumb\" style=\"width: 200px\">" +
|
34
|
+
"<div class=\"thumb-default\" style=\"padding-bottom: 100px\">" +
|
35
|
+
"<div class=\"thumb-clip\">" +
|
36
|
+
"<div class=\"thumb-clip-inner\">" +
|
37
|
+
"<img alt=\"Image\" src=\"/images/image.png\" width=\"200\" />" +
|
38
|
+
"<span class=\"vertical-align\" />" +
|
39
|
+
"</div>" +
|
40
|
+
"</div>" +
|
41
|
+
"</div>" +
|
42
|
+
"</div>"
|
43
|
+
expect(output).to eq expected
|
44
|
+
end
|
45
|
+
|
46
|
+
it 'renders the fixed image correctly from size options (single size value)' do
|
47
|
+
output = View.new.center_image_tag 'image.png', size: "200"
|
48
|
+
expected = "<div class=\"standard-thumb\" style=\"width: 200px\">" +
|
49
|
+
"<div class=\"thumb-default\" style=\"padding-bottom: 200px\">" +
|
50
|
+
"<div class=\"thumb-clip\">" +
|
51
|
+
"<div class=\"thumb-clip-inner\">" +
|
52
|
+
"<img alt=\"Image\" src=\"/images/image.png\" width=\"200\" />" +
|
53
|
+
"<span class=\"vertical-align\" />" +
|
54
|
+
"</div>" +
|
55
|
+
"</div>" +
|
56
|
+
"</div>" +
|
57
|
+
"</div>"
|
58
|
+
expect(output).to eq expected
|
59
|
+
end
|
60
|
+
|
61
|
+
it 'renders the fixed image correctly from width and height options' do
|
62
|
+
output = View.new.center_image_tag 'image.png', width: "200", height: 100
|
63
|
+
expected = "<div class=\"standard-thumb\" style=\"width: 200px\">" +
|
64
|
+
"<div class=\"thumb-default\" style=\"padding-bottom: 100px\">" +
|
65
|
+
"<div class=\"thumb-clip\">" +
|
66
|
+
"<div class=\"thumb-clip-inner\">" +
|
67
|
+
"<img alt=\"Image\" src=\"/images/image.png\" width=\"200\" />" +
|
68
|
+
"<span class=\"vertical-align\" />" +
|
69
|
+
"</div>" +
|
70
|
+
"</div>" +
|
71
|
+
"</div>" +
|
72
|
+
"</div>"
|
73
|
+
expect(output).to eq expected
|
74
|
+
end
|
24
75
|
end
|
25
76
|
end
|
26
77
|
end
|