--- /dev/null
+SRC = media/src
+DEST = media/build
+
+# full-sized image dimensions
+WIDTH = 960
+HEIGHT = 480
+
+HALF_WIDTH = 480
+HALF_HEIGHT = 240
+
+THIRD_WIDTH = 320
+THIRD_HEIGHT = 160
+
+THUMBNAILS = \
+ $(DEST)/1TIT-atoms.mp4 \
+ $(DEST)/takamori-fig4b-fw-fh.png \
+ $(DEST)/skeletal-muscle-fw-fh.png \
+ $(DEST)/titin-fw-fh.png \
+ $(DEST)/1TIT-fw-fh.png \
+ $(DEST)/1TIT-tw-th.png \
+ $(DEST)/pirchi-fig1-fw-hh.png \
+ $(DEST)/afm-3d-fw-fh.png \
+ $(DEST)/contact-afm.ogv \
+ $(DEST)/afm-fw-fh.png \
+ $(DEST)/piezo-fw-fh.png \
+ $(DEST)/unfolding-fw-fh.png \
+ $(DEST)/unfolding-hw-fh.png \
+ $(DEST)/unfolding-hw-hh.png \
+ $(DEST)/expt-sawtooth-fw-fh.png \
+ $(DEST)/expt-sawtooth-hw-hh.png \
+ $(DEST)/carrion-vazquez-fig2-fw-fh.png \
+ $(DEST)/lu-fig1-fw-fh.png \
+ $(DEST)/apparatus-fw-fh.png \
+ $(DEST)/labview-fw-fh.png \
+ $(DEST)/pyafm-fw-fh.png \
+ $(DEST)/ants-fw-fh.png \
+ $(DEST)/cantilever.jpg \
+ $(DEST)/tip.jpg \
+ $(DEST)/vibration-fw-fh.png \
+ $(DEST)/vibration-hw-fh.png \
+ $(DEST)/bump-fw-fh.png \
+ $(DEST)/florin-fig2-hw-fh.png \
+ $(DEST)/pbs-hist-hw-hh.png \
+ $(DEST)/sawsim-states-hw-fh.png \
+ $(DEST)/sawsim-states-hw-hh.png \
+ $(DEST)/monte-carlo-fw-fh.png \
+ $(DEST)/landscape-hw-hh.png \
+ $(DEST)/landscape-hw-fh.png \
+ $(DEST)/landscape-bell-hw-hh.png \
+ $(DEST)/kramers-integrand-hw-hh.png \
+ $(DEST)/wlc-model-hw-fh.png \
+ $(DEST)/fjc-model-hw-fh.png \
+ $(DEST)/fit-valley-fw-fh.png \
+ $(DEST)/1TIT-hbond-fw-fh.png
+
+# $(DEST)/landscape-cant-hw-hh.png
+
+.PRECIOUS: $(DEST)/% $(DEST)/%.png $(DEST)/%.pdf
+
+all: index.html $(THUMBNAILS)
+
+clean:
+ rm -f index.html $(DEST)/* $(SRC)/pymol/*-0*.png
+
+%: %.itex
+ itex2MML < "$(<)" > "$(@)"
+
+## Get the high-resolution source into PNG format
+
+# plain copy
+$(DEST)/%: $(SRC)/binary/%
+ cp "$(<)" "$(@)"
+
+# TODO: re-render and crop?
+$(DEST)/%: $(SRC)/matplotlib/%
+ cp "$(<)" "$(@)"
+
+# TODO: re-render and crop?
+$(DEST)/%: $(SRC)/tikz/%
+ cp "$(<)" "$(@)"
+
+# TODO: extract from the VI? (probably not ;)
+$(DEST)/%: $(SRC)/labview/%
+ cp "$(<)" "$(@)"
+
+# convert JPEGs
+$(DEST)/%.png: $(SRC)/binary/%.jpg
+ convert "$(<)" "$(@)"
+
+# convert PDFs
+$(DEST)/%.png: $(SRC)/binary/%.pdf
+ convert -density 350 "$(<)" "$(@)"
+
+# compile Asymptote graphics
+$(DEST)/%.pdf: $(SRC)/asy/%.asy
+ asy -noprc -render=0 -f pdf -cd "$(<D)" -o "$(*).pdf" "$(*).asy"
+ mv "$(<D)/$(*).pdf" "$(@)"
+
+# convert Asympote PDFs
+$(DEST)/%.png: $(DEST)/%.pdf
+ convert -density 350 "$(<)" "$(@)"
+
+# convert PyMol images
+$(DEST)/%.png: $(SRC)/pymol/%.pml
+ cd "$(SRC)/pymol" && pymol -cq "$(*).pml"
+ mv "$(SRC)/pymol/$(*).png" "$(@)"
+
+# convert PyMol images
+$(DEST)/%.mp4: $(SRC)/pymol/%.pml
+ cd "$(SRC)/pymol" && pymol -cq "$(*).pml"
+ ffmpeg -y -r 20 -i "$(SRC)/pymol/$(*)-%4d.png" -s 640x480 -vcodec libx264 \
+ -preset slower -vpre ipod640 -b:v 800k -bt 800k -aspect 640:480 \
+ -threads 0 "$(@)"
+
+## Convert to the desired geometry
+
+# full width, full height
+$(DEST)/%-fw-fh.png: $(DEST)/%.png
+ convert -format png -strip -quality 95 "$(<)" -thumbnail $(WIDTH)x$(HEIGHT) "$(@)"
+
+# half width, full height
+$(DEST)/%-hw-fh.png: $(DEST)/%.png
+ convert -format png -strip -quality 95 "$(<)" -thumbnail $(HALF_WIDTH)x$(HEIGHT) "$(@)"
+
+# full width, half height
+$(DEST)/%-fw-hh.png: $(DEST)/%.png
+ convert -format png -strip -quality 95 "$(<)" -thumbnail $(WIDTH)x$(HALF_HEIGHT) "$(@)"
+
+# half width, half height
+$(DEST)/%-hw-hh.png: $(DEST)/%.png
+ convert -format png -strip -quality 95 "$(<)" -thumbnail $(HALF_WIDTH)x$(HALF_HEIGHT) "$(@)"
+
+# third width, third height
+$(DEST)/%-tw-th.png: $(DEST)/%.png
+ convert -format png -strip -quality 95 "$(<)" -thumbnail $(THIRD_WIDTH)x$(THIRD_HEIGHT) "$(@)"
+++ /dev/null
-<!doctype html>
-<html lang="en">
-
- <head>
- <meta charset="utf-8">
-
- <title>reveal.js - The HTML Presentation Framework</title>
-
- <meta name="description" content="A framework for easily creating beautiful presentations using HTML">
- <meta name="author" content="Hakim El Hattab">
-
- <meta name="apple-mobile-web-app-capable" content="yes" />
- <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
-
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-
- <link rel="stylesheet" href="css/reveal.min.css">
- <link rel="stylesheet" href="css/theme/default.css" id="theme">
-
- <!-- For syntax highlighting -->
- <link rel="stylesheet" href="lib/css/zenburn.css">
-
- <!-- If the query includes 'print-pdf', use the PDF print sheet -->
- <script>
- document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
- </script>
-
- <!--[if lt IE 9]>
- <script src="lib/js/html5shiv.js"></script>
- <![endif]-->
- </head>
-
- <body>
-
- <div class="reveal">
-
- <!-- Any section element inside of this container is displayed as a slide -->
- <div class="slides">
-
- <section>
- <h1>Reveal.js</h1>
- <h3>HTML Presentations Made Easy</h3>
- <p>
- <small>Created by <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small>
- </p>
- </section>
-
- <section>
- <h2>Heads Up</h2>
- <p>
- reveal.js is a framework for easily creating beautiful presentations using HTML. You'll need a browser with
- support for CSS 3D transforms to see it in its full glory.
- </p>
-
- <aside class="notes">
- Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).
- </aside>
- </section>
-
- <!-- Example of nested vertical slides -->
- <section>
- <section>
- <h2>Vertical Slides</h2>
- <p>
- Slides can be nested inside of other slides,
- try pressing <a href="#" class="navigate-down">down</a>.
- </p>
- <a href="#" class="image navigate-down">
- <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
- </a>
- </section>
- <section>
- <h2>Basement Level 1</h2>
- <p>Press down or up to navigate.</p>
- </section>
- <section>
- <h2>Basement Level 2</h2>
- <p>Cornify</p>
- <a class="test" href="http://cornify.com">
- <img width="280" height="326" src="https://s3.amazonaws.com/hakim-static/reveal-js/cornify.gif" alt="Unicorn">
- </a>
- </section>
- <section>
- <h2>Basement Level 3</h2>
- <p>That's it, time to go back up.</p>
- <a href="#/2" class="image">
- <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="-webkit-transform: rotate(180deg);">
- </a>
- </section>
- </section>
-
- <section>
- <h2>Slides</h2>
- <p>
- Not a coder? No problem. There's a fully-featured visual editor for authoring these, try it out at <a href="http://slid.es" target="_blank">http://slid.es</a>.
- </p>
- </section>
-
- <section>
- <h2>Point of View</h2>
- <p>
- Press <strong>ESC</strong> to enter the slide overview.
- </p>
- <p>
- Hold down alt and click on any element to zoom in on it using <a href="http://lab.hakim.se/zoom-js">zoom.js</a>. Alt + click anywhere to zoom back out.
- </p>
- </section>
-
- <section>
- <h2>Works in Mobile Safari</h2>
- <p>
- Try it out! You can swipe through the slides and pinch your way to the overview.
- </p>
- </section>
-
- <section>
- <h2>Marvelous Unordered List</h2>
- <ul>
- <li>No order here</li>
- <li>Or here</li>
- <li>Or here</li>
- <li>Or here</li>
- </ul>
- </section>
-
- <section>
- <h2>Fantastic Ordered List</h2>
- <ol>
- <li>One is smaller than...</li>
- <li>Two is smaller than...</li>
- <li>Three!</li>
- </ol>
- </section>
-
- <section data-markdown>
- <script type="text/template">
- ## Markdown support
-
- For those of you who like that sort of thing. Instructions and a bit more info available [here](https://github.com/hakimel/reveal.js#markdown).
-
- ```
- <section data-markdown>
- ## Markdown support
-
- For those of you who like that sort of thing.
- Instructions and a bit more info available [here](https://github.com/hakimel/reveal.js#markdown).
- </section>
- ```
- </script>
- </section>
-
- <section id="transitions">
- <h2>Transition Styles</h2>
- <p>
- You can select from different transitions, like: <br>
- <a href="?transition=cube#/transitions">Cube</a> -
- <a href="?transition=page#/transitions">Page</a> -
- <a href="?transition=concave#/transitions">Concave</a> -
- <a href="?transition=zoom#/transitions">Zoom</a> -
- <a href="?transition=linear#/transitions">Linear</a> -
- <a href="?transition=fade#/transitions">Fade</a> -
- <a href="?transition=none#/transitions">None</a> -
- <a href="?#/transitions">Default</a>
- </p>
- </section>
-
- <section id="themes">
- <h2>Themes</h2>
- <p>
- Reveal.js comes with a few themes built in: <br>
- <a href="?theme=sky#/themes">Sky</a> -
- <a href="?theme=beige#/themes">Beige</a> -
- <a href="?theme=simple#/themes">Simple</a> -
- <a href="?theme=serif#/themes">Serif</a> -
- <a href="?theme=night#/themes">Night</a> -
- <a href="?#/themes">Default</a>
- </p>
- <p>
- <small>
- * Theme demos are loaded after the presentation which leads to flicker. In production you should load your theme in the <code><head></code> using a <code><link></code>.
- </small>
- </p>
- </section>
-
- <section>
- <section data-state="alert">
- <h2>Global State</h2>
- <p>
- Set <code>data-state="something"</code> on a slide and <code>"something"</code>
- will be added as a class to the document element when the slide is open. This lets you
- apply broader style changes, like switching the background.
- </p>
- <a href="#" class="image navigate-down">
- <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
- </a>
- </section>
- <section data-state="blackout">
- <h2>"blackout"</h2>
- <a href="#" class="image navigate-down">
- <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Down arrow">
- </a>
- </section>
- <section data-state="soothe">
- <h2>"soothe"</h2>
- <a href="#" class="image navigate-next">
- <img width="178" height="238" src="https://s3.amazonaws.com/hakim-static/reveal-js/arrow.png" alt="Up arrow" style="-webkit-transform: rotate(-90deg);">
- </a>
- </section>
- </section>
-
- <section data-state="customevent">
- <h2>Custom Events</h2>
- <p>
- Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
- </p>
- <pre><code data-trim contenteditable style="font-size: 18px; margin-top: 20px;">
-Reveal.addEventListener( 'customevent', function() {
- console.log( '"customevent" has fired' );
-} );
- </code></pre>
- </section>
-
- <section>
- <h2>Clever Quotes</h2>
- <p>
- These guys come in two forms, inline: <q cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
- “The nice thing about standards is that there are so many to choose from”</q> and block:
- </p>
- <blockquote cite="http://searchservervirtualization.techtarget.com/definition/Our-Favorite-Technology-Quotations">
- “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would
- reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.”
- </blockquote>
- </section>
-
- <section>
- <h2>Pretty Code</h2>
- <pre><code data-trim contenteditable>
-function linkify( selector ) {
- if( supports3DTransforms ) {
-
- var nodes = document.querySelectorAll( selector );
-
- for( var i = 0, len = nodes.length; i < len; i++ ) {
- var node = nodes[i];
-
- if( !node.className ) ) {
- node.className += ' roll';
- }
- };
- }
-}
- </code></pre>
- <p>Courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
- </section>
-
- <section>
- <h2>Intergalactic Interconnections</h2>
- <p>
- You can link between slides internally,
- <a href="#/2/3">like this</a>.
- </p>
- </section>
-
- <section>
- <section>
- <h2>Fragmented Views</h2>
- <p>Hit the next arrow...</p>
- <p class="fragment">... to step through ...</p>
- <ol>
- <li class="fragment"><code>any type</code></li>
- <li class="fragment"><em>of view</em></li>
- <li class="fragment"><strong>fragments</strong></li>
- </ol>
-
- <aside class="notes">
- This slide has fragments which are also stepped through in the notes window.
- </aside>
- </section>
- <section>
- <h2>Fragment Styles</h2>
- <p>There's a few styles of fragments, like:</p>
- <p class="fragment grow">grow</p>
- <p class="fragment shrink">shrink</p>
- <p class="fragment roll-in">roll-in</p>
- <p class="fragment fade-out">fade-out</p>
- <p class="fragment highlight-red">highlight-red</p>
- <p class="fragment highlight-green">highlight-green</p>
- <p class="fragment highlight-blue">highlight-blue</p>
- </section>
- </section>
-
- <section>
- <h2>Spectacular image!</h2>
- <a class="image" href="http://lab.hakim.se/meny/" target="_blank">
- <img width="320" height="299" src="http://s3.amazonaws.com/hakim-static/portfolio/images/meny.png" alt="Meny">
- </a>
- </section>
-
- <section>
- <h2>Export to PDF</h2>
- <p>Presentations can be <a href="https://github.com/hakimel/reveal.js#pdf-export">exported to PDF</a>, below is an example that's been uploaded to SlideShare.</p>
- <iframe id="slideshare" src="http://www.slideshare.net/slideshow/embed_code/13872948" width="455" height="356" style="margin:0;overflow:hidden;border:1px solid #CCC;border-width:1px 1px 0;margin-bottom:5px" allowfullscreen> </iframe>
- <script>
- document.getElementById('slideshare').attributeName = 'allowfullscreen';
- </script>
- </section>
-
- <section>
- <h2>Take a Moment</h2>
- <p>
- Press b or period on your keyboard to enter the 'paused' mode. This mode is helpful when you want to take distracting slides off the screen
- during a presentation.
- </p>
- </section>
-
- <section>
- <h2>Stellar Links</h2>
- <ul>
- <li><a href="http://slid.es">Try the online editor</a></li>
- <li><a href="https://github.com/hakimel/reveal.js">Source code on GitHub</a></li>
- <li><a href="http://twitter.com/hakimel">Follow me on Twitter</a></li>
- </ul>
- </section>
-
- <section>
- <h1>THE END</h1>
- <h3>BY Hakim El Hattab / hakim.se</h3>
- </section>
-
- </div>
-
- </div>
-
- <script src="lib/js/head.min.js"></script>
- <script src="js/reveal.min.js"></script>
-
- <script>
-
- // Full list of configuration options available here:
- // https://github.com/hakimel/reveal.js#configuration
- Reveal.initialize({
- controls: true,
- progress: true,
- history: true,
- center: true,
-
- theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
- transition: Reveal.getQueryHash().transition || 'default', // default/cube/page/concave/zoom/linear/fade/none
-
- // Optional libraries used to extend on reveal.js
- dependencies: [
- { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
- { src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
- { src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
- { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
- { src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
- { src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
- // { src: 'plugin/search/search.js', async: true, condition: function() { return !!document.body.classList; } }
- // { src: 'plugin/remotes/remotes.js', async: true, condition: function() { return !!document.body.classList; } }
- ]
- });
-
- </script>
-
- </body>
-</html>
--- /dev/null
+<!doctype html>
+<html lang="en">
+
+ <head>
+ <meta charset="utf-8">
+
+ <title>Open source single molecule force spectroscopy</title>
+
+ <meta name="description" content="Controlling and analyzing SMFS with varying salt concentrations">
+ <meta name="author" content="Trevor King">
+
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+
+ <link rel="stylesheet" href="css/reveal.min.css">
+ <link rel="stylesheet" href="css/theme/beige.css" id="theme">
+ <link rel="stylesheet" href="css/local.css" id="local">
+
+ <!-- For syntax highlighting -->
+ <link rel="stylesheet" href="lib/css/zenburn.css">
+
+ <!-- If the query includes 'print-pdf', use the PDF print sheet -->
+ <script>
+ document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
+ </script>
+
+ <!--[if lt IE 9]>
+ <script src="lib/js/html5shiv.js"></script>
+ <![endif]-->
+ </head>
+
+ <body>
+
+ <div class="reveal">
+
+ <!-- Any section element inside of this container is displayed as a slide -->
+ <div class="slides">
+
+ <section>
+ <h2>Open source<br/> single molecule<br/> force spectroscopy</h2>
+ <h3>Protein unfolding in varying salt concentrations</h3>
+ <p style="text-align: center;">
+ <small>Trevor King</small>
+ </p>
+ </section>
+ <section>
+ <section>
+ <h2>Proteins: What are they?</h2>
+ <p>
+ <video width="640" height="480"
+ preload="auto" loop="" controls=""> <!--autoplay=""-->
+ <source src="media/build/1TIT-atoms.mp4"
+ type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+ </video>
+ <!-- generated with PyMol from
+ http://www.rcsb.org/pdb/explore.do?structureId=1TIT -->
+ </p>
+ </section>
+ <section>
+ <h2>Proteins: Where are they?</h2>
+ <p>
+ <img src="media/build/takamori-fig4b-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://dx.doi.org/10.1016/j.cell.2006.10.030">
+ Takamori, Holt, Stenius, et al., 2006
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Proteins: Titin</h2>
+ <p>
+ <img src="media/build/skeletal-muscle-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ Adapted from
+ <a href="http://en.wikipedia.org/wiki/File:Skeletal_muscle.jpg">
+ Wikipedia
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Proteins: Titin's I27</h2>
+ <p>
+ <img src="media/build/titin-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://www.ks.uiuc.edu/Research/telethonin/">
+ U. Illinois Biophysics Group
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Proteins: I27</h2>
+ <p>
+ <img src="media/build/1TIT-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://www.rcsb.org/pdb/explore.do?structureId=1TIT">
+ PDB structure 1TIT
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Proteins: What's the problem?</h2>
+ <table class="center">
+ <tr>
+ <td style="vertical-align: middle;">
+ <pre style="display: table; width: auto;">
+MHHHHHHSSLIEV
+EKPLYGVEVFVGE
+TAHFEIELSEPDV
+HGQWKLKGQPLTA
+SPDCEIIEDGKKH
+ILILHNCQLGMTG
+EVSFQAANAKSAA
+NLKVKEL</pre>
+ </td>
+ <td style="vertical-align: middle;"><p> → </p></td>
+ <td style="vertical-align: middle;">
+ <img src="media/build/1TIT-tw-th.png" />
+ </td>
+ </tr>
+ <tr>
+ <td colspan="3">
+ <p>
+ <img src="media/build/pirchi-fig1-fw-hh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://dx.doi.org/10.1038/ncomms1504">
+ Pirchi, Ziv, Riven, et al., 2011
+ </a>
+ </small>
+ </p>
+ </td>
+ </tr>
+ </table>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Atomic force microscopy</h2>
+ <p>
+ <img src="media/build/afm-3d-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>AFM: Cantilever geometry</h2>
+ <p>
+ <!-- need height to stretch low-resolution pictures -->
+ <img src="media/build/cantilever.jpg" height="272" />
+ <img src="media/build/tip.jpg" height="272" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://probe.olympus-global.com/en/product/omcl_tr800psa_w/">
+ Olympus TR800PSA
+ </a>, images from
+ <a href="http://www.asylumresearch.com/Probe/TR400PSA,Olympus">
+ Asylum Research
+ </a><br/>
+ We use the thinner
+ <a href="http://probe.olympus-global.com/en/product/omcl_tr400psa_hw/">
+ TR400PSA
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>AFM: Laser deflection</h2>
+ <p>
+ <video width="640" height="480"
+ preload="auto" loop="" controls=""> <!--autoplay=""-->
+ <source src="media/build/contact-afm.ogv"
+ type='video/ogg; codecs="theora,vorbis"' />
+ </video>
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://www.freesbi.ch/fr/illustration/animations">
+ Charles Roduit
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>AFM: Piezo positioning</h2>
+ <p>
+ <img src="media/build/afm-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>The piezoelectric effect</h2>
+ <p>
+ <object data="media/perovskite.svg" type="image/svg+xml"
+ width="640" height="350"></object>
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://en.wikipedia.org/wiki/File:Perovskite.svg">
+ Wikipedia
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>AFM: Tubular piezos</h2>
+ <p>
+ <img src="media/build/piezo-fw-fh.png" />
+ </p>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Single molecule force spectroscopy</h2>
+ <p>
+ <img src="media/build/unfolding-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>SMFS: Sawtooth curve</h2>
+ <p>
+ <img src="media/build/expt-sawtooth-fw-fh.png" width="640" />
+ </p>
+ </section>
+ <section>
+ <h2>SMFS: What's going on?</h2>
+ <p>
+ <img src="media/build/carrion-vazquez-fig2-fw-fh.png" />
+ </p>
+ <p>
+ <small>
+ <a href="http://dx.doi.org/10.1016/S0079-6107(00)00017-1">
+ Carrion-Vazquez, et al., 2000;
+ adapted from Baljon and Robbins, 1996
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>SMFS: Unfolding one domain</h2>
+ <p>
+ <img src="media/build/lu-fig1-fw-fh.png" />
+ </p>
+ <p>
+ <small>
+ <a href="http://dx.doi.org/10.1016/S0006-3495(00)76273-4">
+ Lu and Schulten, 2000
+ </a>
+ </small>
+ </p>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Experiment control</h2>
+ <p>
+ <img src="media/build/apparatus-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Control: Quick-and-dirty</h2>
+ <p>
+ <img src="media/build/labview-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Control: Modular stack</h2>
+ <p>
+ <img src="media/build/pyafm-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Open source: Existing layers</h2>
+ <table class="center">
+ <tr>
+ <td><img src="media/logo/tux.png" height="150" /></td>
+ <td><object data="media/logo/gnu.svg" type="image/svg+xml"
+ height="150"></object></td>
+ <td><object data="media/logo/gentoo.svg" type="image/svg+xml"
+ height="150"></object></td>
+ <td><object data="media/logo/python.svg" type="image/svg+xml"
+ height="150"></object></td>
+ <td><object data="media/logo/scipy.svg" type="image/svg+xml"
+ height="150"></object></td>
+ </tr>
+ <tr>
+ <td><a href="https://www.kernel.org/">Linux</a></td>
+ <td>
+ <a href="http://www.gnu.org/">
+ <abbr title="GNU's Not Unix!">GNU</abbr>
+ </a>
+ </td>
+ <td><a href="http://www.gentoo.org/">Gentoo</a></td>
+ <td><a href="http://www.python.org/">Python</a></td>
+ <td><a href="http://www.scipy.org/">SciPy</a></td>
+ </tr>
+ <tr>
+ <td>
+ <small>
+ <a href="http://www.comedi.org/">
+ <abbr title="Control and Measurement Device Interface">Comedi<abbr>
+ </a>
+ </small>
+ </td>
+ <td>
+ <small>
+ <a href="http://matplotlib.org/">matplotlib</a>
+ </small>
+ </td>
+ <td>
+ <small>
+ <a href="https://github.com/bashwork/pymodbus">pymodbus</a>
+ </small>
+ </td>
+ <td>
+ <small>
+ <a href="http://www.cython.org/">Cython</a>
+ </small>
+ </td>
+ <td>
+ <small>
+ <a href="https://www.numpy.org/">NumPy</a>
+ </small>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <small>
+ <a href="http://www.h5py.org/">h5py</a>
+ </small>
+ </td>
+ <td><small>…</small></td>
+ </tr>
+ </table>
+ </section>
+ <section>
+ <h2>Open source: Teamwork</h2>
+ <p>
+ <img src="media/build/ants-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://dx.doi.org/10.1073/pnas.1016658108">
+ Mlot, Tovey, and Hu, 2011
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Control: Example code</h2>
+ <pre><code data-trim="">
+class Unfolder (object):
+ …
+ def run(self):
+ """Approach-bind-unfold-save[-plot] cycle.
+ """
+ ret = {}
+ ret['timestamp'] = _email_utils.formatdate(localtime=True)
+ ret['temperature'] = self.afm.get_temperature()
+ ret['approach'] = self._approach()
+ self._bind()
+ ret['unfold'] = self._unfold()
+ self._save(**ret)
+ if _package_config['matplotlib']:
+ self._plot(**ret)
+ return ret
+ </code></pre>
+ </section>
+ <section>
+ <h2>Archival: HDF5 and h5config</h2>
+ <!-- h5dump -H 2013-03-04T12-43-38.h5 |
+ grep 'GROUP\|DATASET' | sed 's/ {.*//' -->
+ <pre>
+GROUP <span style="color: blue">"/"</span>
+ GROUP <span style="color: blue">"approach"</span>
+ …
+ GROUP <span style="color: blue">"config"</span>
+ GROUP <span style="color: blue">"afm"</span>
+ …
+ GROUP <span style="color: blue">"approach"</span>
+ …
+ DATASET <span style="color: blue">"bind time"</span>
+ …
+ GROUP <span style="color: blue">"unfold"</span>
+ …
+ DATASET <span style="color: blue">"velocity"</span>
+ GROUP <span style="color: blue">"environment"</span>
+ DATASET <span style="color: blue">"temperature"</span>
+ DATASET <span style="color: blue">"timestamp"</span>
+ …
+ GROUP <span style="color: blue">"unfold"</span>
+ DATASET <span style="color: blue">"deflection"</span>
+ DATASET <span style="color: blue">"frequency"</span>
+ DATASET <span style="color: blue">"z"</span></pre>
+ </section>
+ <section>
+ <h2>Archival: Version control</h2>
+ <pre>
+<span style="color: red">commit 32bfbf98d79c73eba50b77d0917df100e0e33bcf</span>
+Author: W. Trevor King <wking@tremily.us>
+Date: Fri Jan 18 22:54:49 2013 -0500
+
+ afm: Optionally return stepper_approach data with `record_data`
+
+ Sometimes these approach curves are pretty funky, so I'll start
+ recording them by default in calibcant-calibrate.py.
+
+<span style="font-weight: bold">diff --git a/pyafm/afm.py b/pyafm/afm.py
+index 60741c6..e76b118 100644
+--- a/pyafm/afm.py
++++ b/pyafm/afm.py</span>
+<span style="color: blue">@@ -460,10 +460,11 @@</span> class AFM (object):
+ _LOG.warn(e)
+ raise e
+
+<span style="color: red">- def stepper_approach(self, target_deflection):</span>
+<span style="color: green">+ def stepper_approach(self, target_deflection, record_data=None):</span>
+…</pre>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Cantilever calibration</h2>
+ <p>
+ <img src="media/build/unfolding-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Calibration: Geometry</h2>
+ <p>
+ <!-- need height to stretch low-resolution pictures -->
+ <img src="media/build/cantilever.jpg" height="272" />
+ <img src="media/build/tip.jpg" height="272" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://probe.olympus-global.com/en/product/omcl_tr800psa_w/">
+ Olympus TR800PSA
+ </a>, images from
+ <a href="http://www.asylumresearch.com/Probe/TR400PSA,Olympus">
+ Asylum Research
+ </a><br/>
+ We use the thinner
+ <a href="http://probe.olympus-global.com/en/product/omcl_tr400psa_hw/">
+ TR400PSA
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Calibration: Equipartition</h2>
+ <p>
+ For a damped harmonic oscillator
+ </p>
+
+\[
+ -\kappa x_c
+ - \gamma \frac{\mathrm{d}\! x_c}{\mathrm{d}\! t}
+ + F_\text{ext}(t)
+ = m\frac{\mathrm{d}^2\! x}{\mathrm{d}\! t^2} \;,
+\]
+
+ <p>
+ the energy in each degree of freedom is $\frac{1}{2}k_B
+ T$.
+ </p>
+
+\[
+ \frac{1}{2} \kappa \left\langle x_c^2 \right\rangle = \frac{1}{2}k_B T \;,
+\]
+
+ <p>
+ where $k_B$ is Boltzmann's constant and $T$ is the
+ temperature.
+ </p>
+ </section>
+ <section>
+ <h2>Calibration: Vibration</h2>
+ <p>
+ <img src="media/build/vibration-fw-fh.png" width="620" />
+ </p>
+ </section>
+ <section>
+ <h2>Calibration: Photodiode calibration</h2>
+ <p>
+ <img src="media/build/bump-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Calibration: Results</h2>
+
+\[
+\begin{aligned}
+ T &= 298.15 \pm 0.03 \; \text{K} &
+ \sigma_p &= 35.7 \pm 0.9 \; \text{mV/nm} \\
+ \left\langle V_p^2 \right\rangle &= 97 \pm 1 \; \text{mV}^2 &
+ \sqrt{\left\langle x_c^2 \right\rangle}
+ &= \sqrt{\frac{\left\langle V_p^2 \right\rangle}{\sigma_p^2}}
+ = 0.28 \; \text{nm} \\
+ \kappa &= \frac{k_B T \sigma_p^2}{\left\langle V_p^2 \right\rangle}
+ = 54 \pm 3 \; \text{pN/nm}
+\end{aligned}
+\]
+
+ </section>
+ <section>
+ <h2>Calibration: Stability</h2>
+ <table class="center">
+ <thead>
+ <tr>
+ <th>Quant.</th>
+ <th>Units</th>
+ <th> </th>
+ <!-- 2013-03-03T16-37-12 -->
+ <th colspan="2" style="text-align: center">Day 1</th>
+ <th> </th>
+ <!-- 2013-03-04T12-21-54 -->
+ <th colspan="2" style="text-align: center">Day 2</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>$T$</td>
+ <td>K</td>
+ <td></td>
+ <td>296.30</td>
+ <td>±0.02</td>
+ <td></td>
+ <td>294.27</td>
+ <td>±0.02</td>
+ </tr>
+ <tr>
+ <td>$\sigma_p$</td>
+ <td>mV/nm</td>
+ <td></td>
+ <td> 46.2</td>
+ <td>±0.8</td>
+ <td></td>
+ <td> 41.3</td>
+ <td>±0.2</td>
+ </tr>
+ <tr>
+ <td>$\left\langle V_p^2 \right\rangle$</td>
+ <td>mV$^2$</td>
+ <td></td>
+ <td>108</td>
+ <td>±1</td>
+ <td></td>
+ <td>105</td>
+ <td>±2</td>
+ </tr>
+ <tr>
+ <td>$\kappa$</td>
+ <td>pN/nm</td>
+ <td></td>
+ <td> 67</td>
+ <td>±2</td>
+ <td></td>
+ <td> 66</td>
+ <td>±2</td>
+ </tr>
+ </tbody>
+ </table>
+ </section>
+ <section>
+ <h2>Calibration: Inconsistency</h2>
+ <table class="center">
+ <tr>
+ <td style="vertical-align: middle;">
+ <img src="media/build/florin-fig2-hw-fh.png" />
+ </td>
+ <td style="vertical-align: middle;">
+ <img src="media/build/vibration-hw-fh.png" />
+ </td>
+ </tr>
+ </table>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://dx.doi.org/10.1016/0896-6273(88)90139-0">
+ Florin, Rief, Lehmann, et al., 1995
+ </a>
+ </small>
+ </p>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Monte Carlo unfolding simulations</h2>
+ <table class="center">
+ <tr>
+ <td rowspan="2" style="vertical-align: middle;">
+ <img src="media/build/unfolding-fw-fh.png" />
+ </td>
+ <td style="vertical-align: top;">
+ <img src="media/build/expt-sawtooth-hw-hh.png" />
+ </td>
+ </tr>
+ <tr>
+ <td><img src="media/build/pbs-hist-hw-hh.png" /></td>
+ </tr>
+ </table>
+ </section>
+ <section>
+ <h2>Sawsim: State model</h2>
+ <p>
+ <img src="media/build/unfolding-hw-fh.png"
+ style="vertical-align: middle;">
+ <img src="media/build/sawsim-states-hw-fh.png"
+ style="vertical-align: middle;">
+ </p>
+ </section>
+ <section>
+ <h2>Sawsim: Simulation loop</h2>
+ <ol>
+ <li>Calculate piezo-induced gap $x_t(t)=v t$</li>
+ <li>
+ Find tension model parameters for each state
+ </li>
+ <li>
+ Distribute per-state stretching ($x_c$, $x_u$, …) to
+ balance the tension
+ </li>
+ <li>
+ Calculate the transition rates between states
+ </li>
+ <li>
+ Roll the dice to determine if transitions take
+ place as you step forward in time
+ </li>
+ </ol>
+ </section>
+ <section>
+ <h2>Sawsim: Monte Carlo</h2>
+ <p>
+ <img src="media/build/monte-carlo-fw-fh.png" />
+ </p>
+ </section>
+ <section>
+ <h2>Sawsim: Unfolding models</h2>
+ <table class="center">
+ <tr>
+ <td style="text-align: center;">
+ <img src="media/build/unfolding-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ <td>
+ <img src="media/build/landscape-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ </tr>
+ <tr>
+ <td style="text-align: center;">
+ <img src="media/build/sawsim-states-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ <td>
+ <img src="media/build/landscape-bell-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ </tr>
+ </table>
+ </section>
+ <section>
+ <h2>Sawsim: Kramers' model</h2>
+
+\[
+ \frac{1}{k_u}
+ = \frac{1}{D}
+ \int_{-\infty}^{\infty} \mathrm{d}\! x \;
+ e^{\frac{U_F(x)}{k_B T}}
+ \int_{-\infty}^{x} \mathrm{d}\! x' \;
+ e^{\frac{-U_F(x')}{k_B T}}
+\]
+
+ <p>
+ <img src="media/build/landscape-hw-hh.png"
+ style="vertical-align: middle;">
+ <img src="media/build/kramers-integrand-hw-hh.png"
+ style="vertical-align: middle;">
+ </p>
+ </section>
+ <section>
+ <h2>Sawsim: Tension models</h2>
+ <table class="center">
+ <tr>
+ <td style="text-align: center;">
+ <img src="media/build/unfolding-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ <td rowspan="2" style="vertical-align: middle;">
+ <img src="media/build/wlc-model-hw-fh.png">
+ </td>
+ <td rowspan="2" style="vertical-align: middle;">
+ <img src="media/build/fjc-model-hw-fh.png">
+ </td>
+ </tr>
+ <tr>
+ <td style="text-align: center;">
+ <img src="media/build/sawsim-states-hw-hh.png"
+ style="vertical-align: middle;">
+ </td>
+ </tr>
+ </table>
+ </section>
+ <section>
+ <h2>Sawsim: Fitting models</h2>
+ <p>
+ <img src="media/build/fit-valley-fw-fh.png" />
+ </p>
+ </section>
+ </section>
+ <section>
+ <section>
+ <h2>Sawsim: Salt</h2>
+ <p>
+ <img src="media/build/lu-fig1-fw-fh.png" />
+ </p>
+ <p style="text-align: center;">
+ <small>
+ <a href="http://dx.doi.org/10.1016/S0006-3495(00)76273-4">
+ Lu and Schulten, 2000
+ </a>
+ </small>
+ </p>
+ </section>
+ <section>
+ <h2>Sawsim: Glutamic acid</h2>
+ <p>
+ <img src="media/build/1TIT-hbond-fw-fh.png" />
+ </p>
+ </section>
+ </section>
+ <section>
+ <h1>THE END</h1>
+ <p style="text-align: center;">
+ Written with <a href="http://lab.hakim.se/reveal-js/">reveal.js</a>
+ </p>
+ </section>
+ </div>
+ </div>
+ <script src="lib/js/head.min.js"></script>
+ <script src="js/reveal.min.js"></script>
+ <script>
+ // Full list of configuration options available here:
+ // https://github.com/hakimel/reveal.js#configuration
+ Reveal.initialize({
+ controls: true,
+ progress: true,
+ history: true,
+ center: true,
+ theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
+ transition: Reveal.getQueryHash().transition || 'none', // default/cube/page/concave/zoom/linear/fade/none
+ // Optional libraries used to extend on reveal.js
+ dependencies: [
+ { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
+ { src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
+ { src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
+ { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
+ { src: 'plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
+ { src: 'plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
+ // { src: 'plugin/search/search.js', async: true, condition: function() { return !!document.body.classList; } }
+ // { src: 'plugin/remotes/remotes.js', async: true, condition: function() { return !!document.body.classList; } }
+ ]
+ });
+
+ </script>
+
+ </body>
+</html>