retina_image 0.1.0 → 0.2.0
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 +4 -4
- data/README.md +27 -1
- data/lib/retina_image/version.rb +1 -1
- data/lib/retina_image.rb +12 -13
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 273a90d2884d5e32dedd581385f28e92a708d86d
|
|
4
|
+
data.tar.gz: a7cdbbebe7ca9832cfa9a76d698d25861a7afe66
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 74d7d8aa7d54b6fd2cff6d50be1aced40837307dc1e094989724df9b22b8c68efac8656acf57f1fbc2f418623073a8507eb0c2efdaca030543749a0dc84e7b90
|
|
7
|
+
data.tar.gz: 97ae519be08637eea992b27927d54a21dc5223f4b57ee7911ee0dd61e220244c674896216d79770f36a339dbb8d9e2cea08c86bb279f1157d9a14adb576cf74a
|
data/README.md
CHANGED
|
@@ -1,12 +1,38 @@
|
|
|
1
1
|
# RetinaImage
|
|
2
2
|
Retina Image is a simple retina image tag that supports high resolution images using assets pipeline.
|
|
3
|
+
It will find the suitable image for any resolution for you.
|
|
3
4
|
Also, this gem does not override your original image_tag.
|
|
4
5
|
|
|
5
6
|
|
|
6
7
|
## Usage
|
|
8
|
+
Add images as `example_1x.png`, `example_2x.png`, `example_3x.png` to your asset pipeline
|
|
9
|
+
then add below code to your view.
|
|
7
10
|
```ruby
|
|
8
11
|
<%= retina_image_tag 'example.png' %>
|
|
9
12
|
```
|
|
13
|
+
Output
|
|
14
|
+
```html
|
|
15
|
+
<img srcset="/example_1x.png 1x, /example_2x.png 2x, /example_3x.png 3x" alt="Example" src="/example_1x.png">
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
Add other options. For example
|
|
19
|
+
```ruby
|
|
20
|
+
<%= retina_image_tag 'example.png', alt: 'Example Wow' %>
|
|
21
|
+
```
|
|
22
|
+
Output
|
|
23
|
+
```html
|
|
24
|
+
<img srcset="/example_1x.png 1x, /example_2x.png 2x, /example_3x.png 3x" alt="Example Wow" src="/example_1x.png">
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
Disable retina image tag by adding `include_srcsets: false`
|
|
28
|
+
```ruby
|
|
29
|
+
<%= retina_image_tag 'example.png', include_srcsets: false%>
|
|
30
|
+
```
|
|
31
|
+
Output
|
|
32
|
+
```html
|
|
33
|
+
<img src="/example_1x.png" alt="Example" >
|
|
34
|
+
```
|
|
35
|
+
|
|
10
36
|
|
|
11
37
|
## Installation
|
|
12
38
|
Add this line to your application's Gemfile:
|
|
@@ -26,7 +52,7 @@ $ gem install retina_image
|
|
|
26
52
|
```
|
|
27
53
|
|
|
28
54
|
## Contributing
|
|
29
|
-
|
|
55
|
+
Create pull requests. Raise issues.
|
|
30
56
|
|
|
31
57
|
## License
|
|
32
58
|
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
data/lib/retina_image/version.rb
CHANGED
data/lib/retina_image.rb
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
class RetinaImage
|
|
2
2
|
def retina_tag(source, options = {})
|
|
3
3
|
options.reverse_merge!(include_srcsets: true)
|
|
4
4
|
|
|
@@ -12,25 +12,24 @@ module RetinaImage
|
|
|
12
12
|
image_tag(srcset["1x"], options)
|
|
13
13
|
end
|
|
14
14
|
|
|
15
|
-
private def srcset_from_source(source)
|
|
16
|
-
dir, file, extension = split_path(source)
|
|
17
|
-
|
|
18
|
-
(1..3).each_with_object({}) do |i, srcset|
|
|
19
|
-
scale = "#{i}x"
|
|
20
|
-
srcset[scale] = build_image_path(dir, "#{file}_#{scale}#{extension}")
|
|
21
|
-
end
|
|
22
|
-
end
|
|
23
|
-
|
|
24
15
|
private def split_path(source)
|
|
25
16
|
[
|
|
26
17
|
File.dirname(source),
|
|
27
|
-
|
|
18
|
+
filename(source),
|
|
28
19
|
File.extname(source)
|
|
29
20
|
]
|
|
30
21
|
end
|
|
31
22
|
|
|
23
|
+
private def filename(source)
|
|
24
|
+
File.basename(source, '.*')
|
|
25
|
+
end
|
|
26
|
+
|
|
27
|
+
private def alt(source)
|
|
28
|
+
filename(source).titleize
|
|
29
|
+
end
|
|
30
|
+
|
|
32
31
|
private def build_image_path(dirname, filename)
|
|
33
|
-
|
|
34
|
-
image_path(
|
|
32
|
+
path = (dirname == '.' ? filename : File.join(dirname, filename))
|
|
33
|
+
image_path(path)
|
|
35
34
|
end
|
|
36
35
|
end
|