Allow to import character subsets other than Latin

[erykpiast]

Solves #21

[erykpiast]

@KyleAMathews could you look at this, please?

[koutsenko]

@KyleAMathews , any progress? Please add font subsets

[erykpiast]

@KyleAMathews ping :)

[KyleAMathews]

Looking good!

[KyleAMathews]

Revert this

[erykpiast]

Sure! Done :)

[KyleAMathews]

Tried it locally but it doesn't seem to be working.

Try running it locally:

1. clone https://github.com/majodev/google-webfonts-helper
2. Install its dependencies and start its server by running npm start
3. Try creating a google font file — node scripts/create-package-from-google-font-id.js roboto

[erykpiast]

Okay, I admit I didn't test with local URL, I'll try this.

[KyleAMathews]

👍

Please post h ere the diff you get when it works.

[erykpiast]

@KyleAMathews, which version of node do you use?

[KyleAMathews]

8

[erykpiast]

Alright, I cannot make google-webfonts-helper working with node v8, it's works on v0.10 though (typefaces repository works great on v8 and v9). I cannot say more than it works for me :P Clean node modules installation. Here is a video to prove it (maybe you will notice if I do something differently than you?)

[KyleAMathews]

Video link isn't working.

[erykpiast]

Agrr, sorry for this. Privacy settings. Try it now.

[KyleAMathews]

Oh hmmm sorry — I ran yarn in typefaces and it started working, oops!

So yeah, managed to generate a bunch of new css files.

I'm not familiar with loading font files for additional languages. Can you really just require the latin & greek versions together? And the browser will figure it out? Looking at the CSS files, it seems they'd clash with each other since the @font-face stuff is the same except for which file it's pointing to.

[erykpiast]

Yeah, this solution has a major flaw - it's not possible to include Greek AND Cyrillic charsets on the same page. I've copied default behavior of google-webfonts-helper, that means cyrillic.css contains Cyrillic and Latin characters, greek.css includes Greek and Latin and so on. This info is included in updated README of each font package I believe.

Well, there is probably better (I mean "ultimate") solution for this issue, like dynamically created CSS files for every possible combination of charsets, but until we want to stick to static files (which is quite good in my opinion, because it's simple), this one is the best approach I came with. Notice this one isn't breaking change, it shouldn't be major version update even :) So next iteration may be making it more generic/elastic.

The other idea I have is to create second sets of packages, like typeface-roboto-multilang and keep this one as it is for now, so it could be extended in more universal manner once we find out how.

[erykpiast]

@KyleAMathews Is there a chance for you to come back to it this week? :)

[erykpiast]

@KyleAMathews ping

[erykpiast]

Hey, it's now more than two months since I've opened the PR. Could we do something with it, just move on?

[erykpiast]

It's three months now :(

[ryall]

Just a note, while waiting for this to be merged, would be useful to add usage instructions to the README.md

[erykpiast]

@ryall It is in README. The one inside generated package :) Look at scripts/templates.js.

[ryall]

Ah sorry! I didn't realise it was generated :)

[jsardev]

Would love to see this feature too. Waiting for ya, Kyle!

[koutsenko]

And what we must to do now to install specific subsets?
For example, roboto cyrillic?

[erykpiast]

@koutsenko you can get this particular one through this package: https://www.npmjs.com/package/typeface-roboto-multilang. I've published it with code from this PR.

[koutsenko]

@erykpiast thnx, but i already switched to roboto-fontface package.
The only reason i tried to use typeface-roboto package was an material-ui-next project recommendations.
Why your work wasn't merged here?

[erykpiast]

Yeah, I also found this project because of Material UI :)

[dusek]

@KyleAMathews ping about merging this please? Lack of support for Latin Extended stopped me from using typeface-hind (which looked really promising to streamline font installation and deployment), having to unfortunately devise some manual method of downloading and importing fonts which I am doing right now. Life would be just so much easier if I could use typeface-hind for Latin Extended (and not only for Latin). Thanks.

[chpio]

how about including just the "full" source font file and let the user build the needed fonts by them self? you could include a simple Promise based tool, this should be a simple solution for this issue.

import gulp from 'gulp';
import fontUbuntu from 'typeface-ubuntu';

gulp.task('font', () => fontUbuntu({
  charsets: ['greek', 'latin'],
  styles: ['regular', '300'],
  dest: 'path_to_dest_directory',
}));

[davelab6]

@KyleAMathews one of the issues with not using GF API is that the API now uses unicode-range; it would be good to avoid this whole issue by doing the same :)

[cezarneaga]

@KyleAMathews could this PR work? would need this too!
thanks!

[erykpiast]

@cezarneaga I've published this version of the project (Roboto font only) as the [separate package] (https://www.npmjs.com/package/typeface-roboto-multilang). Readme is not adjusted, so use it like require('typeface-roboto-multilang/latin-ext.css');

[cezarneaga]

I need koho not roboto

[xuhcc]

@cezarneaga Take a look at this fork https://github.com/bedlaj/openfonts/tree/master/packages/koho_all