go.talks/present: separate actions from slide and article templates

Also includes some CSS cleanups, and adds the ability to edit code
in articles.

R=golang-dev, campoy
CC=golang-dev
https://golang.org/cl/6816072
diff --git a/present/parse.go b/present/parse.go
index 86f8914..33c1a87 100644
--- a/present/parse.go
+++ b/present/parse.go
@@ -45,8 +45,8 @@
 // extensions maps the presentable file extensions to the name of the
 // template to be executed.
 var extensions = map[string]string{
-	".slide":   "templates/slides.tmpl",
-	".article": "templates/article.tmpl",
+	".slide":   "slides.tmpl",
+	".article": "article.tmpl",
 }
 
 func isDoc(path string) bool {
@@ -65,17 +65,18 @@
 
 	// Find which template should be executed.
 	ext := filepath.Ext(docFile)
-	tmplPath, ok := extensions[ext]
+	contentTmpl, ok := extensions[ext]
 	if !ok {
 		return fmt.Errorf("no template for extension %v", ext)
 	}
 
 	// Locate the template file.
-	name := filepath.Join(base, tmplPath)
+	actionTmpl := filepath.Join(base, "templates/action.tmpl")
+	contentTmpl = filepath.Join(base, "templates", contentTmpl)
 
 	// Read and parse the input.
-	tmpl := template.New(name).Funcs(funcs)
-	if _, err := tmpl.ParseFiles(name); err != nil {
+	tmpl := template.New("").Funcs(funcs)
+	if _, err := tmpl.ParseFiles(actionTmpl, contentTmpl); err != nil {
 		return err
 	}
 
@@ -273,7 +274,7 @@
 }
 
 // lesserHeading returns true if text is a heading of a lesser or equal level
-// than that denoted by prefix. 
+// than that denoted by prefix.
 func lesserHeading(text, prefix string) bool {
 	return strings.HasPrefix(text, "*") && !strings.HasPrefix(text, prefix+"*")
 }
diff --git a/present/static/article.css b/present/static/article.css
index cb7b381..e6ab1e8 100644
--- a/present/static/article.css
+++ b/present/static/article.css
@@ -10,6 +10,8 @@
 }
 pre {
 	line-height: 18px;
+	margin: 0;
+	padding: 0;
 }
 a {
 	color: #375EAB;
@@ -18,17 +20,9 @@
 a:hover {
 	text-decoration: underline;
 }
-p, pre, ul, ol {
+p, ul, ol {
 	margin: 20px;
 }
-pre {
-	background: #e9e9e9;
-	padding: 10px;
-
-	-webkit-border-radius: 5px;
-	-moz-border-radius: 5px;
-	border-radius: 5px;
-}
 
 h1, h2, h3, h4 {
 	margin: 20px 0;
@@ -94,64 +88,49 @@
 	margin: 40px 0;
 }
 
-/* always show topbar for large screens */
-@media screen and (min-width: 130ex) and (min-height: 300px) {
-       /* 130ex -> wide enough so that title isn't below buttons */
-
-	div#topbar.wide {
-		position: fixed;
-		z-index: 1;
-		top: 0;
-		width: 100%;
-		height: 63px;
-		border-bottom: 1px solid #B0BBC5;
-	}
-
-	div#page.wide {
-		position: fixed;
-		top: 64px; /* to match topbar */
-		bottom: 0px;
-		overflow: auto;
-		margin-left: auto;
-		margin-right: auto;
-	}
-}
-
 .author p {
 	margin: 20, 0, 0, 0px;
 }
 
