Skip to content

Commit

Permalink
FontAwesome 5 with fallback (oblador#787)
Browse files Browse the repository at this point in the history
* FontAwesome5 implementation

+ GlyphMap for FontAwesome 5.1.0 Pro
+ Font files for FontAwesome 5.1.0 Free
+ Implementation enabling FontAwesome5 icons

Handles the copying and renaming of FontAwesome5 Pro font files

Removed debug code

* Update README.md

* Easier way to use FontAwesome5 Pro

Now a default import from a separate file, instead of
creating it using FA5iconSet(bool).

* FontAwesome 5 instructions

Fixes to pass tests

* Automatic build and upgrading, also added to directory and IconExplorer

* Buttons and TabBarItems should be working on iOS too now

* Updated build flow

+ FontAwesome 5.1.1
+ Temporary folder and npm pack when building
+ Separate glyphmaps

* Upgrading FontAwesome is automatic and occurs locally

* Create FontAwesome 5 iconSet with factory

* Setup FontAwesome 5 automatically

* Bug fixes with FontAwesome 5 loading

* getImageSource() implementation for FontAwesome 5

* Export all types in FontAwesome5 iconSets

* Changed name on FA5Type to FA5Style

* Update docs to reflect changes to FontAwesome 5

* Some final iOS fixes for FontAwesome 5 PR

* Updated scripts

* Name changes and minor fixes

* ensureNativeModuleAvailable() in its own file

* Removed add-font-assets from user binaries

* Edited package.json ends with blank line now

* Cleaner code

* Docs update

* FontAwesome5 script now generates metadata

* yarn test

* Implement fallback

* IconExplorer fix

* directory now has custom fallback

* Merge updates

* Should remove project.pbxproj from PR

* Upgrade FontAwesome 5 to 5.2.0

* Invert metadata

* Implement fallback

* eslint corrections

* Fix directory

* Removed brand prop and optional fallback

* Changes how FontAwesome5 metadata is generated
  • Loading branch information
hampustagerud authored and oblador committed Jul 28, 2018
1 parent 296a32e commit 4aa125f
Show file tree
Hide file tree
Showing 15 changed files with 5,277 additions and 28 deletions.
3 changes: 2 additions & 1 deletion FontAwesome5.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@
import { createFA5iconSet } from './lib/create-icon-set-from-fontawesome5';

import glyphMap from './glyphmaps/FontAwesome5Free.json';
import metadata from './glyphmaps/FontAwesome5Free_meta.json';

export { FA5Style } from './lib/create-icon-set-from-fontawesome5';

const iconSet = createFA5iconSet(glyphMap, false);
const iconSet = createFA5iconSet(glyphMap, metadata, false);

export default iconSet;

Expand Down
3 changes: 2 additions & 1 deletion FontAwesome5Pro.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@
import { createFA5iconSet } from './lib/create-icon-set-from-fontawesome5';

import glyphMap from './glyphmaps/FontAwesome5Pro.json';
import metadata from './glyphmaps/FontAwesome5Pro_meta.json';

export { FA5Style } from './lib/create-icon-set-from-fontawesome5';

const iconSet = createFA5iconSet(glyphMap, true);
const iconSet = createFA5iconSet(glyphMap, metadata, true);

export default iconSet;

Expand Down
Binary file modified Fonts/FontAwesome5_Brands.ttf
Binary file not shown.
Binary file modified Fonts/FontAwesome5_Regular.ttf
Binary file not shown.
Binary file modified Fonts/FontAwesome5_Solid.ttf
Binary file not shown.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate
* [`EvilIcons`](http://evil-icons.io) by Alexander Madyankin & Roman Shamin (v1.10.1, **70** icons)
* [`Feather`](http://feathericons.com) by Cole Bemis & Contributors (v4.7.0, **266** icons)
* [`FontAwesome`](http://fortawesome.github.io/Font-Awesome/icons/) by Dave Gandy (v4.7.0, **675** icons)
* [`FontAwesome 5`](https://fontawesome.com) by Fonticons, Inc. (v5.1.1, 1265 (free) **2067** (pro) icons)
* [`FontAwesome 5`](https://fontawesome.com) by Fonticons, Inc. (v5.2.0, 1295 (free) **2357** (pro) icons)
* [`Foundation`](http://zurb.com/playground/foundation-icon-fonts-3) by ZURB, Inc. (v3.0, **283** icons)
* [`Ionicons`](https://ionicons.com/) by Ben Sperry (v4.2.4, **696** icons)
* [`MaterialIcons`](https://www.google.com/design/icons/) by Google, Inc. (v3.0.1, **932** icons)
Expand Down
33 changes: 33 additions & 0 deletions bin/generate-fontawesome5-metadata.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
#!/usr/bin/env node
/* eslint-disable no-console */

const fs = require('fs');

const argv = require('yargs')
.usage('')
.option('path', {
alias: 'p',
string: true,
})
.option('output', {
alias: 'o',
string: true,
})
.demandOption('path')
.demandOption('output').argv;

const path = `${argv.path}/svgs/`;

const generatedJSON = {};
fs.readdirSync(path)
.filter(file => fs.statSync(path + file).isDirectory())
.forEach(file => {
const icons = fs.readdirSync(path + file);
generatedJSON[file] = icons.map(icon => icon.split('.')[0]);
});

fs.writeFileSync(
argv.output,
`${JSON.stringify(generatedJSON, null, 2)}\r\n`,
'utf8'
);
5 changes: 5 additions & 0 deletions directory/src/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,11 @@
src: url('../../Fonts/FontAwesome5_Solid.ttf') format('truetype');
}

@font-face {
font-family: 'FontAwesome5Brands';
src: url('../../Fonts/FontAwesome5_Brands.ttf') format('truetype');
}

@font-face {
font-family: 'Foundation';
src: url('../../Fonts/Foundation.ttf') format('truetype');
Expand Down
12 changes: 11 additions & 1 deletion directory/src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ import EvilIcons from '../../glyphmaps/EvilIcons.json';
import Feather from '../../glyphmaps/Feather.json';
import FontAwesome from '../../glyphmaps/FontAwesome.json';
import FontAwesome5 from '../../glyphmaps/FontAwesome5Free.json';
import FontAwesome5Brands from '../../glyphmaps/FontAwesome5Free.json';
import FontAwesome5Meta from '../../glyphmaps/FontAwesome5Free_meta.json';
import Foundation from '../../glyphmaps/Foundation.json';
import Ionicons from '../../glyphmaps/Ionicons.json';
import MaterialCommunityIcons from '../../glyphmaps/MaterialCommunityIcons.json';
Expand All @@ -22,6 +24,7 @@ const IconFamilies = {
Feather,
FontAwesome,
FontAwesome5,
FontAwesome5Brands,
Foundation,
Ionicons,
MaterialCommunityIcons,
Expand Down Expand Up @@ -154,10 +157,17 @@ class App extends PureComponent {
};

renderIcon(family, name) {
let familyName = family;

if (family === 'FontAwesome5') {
if (FontAwesome5Meta['solid'].indexOf(name) === -1)
familyName = 'FontAwesome5Brands';
}

return (
<div className="Result-Icon-Container" key={name}>
<Icon
family={family}
family={familyName}
name={name}
className="Result-Icon"
/>
Expand Down
35 changes: 34 additions & 1 deletion glyphmaps/FontAwesome5Free.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
"adn": 61808,
"adversal": 62314,
"affiliatetheme": 62315,
"air-freshener": 62928,
"algolia": 62316,
"align-center": 61495,
"align-justify": 61497,
Expand Down Expand Up @@ -37,6 +38,7 @@
"app-store-ios": 62320,
"apper": 62321,
"apple": 61817,
"apple-alt": 62929,
"apple-pay": 62485,
"archive": 61831,
"archway": 62807,
Expand All @@ -60,6 +62,7 @@
"asymmetrik": 62322,
"at": 61946,
"atlas": 62808,
"atom": 62930,
"audible": 62323,
"audio-description": 62110,
"autoprefixer": 62492,
Expand Down Expand Up @@ -108,15 +111,18 @@
"bold": 61490,
"bolt": 61671,
"bomb": 61922,
"bone": 62935,
"bong": 62812,
"book": 61485,
"book-open": 62744,
"book-reader": 62938,
"bookmark": 61486,
"bowling-ball": 62518,
"box": 62566,
"box-open": 62622,
"boxes": 62568,
"braille": 62113,
"brain": 62940,
"briefcase": 61617,
"briefcase-medical": 62569,
"broadcast-tower": 62745,
Expand Down Expand Up @@ -144,6 +150,10 @@
"cannabis": 62815,
"capsules": 62571,
"car": 61881,
"car-alt": 62942,
"car-battery": 62943,
"car-crash": 62945,
"car-side": 62948,
"caret-down": 61655,
"caret-left": 61657,
"caret-right": 61658,
Expand All @@ -168,6 +178,7 @@
"certificate": 61603,
"chalkboard": 62747,
"chalkboard-teacher": 62748,
"charging-station": 62951,
"chart-area": 61950,
"chart-bar": 61568,
"chart-line": 61953,
Expand Down Expand Up @@ -281,6 +292,7 @@
"digg": 61862,
"digital-ocean": 62353,
"digital-tachograph": 62822,
"directions": 62955,
"discord": 62354,
"discourse": 62355,
"divide": 62761,
Expand All @@ -299,6 +311,7 @@
"download": 61465,
"draft2digital": 62358,
"drafting-compass": 62824,
"draw-polygon": 62958,
"dribbble": 61821,
"dribbble-square": 62359,
"dropbox": 61803,
Expand All @@ -315,6 +328,7 @@
"elementor": 62512,
"ellipsis-h": 61761,
"ellipsis-v": 61762,
"ello": 62961,
"ember": 62499,
"empire": 61905,
"envelope": 61664,
Expand Down Expand Up @@ -480,6 +494,7 @@
"h-square": 61693,
"hacker-news": 61908,
"hacker-news-square": 62383,
"hackerrank": 62967,
"hand-holding": 62653,
"hand-holding-heart": 62654,
"hand-holding-usd": 62656,
Expand Down Expand Up @@ -555,6 +570,7 @@
"js": 62392,
"js-square": 62393,
"jsfiddle": 61900,
"kaggle": 62970,
"key": 61572,
"keybase": 62709,
"keyboard": 61724,
Expand All @@ -568,13 +584,15 @@
"korvue": 62511,
"language": 61867,
"laptop": 61705,
"laptop-code": 62972,
"laravel": 62397,
"lastfm": 61954,
"lastfm-square": 61955,
"laugh": 62873,
"laugh-beam": 62874,
"laugh-squint": 62875,
"laugh-wink": 62876,
"layer-group": 62973,
"leaf": 61548,
"leanpub": 61970,
"lemon": 61588,
Expand Down Expand Up @@ -619,6 +637,7 @@
"map-marker-alt": 62405,
"map-pin": 62070,
"map-signs": 62071,
"markdown": 62991,
"marker": 62881,
"mars": 61986,
"mars-double": 61991,
Expand All @@ -645,6 +664,7 @@
"microphone-alt": 62409,
"microphone-alt-slash": 62777,
"microphone-slash": 61745,
"microscope": 62992,
"microsoft": 62410,
"minus": 61544,
"minus-circle": 61526,
Expand All @@ -669,6 +689,7 @@
"mouse-pointer": 62021,
"music": 61441,
"napster": 62418,
"neos": 62994,
"neuter": 61996,
"newspaper": 61930,
"nimblr": 62888,
Expand All @@ -684,6 +705,7 @@
"object-ungroup": 62024,
"odnoklassniki": 62051,
"odnoklassniki-square": 62052,
"oil-can": 62995,
"old-republic": 62736,
"opencart": 62013,
"openid": 61851,
Expand Down Expand Up @@ -750,6 +772,7 @@
"plus-square": 61694,
"podcast": 62158,
"poo": 62206,
"poop": 63001,
"portrait": 62432,
"pound-sign": 61780,
"power-off": 61457,
Expand Down Expand Up @@ -802,6 +825,7 @@
"rocket": 61749,
"rocketchat": 62440,
"rockrms": 62441,
"route": 62679,
"rss": 61598,
"rss-square": 61763,
"ruble-sign": 61784,
Expand All @@ -828,6 +852,7 @@
"sellsy": 61971,
"server": 62003,
"servicestack": 62444,
"shapes": 63007,
"share": 61540,
"share-alt": 61920,
"share-alt-square": 61921,
Expand Down Expand Up @@ -897,6 +922,7 @@
"star": 61445,
"star-half": 61577,
"star-half-alt": 62912,
"star-of-life": 63009,
"staylinked": 62453,
"steam": 61878,
"steam-square": 61879,
Expand Down Expand Up @@ -948,6 +974,8 @@
"tasks": 61614,
"taxi": 61882,
"teamspeak": 62713,
"teeth": 63022,
"teeth-open": 63023,
"telegram": 62150,
"telegram-plane": 62462,
"tencent-weibo": 61909,
Expand All @@ -957,6 +985,7 @@
"th": 61450,
"th-large": 61449,
"th-list": 61451,
"theater-masks": 63024,
"themeco": 62918,
"themeisle": 62130,
"thermometer": 62609,
Expand All @@ -980,6 +1009,7 @@
"tooth": 62921,
"trade-federation": 62739,
"trademark": 62044,
"traffic-light": 63031,
"train": 62008,
"transgender": 61988,
"transgender-alt": 61989,
Expand All @@ -991,7 +1021,9 @@
"trophy": 61585,
"truck": 61649,
"truck-loading": 62686,
"truck-monster": 63035,
"truck-moving": 62687,
"truck-pickup": 63036,
"tshirt": 62803,
"tty": 61924,
"tumblr": 61811,
Expand Down Expand Up @@ -1110,5 +1142,6 @@
"yen-sign": 61783,
"yoast": 62129,
"youtube": 61799,
"youtube-square": 62513
"youtube-square": 62513,
"zhihu": 63039
}
Loading

0 comments on commit 4aa125f

Please sign in to comment.