middleman-scavenger 1.0.3 → 1.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +10 -3
- data/assets/javascripts/middleman-scavenger.js.erb +1 -1
- data/lib/middleman-scavenger.rb +3 -3
- data/lib/svg_processor.rb +1 -1
- data/middleman-scavenger.gemspec +2 -2
- metadata +3 -3
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 2249fd88795e0594c5d497c2ebba0b7ff9c7daaf
|
4
|
+
data.tar.gz: 919da96b31f4e656869bc21b3ed6faac1e931ba7
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: cb823d68707d7ffcf449934b812e4dc0dd071c240cbf9a0992e58d019869b6c98bd2cb9374d03e07c6784eb552cc3c6d223878bd0a1efab78317052340d24348
|
7
|
+
data.tar.gz: 142ebfb3a55305915275f2efe2dfcddd6c7c87b40217197fdd1e17301598fc344f68418e649333929bb49af86b3bab4c9fe7560e592b0370c97f78a9419b2857
|
data/README.md
CHANGED
@@ -4,6 +4,13 @@
|
|
4
4
|
|
5
5
|
A Middleman extension for creating svg sprite sheets. It's usable in modern (IE9+) browsers, uses `<symbol>` to include the svg:s, and can optionally inline the SVG images for speed. If you need legacy browser support it combines well with [svg4everybody](https://github.com/jonathantneal/svg4everybody).
|
6
6
|
|
7
|
+
## Important info about older and newer middleman versions!
|
8
|
+
|
9
|
+
A bunch of things have happened in Middleman core since this plugin was created. There were some changes between minor versions in Middleman 3.x in regard to how files are resolved. This created some unfortunate incompatibilities in middleman-scavenger and to simplify things, the master branch of middleman-scavenger is only compatible with 3.4.x. Middleman 4 has thrown out the Sprockets asset pipeline completely, which is... interesting for us. So, in short:
|
10
|
+
|
11
|
+
- If you're using Middleman 3.4.x, just include everything as usual
|
12
|
+
- If you're on Middleman 3.3.x (or maybe earlier?) you should lock your version of `middleman-scavenger` to 1.0.2
|
13
|
+
- If you've upgraded to Middleman 4, hold on while we figure things out and use [This branch](https://github.com/varvet/middleman-scavenger/tree/feature/middleman-4-support) in the meantime, as documented [here](https://github.com/varvet/middleman-scavenger/pull/11).
|
7
14
|
|
8
15
|
## Installation and quick start
|
9
16
|
|
@@ -26,7 +33,7 @@ If you don't like the default settings, you can change them at activation time.
|
|
26
33
|
activate :middleman_scavenger do |config|
|
27
34
|
config.path = "./source/my-svg-directory/"
|
28
35
|
config.prefix = "icon-"
|
29
|
-
config.sprite_path = "
|
36
|
+
config.sprite_path = "source/javascripts/my-sprite.svg"
|
30
37
|
end
|
31
38
|
```
|
32
39
|
|
@@ -54,14 +61,14 @@ If you want to reference the sprite directly, you can use `scavenger_sprite_path
|
|
54
61
|
|
55
62
|
Middleman-scavenger uses an SVG processor based on [Nokogiri](http://www.nokogiri.org) to load and parse the SVG images in the folder into a sprite sheet, each image in its own `<symbol>` with its own viewBox. The sprite sheet is cached in memory and written to disk, so it can be asynchronously loaded or quickly inlined into the document. Whenever an SVG is added, removed, or changed in development mode Middleman-scavenger will make a new in-memory and on-disk version. The rebuild process fires at build time as well.
|
56
63
|
|
57
|
-
The bundled javascript will asynchronously load the SVG sprite sheet as text and insert it at the top of the body. This makes it possible to control the SVG sprites via CSS. An externally referenced SVG will create a shadow DOM boundary that is impossible to cross, but inserting the sprite sheet into the document removes that obstacle and makes
|
64
|
+
The bundled javascript will asynchronously load the SVG sprite sheet as text and insert it at the top of the body. This makes it possible to control the SVG sprites via CSS. An externally referenced SVG will create a shadow DOM boundary that is impossible to cross, but inserting the sprite sheet into the document removes that obstacle and makes it possible to control transitions and hover states.
|
58
65
|
|
59
66
|
|
60
67
|
## Gotchas
|
61
68
|
|
62
69
|
### Sizing
|
63
70
|
|
64
|
-
SVG sizing is always a little difficult, and even more so with sprite sheets. Middleman-scavenger
|
71
|
+
SVG sizing is always a little difficult, and even more so with sprite sheets. Middleman-scavenger allows each image to have its own viewBox, which means they will scale as expected when given width or height parameters. Including an SVG without sizing information will constrain it to the dimensions of the element it was included in, so it's advisable to add `width:` or `height:` or a styled CSS selector to the `svg` helper.
|
65
72
|
|
66
73
|
|
67
74
|
### FONI
|
data/lib/middleman-scavenger.rb
CHANGED
@@ -5,7 +5,7 @@ require "middleman-core"
|
|
5
5
|
class MiddlemanScavenger < ::Middleman::Extension
|
6
6
|
option :path, "./source/images/svg", "Directory containing SVG files"
|
7
7
|
option :prefix, "", "Optional prefix for icon names"
|
8
|
-
option :sprite_path, "sprite.svg", "Static file to write svg spritesheet to"
|
8
|
+
option :sprite_path, "./source/images/sprite.svg", "Static file to write svg spritesheet to"
|
9
9
|
|
10
10
|
def initialize(app, options_hash={}, &block)
|
11
11
|
super
|
@@ -34,7 +34,7 @@ class MiddlemanScavenger < ::Middleman::Extension
|
|
34
34
|
|
35
35
|
helpers do
|
36
36
|
def scavenger_sprite_path
|
37
|
-
image_path svg_sprite_path
|
37
|
+
image_path File.basename(svg_sprite_path)
|
38
38
|
end
|
39
39
|
|
40
40
|
def inline_svg_sprite
|
@@ -42,7 +42,7 @@ class MiddlemanScavenger < ::Middleman::Extension
|
|
42
42
|
end
|
43
43
|
|
44
44
|
def svg(name, options=nil)
|
45
|
-
if
|
45
|
+
if !options.nil?
|
46
46
|
attrs = options.map {|k,v| "#{k}=\"#{v}\"" }.join(" ")
|
47
47
|
"<svg #{attrs}><use xlink:href=\"##{name}\" /></svg>"
|
48
48
|
else
|
data/lib/svg_processor.rb
CHANGED
@@ -10,7 +10,7 @@ class SVGProcessor
|
|
10
10
|
|
11
11
|
def rebuild
|
12
12
|
@svgs = Dir["#{@path}/*.svg"].map { |file| get_svg(file) }
|
13
|
-
logger.
|
13
|
+
logger.info "rebuilding: #{@svgs.length} svgs found"
|
14
14
|
@symbols = @svgs.map { |svg| convert_to_symbol(svg) }
|
15
15
|
|
16
16
|
@symbol_string = @symbols.join("\n")
|
data/middleman-scavenger.gemspec
CHANGED
@@ -3,7 +3,7 @@ $:.push File.expand_path("../lib", __FILE__)
|
|
3
3
|
|
4
4
|
Gem::Specification.new do |s|
|
5
5
|
s.name = "middleman-scavenger"
|
6
|
-
s.version = "1.0.
|
6
|
+
s.version = "1.0.4"
|
7
7
|
s.platform = Gem::Platform::RUBY
|
8
8
|
s.authors = ["Johan Halse"]
|
9
9
|
s.email = ["johan.halse@varvet.com"]
|
@@ -18,7 +18,7 @@ Gem::Specification.new do |s|
|
|
18
18
|
s.require_paths = ["lib"]
|
19
19
|
|
20
20
|
# The version of middleman-core your extension depends on
|
21
|
-
s.add_runtime_dependency("middleman-core", [">= 3.
|
21
|
+
s.add_runtime_dependency("middleman-core", [">= 3.4.0", "< 4.0.0"])
|
22
22
|
|
23
23
|
# Additional dependencies
|
24
24
|
s.add_runtime_dependency("nokogiri", "~> 1.6")
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: middleman-scavenger
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.4
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Johan Halse
|
@@ -16,7 +16,7 @@ dependencies:
|
|
16
16
|
requirements:
|
17
17
|
- - ">="
|
18
18
|
- !ruby/object:Gem::Version
|
19
|
-
version: 3.
|
19
|
+
version: 3.4.0
|
20
20
|
- - "<"
|
21
21
|
- !ruby/object:Gem::Version
|
22
22
|
version: 4.0.0
|
@@ -26,7 +26,7 @@ dependencies:
|
|
26
26
|
requirements:
|
27
27
|
- - ">="
|
28
28
|
- !ruby/object:Gem::Version
|
29
|
-
version: 3.
|
29
|
+
version: 3.4.0
|
30
30
|
- - "<"
|
31
31
|
- !ruby/object:Gem::Version
|
32
32
|
version: 4.0.0
|