-
Notifications
You must be signed in to change notification settings - Fork 4
Christoph Burgmer edited this page Jul 2, 2016
·
4 revisions
Current API (subject to change during 0.x releases):
-
Inline all
<img>
and<input type="image">
references:inlineresources.loadAndInlineImages(doc, options)
-
Inline all
@import
,background-image
&font-face
occurrences in<style>
elements:inlineresources.loadAndInlineStyles(doc, options)
-
Inline all CSS
<link rel="stylesheets">
elements including@import
,background-image
&font-face
occurrences:inlineresources.loadAndInlineCssLinks(doc, options)
-
Inline all
<script>
references:inlineresources.loadAndInlineScript(doc, options)
Inline all references (convenience method):
inlineresources.inlineReferences(doc, options)
- doc is a Document object (DOM)
-
options is key/value pairs of further options:
-
baseUrl the URL base of the document which relative resources will be based on, default:
null
. -
cache allows fine-tuning caching behaviour:
-
'none'
forces requested pages not to be cached by the browser by adding a unique query string in the form of"?_=[timestamp]"
to each request, -
'repeated'
forces a non-cached load for initial calls, while allowing the browser to cache repeated calls to the same URL, -
'all'
will not employ any cache busting (default).
-
-
cacheBucket an object holding the library's own in-memory cache. Only effective in reuse between several calls to the API and
cache
set to some value other thannone
. Should be initialized with{}
.
-
baseUrl the URL base of the document which relative resources will be based on, default:
###Return value:
All methods return a promise that is fulfilled once the content is rendered. The general call pattern for any of the methods is
loadAndInlineImages(doc, options)
.then(function (failedResources) {
...
});
The callback is called with a list of resources that failed to load in the form
{ resourceType: "TYPE_OF_RESOURCE", url: "THE_FAILED_URL", msg: "A_HUMAN_READABLE_MSG" }
Resource types:
-
image an
<img href="">
or<input type="image" src="">
-
stylesheet a
<link rel="stylesheet" href="">
or@import url("");
-
backgroundImage a
background-image: url("");
-
fontFace a
@font-face { src: url("") }
-
script a
<script src="">
For questions, reach out to @cburgmer on Twitter.