webfontloader 1.4.3 → 1.4.4

data/webfontloader.gemspec

@@ -13,8 +13,8 @@ Gem::Specification.new do |s|
   ## If your rubyforge_project name is different, then edit it and comment out
   ## the sub! line in the Rakefile
   s.name              = 'webfontloader'
-  s.version           = '1.4.3'
-  s.date              = '2013-05-16'
+  s.version           = '1.4.4'
+  s.date              = '2013-05-22'
 
   ## Make sure your summary is short. The description may be as long
   ## as you like.
@@ -66,15 +66,13 @@ DESC
   ## THE MANIFEST COMMENTS, they are used as delimiters by the task.
   # = MANIFEST =
   s.files = %w[
+    AUTHORS
     CHANGELOG
     Gemfile
     LICENSE
     README.md
     Rakefile
     bin/webfontloader-demos
-    docs/EVENTS.md
-    docs/MODULES.md
-    docs/TRANSITIONS.md
     lib/webfontloader.rb
     lib/webfontloader/demo/public/ascender-iframe.html
     lib/webfontloader/demo/public/ascender.html

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: webfontloader
 version: !ruby/object:Gem::Version 
-  hash: 1
+  hash: 15
   prerelease: 
   segments: 
   - 1
   - 4
-  - 3
-  version: 1.4.3
+  - 4
+  version: 1.4.4
 platform: ruby
 authors: 
 - Ryan Carver
@@ -16,7 +16,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2013-05-16 00:00:00 Z
+date: 2013-05-22 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: rake
@@ -93,19 +93,14 @@ extensions: []
 
 extra_rdoc_files: 
 - README.md
-- docs/EVENTS.md
-- docs/MODULES.md
-- docs/TRANSITIONS.md
 files: 
+- AUTHORS
 - CHANGELOG
 - Gemfile
 - LICENSE
 - README.md
 - Rakefile
 - bin/webfontloader-demos
-- docs/EVENTS.md
-- docs/MODULES.md
-- docs/TRANSITIONS.md
 - lib/webfontloader.rb
 - lib/webfontloader/demo/public/ascender-iframe.html
 - lib/webfontloader/demo/public/ascender.html

data/docs/EVENTS.md

@@ -1,169 +0,0 @@
-# Events
-
-WebFont Loader provides an event system that developers can hook into. It
-gives you notifications of the font loading sequence in both CSS and
-JavaScript.
-
-## The Events
-
-  * `Loading` - This event is triggered when all fonts have been requested.
-  * `Active` - This event is triggered when all of the fonts have rendered.
-  * `Inactive` - This event is triggered when the browser does not support
-      linked fonts *or* if none of the fonts could be loaded.
-  * `Font Loading` - This event is triggered once for each font that's loaded.
-  * `Font Active` - This event is triggered once for each font that renders.
-  * `Font Inactive` - This event is triggered if the font can't be loaded.
-
-### CSS Flavored
-
-CSS events are implemented as classes on the `html` element.
-
-    html.wf-loading
-    html.wf-active
-    html.wf-inactive
-    html.wf-familyname-fvd-loading
-    html.wf-familyname-fvd-active
-    html.wf-familyname-fvd-inactive
-
-`familyname` is a sanitized version of the name of each font family. Spaces
-and underscores are removed from the name, and all characters are converted to
-lower case. For example, `Droid Sans` becomes `droidsans`.
-
-`fvd` is a *Font Variation Description*. Put simply, it's a shorthand for
-describing the style and weight of a particular font. Here are a few examples:
-
-    @font-face {
-      font-style: normal;
-      font-weight: normal;
-    }
-    => n4
-
-    @font-face {
-      font-style: italic;
-      font-weight: bold;
-    }
-    => i7
-
-If no style/weight is specified, the default "n4" (font-style: normal;
-font-weight: normal;) will be used.
-
-If fonts are loaded multiple times on a single page, the CSS classes continue
-to update to reflect the current state of the page. The global `wf-loading`
-class is applied whenever fonts are being requested (even if other fonts are
-already active or inactive). The `wf-inactive` class is applied only if none of
-the fonts on the page have rendered. Otherwise, the `wf-active` class is applied
-instead (even if some fonts are inactive).
-
-Here's an example of CSS classes over multiple loads:
-
-  * Droid Sans n4 is requested
-    * The `html` element has `wf-loading wf-droidsans-n4-loading`
-  * Droid Sans n4 is detected as active
-    * The `html` element has `wf-active wf-droidsans-n4-active`
-  * Droid Sans n7 is subsequently requested
-    * The `html` element has `wf-active wf-loading wf-droidsans-n4-active
-        wf-droidsans-n7-loading`
-  * Droid Sans n7 is detected as active
-    * The `html` element has `wf-active wf-droidsans-n4-active
-        wf-droidsans-n7-active`
-
-Here's another example of CSS classes over multiple loads when one of the
-requested fonts is inactive:
-
-  * Droid Sans n9 is requested (which doesn't exist)
-    * The `html` element has `wf-loading wf-droidsans-n9-loading`
-  * Droid Sans n9 is detected as inactive
-    * The `html` element has `wf-inactive wf-droidsans-n9-inactive`
-  * Droid Sans n4 is subsequently requested
-    * The `html` element has `wf-inactive wf-loading wf-droidsans-n9-inactive
-        wf-droidsans-n4-loading`
-  * Droid Sans n4 is detected as active
-    * The `html` element has `wf-active wf-droidsans-n9-inactive
-        wf-droidsans-n4-active`
-
-
-### JavaScript Flavored
-
-JavaScript events are implemented as callback functions on the `WebFont.load`
-function.
-
-    WebFont.load({
-      loading: function() {
-      },
-      active: function() {
-      },
-      inactive: function() {
-      },
-      fontloading: function(familyName, fvd) {
-      },
-      fontactive: function(familyName, fvd) {
-      },
-      fontinactive: function(familyName, fvd) {
-      }
-    })
-
-
-## Error Handling
-
-### Timeouts
-
-Since the Internet is not 100% reliable, it's possible that a font fails to
-load. You can use events to gracefully degrade in this situation.
-
-> The `Font Inactive` event will be triggered after 5 seconds if the font
-fails to render. If *at least* one font succesfully renders, the `Active`
-event will be triggered, else the `Inactive` even will be triggered.
-
-You can configure the timeout by using the `timeout` configuration on the
-`WebFont.load` function.
-
-    WebFont.load({
-      timeout: 2000, // Set the timeout to two seconds
-      ...
-    });
-
-The timeout value should be in milliseconds, and defaults to 5 seconds if
-not supplied.
-
-### Browser Support
-
-Every web browser has varying levels of support for fonts linked via
-@font-face. Support for web fonts is determined using the browser user agent
-string. The user agent string may claim to support a web font format
-when it in fact does not. This is especially noticable on mobile browsers
-with a "Desktop" mode, which usually identify as Chrome on Linux.
-In this case a web font provider may decide to send WOFF fonts to the
-device because the real desktop Chrome supports it, while the mobile
-browser does not. The WebFont Loader is not designed to handle these
-cases and it chooses to believe the user agent string. Web font providers
-may or may not build on top of the basic WebFont Loader functionality
-to handle these special cases individually.
-
-> If WebFont Loader determines that the current browser does not support
-`@font-face`, the `Inactive` event will be triggered.
-
-When loading fonts from multiple providers, each provider may or may not
-support a given browser.
-
-> If WebFont Loader determines that the current browser can support
-`@font-face`, and *at least* one provider is able to serve fonts,
-the fonts from that provide will be loaded. When finished, the `Active` event
-will be triggered.
-
-> For fonts loaded from supported providers, the `Font Active` event will be
-triggered. For fonts loaded from a provider that *does not* support the
-current browser, the `Font Inactive` event will be triggered.
-
-For example:
-
-    WebFont.load({
-      providerA: 'Family1',
-      providerB: 'Family2'
-    });
-
-> If `providerA` can serve fonts to a browser, but `providerB` cannot, The
-`Font Inactive` event will be triggered for `Family2`. The `Font Active`
-event will be triggered for `Family1` once it loads, as will the `Active`
-event.
-
-

data/docs/MODULES.md

@@ -1,96 +0,0 @@
-# Modules
-
-WebFont Loader provides a generic module system so that any web font provider
-may be used. The specifics of each provider are documented here.
-
-
-## Google
-
-Using Google's Font API, name the font families you'd like to load.
-
-    WebFont.load({
-      google: {
-        families: ['Droid Sans', 'Droid Serif']
-      }
-    });
-
-Learn more about the [Google Font API][gfontapi]. You can also supply the `text` parameter to perform character subsetting:
-
-    WebFont.load({
-      google: {
-        families: ['Droid Sans', 'Droid Serif'],
-        text: 'abcdedfghijklmopqrstuvwxyz!'
-      }
-    });
-
-This functionality is only available for the Google module.
-
-## Typekit
-
-When using Typekit, specify the Kit to retrieve by its ID. You can find this
-ID within Typekit's Kit Editor interface.
-
-    WebFont.load({
-      typekit: {
-        id: 'xxxxxx'
-      }
-    });
-
-Learn more about [Typekit][tk].
-
-## Fontdeck
-
-To use Fontdeck, specify the ID of your website. You can find this ID on the
-website page within your account settings.
-
-    WebFont.load({
-      fontdeck: {
-        id: 'xxxxx'
-      }
-    });
-
-Learn more about [Fontdeck][fd].
-
-## Fonts.com web fonts
-
-When using [Fonts.com web fonts][mtiwfs]
-
-(First sign up for [Fonts.com web fonts][mtiwfs]. Create a project, choose fonts to add into the created project and retrieve your Project ID. You can find this Project ID in the "Publish" tab).
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        monotype: {
-          projectId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
-          version: 12345 // (optional, flushes the CDN cache)
-        }
-      });
-    </script>
-
-Or as pure Fonts.com Web fonts API
-
-    <script type="text/javascript" src="http://fast.fonts.com/jsapi/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx.js"></script>
-
-## Custom
-
-To load fonts from any external stylesheet, use the `custom` module. Here you'll
-need to specify both the url of the stylesheet as well as the font families it
-provides.
-
-You can specify a specific font variation or set of variations to load and watch
-by appending the variations separated by commas to the family name separated by 
-a colon. Variations are specified using [FVD notation][fvd].
-
-    WebFont.load({
-      custom: {
-        families: ['My Font', 'My Other Font:n4,i4,n7'],
-        urls: ['/fonts.css']
-      }
-    });
-
-
-[gfontapi]: https://code.google.com/apis/webfonts/docs/getting_started.html
-[tk]: http://typekit.com/
-[fd]: http://fontdeck.com/
-[mtiwfs]: http://webfonts.fonts.com/
-[fvd]: https://github.com/typekit/fvd

