safeframe
Version:
SafeFrame provides a consistent JS API to include 3rd party content
818 lines (459 loc) • 23.6 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="generator" content="JsDoc Toolkit" />
<title>$sf.vend | SafeFrames JS API</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<meta name="mobileoptimized" content="0" />
<link rel="stylesheet" href="../css/all.css" media="all" />
<link rel="stylesheet" href="../css/handheld.css" media="only screen and (max-width: 660px)" />
<link rel="stylesheet" href="../css/handheld.css" media="handheld" />
<link rel="stylesheet" href="../css/screen.css" media="screen and (min-width: 661px)" />
<script src="../javascript/all.js"></script>
<!--[if lt IE 9]>
<script src="../javascript/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="index">
<div class="menu">
<div class="indexLinks">
</div>
<h2 class="heading1">Classes</h2>
<input type="text" name="classFilter" class="classFilter" id="ClassFilter" placeholder="Filter"></input>
<nav>
<ul class="classList" id="ClassList">
<li><a href="../symbols/%24sf.html">$sf</a></li>
<li><a href="../symbols/%24sf.env.html">$sf<span class='break'> </span>.<span class='break'> </span>env</a></li>
<li><a href="../symbols/%24sf.env.ua.html">$sf<span class='break'> </span>.<span class='break'> </span>env<span class='break'> </span>.<span class='break'> </span>ua</a></li>
<li><a href="../symbols/%24sf.lib.html">$sf<span class='break'> </span>.<span class='break'> </span>lib</a></li>
<li><a href="../symbols/%24sf.lib.dom.html">$sf<span class='break'> </span>.<span class='break'> </span>lib<span class='break'> </span>.<span class='break'> </span>dom</a></li>
<li><a href="../symbols/%24sf.lib.dom.iframes.html">$sf<span class='break'> </span>.<span class='break'> </span>lib<span class='break'> </span>.<span class='break'> </span>dom<span class='break'> </span>.<span class='break'> </span>iframes</a></li>
<li><a href="../symbols/%24sf.lib.dom.msghost.html">$sf<span class='break'> </span>.<span class='break'> </span>lib<span class='break'> </span>.<span class='break'> </span>dom<span class='break'> </span>.<span class='break'> </span>msghost</a></li>
<li><a href="../symbols/%24sf.lib.lang.html">$sf<span class='break'> </span>.<span class='break'> </span>lib<span class='break'> </span>.<span class='break'> </span>lang</a></li>
<li><a href="../symbols/%24sf.lib.lang.ParamHash.html">$sf<span class='break'> </span>.<span class='break'> </span>lib<span class='break'> </span>.<span class='break'> </span>lang<span class='break'> </span>.<span class='break'> </span>ParamHash</a></li>
<li><a href="../symbols/%24sf.pub.html">$sf<span class='break'> </span>.<span class='break'> </span>pub</a></li>
<li><a href="../symbols/%24sf.pub.Config.html">$sf<span class='break'> </span>.<span class='break'> </span>pub<span class='break'> </span>.<span class='break'> </span>Config</a></li>
<li><a href="../symbols/%24sf.pub.PosConfig.html">$sf<span class='break'> </span>.<span class='break'> </span>pub<span class='break'> </span>.<span class='break'> </span>PosConfig</a></li>
<li><a href="../symbols/%24sf.pub.Position.html">$sf<span class='break'> </span>.<span class='break'> </span>pub<span class='break'> </span>.<span class='break'> </span>Position</a></li>
<li><a href="../symbols/%24sf.vend.html">$sf<span class='break'> </span>.<span class='break'> </span>vend</a></li>
</ul>
</nav>
</div>
<div class="fineprint" style="clear:both">
<footer>
Documentation generator: <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0<br />
Template: <a href="" target="_blank">Codeview</a> 1.2.1<br />
Generated on:
<time datetime='2012-7-6' pubdate>2012-7-6 16:05</time>
</footer>
</div>
</div>
<div class="index indexStatic"></div>
<div class="content">
<div class="innerContent">
<article>
<header>
<h1 class="classTitle">
Namespace <span>$sf.vend</span>
</h1>
<div class="intro">
<p class="description summary">
$sf.vend The vendor / client API for functionality inside a SafeFrame
</p>
<ul class="summary">
</ul>
</div>
</header>
<!--
#### METHODS SUMMARY
-->
<section>
<div class="props">
<h2 class="sectionTitle">Method Summary</h2>
<nav>
<table class="summaryTable" id="MethodsList" cellspacing="0" summary="A summary of the methods documented in the class $sf.vend.">
<thead>
<tr>
<th scope="col">Method Attributes</th>
<th scope="col">Method Name and Description</th>
</tr>
</thead>
<tbody>
<tr
class='item0'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.collapse">collapse</a></b>()
</div>
<div class="description">Collapse the SafeFrame container after having called to expand.</div>
</td>
</tr>
<tr
class='item1'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.expand">expand</a></b>(deltaXorDesc, deltaY)
</div>
<div class="description">Make a request to expand the SafeFrame container to a certain size.</div>
</td>
</tr>
<tr
class='item2'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.geom">geom</a></b>()
</div>
<div class="description">Return geometric information about the SafeFrame container and it's status within a page</div>
</td>
</tr>
<tr
class='item3'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.hostURL">hostURL</a></b>()
</div>
<div class="description">Return the known good publisher host URL, stripped of query string / hash values</div>
</td>
</tr>
<tr
class='item4'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.inView">inView</a></b>()
</div>
<div class="description">Return the percentage that the SafeFrame container is viewable within the browser window</div>
</td>
</tr>
<tr
class='item5'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.meta">meta</a></b>(propName, owner_key)
</div>
<div class="description">Return meta-data information that may have been specified by the publisher / host.</div>
</td>
</tr>
<tr
class='item6'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.register">register</a></b>(initWidth, initHeight, notify)
</div>
<div class="description">Intialize the SafeFrame vendor/client API, so that other features may be used
This method MUST be called prior to using any other rich-media functionality (like expansion).</div>
</td>
</tr>
<tr
class='item7'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.status">status</a></b>()
</div>
<div class="description">Return the current status of the SafeFrame container, in cases where
a command may be pending.</div>
</td>
</tr>
<tr
class='item8'
>
<td class="attributes"><static> </td>
<td class="nameDescription">
<div class="fixedFont">$sf.vend.<b><a href="../symbols/%24sf.vend.html#.supports">supports</a></b>(key)
</div>
<div class="description">Return whether or not a particular feature is supported, or an object containing
key/value pairs denoting all features and whether or not they are supported
By default SafeFrames version 1 supports the following feature:
"exp-ovr": Expansion of the container by overlaying on top of other content
Later in other versions there are expexted to be more feature with their own
string name, that can be checked by the content in the SafeFrame, so that
it knows what things can be done.</div>
</td>
</tr>
</tbody>
</table>
</nav>
</div>
</section>
<!--
#### EVENTS SUMMARY
-->
<!--
#### CONSTRUCTOR DETAILS
-->
<!--
#### FIELD DETAILS
-->
<!--
#### METHOD DETAILS
-->
<section>
<div class="details props">
<div class="innerProps">
<h2 class="sectionTitle">
Method Detail
</h2>
<ul class="methodDetail" id="MethodDetail">
<li
class='item0'
>
<div class="fixedFont heading" id=".collapse">
<span class='lighter'>
<static>
</span>
<span class="light">$sf.vend.</span><b>collapse</b>()
</div>
<div class="description">
Collapse the SafeFrame container after having called to expand. If no previous call to expand has been made, this call will do nothing.
</div>
<div class="hr"></div>
</li>
<li
class='item1'
>
<div class="fixedFont heading" id=".expand">
<span class='lighter'>
<static>
</span>
<span class="light">{Boolean}</span>
<span class="light">$sf.vend.</span><b>expand</b>(deltaXorDesc, deltaY)
</div>
<div class="description">
Make a request to expand the SafeFrame container to a certain size. Note that you may only call $sf.vend.expand
to expand to the largest size needed, followed by calling collapse (and then repeat the same process if needed).
Tweening or animation done, should be reserved for your own content, and you cannot make multiple calls to expand
without a corresponding collapse.
</div>
<dl class="detailList params">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Number|Object}</span> <b>deltaXorDesc</b>
</dt>
<dd>If a number is specifed, SafeFrame will grow in size by this amount in pixels along the horizontal axis. Specifiy a negative value to grow to the left, and a postive value to grow to the right. <br />
If an object is specified, it should contain "t","l","r","b" properties (top,left,bottom,right) for the amount in pixels to grow the container in each dimension</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>deltaXorDesc.t</b>
</dt>
<dd>Specifies to shift the top position of the SafeFrame container by the number of pixels specified. A negative value will shift the top higher on the screen, positive value shifts the top lower on the screen</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>deltaXorDesc.l</b>
</dt>
<dd>Specifies to shift the left position of the SafeFrame container by the number of pixels specified.</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>deltaXorDesc.b</b>
</dt>
<dd>Specifies to shift the bottom position of the SafeFrame container by the number of pixels specified. A negative value will shift the bottom higher on the screen, positive value shifts the bottom lower on the screen. <br />
Can be used in conjuction with deltaXorDesc.t, to effectively make the overall height of the SafeFrame taller or shorter.</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>deltaXorDesc.r</b>
</dt>
<dd>Specifies to shift the left position of the SafeFrame container by the number of pixels specified. <br />
Can be used in conjuction with deltaXorDesc.l to effectively make the overall width of the SafeFrame wider or narrower.</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>deltaY</b>
</dt>
<dd>If a number is specifed, SafeFrame will grow in size by this amount in pixels along the vertical axis. Specifiy a negative value to grow to the top, and a postive value to grow to the bottom. <br />
Note that this value is ignored if deltaXorDesc is passed in as an object.</dd>
</dl>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{Boolean}</span> true/false if the request to expand the container was sent. This does not mean that expansion is complete as expansion is an asynchronous process. Pass in a callback function to $sf.vend.register to get status updates.</dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item2'
>
<div class="fixedFont heading" id=".geom">
<span class='lighter'>
<static>
</span>
<span class="light">{Object}</span>
<span class="light">$sf.vend.</span><b>geom</b>()
</div>
<div class="description">
Return geometric information about the SafeFrame container and it's status within a page
</div>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{Object}</span> geom_info</dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item3'
>
<div class="fixedFont heading" id=".hostURL">
<span class='lighter'>
<static>
</span>
<span class="light">{String}</span>
<span class="light">$sf.vend.</span><b>hostURL</b>()
</div>
<div class="description">
Return the known good publisher host URL, stripped of query string / hash values
</div>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{String}</span> </dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item4'
>
<div class="fixedFont heading" id=".inView">
<span class='lighter'>
<static>
</span>
<span class="light">{Number}</span>
<span class="light">$sf.vend.</span><b>inView</b>()
</div>
<div class="description">
Return the percentage that the SafeFrame container is viewable within the browser window
</div>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{Number}</span> </dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item5'
>
<div class="fixedFont heading" id=".meta">
<span class='lighter'>
<static>
</span>
<span class="light">{String}</span>
<span class="light">$sf.vend.</span><b>meta</b>(propName, owner_key)
</div>
<div class="description">
Return meta-data information that may have been specified by the publisher / host.
</div>
<dl class="detailList params">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{String}</span> <b>propName</b>
</dt>
<dd>the key name of the meta-data value to be retrieved</dd>
<dt>
<span class="light fixedFont">{String}</span> <b>owner_key</b>
<i>Optional</i>
</dt>
<dd>the super key name of the data to be retrieved</dd>
</dl>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{String}</span> The value of some meta-data that may have been specified by the publisher / host or "".</dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item6'
>
<div class="fixedFont heading" id=".register">
<span class='lighter'>
<static>
</span>
<span class="light">$sf.vend.</span><b>register</b>(initWidth, initHeight, notify)
</div>
<div class="description">
Intialize the SafeFrame vendor/client API, so that other features may be used
This method MUST be called prior to using any other rich-media functionality (like expansion).
</div>
<dl class="detailList params">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{Number}</span> <b>initWidth</b>
</dt>
<dd>The initial width (in pixels) expected of the content within the SafeFrame container</dd>
<dt>
<span class="light fixedFont">{Number}</span> <b>initHeight</b>
</dt>
<dd>The initial height (in pixels) expected of the content within the SafeFrame container</dd>
<dt>
<span class="light fixedFont">{Function}</span> <b>notify</b>
<i>Optional</i>
</dt>
<dd>A callback function that content can specify to be notified of status updates</dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item7'
>
<div class="fixedFont heading" id=".status">
<span class='lighter'>
<static>
</span>
<span class="light">{String}</span>
<span class="light">$sf.vend.</span><b>status</b>()
</div>
<div class="description">
Return the current status of the SafeFrame container, in cases where
a command may be pending. If an empty string is returned ("") container is idle.
</div>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{String}</span> of any pending status, otherwise empty string.</dd>
</dl>
<div class="hr"></div>
</li>
<li
class='item8'
>
<div class="fixedFont heading" id=".supports">
<span class='lighter'>
<static>
</span>
<span class="light">{Boolean|Object}</span>
<span class="light">$sf.vend.</span><b>supports</b>(key)
</div>
<div class="description">
Return whether or not a particular feature is supported, or an object containing
key/value pairs denoting all features and whether or not they are supported
By default SafeFrames version 1 supports the following feature:
"exp-ovr": Expansion of the container by overlaying on top of other content
Later in other versions there are expexted to be more feature with their own
string name, that can be checked by the content in the SafeFrame, so that
it knows what things can be done.
</div>
<dl class="detailList params">
<dt class="heading">Parameters:</dt>
<dt>
<span class="light fixedFont">{String}</span> <b>key</b>
<i>Optional</i>
</dt>
<dd>If specifed, checks to see if that specific feature has been enabled</dd>
</dl>
<dl class="detailList nomargin">
<dt class="heading">Returns:</dt>
<dd><span class="light fixedFont">{Boolean|Object}</span> </dd>
</dl>
</li>
</ul>
</div>
</div>
</section>
<!--
#### EVENT DETAILS
-->
</article>
</div>
</div>
<script type="text/javascript">
wbos.CssTools.MediaQueryFallBack.LoadCss('../css/screen.css', '../css/handheld.css', 660)
codeview.classFilter.Init()
</script>
</body>
</html>