Files
shiny/tutorial/index.html
Yihui Xie d3952b60af whenever manageNextPrev() is called, the page should scroll to top
this should also happen in hashchange() so that clicking on the links in the left navigation panel will bring the page to top
2013-09-09 13:54:44 -05:00

483 lines
22 KiB
HTML

---
title: "Tutorial: Building 'Shiny' Applications with R"
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Tutorial: Building 'Shiny' Applications with R</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<base target="_blank"/>
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700,400italic,600italic,700italic' rel='stylesheet' type='text/css'>
<style>
body {
padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
font-family: 'Source Sans Pro', sans-serif;
font-size: 15px;
line-height: 1.5;
}
.responsive-image {
max-width: 100%;
}
.console {
color: blue;
}
code {
background-color: transparent;
border: none;
padding: 0;
color: #5F504D;
}
dt {
margin-top: 20px;
margin-bottom: 4px;
}
dd {
margin-left: 30px;
}
h2 {
font-size: 30px;
}
h3 {
font-size: 22px;
margin-top: 30px;
margin-bottom: 10px;
}
</style>
<link href="bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Styles for R syntax highlighter -->
<style type="text/css">
tt, code, pre {
font-family: 'DejaVu Sans Mono', 'Droid Sans Mono', 'Lucida Console', Consolas, Monaco, monospace;
}
pre .operator,
pre .paren {
color: rgb(104, 118, 135)
}
pre .literal {
color: rgb(88, 72, 246)
}
pre .number {
color: rgb(0, 0, 205);
}
pre .comment {
color: rgb(76, 136, 107);
}
pre .keyword {
color: rgb(0, 0, 255);
}
pre .identifier {
color: rgb(0, 0, 0);
}
pre .string {
color: rgb(3, 106, 7);
}
.footer {
font-size: 12px;
padding: 24px 0;
text-align: center;
}
</style>
<!-- R syntax highlighter -->
<script type="text/javascript">
var hljs=new function(){function m(p){return p.replace(/&/gm,"&amp;").replace(/</gm,"&lt;")}function f(r,q,p){return RegExp(q,"m"+(r.cI?"i":"")+(p?"g":""))}function b(r){for(var p=0;p<r.childNodes.length;p++){var q=r.childNodes[p];if(q.nodeName=="CODE"){return q}if(!(q.nodeType==3&&q.nodeValue.match(/\s+/))){break}}}function h(t,s){var p="";for(var r=0;r<t.childNodes.length;r++){if(t.childNodes[r].nodeType==3){var q=t.childNodes[r].nodeValue;if(s){q=q.replace(/\n/g,"")}p+=q}else{if(t.childNodes[r].nodeName=="BR"){p+="\n"}else{p+=h(t.childNodes[r])}}}if(/MSIE [678]/.test(navigator.userAgent)){p=p.replace(/\r/g,"\n")}return p}function a(s){var r=s.className.split(/\s+/);r=r.concat(s.parentNode.className.split(/\s+/));for(var q=0;q<r.length;q++){var p=r[q].replace(/^language-/,"");if(e[p]){return p}}}function c(q){var p=[];(function(s,t){for(var r=0;r<s.childNodes.length;r++){if(s.childNodes[r].nodeType==3){t+=s.childNodes[r].nodeValue.length}else{if(s.childNodes[r].nodeName=="BR"){t+=1}else{if(s.childNodes[r].nodeType==1){p.push({event:"start",offset:t,node:s.childNodes[r]});t=arguments.callee(s.childNodes[r],t);p.push({event:"stop",offset:t,node:s.childNodes[r]})}}}}return t})(q,0);return p}function k(y,w,x){var q=0;var z="";var s=[];function u(){if(y.length&&w.length){if(y[0].offset!=w[0].offset){return(y[0].offset<w[0].offset)?y:w}else{return w[0].event=="start"?y:w}}else{return y.length?y:w}}function t(D){var A="<"+D.nodeName.toLowerCase();for(var B=0;B<D.attributes.length;B++){var C=D.attributes[B];A+=" "+C.nodeName.toLowerCase();if(C.value!==undefined&&C.value!==false&&C.value!==null){A+='="'+m(C.value)+'"'}}return A+">"}while(y.length||w.length){var v=u().splice(0,1)[0];z+=m(x.substr(q,v.offset-q));q=v.offset;if(v.event=="start"){z+=t(v.node);s.push(v.node)}else{if(v.event=="stop"){var p,r=s.length;do{r--;p=s[r];z+=("</"+p.nodeName.toLowerCase()+">")}while(p!=v.node);s.splice(r,1);while(r<s.length){z+=t(s[r]);r++}}}}return z+m(x.substr(q))}function j(){function q(x,y,v){if(x.compiled){return}var u;var s=[];if(x.k){x.lR=f(y,x.l||hljs.IR,true);for(var w in x.k){if(!x.k.hasOwnProperty(w)){continue}if(x.k[w] instanceof Object){u=x.k[w]}else{u=x.k;w="keyword"}for(var r in u){if(!u.hasOwnProperty(r)){continue}x.k[r]=[w,u[r]];s.push(r)}}}if(!v){if(x.bWK){x.b="\\b("+s.join("|")+")\\s"}x.bR=f(y,x.b?x.b:"\\B|\\b");if(!x.e&&!x.eW){x.e="\\B|\\b"}if(x.e){x.eR=f(y,x.e)}}if(x.i){x.iR=f(y,x.i)}if(x.r===undefined){x.r=1}if(!x.c){x.c=[]}x.compiled=true;for(var t=0;t<x.c.length;t++){if(x.c[t]=="self"){x.c[t]=x}q(x.c[t],y,false)}if(x.starts){q(x.starts,y,false)}}for(var p in e){if(!e.hasOwnProperty(p)){continue}q(e[p].dM,e[p],true)}}function d(B,C){if(!j.called){j();j.called=true}function q(r,M){for(var L=0;L<M.c.length;L++){if((M.c[L].bR.exec(r)||[null])[0]==r){return M.c[L]}}}function v(L,r){if(D[L].e&&D[L].eR.test(r)){return 1}if(D[L].eW){var M=v(L-1,r);return M?M+1:0}return 0}function w(r,L){return L.i&&L.iR.test(r)}function K(N,O){var M=[];for(var L=0;L<N.c.length;L++){M.push(N.c[L].b)}var r=D.length-1;do{if(D[r].e){M.push(D[r].e)}r--}while(D[r+1].eW);if(N.i){M.push(N.i)}return f(O,M.join("|"),true)}function p(M,L){var N=D[D.length-1];if(!N.t){N.t=K(N,E)}N.t.lastIndex=L;var r=N.t.exec(M);return r?[M.substr(L,r.index-L),r[0],false]:[M.substr(L),"",true]}function z(N,r){var L=E.cI?r[0].toLowerCase():r[0];var M=N.k[L];if(M&&M instanceof Array){return M}return false}function F(L,P){L=m(L);if(!P.k){return L}var r="";var O=0;P.lR.lastIndex=0;var M=P.lR.exec(L);while(M){r+=L.substr(O,M.index-O);var N=z(P,M);if(N){x+=N[1];r+='<span class="'+N[0]+'">'+M[0]+"</span>"}else{r+=M[0]}O=P.lR.lastIndex;M=P.lR.exec(L)}return r+L.substr(O,L.length-O)}function J(L,M){if(M.sL&&e[M.sL]){var r=d(M.sL,L);x+=r.keyword_count;return r.value}else{return F(L,M)}}function I(M,r){var L=M.cN?'<span class="'+M.cN+'">':"";if(M.rB){y+=L;M.buffer=""}else{if(M.eB){y+=m(r)+L;M.buffer=""}else{y+=L;M.buffer=r}}D.push(M);A+=M.r}function G(N,M,Q){var R=D[D.length-1];if(Q){y+=J(R.buffer+N,R);return false}var P=q(M,R);if(P){y+=J(R.buffer+N,R);I(P,M);return P.rB}var L=v(D.length-1,M);if(L){var O=R.cN?"</span>":"";if(R.rE){y+=J(R.buffer+N,R)+O}else{if(R.eE){y+=J(R.buffer+N,R)+O+m(M)}else{y+=J(R.buffer+N+M,R)+O}}while(L>1){O=D[D.length-2].cN?"</span>":"";y+=O;L--;D.length--}var r=D[D.length-1];D.length--;D[D.length-1].buffer="";if(r.starts){I(r.starts,"")}return R.rE}if(w(M,R)){throw"Illegal"}}var E=e[B];var D=[E.dM];var A=0;var x=0;var y="";try{var s,u=0;E.dM.buffer="";do{s=p(C,u);var t=G(s[0],s[1],s[2]);u+=s[0].length;if(!t){u+=s[1].length}}while(!s[2]);if(D.length>1){throw"Illegal"}return{r:A,keyword_count:x,value:y}}catch(H){if(H=="Illegal"){return{r:0,keyword_count:0,value:m(C)}}else{throw H}}}function g(t){var p={keyword_count:0,r:0,value:m(t)};var r=p;for(var q in e){if(!e.hasOwnProperty(q)){continue}var s=d(q,t);s.language=q;if(s.keyword_count+s.r>r.keyword_count+r.r){r=s}if(s.keyword_count+s.r>p.keyword_count+p.r){r=p;p=s}}if(r.language){p.second_best=r}return p}function i(r,q,p){if(q){r=r.replace(/^((<[^>]+>|\t)+)/gm,function(t,w,v,u){return w.replace(/\t/g,q)})}if(p){r=r.replace(/\n/g,"<br>")}return r}function n(t,w,r){var x=h(t,r);var v=a(t);var y,s;if(v){y=d(v,x)}else{return}var q=c(t);if(q.length){s=document.createElement("pre");s.innerHTML=y.value;y.value=k(q,c(s),x)}y.value=i(y.value,w,r);var u=t.className;if(!u.match("(\\s|^)(language-)?"+v+"(\\s|$)")){u=u?(u+" "+v):v}if(/MSIE [678]/.test(navigator.userAgent)&&t.tagName=="CODE"&&t.parentNode.tagName=="PRE"){s=t.parentNode;var p=document.createElement("div");p.innerHTML="<pre><code>"+y.value+"</code></pre>";t=p.firstChild.firstChild;p.firstChild.cN=s.cN;s.parentNode.replaceChild(p.firstChild,s)}else{t.innerHTML=y.value}t.className=u;t.result={language:v,kw:y.keyword_count,re:y.r};if(y.second_best){t.second_best={language:y.second_best.language,kw:y.second_best.keyword_count,re:y.second_best.r}}}function o(){if(o.called){return}o.called=true;var r=document.getElementsByTagName("pre");for(var p=0;p<r.length;p++){var q=b(r[p]);if(q){n(q,hljs.tabReplace)}}}function l(){if(window.addEventListener){window.addEventListener("DOMContentLoaded",o,false);window.addEventListener("load",o,false)}else{if(window.attachEvent){window.attachEvent("onload",o)}else{window.onload=o}}}var e={};this.LANGUAGES=e;this.highlight=d;this.highlightAuto=g;this.fixMarkup=i;this.highlightBlock=n;this.initHighlighting=o;this.initHighlightingOnLoad=l;this.IR="[a-zA-Z][a-zA-Z0-9_]*";this.UIR="[a-zA-Z_][a-zA-Z0-9_]*";this.NR="\\b\\d+(\\.\\d+)?";this.CNR="\\b(0[xX][a-fA-F0-9]+|(\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)";this.BNR="\\b(0b[01]+)";this.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|\\.|-|-=|/|/=|:|;|<|<<|<<=|<=|=|==|===|>|>=|>>|>>=|>>>|>>>=|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~";this.ER="(?![\\s\\S])";this.BE={b:"\\\\.",r:0};this.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[this.BE],r:0};this.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[this.BE],r:0};this.CLCM={cN:"comment",b:"//",e:"$"};this.CBLCLM={cN:"comment",b:"/\\*",e:"\\*/"};this.HCM={cN:"comment",b:"#",e:"$"};this.NM={cN:"number",b:this.NR,r:0};this.CNM={cN:"number",b:this.CNR,r:0};this.BNM={cN:"number",b:this.BNR,r:0};this.inherit=function(r,s){var p={};for(var q in r){p[q]=r[q]}if(s){for(var q in s){p[q]=s[q]}}return p}}();hljs.LANGUAGES.cpp=function(){var a={keyword:{"false":1,"int":1,"float":1,"while":1,"private":1,"char":1,"catch":1,"export":1,virtual:1,operator:2,sizeof:2,dynamic_cast:2,typedef:2,const_cast:2,"const":1,struct:1,"for":1,static_cast:2,union:1,namespace:1,unsigned:1,"long":1,"throw":1,"volatile":2,"static":1,"protected":1,bool:1,template:1,mutable:1,"if":1,"public":1,friend:2,"do":1,"return":1,"goto":1,auto:1,"void":2,"enum":1,"else":1,"break":1,"new":1,extern:1,using:1,"true":1,"class":1,asm:1,"case":1,typeid:1,"short":1,reinterpret_cast:2,"default":1,"double":1,register:1,explicit:1,signed:1,typename:1,"try":1,"this":1,"switch":1,"continue":1,wchar_t:1,inline:1,"delete":1,alignof:1,char16_t:1,char32_t:1,constexpr:1,decltype:1,noexcept:1,nullptr:1,static_assert:1,thread_local:1,restrict:1,_Bool:1,complex:1},built_in:{std:1,string:1,cin:1,cout:1,cerr:1,clog:1,stringstream:1,istringstream:1,ostringstream:1,auto_ptr:1,deque:1,list:1,queue:1,stack:1,vector:1,map:1,set:1,bitset:1,multiset:1,multimap:1,unordered_set:1,unordered_map:1,unordered_multiset:1,unordered_multimap:1,array:1,shared_ptr:1}};return{dM:{k:a,i:"</",c:[hljs.CLCM,hljs.CBLCLM,hljs.QSM,{cN:"string",b:"'\\\\?.",e:"'",i:"."},{cN:"number",b:"\\b(\\d+(\\.\\d*)?|\\.\\d+)(u|U|l|L|ul|UL|f|F)"},hljs.CNM,{cN:"preprocessor",b:"#",e:"$"},{cN:"stl_container",b:"\\b(deque|list|queue|stack|vector|map|set|bitset|multiset|multimap|unordered_map|unordered_set|unordered_multiset|unordered_multimap|array)\\s*<",e:">",k:a,r:10,c:["self"]}]}}}();hljs.LANGUAGES.r={dM:{c:[hljs.HCM,{cN:"number",b:"\\b0[xX][0-9a-fA-F]+[Li]?\\b",e:hljs.IMMEDIATE_RE,r:0},{cN:"number",b:"\\b\\d+(?:[eE][+\\-]?\\d*)?L\\b",e:hljs.IMMEDIATE_RE,r:0},{cN:"number",b:"\\b\\d+\\.(?!\\d)(?:i\\b)?",e:hljs.IMMEDIATE_RE,r:1},{cN:"number",b:"\\b\\d+(?:\\.\\d*)?(?:[eE][+\\-]?\\d*)?i?\\b",e:hljs.IMMEDIATE_RE,r:0},{cN:"number",b:"\\.\\d+(?:[eE][+\\-]?\\d*)?i?\\b",e:hljs.IMMEDIATE_RE,r:1},{cN:"keyword",b:"(?:tryCatch|library|setGeneric|setGroupGeneric)\\b",e:hljs.IMMEDIATE_RE,r:10},{cN:"keyword",b:"\\.\\.\\.",e:hljs.IMMEDIATE_RE,r:10},{cN:"keyword",b:"\\.\\.\\d+(?![\\w.])",e:hljs.IMMEDIATE_RE,r:10},{cN:"keyword",b:"\\b(?:function)",e:hljs.IMMEDIATE_RE,r:2},{cN:"keyword",b:"(?:if|in|break|next|repeat|else|for|return|switch|while|try|stop|warning|require|attach|detach|source|setMethod|setClass)\\b",e:hljs.IMMEDIATE_RE,r:1},{cN:"literal",b:"(?:NA|NA_integer_|NA_real_|NA_character_|NA_complex_)\\b",e:hljs.IMMEDIATE_RE,r:10},{cN:"literal",b:"(?:NULL|TRUE|FALSE|T|F|Inf|NaN)\\b",e:hljs.IMMEDIATE_RE,r:1},{cN:"identifier",b:"[a-zA-Z.][a-zA-Z0-9._]*\\b",e:hljs.IMMEDIATE_RE,r:0},{cN:"operator",b:"<\\-(?!\\s*\\d)",e:hljs.IMMEDIATE_RE,r:2},{cN:"operator",b:"\\->|<\\-",e:hljs.IMMEDIATE_RE,r:1},{cN:"operator",b:"%%|~",e:hljs.IMMEDIATE_RE},{cN:"operator",b:">=|<=|==|!=|\\|\\||&&|=|\\+|\\-|\\*|/|\\^|>|<|!|&|\\||\\$|:",e:hljs.IMMEDIATE_RE,r:0},{cN:"operator",b:"%",e:"%",i:"\\n",r:1},{cN:"identifier",b:"`",e:"`",r:0},{cN:"string",b:'"',e:'"',c:[hljs.BE],r:0},{cN:"string",b:"'",e:"'",c:[hljs.BE],r:0},{cN:"paren",b:"[[({\\])}]",e:hljs.IMMEDIATE_RE,r:0}]}};
hljs.initHighlightingOnLoad();
</script>
<script src="jquery.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-20375833-5']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<!-- Top navigation bar -->
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="#">Tutorial: Building 'Shiny' Applications with R</a>
<a class="btn btn-primary pull-right" href="https://github.com/rstudio/shiny" target="_blank">Shiny on GitHub</a>
</div>
</div>
</div>
<!-- Document body -->
<div class="container-fluid">
<div class="row-fluid">
<!-- Side navigation bar -->
<div class="span4 well">
<ul class = "nav nav-list">
<li class="nav-header">Getting Started</li>
<li class="active">
<a target="_self" href="#welcome">Welcome</a>
</li>
<li>
<a target="_self" href="#hello-shiny">Hello Shiny</a>
</li>
<li>
<a target="_self" href="#shiny-text">Shiny Text</a>
</li>
<li>
<a target="_self" href="#reactivity">Reactivity</a>
</li>
<li class="nav-header">Building an App</li>
<li>
<a target="_self" href="#ui-and-server">UI &amp; Server</a>
</li>
<li>
<a target="_self" href="#inputs-and-outputs">Inputs &amp; Outputs</a>
</li>
<li>
<a target="_self" href="#run-and-debug">Run &amp; Debug</a>
</li>
<li class="nav-header">Tooling Up</li>
<li>
<a target="_self" href="#sliders">Sliders</a>
</li>
<li>
<a target="_self" href="#tabsets">Tabsets</a>
</li>
<li>
<a target="_self" href="#more-widgets">More Widgets</a>
</li>
<li>
<a target="_self" href="#uploads">Uploading Files</a>
</li>
<li>
<a target="_self" href="#downloads">Downloading Data</a>
</li>
<li>
<a target="_self" href="#html-ui">HTML UI</a>
</li>
<li>
<a target="_self" href="#dynamic-ui">Dynamic UI</a>
</li>
<li class="nav-header">Advanced Shiny</li>
<li>
<a target="_self" href="#scoping">Scoping</a>
</li>
<li>
<a target="_self" href="#client-data">Client Data</a>
</li>
<li>
<a target="_self" href="#sending-images">Sending Images</a>
</li>
<li class="nav-header">Understanding Reactivity</li>
<li>
<a target="_self" href="#reactivity-overview">Reactivity Overview</a>
</li>
<li>
<a target="_self" href="#execution-scheduling">Execution Scheduling</a>
</li>
<li>
<a target="_self" href="#isolation">Isolation</a>
</li>
<li class="nav-header">Deploying and Sharing Apps</li>
<li>
<a target="_self" href="#deployment-web">Deploying Over the Web</a>
</li>
<li>
<a target="_self" href="#deployment-local">Sharing Apps to Run Locally</a>
</li>
<li class="nav-header">Extending Shiny</li>
<li>
<a target="_self" href="#building-inputs">Building Inputs</a>
</li>
<li>
<a target="_self" href="#building-outputs">Building Outputs</a>
</li>
<!--
<li>
<a target="_self" href="#packaging-components">Packaging Components</a>
</li>
-->
</ul>
</div>
<!-- Tabs -->
<div class="span8 tab-content">
<!-- Welcome -->
<div class="tab-pane active" id="welcome">
{% capture welcome %}{% include tutorial/welcome.md %}{% endcapture %}
{{ welcome | markdownify }}
</div>
<!-- Hello Shiny -->
<div class="tab-pane" id="hello-shiny">
{% capture hello_shiny %}{% include tutorial/hello-shiny.md %}{% endcapture %}
{{ hello_shiny | markdownify }}
</div>
<!-- Shiny Text -->
<div class="tab-pane" id="shiny-text">
{% capture shiny_text %}{% include tutorial/shiny-text.md %}{% endcapture %}
{{ shiny_text | markdownify }}
</div>
<!-- Reactivity -->
<div class="tab-pane" id="reactivity">
{% capture reactivity %}{% include tutorial/reactivity.md %}{% endcapture %}
{{ reactivity | markdownify }}
</div>
<!-- UI and Server -->
<div class="tab-pane" id="ui-and-server">
{% capture ui_and_server %}{% include tutorial/ui-and-server.md %}{% endcapture %}
{{ ui_and_server | markdownify }}
</div>
<!-- Inputs and Outputs -->
<div class="tab-pane" id="inputs-and-outputs">
{% capture inputs_and_outputs %}{% include tutorial/inputs-and-outputs.md %}{% endcapture %}
{{ inputs_and_outputs | markdownify }}
</div>
<!-- Edit, Run, Debug -->
<div class="tab-pane" id="run-and-debug">
{% capture run_and_debug %}{% include tutorial/run-and-debug.md %}{% endcapture %}
{{ run_and_debug | markdownify }}
</div>
<!-- Sliders -->
<div class="tab-pane" id="sliders">
{% capture sliders %}{% include tutorial/sliders.md %}{% endcapture %}
{{ sliders | markdownify }}
</div>
<!-- Tabsets -->
<div class="tab-pane" id="tabsets">
{% capture tabsets %}{% include tutorial/tabsets.md %}{% endcapture %}
{{ tabsets | markdownify }}
</div>
<!-- More Widgets -->
<div class="tab-pane" id="more-widgets">
{% capture more_widgets %}{% include tutorial/more-widgets.md %}{% endcapture %}
{{ more_widgets | markdownify }}
</div>
<!-- Uploading Data -->
<div class="tab-pane" id="uploads">
{% capture uploads %}{% include tutorial/uploads.md %}{% endcapture %}
{{ uploads | markdownify }}
</div>
<!-- Downloading Data -->
<div class="tab-pane" id="downloads">
{% capture downloads %}{% include tutorial/downloads.md %}{% endcapture %}
{{ downloads | markdownify }}
</div>
<!-- Dynamic UI -->
<div class="tab-pane" id="dynamic-ui">
{% capture dynamic_ui %}{% include tutorial/dynamic-ui.md %}{% endcapture %}
{{ dynamic_ui | markdownify }}
</div>
<!-- HTML UI -->
<div class="tab-pane" id="html-ui">
{% capture html_ui %}{% include tutorial/html-ui.md %}{% endcapture %}
{{ html_ui | markdownify }}
</div>
<!-- Scoping -->
<div class="tab-pane" id="scoping">
{% capture scoping %}{% include tutorial/scoping.md %}{% endcapture %}
{{ scoping | markdownify }}
</div>
<!-- Client Data -->
<div class="tab-pane" id="client-data">
{% capture client_data %}{% include tutorial/client-data.md %}{% endcapture %}
{{ client_data | markdownify }}
</div>
<!-- Sending Images -->
<div class="tab-pane" id="sending-images">
{% capture sending_images %}{% include tutorial/sending-images.md %}{% endcapture %}
{{ sending_images | markdownify }}
</div>
<!-- Reactivity Overview -->
<div class="tab-pane" id="reactivity-overview">
{% capture reactivity_overview %}{% include tutorial/reactivity-overview.md %}{% endcapture %}
{{ reactivity_overview | markdownify }}
</div>
<!-- Execution Scheduling -->
<div class="tab-pane" id="execution-scheduling">
{% capture execution_scheduling %}{% include tutorial/execution-scheduling.md %}{% endcapture %}
{{ execution_scheduling | markdownify }}
</div>
<!-- Isolation -->
<div class="tab-pane" id="isolation">
{% capture isolation %}{% include tutorial/isolation.md %}{% endcapture %}
{{ isolation | markdownify }}
</div>
<!-- Deploying Shiny Apps Over the Web -->
<div class="tab-pane" id="deployment-web">
{% capture deployment_web %}{% include tutorial/deployment-web.md %}{% endcapture %}
{{ deployment_web | markdownify }}
</div>
<!-- Sharing Apps to Run Locally -->
<div class="tab-pane" id="deployment-local">
{% capture deployment_local %}{% include tutorial/deployment-local.md %}{% endcapture %}
{{ deployment_local | markdownify }}
</div>
<!-- Building Inputs -->
<div class="tab-pane" id="building-inputs">
{% capture building_inputs %}{% include tutorial/building-inputs.md %}{% endcapture %}
{{ building_inputs | markdownify }}
</div>
<!-- Building Outputs -->
<div class="tab-pane" id="building-outputs">
{% capture building_outputs %}{% include tutorial/building-outputs.md %}{% endcapture %}
{{ building_outputs | markdownify }}
</div>
<ul class="pager">
<li><a href="#" id="previous">&larr; Previous</a></li>
<li><a href="#" id="next">Next &rarr;</a></li>
</ul>
</div>
</div>
<div class="row-fluid footer">
&copy; 2012-2013 RStudio, Inc. All rights reserved.<br/>Code samples in this tutorial are released under the <a href="http://creativecommons.org/about/cc0">Creative Commons Zero 1.0</a> license (CC0).
</div>
</div>
<!-- Placed at the end of the document so the pages load faster -->
<script src="jquery.ba-hashchange.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script>
function manageNextPrev() {
$('a#next').parent().toggleClass('disabled', $('.nav li.active').nextAll('li:not(.nav-header)').size() == 0);
$('a#previous').parent().toggleClass('disabled', $('.nav li.active').prevAll('li:not(.nav-header)').size() == 0);
$('html,body').scrollTop(0);
}
manageNextPrev();
$('a#next').click(function(e) {
e.preventDefault();
location.href = $('.nav li.active').nextAll('li:not(.nav-header)').first().find('a').attr('href');
manageNextPrev();
});
$('a#previous').click(function(e) {
e.preventDefault();
location.href = $('.nav li.active').prevAll('li:not(.nav-header)').first().find('a').attr('href');
manageNextPrev();
});
$(window).hashchange(function() {
$('.tab-pane').hide();
var tab = location.hash || '#welcome';
$(tab + '.tab-pane').show();
$('.nav li.active').removeClass('active');
$('.nav li a[href="' + tab + '"]').parent().addClass('active');
manageNextPrev();
});
$(window).hashchange();
</script>
</body>
</html>