data/docs/TRANSITIONS.md

@@ -1,142 +0,0 @@
-# Transitions
-
-In order to support smooth transitions between webfont providers, WebFont
-Loader provides a common interface to each provider. It also makes it trivial
-to load fonts from multiple providers.
-
-This is especially powerful when building your page against the [events][]
-because the same events are triggered regardless of the provider.
-
-Here are a few scenarios.
-
-## From Google Fonts to Typekit
-
-### Step 1: Use Google with WebFont Loader
-
-You can get started with web fonts quickly and easily by just using Google.
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        google: {
-          families: ['Droid Sans']
-        }
-      });
-    </script>
-
-### Step 2: Add Typekit
-
-If you discover that Google doesn't have your preferred typeface, you may wish
-to add fonts from Typekit.
-
-(first sign up for Typekit, add fonts and retrieve your Kit ID)
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        google: {
-          families: ['Droid Sans']
-        },
-        typekit: {
-          id: 'abc1def'
-        }
-      });
-    </script>
-
-### Step 3 Remove Google
-
-You may now discover that the number of HTTP requests has increased by pulling
-fonts from both Google and Typekit. Since Typekit has all of the fonts that
-Google has, let's drop that dependency.
-
-(first add 'Droid Sans' to your Kit with ID 'abc1def')
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({,
-        typekit: {
-          id: 'abc1def'
-        }
-      });
-    </script>
-
-### Step 4: Remove WebFont Loader
-
-You may wish to reduce HTTP requests further by dropping the dependency on
-WebFont Loader to work directly with Typekit. Typekit's API is fully
-compatible with WebFont Loader.
-
-    <script type="text/javascript" src="http://use.typekit.com/abc1def.js"></script>
-    <script type="text/javascript">
-      WebFont.load();
-    </script>
-
-Or as pure Typekit
-
-    <script type="text/javascript" src="http://use.typekit.com/abc1def.js"></script>
-    <script type="text/javascript">
-      Typekit.load();
-    </script>
-
-## From Google Fonts to Fonts.com Web fonts
-
-### Step 1: Use Google with WebFont Loader
-
-You can get started with web fonts quickly and easily by just using Google.
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        google: {
-          families: ['Droid Sans']
-        }
-      });
-    </script>
-
-### Step 2: Add Fonts.com Web fonts
-
-If you discover that Google doesn't have your preferred typeface, you may wish
-to add fonts from Fonts.com Web fonts.
-
-(first sign up for Fonts.com Web fonts, add fonts and retrieve your Project ID)
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        monotype: {
-          projectId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'
-        }
-      });
-    </script>
-
-
-Or as pure Fonts.com Web fonts API
-
-    <script type="text/javascript" src="http://fast.fonts.com/jsapi/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx.js"></script>
-
-## Add events to self-hosted fonts
-
-### Step 1: Link to your own stylesheet
-
-If you already have fonts and the `@font-face` rules written, you might
-already be using them in your page.
-
-    <link type="text/css" rel="stylesheet" href="/fonts.css">
-
-### Step 2: Use WebFont Loader
-
-To add [events][] support, use the `custom` module to load your stylesheet,
-and name the font families that the stylesheet provides.
-
-    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
-    <script type="text/javascript">
-      WebFont.load({
-        default: {
-          families: ['My Font'],
-          urls: ['/fonts.css']
-        }
-      });
-    </script>
-
-
-[events]: EVENTS.md