Skip to content

Commit

Permalink
fix(ScaledIcons): Icons using a scaled viewbow weren't rendering as e…
Browse files Browse the repository at this point in the history 
…xpected

fix #73
  • Loading branch information
@nfroidure
nfroidure committed Jul 15, 2017
1 parent 14be079 commit 44e3dd6
Show file tree
Hide file tree
Showing 6 changed files with 124 additions and 9 deletions.
40 changes: 31 additions & 9 deletions src/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,20 +188,33 @@ function SVGIcons2SVGFontStream(options) {
if('svg' === tag.name) {
glyph.dX = 0;
glyph.dY = 0;
glyph.scaleX = 1;
glyph.scaleY = 1;
if('viewBox' in tag.attributes) {
values = tag.attributes.viewBox.split(/\s*,*\s|\s,*\s*|,/);
glyph.dX = parseFloat(values[0], 10);
glyph.dY = parseFloat(values[1], 10);
glyph.width = parseFloat(values[2], 10);
glyph.height = parseFloat(values[3], 10);
if('width' in tag.attributes) {
glyph.scaleX = glyph.width /
parseFloat(tag.attributes.width, 10);
glyph.width = parseFloat(tag.attributes.width, 10);
}
if('height' in tag.attributes) {
glyph.scaleY = glyph.height /
parseFloat(tag.attributes.height, 10);
glyph.height = parseFloat(tag.attributes.height, 10);
}
} else {
if('width' in tag.attributes) {
glyph.width = parseFloat(tag.attributes.width, 10);
}
if('height' in tag.attributes) {
glyph.height = parseFloat(tag.attributes.height, 10);
}
}
if('width' in tag.attributes) {
glyph.width = parseFloat(tag.attributes.width, 10);
}
if('height' in tag.attributes) {
glyph.height = parseFloat(tag.attributes.height, 10);
}
if(!glyph.width || !glyph.height) {
if((!glyph.width) || !glyph.height) {
log('Glyph "' + glyph.name + '" has no size attribute on which to' +
' get the gylph dimensions (heigh and width or viewBox' +
' attributes)');
Expand Down Expand Up @@ -336,8 +349,17 @@ function SVGIcons2SVGFontStream(options) {
.toAbs()
.translate(-glyph.dX, -glyph.dY)
.scale(
options.normalize ? ratio : 1,
options.normalize ? ratio : 1)
(
options.normalize ?
ratio :
1
) * glyph.scaleX,
(
options.normalize ?
ratio :
1
) * glyph.scaleY
)
.ySymetry(glyph.height - options.descent)
.round(options.round)
.encode();
Expand Down
15 changes: 15 additions & 0 deletions tests/expected/scaledicons.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
50 changes: 50 additions & 0 deletions tests/expected/test-codepoint.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,17 @@
"unicode": ["\uE001"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150
}, {
"name": "arrow-down",
"unicode": ["\uE002"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#0F9925"
Expand All @@ -19,6 +23,8 @@
"unicode": ["\uE003"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "black"
Expand All @@ -27,6 +33,8 @@
"unicode": ["\uE004"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "red"
Expand All @@ -35,6 +43,8 @@
"unicode": ["\uE005"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "blue"
Expand All @@ -43,6 +53,8 @@
"unicode": ["\uE006"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#F9CE42"
Expand All @@ -51,6 +63,8 @@
"unicode": ["\uE007"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "purple"
Expand All @@ -59,13 +73,17 @@
"unicode": ["\uE008"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150
}, {
"name": "plus",
"unicode": ["\uE009"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#F0F"
Expand All @@ -74,6 +92,8 @@
"unicode": ["\uE00A"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "black"
Expand All @@ -83,6 +103,8 @@
"unicode": ["\uE001"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "yellow"
Expand All @@ -91,6 +113,8 @@
"unicode": ["\uE002"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "black"
Expand All @@ -100,6 +124,8 @@
"unicode": ["\uE001"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 439,
"height": 1024,
"color": "black"
Expand All @@ -108,13 +134,17 @@
"unicode": ["\uE002"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 439,
"height": 1024
}, {
"name": "speaker",
"unicode": ["\uE003"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 511.9057,
"height": 1024,
"color": "#0F0"
Expand All @@ -124,6 +154,8 @@
"unicode": ["\uE008"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "green"
Expand All @@ -132,6 +164,8 @@
"unicode": ["\uE00F"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "black"
Expand All @@ -140,6 +174,8 @@
"unicode": ["\uE013"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#0F0F0F"
Expand All @@ -148,6 +184,8 @@
"unicode": ["\uE014"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#F4F4F4"
Expand All @@ -157,6 +195,8 @@
"unicode": ["\uE001"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "red"
Expand All @@ -165,6 +205,8 @@
"unicode": ["\uE002"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#1F1F1F"
Expand All @@ -173,6 +215,8 @@
"unicode": ["\uE003"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150,
"color": "#8F8F8F"
Expand All @@ -181,20 +225,26 @@
"unicode": ["\uE004"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150
}, {
"name": "polyline",
"unicode": ["\uE005"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150
}, {
"name": "rect",
"unicode": ["\uE006"],
"dX": 0,
"dY": 0,
"scaleX": 1,
"scaleY": 1,
"width": 150,
"height": 150
}]
Expand Down
4 changes: 4 additions & 0 deletions tests/fixtures/scaledicons/ic_search_black_48px.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 9 additions & 0 deletions tests/index.mocha.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -171,6 +171,15 @@ describe('Generating fonts to files', function() {
}, done, 'id');
});

it('should work with scaled icons', function(done) {
generateFontToFile({
fontName: 'scaledicons',
fixedWidth: true,
centerHorizontally: true,
fontId: 'plop',
}, done);
});

it('should not display hidden pathes', function(done) {
generateFontToFile({
fontName: 'hiddenpathesicons',
Expand Down
15 changes: 15 additions & 0 deletions tests/results/scaledicons.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 44e3dd6

Please sign in to comment.