-div.output pre {
-  background: black;
+div.code,
+div.output {
+	margin: 20px;
+	padding: 10px;
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
 }
-div.output .stdout {
-  color: #e6e6e6;
+
+div.code { background: #e9e9e9; }
+div.output { background: black; }
+div.output .stdout { color: #e6e6e6; }
+div.output .stderr { color: rgb(244, 74, 63); }
+div.output .system { color: rgb(255, 209, 77) }
+
+.buttons {
+	margin-left: 20px;
 }
-div.output .stderr {
-  color: rgb(244, 74, 63);
-}
-div.output .system {
-  color: rgb(255, 209, 77)
+div.output .buttons {
+	margin-left: 0;
+	margin-bottom: 10px;
 }
 
 #toc {
-  float: right;
-  margin: 0px 10px;
-  padding: 10px;
-  border: 1px solid #e5ecf9; 
-  border-radius: 1em;
-  -moz-border-radius: 1em;
-  background-color: white;
-  max-width: 33%;
+	float: right;
+	margin: 0px 10px;
+	padding: 10px;
+	border: 1px solid #e5ecf9; 
+	background-color: white;
+	max-width: 33%;
+
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
 }
 
 #toc ul, #toc a {
-  list-style-type: none;
-  padding-left: 10px;
-  color: black;
-  margin: 0px;
+	list-style-type: none;
+	padding-left: 10px;
+	color: black;
+	margin: 0px;
 }
-
-.buttons  {
-  margin-left: 1.0em;
-}
\ No newline at end of file
diff --git a/present/templates/action.tmpl b/present/templates/action.tmpl
new file mode 100644
index 0000000..8f4f8c1
--- /dev/null
+++ b/present/templates/action.tmpl
@@ -0,0 +1,36 @@
+{/*
+This is the action template.
+It determines how the formatting actions are rendered.
+*/}
+
+{{define "section"}}
+  <h{{len .Number}} id="TOC_{{.FormattedNumber}}">{{.FormattedNumber}} {{.Title}}</h{{len .Number}}>
+  {{range .Elem}}{{.HTML $.Doc.Template}}{{end}}
+{{end}}
+
+{{define "list"}}
+  <ul>
+  {{range .Bullet}}
+    <li>{{style .}}</li>
+  {{end}}
+  </ul>
+{{end}}
+
+{{define "text"}}
+  {{if .Pre}}
+  <div class="code"><pre>{{range .Lines}}{{.}}{{end}}</pre></div>
+  {{else}}
+  <p>
+    {{range $i, $l := .Lines}}{{if $i}}<br>
+    {{end}}{{style $l}}{{end}}
+  </p>
+  {{end}}
+{{end}}
+
+{{define "code"}}
+  <div class="code{{if .Play}} playground{{end}}" contenteditable="true">{{code .}}</div>
+{{end}}
+
+{{define "image"}}<div class="image">{{image .File .Args}}</div>{{end}}
+      
+{{define "link"}}<p class="link">{{link .URL .Args}}</p>{{end}}
diff --git a/present/templates/article.tmpl b/present/templates/article.tmpl
index 8153cd9..f3f01d2 100644
--- a/present/templates/article.tmpl
+++ b/present/templates/article.tmpl
@@ -1,11 +1,5 @@
-{/*
+{/* This is the article template. It defines how articles are formatted. */}
 
-This is the article template. It defines how articles are formatted.
-
-The "root" template is the base HTML document. The "list", "text", "code",
-"image", and "link" templates are used by the various formatting helpers.
-
-*/}
 {{define "root"}}
 <!DOCTYPE html>
 <html>
@@ -59,35 +53,3 @@
     {{end}}
   </ul>
 {{end}}
-
-{{define "section"}}
-  <h{{len .Number}} id="TOC_{{.FormattedNumber}}">{{.FormattedNumber}} {{.Title}}</h{{len .Number}}>
-  {{range .Elem}}{{.HTML $.Doc.Template}}{{end}}
-{{end}}
-
-{{define "list"}}
-  <ul>
-  {{range .Bullet}}
-    <li>{{style .}}</li>
-  {{end}}
-  </ul>
-{{end}}
-
-{{define "text"}}
-  {{if .Pre}}
-  <div class="code"><pre>{{range .Lines}}{{.}}{{end}}</pre></div>
-  {{else}}
-  <p>
-    {{range $i, $l := .Lines}}{{if $i}}<br>
-    {{end}}{{style $l}}{{end}}
-  </p>
-  {{end}}
-{{end}}
-
-{{define "code"}}
-  <div class="code{{if .Play}} playground{{end}}" contenteditable="true">{{code .}}</div>
-{{end}}
-
-{{define "image"}}<div class="image">{{image .File .Args}}</div>{{end}}
-      
-{{define "link"}}<p class="link">{{link .URL .Args}}</p>{{end}}
diff --git a/present/templates/slides.tmpl b/present/templates/slides.tmpl
index 1774f58..5567127 100755
--- a/present/templates/slides.tmpl
+++ b/present/templates/slides.tmpl
@@ -1,11 +1,5 @@
-{/*
+{/* This is the slide template. It defines how presentations are formatted. */}
 
-This is the slide template. It defines how presentations are formatted.
-
-The "root" template is the base HTML document. The "list", "text", "code",
-"image", and "link" templates are used by the various formatting helpers.
-
-*/}
 {{define "root"}}
 <!DOCTYPE html>
 <html>
@@ -55,35 +49,3 @@
   <script src='/static/playground.js'></script>
 </html>
 {{end}}
-
-{{define "section"}}
-  <h{{len .Number}} id="TOC_{{.FormattedNumber}}">{{.FormattedNumber}} {{.Title}}</h{{len .Number}}>
-  {{range .Elem}}{{.HTML $.Doc.Template}}{{end}}
-{{end}}
-
-{{define "list"}}
-  <ul>
-  {{range .Bullet}}
-    <li>{{style .}}</li>
-  {{end}}
-  </ul>
-{{end}}
-
-{{define "text"}}
-  {{if .Pre}}
-  <div class="code" contenteditable="true"><pre>{{range .Lines}}{{.}}{{end}}</pre></div>
-  {{else}}
-  <p>
-    {{range $i, $l := .Lines}}{{if $i}}<br>
-    {{end}}{{style $l}}{{end}}
-  </p>
-  {{end}}
-{{end}}
-
-{{define "code"}}
-  <div class="code{{if .Play}} playground{{end}}" contenteditable="true">{{code .}}</div>
-{{end}}
-
-{{define "image"}}<div class="image">{{image .File .Args}}</div>{{end}}
-      
-{{define "link"}}<p class="link">{{link .URL .Args}}</p>{{end}}
\ No newline at end of file