123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <!-- configuration parameters -->
- <meta name="defaultView" content="slideshow" />
- <meta name="controlVis" content="hidden" />
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <meta name="generator" content="pandoc" />
- <style type="text/css" media="projection" id="slideProj">
- /* Do not edit or override these styles! The system will likely break if you do. */
- div#header, div#footer, div#controls, .slide {position: absolute;}
- html>body div#header, html>body div#footer,
- html>body div#controls, html>body .slide {position: fixed;}
- .handout {display: none;}
- .layout {display: block;}
- .slide, .hideme, .incremental {visibility: hidden;}
- #slide0 {visibility: visible;}
- /* The following styles size, place, and layer the slide components.
- Edit these if you want to change the overall slide layout.
- The commented lines can be uncommented (and modified, if necessary)
- to help you with the rearrangement process. */
- /* target = 1024x768 */
- div#header, div#footer, .slide {width: 100%; top: 0; left: 0;}
- div#header {top: 0; height: 3em; z-index: 1;}
- div#footer {top: auto; bottom: 0; height: 2.5em; z-index: 5;}
- .slide {top: 0; width: 92%; padding: 3.5em 4% 4%; z-index: 2; list-style: none;}
- div#controls {left: 50%; bottom: 0; width: 50%; z-index: 100;}
- div#controls form {position: absolute; bottom: 0; right: 0; width: 100%;
- margin: 0;}
- #currentSlide {position: absolute; width: 10%; left: 45%; bottom: 1em; z-index: 10;}
- html>body #currentSlide {position: fixed;}
- /*
- div#header {background: #FCC;}
- div#footer {background: #CCF;}
- div#controls {background: #BBD;}
- div#currentSlide {background: #FFC;}
- */
- /* Following are the presentation styles -- edit away! */
- body {background: #FFF url(bodybg.gif) -16px 0 no-repeat; color: #000; font-size: 2em;}
- :link, :visited {text-decoration: none; color: #00C;}
- #controls :active {color: #88A !important;}
- #controls :focus {outline: 1px dotted #227;}
- h1, h2, h3, h4 {font-size: 100%; margin: 0; padding: 0; font-weight: inherit;}
- ul, pre {margin: 0; line-height: 1em;}
- html, body {margin: 0; padding: 0;}
- blockquote, q {font-style: italic;}
- blockquote {padding: 0 2em 0.5em; margin: 0 1.5em 0.5em; text-align: center; font-size: 1em;}
- blockquote p {margin: 0;}
- blockquote i {font-style: normal;}
- blockquote b {display: block; margin-top: 0.5em; font-weight: normal; font-size: smaller; font-style: normal;}
- blockquote b i {font-style: italic;}
- kbd {font-weight: bold; font-size: 1em;}
- sup {font-size: smaller; line-height: 1px;}
- .slide code {padding: 2px 0.25em; font-weight: bold; color: #533;}
- .slide code.bad, code del {color: red;}
- .slide code.old {color: silver;}
- .slide pre {padding: 0; margin: 0.25em 0 0.5em 0.5em; color: #533; font-size: 90%;}
- .slide pre code {display: block;}
- .slide ul {margin-left: 5%; margin-right: 7%; list-style: disc;}
- .slide li {margin-top: 0.75em; margin-right: 0;}
- .slide ul ul {line-height: 1;}
- .slide ul ul li {margin: .2em; font-size: 85%; list-style: square;}
- .slide img.leader {display: block; margin: 0 auto;}
- div#header, div#footer {background: #005; color: #AAB;
- font-family: Verdana, Helvetica, sans-serif;}
- div#header {background: #005 url(bodybg.gif) -16px 0 no-repeat;
- line-height: 1px;}
- div#footer {font-size: 0.5em; font-weight: bold; padding: 1em 0;}
- #footer h1, #footer h2 {display: block; padding: 0 1em;}
- #footer h2 {font-style: italic;}
- div.long {font-size: 0.75em;}
- .slide h1 {position: absolute; top: 0.7em; left: 87px; z-index: 1;
- margin: 0; padding: 0.3em 0 0 50px; white-space: nowrap;
- font: bold 150%/1em Helvetica, sans-serif; text-transform: capitalize;
- color: #DDE; background: #005;}
- .slide h3 {font-size: 130%;}
- h1 abbr {font-variant: small-caps;}
- div#controls {position: absolute; left: 50%; bottom: 0;
- width: 50%;
- text-align: right; font: bold 0.9em Verdana, Helvetica, sans-serif;}
- html>body div#controls {position: fixed; padding: 0 0 1em 0;
- top: auto;}
- div#controls form {position: absolute; bottom: 0; right: 0; width: 100%;
- margin: 0; padding: 0;}
- #controls #navLinks a {padding: 0; margin: 0 0.5em;
- background: #005; border: none; color: #779;
- cursor: pointer;}
- #controls #navList {height: 1em;}
- #controls #navList #jumplist {position: absolute; bottom: 0; right: 0; background: #DDD; color: #227;}
- #currentSlide {text-align: center; font-size: 0.5em; color: #449;}
- #slide0 {padding-top: 3.5em; font-size: 90%;}
- #slide0 h1 {position: static; margin: 1em 0 0; padding: 0;
- font: bold 2em Helvetica, sans-serif; white-space: normal;
- color: #000; background: transparent;}
- #slide0 h2 {font: bold italic 1em Helvetica, sans-serif; margin: 0.25em;}
- #slide0 h3 {margin-top: 1.5em; font-size: 1.5em;}
- #slide0 h4 {margin-top: 0; font-size: 1em;}
- ul.urls {list-style: none; display: inline; margin: 0;}
- .urls li {display: inline; margin: 0;}
- .note {display: none;}
- .external {border-bottom: 1px dotted gray;}
- html>body .external {border-bottom: none;}
- .external:after {content: " \274F"; font-size: smaller; color: #77B;}
- .incremental, .incremental *, .incremental *:after {color: #DDE; visibility: visible;}
- img.incremental {visibility: hidden;}
- .slide .current {color: #B02;}
- /* diagnostics
- li:after {content: " [" attr(class) "]"; color: #F88;}
- */
- </style>
- <style type="text/css" media="projection" id="operaFix">
- /* DO NOT CHANGE THESE unless you really want to break Opera Show */
- .slide {
- visibility: visible !important;
- position: static !important;
- page-break-before: always;
- }
- #slide0 {page-break-before: avoid;}
- </style>
- <style type="text/css" media="screen" id="outlineStyle">
- /* don't change this unless you want the layout stuff to show up in the outline view! */
- .layout div, #footer *, #controlForm * {display: none;}
- #footer, #controls, #controlForm, #navLinks, #toggle {
- display: block; visibility: visible; margin: 0; padding: 0;}
- #toggle {float: right; padding: 0.5em;}
- html>body #toggle {position: fixed; top: 0; right: 0;}
- /* making the outline look pretty-ish */
- #slide0 h1, #slide0 h2, #slide0 h3, #slide0 h4 {border: none; margin: 0;}
- #slide0 h1 {padding-top: 1.5em;}
- .slide h1 {margin: 1.5em 0 0; padding-top: 0.25em;
- border-top: 1px solid #888; border-bottom: 1px solid #AAA;}
- #toggle {border: 1px solid; border-width: 0 0 1px 1px; background: #FFF;}
- </style>
- <style type="text/css" media="print" id="slidePrint">
- /* The following rule is necessary to have all slides appear in print! DO NOT REMOVE IT! */
- .slide, ul {page-break-inside: avoid; visibility: visible !important;}
- h1 {page-break-after: avoid;}
- body {font-size: 12pt; background: white;}
- * {color: black;}
- #slide0 h1 {font-size: 200%; border: none; margin: 0.5em 0 0.25em;}
- #slide0 h3 {margin: 0; padding: 0;}
- #slide0 h4 {margin: 0 0 0.5em; padding: 0;}
- #slide0 {margin-bottom: 3em;}
- h1 {border-top: 2pt solid gray; border-bottom: 1px dotted silver;}
- .extra {background: transparent !important;}
- div.extra, pre.extra, .example {font-size: 10pt; color: #333;}
- ul.extra a {font-weight: bold;}
- p.example {display: none;}
- #header {display: none;}
- #footer h1 {margin: 0; border-bottom: 1px solid; color: gray; font-style: italic;}
- #footer h2, #controls {display: none;}
- /* The following rule keeps the layout stuff out of print. Remove at your own risk! */
- .layout, .layout * {display: none !important;}
- </style>
- <script type="text/javascript">
- // S5 v1.1 slides.js -- released into the Public Domain
- //
- // Please see http://www.meyerweb.com/eric/tools/s5/credits.html for information
- // about all the wonderful and talented contributors to this code!
- var undef;
- var slideCSS = '';
- var snum = 0;
- var smax = 1;
- var incpos = 0;
- var number = undef;
- var s5mode = true;
- var defaultView = 'slideshow';
- var controlVis = 'visible';
- var isIE = navigator.appName == 'Microsoft Internet Explorer' && navigator.userAgent.indexOf('Opera') < 1 ? 1 : 0;
- var isOp = navigator.userAgent.indexOf('Opera') > -1 ? 1 : 0;
- var isGe = navigator.userAgent.indexOf('Gecko') > -1 && navigator.userAgent.indexOf('Safari') < 1 ? 1 : 0;
- function hasClass(object, className) {
- if (!object.className) return false;
- return (object.className.search('(^|\\s)' + className + '(\\s|$)') != -1);
- }
- function hasValue(object, value) {
- if (!object) return false;
- return (object.search('(^|\\s)' + value + '(\\s|$)') != -1);
- }
- function removeClass(object,className) {
- if (!object) return;
- object.className = object.className.replace(new RegExp('(^|\\s)'+className+'(\\s|$)'), RegExp.$1+RegExp.$2);
- }
- function addClass(object,className) {
- if (!object || hasClass(object, className)) return;
- if (object.className) {
- object.className += ' '+className;
- } else {
- object.className = className;
- }
- }
- function GetElementsWithClassName(elementName,className) {
- var allElements = document.getElementsByTagName(elementName);
- var elemColl = new Array();
- for (var i = 0; i< allElements.length; i++) {
- if (hasClass(allElements[i], className)) {
- elemColl[elemColl.length] = allElements[i];
- }
- }
- return elemColl;
- }
- function isParentOrSelf(element, id) {
- if (element == null || element.nodeName=='BODY') return false;
- else if (element.id == id) return true;
- else return isParentOrSelf(element.parentNode, id);
- }
- function nodeValue(node) {
- var result = "";
- if (node.nodeType == 1) {
- var children = node.childNodes;
- for (var i = 0; i < children.length; ++i) {
- result += nodeValue(children[i]);
- }
- }
- else if (node.nodeType == 3) {
- result = node.nodeValue;
- }
- return(result);
- }
- function slideLabel() {
- var slideColl = GetElementsWithClassName('*','slide');
- var list = document.getElementById('jumplist');
- smax = slideColl.length;
- for (var n = 0; n < smax; n++) {
- var obj = slideColl[n];
- var did = 'slide' + n.toString();
- obj.setAttribute('id',did);
- if (isOp) continue;
- var otext = '';
- var menu = obj.firstChild;
- if (!menu) continue; // to cope with empty slides
- while (menu && menu.nodeType == 3) {
- menu = menu.nextSibling;
- }
- if (!menu) continue; // to cope with slides with only text nodes
- var menunodes = menu.childNodes;
- for (var o = 0; o < menunodes.length; o++) {
- otext += nodeValue(menunodes[o]);
- }
- list.options[list.length] = new Option(n + ' : ' + otext, n);
- }
- }
- function currentSlide() {
- var cs;
- if (document.getElementById) {
- cs = document.getElementById('currentSlide');
- } else {
- cs = document.currentSlide;
- }
- cs.innerHTML = '<span id="csHere">' + snum + '<\/span> ' +
- '<span id="csSep">\/<\/span> ' +
- '<span id="csTotal">' + (smax-1) + '<\/span>';
- if (snum == 0) {
- cs.style.visibility = 'hidden';
- } else {
- cs.style.visibility = 'visible';
- }
- }
- function go(step) {
- if (document.getElementById('slideProj').disabled || step == 0) return;
- var jl = document.getElementById('jumplist');
- var cid = 'slide' + snum;
- var ce = document.getElementById(cid);
- if (incrementals[snum].length > 0) {
- for (var i = 0; i < incrementals[snum].length; i++) {
- removeClass(incrementals[snum][i], 'current');
- removeClass(incrementals[snum][i], 'incremental');
- }
- }
- if (step != 'j') {
- snum += step;
- lmax = smax - 1;
- if (snum > lmax) snum = lmax;
- if (snum < 0) snum = 0;
- } else
- snum = parseInt(jl.value);
- var nid = 'slide' + snum;
- var ne = document.getElementById(nid);
- if (!ne) {
- ne = document.getElementById('slide0');
- snum = 0;
- }
- if (step < 0) {incpos = incrementals[snum].length} else {incpos = 0;}
- if (incrementals[snum].length > 0 && incpos == 0) {
- for (var i = 0; i < incrementals[snum].length; i++) {
- if (hasClass(incrementals[snum][i], 'current'))
- incpos = i + 1;
- else
- addClass(incrementals[snum][i], 'incremental');
- }
- }
- if (incrementals[snum].length > 0 && incpos > 0)
- addClass(incrementals[snum][incpos - 1], 'current');
- ce.style.visibility = 'hidden';
- ne.style.visibility = 'visible';
- jl.selectedIndex = snum;
- currentSlide();
- number = 0;
- }
- function goTo(target) {
- if (target >= smax || target == snum) return;
- go(target - snum);
- }
- function subgo(step) {
- if (step > 0) {
- removeClass(incrementals[snum][incpos - 1],'current');
- removeClass(incrementals[snum][incpos], 'incremental');
- addClass(incrementals[snum][incpos],'current');
- incpos++;
- } else {
- incpos--;
- removeClass(incrementals[snum][incpos],'current');
- addClass(incrementals[snum][incpos], 'incremental');
- addClass(incrementals[snum][incpos - 1],'current');
- }
- }
- function toggle() {
- var slideColl = GetElementsWithClassName('*','slide');
- var slides = document.getElementById('slideProj');
- var outline = document.getElementById('outlineStyle');
- if (!slides.disabled) {
- slides.disabled = true;
- outline.disabled = false;
- s5mode = false;
- fontSize('1em');
- for (var n = 0; n < smax; n++) {
- var slide = slideColl[n];
- slide.style.visibility = 'visible';
- }
- } else {
- slides.disabled = false;
- outline.disabled = true;
- s5mode = true;
- fontScale();
- for (var n = 0; n < smax; n++) {
- var slide = slideColl[n];
- slide.style.visibility = 'hidden';
- }
- slideColl[snum].style.visibility = 'visible';
- }
- }
- function showHide(action) {
- var obj = GetElementsWithClassName('*','hideme')[0];
- switch (action) {
- case 's': obj.style.visibility = 'visible'; break;
- case 'h': obj.style.visibility = 'hidden'; break;
- case 'k':
- if (obj.style.visibility != 'visible') {
- obj.style.visibility = 'visible';
- } else {
- obj.style.visibility = 'hidden';
- }
- break;
- }
- }
- // 'keys' code adapted from MozPoint (http://mozpoint.mozdev.org/)
- function keys(key) {
- if (!key) {
- key = event;
- key.which = key.keyCode;
- }
- if (key.which == 84) {
- toggle();
- return;
- }
- if (s5mode) {
- switch (key.which) {
- case 10: // return
- case 13: // enter
- if (window.event && isParentOrSelf(window.event.srcElement, 'controls')) return;
- if (key.target && isParentOrSelf(key.target, 'controls')) return;
- if(number != undef) {
- goTo(number);
- break;
- }
- case 32: // spacebar
- case 34: // page down
- case 39: // rightkey
- case 40: // downkey
- if(number != undef) {
- go(number);
- } else if (!incrementals[snum] || incpos >= incrementals[snum].length) {
- go(1);
- } else {
- subgo(1);
- }
- break;
- case 33: // page up
- case 37: // leftkey
- case 38: // upkey
- if(number != undef) {
- go(-1 * number);
- } else if (!incrementals[snum] || incpos <= 0) {
- go(-1);
- } else {
- subgo(-1);
- }
- break;
- case 36: // home
- goTo(0);
- break;
- case 35: // end
- goTo(smax-1);
- break;
- case 67: // c
- showHide('k');
- break;
- }
- if (key.which < 48 || key.which > 57) {
- number = undef;
- } else {
- if (window.event && isParentOrSelf(window.event.srcElement, 'controls')) return;
- if (key.target && isParentOrSelf(key.target, 'controls')) return;
- number = (((number != undef) ? number : 0) * 10) + (key.which - 48);
- }
- }
- return false;
- }
- function clicker(e) {
- number = undef;
- var target;
- if (window.event) {
- target = window.event.srcElement;
- e = window.event;
- } else target = e.target;
- if (target.getAttribute('href') != null || hasValue(target.rel, 'external') || isParentOrSelf(target, 'controls') || isParentOrSelf(target,'embed') || isParentOrSelf(target,'object')) return true;
- if (!e.which || e.which == 1) {
- if (!incrementals[snum] || incpos >= incrementals[snum].length) {
- go(1);
- } else {
- subgo(1);
- }
- }
- }
- function findSlide(hash) {
- var target = null;
- var slides = GetElementsWithClassName('*','slide');
- for (var i = 0; i < slides.length; i++) {
- var targetSlide = slides[i];
- if ( (targetSlide.name && targetSlide.name == hash)
- || (targetSlide.id && targetSlide.id == hash) ) {
- target = targetSlide;
- break;
- }
- }
- while(target != null && target.nodeName != 'BODY') {
- if (hasClass(target, 'slide')) {
- return parseInt(target.id.slice(5));
- }
- target = target.parentNode;
- }
- return null;
- }
- function slideJump() {
- if (window.location.hash == null) return;
- var sregex = /^#slide(\d+)$/;
- var matches = sregex.exec(window.location.hash);
- var dest = null;
- if (matches != null) {
- dest = parseInt(matches[1]);
- } else {
- dest = findSlide(window.location.hash.slice(1));
- }
- if (dest != null)
- go(dest - snum);
- }
- function fixLinks() {
- var thisUri = window.location.href;
- thisUri = thisUri.slice(0, thisUri.length - window.location.hash.length);
- var aelements = document.getElementsByTagName('A');
- for (var i = 0; i < aelements.length; i++) {
- var a = aelements[i].href;
- var slideID = a.match('\#slide[0-9]{1,2}');
- if ((slideID) && (slideID[0].slice(0,1) == '#')) {
- var dest = findSlide(slideID[0].slice(1));
- if (dest != null) {
- if (aelements[i].addEventListener) {
- aelements[i].addEventListener("click", new Function("e",
- "if (document.getElementById('slideProj').disabled) return;" +
- "go("+dest+" - snum); " +
- "if (e.preventDefault) e.preventDefault();"), true);
- } else if (aelements[i].attachEvent) {
- aelements[i].attachEvent("onclick", new Function("",
- "if (document.getElementById('slideProj').disabled) return;" +
- "go("+dest+" - snum); " +
- "event.returnValue = false;"));
- }
- }
- }
- }
- }
- function externalLinks() {
- if (!document.getElementsByTagName) return;
- var anchors = document.getElementsByTagName('a');
- for (var i=0; i<anchors.length; i++) {
- var anchor = anchors[i];
- if (anchor.getAttribute('href') && hasValue(anchor.rel, 'external')) {
- anchor.target = '_blank';
- addClass(anchor,'external');
- }
- }
- }
- function createControls() {
- var controlsDiv = document.getElementById("controls");
- if (!controlsDiv) return;
- var hider = ' onmouseover="showHide(\'s\');" onmouseout="showHide(\'h\');"';
- var hideDiv, hideList = '';
- if (controlVis == 'hidden') {
- hideDiv = hider;
- } else {
- hideList = hider;
- }
- controlsDiv.innerHTML = '<form action="#" id="controlForm"' + hideDiv + '>' +
- '<div id="navLinks">' +
- '<a accesskey="t" id="toggle" href="javascript:toggle();">Ø<\/a>' +
- '<a accesskey="z" id="prev" href="javascript:go(-1);">«<\/a>' +
- '<a accesskey="x" id="next" href="javascript:go(1);">»<\/a>' +
- '<div id="navList"' + hideList + '><select id="jumplist" onchange="go(\'j\');"><\/select><\/div>' +
- '<\/div><\/form>';
- if (controlVis == 'hidden') {
- var hidden = document.getElementById('navLinks');
- } else {
- var hidden = document.getElementById('jumplist');
- }
- addClass(hidden,'hideme');
- }
- function fontScale() { // causes layout problems in FireFox that get fixed if browser's Reload is used; same may be true of other Gecko-based browsers
- if (!s5mode) return false;
- var vScale = 22; // both yield 32 (after rounding) at 1024x768
- var hScale = 32; // perhaps should auto-calculate based on theme's declared value?
- if (window.innerHeight) {
- var vSize = window.innerHeight;
- var hSize = window.innerWidth;
- } else if (document.documentElement.clientHeight) {
- var vSize = document.documentElement.clientHeight;
- var hSize = document.documentElement.clientWidth;
- } else if (document.body.clientHeight) {
- var vSize = document.body.clientHeight;
- var hSize = document.body.clientWidth;
- } else {
- var vSize = 700; // assuming 1024x768, minus chrome and such
- var hSize = 1024; // these do not account for kiosk mode or Opera Show
- }
- var newSize = Math.min(Math.round(vSize/vScale),Math.round(hSize/hScale));
- fontSize(newSize + 'px');
- if (isGe) { // hack to counter incremental reflow bugs
- var obj = document.getElementsByTagName('body')[0];
- obj.style.display = 'none';
- obj.style.display = 'block';
- }
- }
- function fontSize(value) {
- if (!(s5ss = document.getElementById('s5ss'))) {
- if (!isIE) {
- document.getElementsByTagName('head')[0].appendChild(s5ss = document.createElement('style'));
- s5ss.setAttribute('media','screen, projection');
- s5ss.setAttribute('id','s5ss');
- } else {
- document.createStyleSheet();
- document.s5ss = document.styleSheets[document.styleSheets.length - 1];
- }
- }
- if (!isIE) {
- while (s5ss.lastChild) s5ss.removeChild(s5ss.lastChild);
- s5ss.appendChild(document.createTextNode('body {font-size: ' + value + ' !important;}'));
- } else {
- document.s5ss.addRule('body','font-size: ' + value + ' !important;');
- }
- }
- function notOperaFix() {
- slideCSS = document.getElementById('slideProj').href;
- var slides = document.getElementById('slideProj');
- var outline = document.getElementById('outlineStyle');
- slides.setAttribute('media','screen');
- outline.disabled = true;
- if (isGe) {
- slides.setAttribute('href','null'); // Gecko fix
- slides.setAttribute('href',slideCSS); // Gecko fix
- }
- if (isIE && document.styleSheets && document.styleSheets[0]) {
- document.styleSheets[0].addRule('img', 'behavior: url(ui/default/iepngfix.htc)');
- document.styleSheets[0].addRule('div', 'behavior: url(ui/default/iepngfix.htc)');
- document.styleSheets[0].addRule('.slide', 'behavior: url(ui/default/iepngfix.htc)');
- }
- }
- function getIncrementals(obj) {
- var incrementals = new Array();
- if (!obj)
- return incrementals;
- var children = obj.childNodes;
- for (var i = 0; i < children.length; i++) {
- var child = children[i];
- if (hasClass(child, 'incremental')) {
- if (child.nodeName == 'OL' || child.nodeName == 'UL') {
- removeClass(child, 'incremental');
- for (var j = 0; j < child.childNodes.length; j++) {
- if (child.childNodes[j].nodeType == 1) {
- addClass(child.childNodes[j], 'incremental');
- }
- }
- } else {
- incrementals[incrementals.length] = child;
- removeClass(child,'incremental');
- }
- }
- if (hasClass(child, 'show-first')) {
- if (child.nodeName == 'OL' || child.nodeName == 'UL') {
- removeClass(child, 'show-first');
- if (child.childNodes[isGe].nodeType == 1) {
- removeClass(child.childNodes[isGe], 'incremental');
- }
- } else {
- incrementals[incrementals.length] = child;
- }
- }
- incrementals = incrementals.concat(getIncrementals(child));
- }
- return incrementals;
- }
- function createIncrementals() {
- var incrementals = new Array();
- for (var i = 0; i < smax; i++) {
- incrementals[i] = getIncrementals(document.getElementById('slide'+i));
- }
- return incrementals;
- }
- function defaultCheck() {
- var allMetas = document.getElementsByTagName('meta');
- for (var i = 0; i< allMetas.length; i++) {
- if (allMetas[i].name == 'defaultView') {
- defaultView = allMetas[i].content;
- }
- if (allMetas[i].name == 'controlVis') {
- controlVis = allMetas[i].content;
- }
- }
- }
- // Key trap fix, new function body for trap()
- function trap(e) {
- if (!e) {
- e = event;
- e.which = e.keyCode;
- }
- try {
- modifierKey = e.ctrlKey || e.altKey || e.metaKey;
- }
- catch(e) {
- modifierKey = false;
- }
- return modifierKey || e.which == 0;
- }
- function startup() {
- defaultCheck();
- if (!isOp)
- createControls();
- slideLabel();
- fixLinks();
- externalLinks();
- fontScale();
- if (!isOp) {
- notOperaFix();
- incrementals = createIncrementals();
- slideJump();
- if (defaultView == 'outline') {
- toggle();
- }
- document.onkeyup = keys;
- document.onkeypress = trap;
- document.onclick = clicker;
- }
- }
- window.onload = startup;
- window.onresize = function(){setTimeout('fontScale()', 50);}</script>
- <meta name="author" content="John Melesky" />
- <meta name="date" content="2007-05-10" />
- <title>Bayes' Theorem</title>
- </head>
- <body>
- <div class="layout">
- <div id="controls"></div>
- <div id="currentSlide"></div>
- <div id="header"></div>
- <div id="footer">
- <h1>2007-05-10</h1>
- <h2>Bayes' Theorem</h2>
- </div>
- </div>
- <div class="presentation">
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <h3>John Melesky</h3>
- <h4>2007-05-10</h4>
- </div>
- <div class="slide">
- <h1>What is Bayes' Theorem?</h1>
- <p>
- It's a method for determining conditional probabilities.
- </p>
- <p>
- Duh.
- </p>
- <p>
- See? <a target="new" href="Bayes%27_theorem.html">Wikipedia says so</a>.
- </p>
- </div>
- <div class="slide">
- <h1>Um, dude, whut?</h1>
- </div>
- <div class="slide">
- <h1>Um, dude, whut?</h1>
- <p>
- Seriously, i don't know, either.
- </p>
- </div>
- <div class="slide">
- <h1>An example</h1>
- </div>
- <div class="slide">
- <h1>An example</h1>
- <p>
- 1000 Python programmers walk into a conference.
- </p>
- </div>
- <div class="slide">
- <h1>An example</h1>
- <p>
- 1000 Python programmers walk into a conference.
- </p>
- <p>
- 10 of them (1%) harbour a dark secret.
- </p>
- </div>
- <div class="slide">
- <h1>A test!</h1>
- </div>
- <div class="slide">
- <h1>A test!</h1>
- <p>
- "Do you prefer list comprehensions to 'map'?"
- </p>
- </div>
- <div class="slide">
- <h1>A test!</h1>
- <p>
- "Do you prefer list comprehensions to 'map'?"
- </p>
- <p>
- How accurate is it?
- </p>
- <ul class="incremental">
- <li>If you harbour the dark secret, it will return positive 90% of
- the time</li>
- <li>If you don't harbour that secret, it will return positive only
- 10% of the time</li>
- </ul>
- </div>
- <div class="slide">
- <h1>A question</h1>
- <p>
- Joe takes the test, and it returns positive.
- </p>
- </div>
- <div class="slide">
- <h1>A question</h1>
- <p>
- Joe takes the test, and it returns positive.
- </p>
- <p>
- How likely is he to harbour this dark secret?
- </p>
- </div>
- <div class="slide">
- <h1>The answer</h1>
- <p>
- 90% !
- </p>
- <p>
- Duh.
- </p>
- </div>
- <div class="slide">
- <h1>The answer</h1>
- <p>
- Probably not what you think.
- </p>
- </div>
- <div class="slide">
- <h1>The answer: Bayes' Theorem</h1>
- <p>
- Bayes' Theorem tells us how to compute this.
- </p>
- </div>
- <div class="slide">
- <h1>The answer: Bayes' Theorem</h1>
- <p>
- Bayes' Theorem tells us how to compute this.
- </p>
- <p>
- But we don't know Bayes' Theorem yet, so let's puzzle through it.
- </p>
- </div>
- <div class="slide">
- <h1>The question</h1>
- <p>
- Joe takes the test, and it returns positive.
- </p>
- <p>
- How likely is he to harbour this dark secret?
- </p>
- </div>
- <div class="slide">
- <h1>The question, step-by-step</h1>
- <p>
- If we test <em>everyone</em>, how many people will get positive
- results?
- </p>
- </div>
- <div class="slide">
- <h1>The question, step-by-step</h1>
- <p>
- If we test <em>everyone</em>, how many people will get positive
- results?
- </p>
- <p>
- And of those, how many will actually be evil?
- </p>
- </div>
- <div class="slide">
- <h1>The question, step-by-step</h1>
- <p>
- If we test <em>everyone</em>, how many people will get positive
- results?
- </p>
- <p>
- And of those, how many will actually be evil?
- </p>
- <p>
- We can use those two numbers to figure out how likely Joe is to be
- evil.
- </p>
- </div>
- <div class="slide">
- <h1>The population</h1>
- <p>
- 1000 Python programmers
- </p>
- </div>
- <div class="slide">
- <h1>The population</h1>
- <p>
- 1000 Python programmers
- </p>
- <p>
- 10% harbour the secret
- </p>
- </div>
- <div class="slide">
- <h1>The population</h1>
- <p>
- 1000 Python programmers
- </p>
- <ul class="incremental">
- <li>990 Pure and stout of heart</li>
- <li>10 Dark-hearted functional bastards</li>
- </ul>
- </div>
- <div class="slide">
- <h1>The bad population</h1>
- <p>
- 10 Dark souls
- </p>
- </div>
- <div class="slide">
- <h1>The bad population</h1>
- <p>
- 10 Dark souls
- </p>
- <p>
- ... with 90% positive test results ...
- </p>
- </div>
- <div class="slide">
- <h1>The bad population</h1>
- <p>
- 10 Dark souls
- </p>
- <p>
- ... with 90% positive test results ...
- </p>
- <p>
- ... means that if we administer the test to everyone, we'll
- identify 9 functional bastards.
- </p>
- </div>
- <div class="slide">
- <h1>The bad population</h1>
- <p>
- 10 Dark souls
- </p>
- <p>
- ... with 90% positive test results ...
- </p>
- <p>
- ... means that if we administer the test to everyone, we'll
- identify 9 functional bastards.
- </p>
- <p>
- ... oh, and 1 will get through.
- </p>
- </div>
- <div class="slide">
- <h1>The good population</h1>
- <p>
- 990 Stout hearts
- </p>
- </div>
- <div class="slide">
- <h1>The good population</h1>
- <p>
- 990 Stout hearts
- </p>
- <p>
- ... with a mere 10% positive test results ...
- </p>
- </div>
- <div class="slide">
- <h1>The good population</h1>
- <p>
- 990 Stout hearts
- </p>
- <p>
- ... with a mere 10% positive test results ...
- </p>
- <p>
- ... means that if we administer the test to everyone, we'll clear
- 891 pure pythonic souls.
- </p>
- </div>
- <div class="slide">
- <h1>The good population</h1>
- <p>
- 990 Stout hearts
- </p>
- <p>
- ... with a mere 10% positive test results ...
- </p>
- <p>
- ... means that if we administer the test to everyone, we'll clear
- 891 pure pythonic souls.
- </p>
- <p>
- ... <em>BUT</em> 99 will be falsely misrepresented!
- </p>
- </div>
- <div class="slide">
- <h1>The total population</h1>
- <p>
- 1000 Python programmers
- </p>
- <ul class="incremental">
- <li><p>
- 10 evildoers
- </p>
- <ul class="incremental">
- <li><p>
- 9 rightly identified
- </p></li>
- <li><p>
- 1 slips through the cracks
- </p></li>
- </ul></li>
- <li><p>
- 990 true and stout-hearted pythonists
- </p>
- <ul class="incremental">
- <li><p>
- 99 falsely accused
- </p></li>
- <li><p>
- 891 cleared by the test
- </p></li>
- </ul></li>
- </ul>
- </div>
- <div class="slide">
- <h1>The positive-test population</h1>
- <p>
- 108 people will test positive (99 + 9)
- </p>
- </div>
- <div class="slide">
- <h1>The positive-test population</h1>
- <p>
- 108 people will test positive (99 + 9)
- </p>
- <p>
- 9 of which are actual wrong-headed fools.
- </p>
- </div>
- <div class="slide">
- <h1>The positive-test population</h1>
- <p>
- 108 people will test positive (99 + 9)
- </p>
- <p>
- 9 of which are actual wrong-headed fools.
- </p>
- <p>
- Which means that 8.33% (9 / 108) of those with a positive test
- result will be nasty, worthless functional programmers.
- </p>
- </div>
- <div class="slide">
- <h1>The positive-test population</h1>
- <p>
- 108 people will test positive (99 + 9)
- </p>
- <p>
- 9 of which are actual wrong-headed fools.
- </p>
- <p>
- Which means that 8.33% (9 / 108) of those with a positive test
- result will be nasty, worthless functional programmers.
- </p>
- <p>
- Which is a far cry from 90%
- </p>
- </div>
- <div class="slide">
- <h1>The total population</h1>
- <p>
- 1000 Python programmers
- </p>
- <p>
- 1% incidence of dark secret, 90% positive test rate for those who
- harbour dark secret, 10% positive test rate for those who are
- innocent.
- </p>
- <ul>
- <li><p>
- 1% - 10 functional programmers
- </p>
- <ul>
- <li><p>
- .9% - 9 rightly identified
- </p></li>
- <li><p>
- .1% - 1 slips through the cracks
- </p></li>
- </ul></li>
- <li><p>
- 99% - 990 true pythonists
- </p>
- <ul>
- <li><p>
- 9.9% - 99 falsely accused
- </p></li>
- <li><p>
- 89.1% - 891 cleared by the test
- </p></li>
- </ul></li>
- </ul>
- </div>
- <div class="slide">
- <h1>The total population</h1>
- <p>
- 1000 Python programmers
- </p>
- <p>
- 1% incidence of dark secret, 95% positive test rate for those who
- harbour dark secret, 10% positive test rate for those who are
- innocent.
- </p>
- <ul>
- <li><p>
- 1% - 10 functional programmers
- </p>
- <ul>
- <li><p>
- .95% - 9.5 rightly identified
- </p></li>
- <li><p>
- .05% - 0.5 slips through the cracks
- </p></li>
- </ul></li>
- <li><p>
- 99% - 990 true pythonists
- </p>
- <ul>
- <li><p>
- 9.9% - 99 falsely accused
- </p></li>
- <li><p>
- 89.1% - 891 cleared by the test
- </p></li>
- </ul></li>
- </ul>
- </div>
- <div class="slide">
- <h1>The total population</h1>
- <p>
- 1000 Python programmers
- </p>
- <p>
- 1% incidence of dark secret, 95% positive test rate for those who
- harbour dark secret, 2% positive test rate for those who are
- innocent.
- </p>
- <ul>
- <li><p>
- 1% - 10 functional programmers
- </p>
- <ul>
- <li><p>
- .95% - 9.5 rightly identified
- </p></li>
- <li><p>
- .05% - 0.5 slips through the cracks
- </p></li>
- </ul></li>
- <li><p>
- 99% - 990 true pythonists
- </p>
- <ul>
- <li><p>
- 1.98% - 19.8 falsely accused
- </p></li>
- <li><p>
- 97.02% - 970.2 cleared by the test
- </p></li>
- </ul></li>
- </ul>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- probability(positive test result, given guilt) * probability(guilt)
- </p>
- <p>
- over
- </p>
- <p>
- probability(positive test result)
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- probability(positive test result, given guilt) * 1%
- </p>
- <p>
- over
- </p>
- <p>
- probability(positive test result)
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- 90% * 1%
- </p>
- <p>
- over
- </p>
- <p>
- probability(positive test result)
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- 90% * 1%
- </p>
- <p>
- over
- </p>
- <p>
- hmmm....
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- population with positive test result
- </p>
- <p>
- over
- </p>
- <p>
- total population
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- population of true positives + population of false positives
- </p>
- <p>
- over
- </p>
- <p>
- total population
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- 9 + population of false positives
- </p>
- <p>
- over
- </p>
- <p>
- total population
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- 9 + 99
- </p>
- <p>
- over
- </p>
- <p>
- total population
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- 9 + 99
- </p>
- <p>
- over
- </p>
- <p>
- 1000
- </p>
- </div>
- <div class="slide">
- <h1>probability(positive test result)</h1>
- <p>
- (9 + 108) / 1000 = 10.8%
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- 90% * 1%
- </p>
- <p>
- over
- </p>
- <p>
- 10.8%
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- 90% * 1% / 10.8% =
- </p>
- <p>
- 8.33%
- </p>
- </div>
- <div class="slide">
- <h1>Bayes' Theorem</h1>
- <p>
- probability(guilt, given a positive test result) =
- </p>
- <p>
- 90% * 1% / 10.8% =
- </p>
- <p>
- 8.33%
- </p>
- <p>
- And it's just that simple
- </p>
- </div>
- <div class="slide">
- <h1>But....</h1>
- <p>
- What's this got to do with spam?
- </p>
- </div>
- </div>
- </body>
- </html>
|