From f208307cbdd403d3fa92a1aae1dc9c094c7ec9d8 Mon Sep 17 00:00:00 2001
From: Eric Bidelman
Date: Wed, 11 Jul 2012 10:43:37 -0700
Subject: Bringing in upstream changes

---
 scripts/md/README.md |  5 ++++
 scripts/md/base.html | 66 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 scripts/md/render.py | 53 +++++++++++++++++++++++++++++++++++++++++
 scripts/md/slides.md | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 188 insertions(+)
 create mode 100644 scripts/md/README.md
 create mode 100644 scripts/md/base.html
 create mode 100755 scripts/md/render.py
 create mode 100644 scripts/md/slides.md

(limited to 'scripts')

diff --git a/scripts/md/README.md b/scripts/md/README.md
new file mode 100644
index 0000000..136e465
--- /dev/null
+++ b/scripts/md/README.md
@@ -0,0 +1,5 @@
+Want to use markdown instead?
+
+`python render.py` can do that for you.
+
+Dependencies: jinja2, markdown.
diff --git a/scripts/md/base.html b/scripts/md/base.html
new file mode 100644
index 0000000..a469806
--- /dev/null
+++ b/scripts/md/base.html
@@ -0,0 +1,66 @@
+<!--
+Google IO 2012 HTML5 Slide Template
+
+Authors: Eric Bidelman <ebidel@gmail.com>
+         Luke Mahe <lukem@google.com>
+
+URL: https://code.google.com/p/io-2012-slides
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Google IO 2012</title>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="chrome=1">
+  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">-->
+  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
+  <!--This one seems to work all the time, but really small on ipad-->
+  <!--<meta name="viewport" content="initial-scale=0.4">-->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <link rel="stylesheet" media="all" href="theme/css/default.css">
+  <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="theme/css/phone.css">
+  <base target="_blank"> <!-- This amazingness opens all links in a new tab. -->
+  <script data-main="js/slides" src="js/require-1.0.8.min.js"></script>
+</head>
+<body style="opacity: 0">
+
+<slides class="layout-widescreen">
+
+<slide class="logoslide nobackground">
+  <article class="flexbox vcenter">
+    <span><img src="images/google_developers_logo.png"></span>
+  </article>
+</slide>
+
+<slide class="title-slide segue nobackground">
+  <aside class="gdbar"><img src="images/google_developers_icon_128.png"></aside>
+  <!-- The content of this hgroup is replaced programmatically through the slide_config.json. -->
+  <hgroup class="auto-fadein">
+    <h1 data-config-title><!-- populated from slide_config.json --></h1>
+    <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>
+    <p data-config-presenter><!-- populated from slide_config.json --></p>
+  </hgroup>
+</slide>
+
+{% for slide in slides %}
+<slide class="{{ slide.class }}">
+  <hgroup>
+    <h1>{{ slide.h1 }}</h1>
+    <h2>{{ slide.title }}</h2>
+  </hgroup>
+  <article>
+  {{ slide.content }}
+  </article>
+</slide>
+{% endfor %}
+
+<slide class="backdrop"></slide>
+
+</slides>
+
+<!--[if IE]>
+  <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
+  <script>CFInstall.check({mode: 'overlay'});</script>
+<![endif]-->
+</body>
+</html>
diff --git a/scripts/md/render.py b/scripts/md/render.py
new file mode 100755
index 0000000..c634ea0
--- /dev/null
+++ b/scripts/md/render.py
@@ -0,0 +1,53 @@
+#!/opt/local/Library/Frameworks/Python.framework/Versions/2.7/bin/python
+import codecs
+import re
+import jinja2
+import markdown
+
+def process_slides():
+  with codecs.open('../presentation.html', 'w', encoding='utf8') as outfile:
+    md = codecs.open('slides.md', encoding='utf8').read()
+    md_slides = md.split('\n---\n')
+    print len(md_slides)
+
+    slides = []
+    # Process each slide separately.
+    for md_slide in md_slides:
+      slide = {}
+      sections = md_slide.split('\n\n')
+      # Extract metadata at the beginning of the slide (look for key: value)
+      # pairs.
+      metadata_section = sections[0]
+      metadata = parse_metadata(metadata_section)
+      slide.update(metadata)
+      remainder_index = metadata and 1 or 0
+      # Get the content from the rest of the slide.
+      content_section = '\n\n'.join(sections[remainder_index:])
+      html = markdown.markdown(content_section)
+      slide['content'] = postprocess_html(html, markdown)
+
+      slides.append(slide)
+
+    template = jinja2.Template(open('base.html').read())
+
+    outfile.write(template.render(locals()))
+
+def parse_metadata(section):
+  """Given the first part of a slide, returns metadata associated with it."""
+  metadata = {}
+  metadata_lines = section.split('\n')
+  for line in metadata_lines:
+    colon_index = line.find(':')
+    if colon_index != -1:
+      key = line[:colon_index].strip()
+      val = line[colon_index + 1:].strip()
+      metadata[key] = val
+
+  return metadata
+
+def postprocess_html(html, metadata):
+  """Returns processed HTML to fit into the slide template format."""
+  return html
+
+if __name__ == '__main__':
+  process_slides()
diff --git a/scripts/md/slides.md b/scripts/md/slides.md
new file mode 100644
index 0000000..064b8db
--- /dev/null
+++ b/scripts/md/slides.md
@@ -0,0 +1,64 @@
+title: Slide Title
+class: image
+
+![Mobile vs desktop users](image.png)
+
+---
+
+title: Agenda
+class: big
+
+Things we'll cover:
+
+- Bullet1
+- Bullet2
+- Bullet3
+
+---
+
+title: Today
+class: nobackground fill
+
+![Many kinds of devices.](image.png)
+
+<footer class="source">source: place source info here</footer>
+
+---
+
+h1: Big Title Slide
+class: title-slide
+
+---
+
+title: Code Example
+
+Media Queries are sweet:
+
+<pre class="prettyprint" data-lang="css">
+@media screen and (max-width: 640px) {
+  #sidebar { display: none; }
+}
+</pre>
+
+---
+
+title: Once more, with JavaScript
+
+<pre class="prettyprint" data-lang="javascript">
+function isSmall() {
+  return window.matchMedia("(min-device-width: ???)").matches;
+}
+
+function hasTouch() {
+  return Modernizr.touch;
+}
+
+function detectFormFactor() {
+  var device = DESKTOP;
+  if (hasTouch()) {
+    device = isSmall() ? PHONE : TABLET;
+  }
+  return device;
+}
+</pre>
+
-- 
cgit v1.2.3