- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Mon, 10 Mar 2014 14:10:15 -0700
- To: John Daggett <jdaggett@mozilla.com>
- Cc: www-style list <www-style@w3.org>
On Sun, Mar 9, 2014 at 7:05 PM, John Daggett <jdaggett@mozilla.com> wrote: > Tab Atkins wrote: >>>> Construction doesn't mention anything about automatically adding >>>> it to the document's font source, so it doesn't do so. >>> >>> I think the spec should state that explicitly. >> >> Done. > > Ok, found it. I think I would word it slightly differently and > emphasize the implication of what this means for authors. > > Current text: > >> Note: Note that constructing a FontFace object does not >> automatically add it to the document’s font source. If it’s desired >> that the newly-constructed FontFace object is usable from CSS/etc, >> it must be explicitly added to a font source. > > Emphasizing what this means for authors: > > Newly constructed FontFace objects are not automatically added to the > FontFaceSet associated with a document or a context for a worker > thread. This means that while newly constructed fonts can be > preloaded, they cannot actually be used until they are explicitly > added to a FontFaceSet. See the following section for a more complete > description of FontFaceSet. That sounds pretty good. I've replaced my note with your text. > Aside: as much as possible I would avoid the term "font source" as it > adds an extra level of indirection when reading the spec. > > I think it would also be a good idea to have an example demonstrating > the different usage patterns that this suggests. > > Example for the end of section 3.6: > > Fonts are available when they are added to a FontFaceSet. Adding a new > @font-face rule to a stylesheet also adds a new FontFace to the > FontFaceSet of the Document object. > > Adding a new @font-face rule: > > document.styleSheets[0].insertRule( > "@font-face { font-family: newtest; src: url(newtest.woff); }", 0); > document.getElementsByTagName("body")[0].style.fontFamily = "newtest, serif"; > > Constructing a new FontFace object and adding it to document.fonts: > > var newfont = new FontFace("newtest", "url(newtest.woff)", {}); > document.fonts.add(newfont); > document.getElementsByTagName("body")[0].style.fontFamily = "newtest, serif"; > > In both cases, the loading of the font resource 'newtest.woff' will be > initiated by the layout engine, just as other @font-face rule fonts > are loaded. > > Omitting the addition to document.fonts means the font would never be > loaded and text would be displayed in the default serif font: > > var newfont = new FontFace("newtest", "url(newtest.woff)", {}); > > /* new FontFace not added to FontFaceSet so serif will be used */ > document.getElementsByTagName("body")[0].style.fontFamily = "newtest, serif"; > > To explicitly preload a font before using it, authors can defer the > addition of a new FontFace to a FontFaceSet until the load has completed: > > var newfont = new FontFace("newtest", "url(newtest.woff)", {}); > newfont.load().then(function () { > document.getElementsByTagName("body")[0].style.fontFamily = "newtest, serif"; > }, handleError); > > In this case, the font resource 'newtest.woff' is first downloaded. > Once the download completes, the body font is changed and the layout > engine uses the new font resource. Excellent example. I added it, with only minor tweaks. Also, this example showed that it probably makes sense to let the load() promise resolve to the FontFace. ~TJ
Received on Monday, 10 March 2014 21:11:01 UTC