responsive_image 0.0.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +15 -0
- data/.gitignore +22 -0
- data/Gemfile +4 -0
- data/LICENSE.txt +22 -0
- data/README.md +29 -0
- data/Rakefile +1 -0
- data/lib/responsive_image.rb +30 -0
- data/lib/responsive_image/helpers.rb +32 -0
- data/lib/responsive_image/railtie.rb +13 -0
- data/lib/responsive_image/version.rb +3 -0
- data/responsive_image.gemspec +23 -0
- data/spec/responsive_image_spec.rb +46 -0
- metadata +100 -0
checksums.yaml
ADDED
@@ -0,0 +1,15 @@
|
|
1
|
+
---
|
2
|
+
!binary "U0hBMQ==":
|
3
|
+
metadata.gz: !binary |-
|
4
|
+
ZmRiNzEwZWFiOGVlNzgxYzU4YTg0MmMxZjkwNTI4ODg4MjFiNTNmMA==
|
5
|
+
data.tar.gz: !binary |-
|
6
|
+
OTk3NTdjNDU3ODczMWVmZTU5ODlhMTFkZjljMzc0ZTllNWIzMDc3Yg==
|
7
|
+
SHA512:
|
8
|
+
metadata.gz: !binary |-
|
9
|
+
ZmIzMDc1MjFlYWUxZGFmMTRiYjMwZjFkMmZjOGNhMGI2ZWVkYjUwODg5YzVl
|
10
|
+
MDlmYjE5NTRlYzc3MzFhM2M5OTI0ODM1NWNlODY1OTFkN2E5MTc3MzUwYWQ2
|
11
|
+
N2IxYWU2YWIwODdkMmVhMGRjMTM1NGNmOTQ0OWZmN2ExZGQ5YmQ=
|
12
|
+
data.tar.gz: !binary |-
|
13
|
+
NDkwMzViYmI5OTgzZTNlNjUzNjc0Mzg1YjNlMTRkZDZhNDg5NTY3NmZlOWMy
|
14
|
+
YTY2N2FjNWFlZDAyZTU4OWZiNDc0YTQ4YTRiYjZjYjczYTJjNmUwYzI4ZTZk
|
15
|
+
ZjAyYWY5YmIwMWE2Y2U1NjhlNjQ1MzY1NzE3YTA3Yjk4Y2Q0ZjE=
|
data/.gitignore
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
*.gem
|
2
|
+
*.rbc
|
3
|
+
.bundle
|
4
|
+
.config
|
5
|
+
.yardoc
|
6
|
+
Gemfile.lock
|
7
|
+
InstalledFiles
|
8
|
+
_yardoc
|
9
|
+
coverage
|
10
|
+
doc/
|
11
|
+
lib/bundler/man
|
12
|
+
pkg
|
13
|
+
rdoc
|
14
|
+
spec/reports
|
15
|
+
test/tmp
|
16
|
+
test/version_tmp
|
17
|
+
tmp
|
18
|
+
*.bundle
|
19
|
+
*.so
|
20
|
+
*.o
|
21
|
+
*.a
|
22
|
+
mkmf.log
|
data/Gemfile
ADDED
data/LICENSE.txt
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Copyright (c) 2014 Robert Lyall
|
2
|
+
|
3
|
+
MIT License
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
6
|
+
a copy of this software and associated documentation files (the
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
11
|
+
the following conditions:
|
12
|
+
|
13
|
+
The above copyright notice and this permission notice shall be
|
14
|
+
included in all copies or substantial portions of the Software.
|
15
|
+
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,29 @@
|
|
1
|
+
# ResponsiveImage
|
2
|
+
|
3
|
+
TODO: Write a gem description
|
4
|
+
|
5
|
+
## Installation
|
6
|
+
|
7
|
+
Add this line to your application's Gemfile:
|
8
|
+
|
9
|
+
gem 'responsive_image'
|
10
|
+
|
11
|
+
And then execute:
|
12
|
+
|
13
|
+
$ bundle
|
14
|
+
|
15
|
+
Or install it yourself as:
|
16
|
+
|
17
|
+
$ gem install responsive_image
|
18
|
+
|
19
|
+
## Usage
|
20
|
+
|
21
|
+
TODO: Write usage instructions here
|
22
|
+
|
23
|
+
## Contributing
|
24
|
+
|
25
|
+
1. Fork it ( https://github.com/rglyall/responsive_image/fork )
|
26
|
+
2. Create your feature branch (`git checkout -b my-new-feature`)
|
27
|
+
3. Commit your changes (`git commit -am 'Add some feature'`)
|
28
|
+
4. Push to the branch (`git push origin my-new-feature`)
|
29
|
+
5. Create a new Pull Request
|
data/Rakefile
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
require "bundler/gem_tasks"
|
@@ -0,0 +1,30 @@
|
|
1
|
+
require "responsive_image/version"
|
2
|
+
|
3
|
+
module ResponsiveImage
|
4
|
+
class << self
|
5
|
+
attr_writer :host
|
6
|
+
attr_writer :media_types
|
7
|
+
|
8
|
+
DEFAULT_HOST = "/"
|
9
|
+
|
10
|
+
DEFAULT_MT_CONFIGURATION = [
|
11
|
+
{ :media_query => "(min-width: 480px)", :filename_suffix => "mobile" },
|
12
|
+
{ :media_query => "(min-width: 480px) and (min-device-pixel-ratio: 2.0)", :filename_suffix => "mobile_2x" },
|
13
|
+
{ :media_query => "(min-width: 768px)", :filename_suffix => "tablet" },
|
14
|
+
{ :media_query => "(min-width: 768px) and (min-device-pixel-ratio: 2.0)", :filename_suffix => "tablet_2x" },
|
15
|
+
{ :media_query => "(min-width: 1024px)", :filename_suffix => "desktop" },
|
16
|
+
{ :media_query => "(min-width: 1024px) and (min-device-pixel-ratio: 2.0)", :filename_suffix => "desktop_2x" }
|
17
|
+
]
|
18
|
+
|
19
|
+
def host
|
20
|
+
@host || DEFAULT_HOST
|
21
|
+
end
|
22
|
+
|
23
|
+
def media_types
|
24
|
+
@media_types || DEFAULT_MT_CONFIGURATION
|
25
|
+
end
|
26
|
+
end
|
27
|
+
end
|
28
|
+
|
29
|
+
require "responsive_image/helpers"
|
30
|
+
require "responsive_image/railtie" if defined?(Rails)
|
@@ -0,0 +1,32 @@
|
|
1
|
+
module ResponsiveImage
|
2
|
+
module Helpers
|
3
|
+
def self.create_picture(image, options = {})
|
4
|
+
extension = File.extname(image)
|
5
|
+
filename = File.basename(image, extension)
|
6
|
+
|
7
|
+
if options[:config]
|
8
|
+
ResponsiveImage.media_types = options[:config]
|
9
|
+
end
|
10
|
+
|
11
|
+
if options[:host]
|
12
|
+
ResponsiveImage.host = options[:host]
|
13
|
+
end
|
14
|
+
|
15
|
+
element = ""
|
16
|
+
element = "<picture>"
|
17
|
+
element << "<!--[if IE 9]><video style='display: none;'><![endif]-->"
|
18
|
+
ResponsiveImage.media_types.each do |source|
|
19
|
+
srcfile = "#{filename}-#{source[:filename_suffix]}#{extension}"
|
20
|
+
element << "<source srcset='#{ResponsiveImage.host}#{image_url(srcfile)}' media='#{source[:media_query]}'>"
|
21
|
+
end
|
22
|
+
element << "<!--[if IE 9]></video><![endif]-->"
|
23
|
+
element << "<img srcset='#{ResponsiveImage.host}#{image_url(image)}' class='#{options[:html] ? options[:html][:class] : nil}' alt='#{options[:html] ? options[:html][:alt] : nil}'>"
|
24
|
+
element << "</picture>"
|
25
|
+
element
|
26
|
+
end
|
27
|
+
|
28
|
+
def self.image_url(image)
|
29
|
+
"images/#{image}"
|
30
|
+
end
|
31
|
+
end
|
32
|
+
end
|
@@ -0,0 +1,13 @@
|
|
1
|
+
module ResponsiveImage
|
2
|
+
module RailsViewHelpers
|
3
|
+
def picture_element(image, options = {})
|
4
|
+
ResponsiveImage::Helpers.create_picture(image, options)
|
5
|
+
end
|
6
|
+
end
|
7
|
+
|
8
|
+
class Railtie < Rails::Railtie
|
9
|
+
initializer "responsive_image.view_helpers" do
|
10
|
+
ActionView::Base.send :include, ResponsiveImage::RailsViewHelpers
|
11
|
+
end
|
12
|
+
end
|
13
|
+
end
|
@@ -0,0 +1,23 @@
|
|
1
|
+
# coding: utf-8
|
2
|
+
lib = File.expand_path('../lib', __FILE__)
|
3
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
4
|
+
require 'responsive_image/version'
|
5
|
+
|
6
|
+
Gem::Specification.new do |spec|
|
7
|
+
spec.name = "responsive_image"
|
8
|
+
spec.version = ResponsiveImage::VERSION
|
9
|
+
spec.authors = ["Robert Lyall", "Dan Wentworth"]
|
10
|
+
spec.email = ["rob@atechmedia.com", "dan@atechmedia.com"]
|
11
|
+
spec.summary = %q{A helper for creating the picture element in Ruby}
|
12
|
+
spec.homepage = "https://github.com/rglyall/responsive_image"
|
13
|
+
spec.license = "MIT"
|
14
|
+
|
15
|
+
spec.files = `git ls-files -z`.split("\x0")
|
16
|
+
spec.executables = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
|
17
|
+
spec.test_files = spec.files.grep(%r{^(test|spec|features)/})
|
18
|
+
spec.require_paths = ["lib"]
|
19
|
+
|
20
|
+
spec.add_development_dependency "bundler", "~> 1.6"
|
21
|
+
spec.add_development_dependency "rake"
|
22
|
+
spec.add_development_dependency 'rspec', '~> 2.14'
|
23
|
+
end
|
@@ -0,0 +1,46 @@
|
|
1
|
+
require "responsive_image"
|
2
|
+
|
3
|
+
describe ResponsiveImage do
|
4
|
+
|
5
|
+
context "with default configuration" do
|
6
|
+
|
7
|
+
picture_element = ResponsiveImage::Helpers.create_picture("fishtank.jpg")
|
8
|
+
|
9
|
+
it "should create a valid picture element" do
|
10
|
+
expect(picture_element).to eq("<picture><!--[if IE 9]><video style='display: none;'><![endif]--><source srcset='/images/fishtank-mobile.jpg' media='(min-width: 480px)'><source srcset='/images/fishtank-mobile_2x.jpg' media='(min-width: 480px) and (min-device-pixel-ratio: 2.0)'><source srcset='/images/fishtank-tablet.jpg' media='(min-width: 768px)'><source srcset='/images/fishtank-tablet_2x.jpg' media='(min-width: 768px) and (min-device-pixel-ratio: 2.0)'><source srcset='/images/fishtank-desktop.jpg' media='(min-width: 1024px)'><source srcset='/images/fishtank-desktop_2x.jpg' media='(min-width: 1024px) and (min-device-pixel-ratio: 2.0)'><!--[if IE 9]></video><![endif]--><img srcset='/images/fishtank.jpg' class='' alt=''></picture>")
|
11
|
+
end
|
12
|
+
|
13
|
+
end
|
14
|
+
|
15
|
+
context "with custom configuration" do
|
16
|
+
|
17
|
+
it "should create a valid picture element" do
|
18
|
+
ResponsiveImage.media_types = [{:filename_suffix => "iphone", :media_query => "(min-width: 320px)"}]
|
19
|
+
|
20
|
+
picture_element = ResponsiveImage::Helpers.create_picture("fishtank.jpg")
|
21
|
+
|
22
|
+
expect(picture_element).to eq("<picture><!--[if IE 9]><video style='display: none;'><![endif]--><source srcset='/images/fishtank-iphone.jpg' media='(min-width: 320px)'><!--[if IE 9]></video><![endif]--><img srcset='/images/fishtank.jpg' class='' alt=''></picture>")
|
23
|
+
end
|
24
|
+
|
25
|
+
end
|
26
|
+
|
27
|
+
context "with custom html options" do
|
28
|
+
|
29
|
+
it "should apply html options to the image element" do
|
30
|
+
picture_element = ResponsiveImage::Helpers.create_picture("fishtank.jpg", :html => { :class => "awesome-image", :alt => "A really awesome image!" })
|
31
|
+
|
32
|
+
expect(picture_element).to eq("<picture><!--[if IE 9]><video style='display: none;'><![endif]--><source srcset='/images/fishtank-iphone.jpg' media='(min-width: 320px)'><!--[if IE 9]></video><![endif]--><img srcset='/images/fishtank.jpg' class='awesome-image' alt='A really awesome image!'></picture>")
|
33
|
+
end
|
34
|
+
|
35
|
+
end
|
36
|
+
|
37
|
+
context "with different host" do
|
38
|
+
|
39
|
+
it "should create a valid picture element" do
|
40
|
+
picture_element = ResponsiveImage::Helpers.create_picture("fishtank.jpg", :host => "http://placehold.it/")
|
41
|
+
expect(picture_element).to eq("<picture><!--[if IE 9]><video style='display: none;'><![endif]--><source srcset='http://placehold.it/images/fishtank-iphone.jpg' media='(min-width: 320px)'><!--[if IE 9]></video><![endif]--><img srcset='http://placehold.it/images/fishtank.jpg' class='' alt=''></picture>")
|
42
|
+
end
|
43
|
+
|
44
|
+
end
|
45
|
+
|
46
|
+
end
|
metadata
ADDED
@@ -0,0 +1,100 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: responsive_image
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.0.3
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Robert Lyall
|
8
|
+
- Dan Wentworth
|
9
|
+
autorequire:
|
10
|
+
bindir: bin
|
11
|
+
cert_chain: []
|
12
|
+
date: 2014-09-09 00:00:00.000000000 Z
|
13
|
+
dependencies:
|
14
|
+
- !ruby/object:Gem::Dependency
|
15
|
+
name: bundler
|
16
|
+
requirement: !ruby/object:Gem::Requirement
|
17
|
+
requirements:
|
18
|
+
- - ~>
|
19
|
+
- !ruby/object:Gem::Version
|
20
|
+
version: '1.6'
|
21
|
+
type: :development
|
22
|
+
prerelease: false
|
23
|
+
version_requirements: !ruby/object:Gem::Requirement
|
24
|
+
requirements:
|
25
|
+
- - ~>
|
26
|
+
- !ruby/object:Gem::Version
|
27
|
+
version: '1.6'
|
28
|
+
- !ruby/object:Gem::Dependency
|
29
|
+
name: rake
|
30
|
+
requirement: !ruby/object:Gem::Requirement
|
31
|
+
requirements:
|
32
|
+
- - ! '>='
|
33
|
+
- !ruby/object:Gem::Version
|
34
|
+
version: '0'
|
35
|
+
type: :development
|
36
|
+
prerelease: false
|
37
|
+
version_requirements: !ruby/object:Gem::Requirement
|
38
|
+
requirements:
|
39
|
+
- - ! '>='
|
40
|
+
- !ruby/object:Gem::Version
|
41
|
+
version: '0'
|
42
|
+
- !ruby/object:Gem::Dependency
|
43
|
+
name: rspec
|
44
|
+
requirement: !ruby/object:Gem::Requirement
|
45
|
+
requirements:
|
46
|
+
- - ~>
|
47
|
+
- !ruby/object:Gem::Version
|
48
|
+
version: '2.14'
|
49
|
+
type: :development
|
50
|
+
prerelease: false
|
51
|
+
version_requirements: !ruby/object:Gem::Requirement
|
52
|
+
requirements:
|
53
|
+
- - ~>
|
54
|
+
- !ruby/object:Gem::Version
|
55
|
+
version: '2.14'
|
56
|
+
description:
|
57
|
+
email:
|
58
|
+
- rob@atechmedia.com
|
59
|
+
- dan@atechmedia.com
|
60
|
+
executables: []
|
61
|
+
extensions: []
|
62
|
+
extra_rdoc_files: []
|
63
|
+
files:
|
64
|
+
- .gitignore
|
65
|
+
- Gemfile
|
66
|
+
- LICENSE.txt
|
67
|
+
- README.md
|
68
|
+
- Rakefile
|
69
|
+
- lib/responsive_image.rb
|
70
|
+
- lib/responsive_image/helpers.rb
|
71
|
+
- lib/responsive_image/railtie.rb
|
72
|
+
- lib/responsive_image/version.rb
|
73
|
+
- responsive_image.gemspec
|
74
|
+
- spec/responsive_image_spec.rb
|
75
|
+
homepage: https://github.com/rglyall/responsive_image
|
76
|
+
licenses:
|
77
|
+
- MIT
|
78
|
+
metadata: {}
|
79
|
+
post_install_message:
|
80
|
+
rdoc_options: []
|
81
|
+
require_paths:
|
82
|
+
- lib
|
83
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
84
|
+
requirements:
|
85
|
+
- - ! '>='
|
86
|
+
- !ruby/object:Gem::Version
|
87
|
+
version: '0'
|
88
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
89
|
+
requirements:
|
90
|
+
- - ! '>='
|
91
|
+
- !ruby/object:Gem::Version
|
92
|
+
version: '0'
|
93
|
+
requirements: []
|
94
|
+
rubyforge_project:
|
95
|
+
rubygems_version: 2.2.2
|
96
|
+
signing_key:
|
97
|
+
specification_version: 4
|
98
|
+
summary: A helper for creating the picture element in Ruby
|
99
|
+
test_files:
|
100
|
+
- spec/responsive_image_spec.rb
|