Opening of font files in browser about fontkit HOT 10 OPEN

<script type="text/javascript" src="fontkit.js"></script>
<script>
function fkOpenFont (fkFontPath) {
  var xhr = new XMLHttpRequest()
  xhr.open('GET', fkFontPath, true)
  xhr.responseType = 'arraybuffer'
  var fkFont = null
  xhr.onload = function (e) {
    if (this.status == 200) {
      var fkBlob = this.response
      var fkBuffer = new Buffer(fkBlob)
      fkFont = fontkit.create(fkBuffer)
    }
  }
  xhr.send();
}

fkOpenFont('../fonts/Monoto-VF.woff')
</script>

from fontkit.

Well do. I still need another week, well have much better sample code then. This is the first time I touched JS since Netscape Navigator :)

from fontkit.

@twardoch's solution is even easier with the new fetch API:

const fontUrl = "https://fonts.gstatic.com/s/raviprakash/v3/8EzbM7Rymjk25jWeHxbO6CXeN0lhaNKjYxc8tNqs5DA.woff2";

fetch(fontUrl).then(res => res.arrayBuffer()).then(ab => {
  const font = fontkit.create(new Buffer(ab));
});

from fontkit.

I found a way, shown here:

• https://github.com/twardoch/monoto-fonts-ofl/blob/master/srcdocs/test/fontkit-include.js
• https://github.com/twardoch/monoto-fonts-ofl/blob/master/srcdocs/test/browserifyme.sh
• https://github.com/twardoch/monoto-fonts-ofl/blob/master/srcdocs/test/Monoto-VF-fontkit.html

from fontkit.

Adam,
Thanks for this! I was just struggling with this myself a few days ago.

from fontkit.

The main point that I had to discover is that node.js has the fs module which uses a Buffer object that fontkit uses. Browserify has a built-in Buffer object that can be used to convert an ArrayBuffer into a fontkit-compatible Buffer. XMLHttpRequest that is built into browsers can return an ArrayBuffer. So it works.

from fontkit.

Thanks Adam!

from fontkit.

Worth filing a quick PR that adds this code (or some form of) to the README.md?

from fontkit.

welcome back to JS, it's a brave new world =D

(with so much new functionality it's pretty much a completely different language compared to what we had in '98)

from fontkit.

Does it really support browser not node?
I don't want to use <script type="text/javascript" src="fontkit.js"></script>
I use for React.js. And installed from npm.

from fontkit.