Move doc/manual.html to ref.html

Clean up build scripts, put backer list in new layout
ericandrewlewis · Jan 15, 2016 · b9c36a3 · b9c36a3
1 parent 6a34e93
commit b9c36a3
Show file tree

Hide file tree

Showing 26 changed files with 101 additions and 301 deletions.
diff --git a/Makefile b/Makefile
@@ -1,7 +1,6 @@
 PAGES:=$(wildcard pages/*.html) $(wildcard pages/**/*.html)
 
-all: public/doc/manual.html \
-     $(PAGES:pages/%=public/%) \
+all: $(PAGES:pages/%=public/%) \
      public/demo/bundle_basic.js \
      public/demo/bundle_markdown.js \
      public/demo/bundle_dino.js \
@@ -11,11 +10,11 @@ all: public/doc/manual.html \
 
 BUILD:=browserify
 
-public/doc/manual.html: node_modules/prosemirror/src/*/*.js src/templates/* src/doc/build-manual.js
-	node src/doc/build-manual.js > $@
+public/ref.html: node_modules/prosemirror/src/*/*.js pages/ref.html templates/* src/build/*.js
+	node src/build/build.js --ref $@
 
-%.html: $($@:public/%=pages/%)
-	node src/generate.js $@
+public/%.html: pages/%.html templates/* src/build/*.js
+	node src/build/build.js $@
 
 public/demo/bundle_collab.js: src/demo/collab/client/*.js node_modules/prosemirror/dist/**/*.js
 	node_modules/.bin/$(BUILD) --outfile $@ -t babelify src/demo/collab/client/collab.js

diff --git a/src/doc/intro.md → markdown/ref_intro.md b/src/doc/intro.md → markdown/ref_intro.md
diff --git a/public/backers.html → pages/backers.html b/public/backers.html → pages/backers.html
@@ -1,9 +1,6 @@
-<!doctype html>
+<<head {title: "ProseMirror backer list"}>>
 
-<meta charset="utf-8">
-<title>ProseMirror backer list</title>
-<link rel=stylesheet href=demo.css>
-<meta name="viewport" content="width=device-width, initial-scale=1">
+<h2>This is why we <em>can</em> have nice things</h2>
 
 <style>
   .backerlogo { vertical-align: middle; }
@@ -15,35 +12,6 @@
   .backertable a.logolink { font-size: 130% }
 </style>
 
-<body>
-
-<div class="fronttitle">
-  <div class="fronttitle-inner">
-    <h1><a href="index.html"><img src="logo.png" class=logo> ProseMirror</a></h1>
-    <div class=subtitle>&nbsp;List of backers</div>
-  </div>
-</div>
-
-<div class="nav">
-  <span class="demos">
-    <a href="#">Demos</a>
-    <div class=submenu>
-      <a href="demo_basic.html">Basics</a>
-      <a href="demo_markdown.html">User-friendly Markdown</a>
-      <a href="demo_dino.html">Dinos in the document</a>
-      <a href="demo_lint.html">Document checking</a>
-      <a href="demo_track.html">Change tracking</a>
-      <a href="demo_collab.html">Collaborative editing</a>
-    </div>
-  </span>
-  <a href="doc/manual.html">Docs</a>
-  <a href="https://github.com/prosemirror/prosemirror">GitHub</a>
-</div>
-
-<article>
-
-<h3>This is why we <em>can</em> have nice things</h3>
-
 <p>These are the wonderful people and companies
 that <a href="http://indiegogo.com/projects/prosemirror/">funded</a>
 the open-sourcing of ProseMirror in 2015, raising a total of
@@ -1719,3 +1687,5 @@ <h3>This is why we <em>can</em> have nice things</h3>
     <td><span style="color: #666">Undisclosed<span></td>
   </tr>
 </table>
+
+<<foot>>
diff --git a/pages/demo/basic.html b/pages/demo/basic.html
@@ -1,6 +1,8 @@
 <<head {title: "ProseMirror demo",
         nav: {demos: "index.html#demos"}}>>
 
+<h2>Editing with ProseMirror</h2>
+
 <style>
 .menustyle {
   position: absolute;
@@ -9,8 +11,6 @@
 }
 </style>
 
-<h3>Editing with ProseMirror</h3>
-
 <p>It takes all of two lines code to set up a ProseMirror editor:</p>
 
 <pre>

diff --git a/pages/demo/collab.html b/pages/demo/collab.html
@@ -2,6 +2,8 @@
         nav: {demos: "index.html#demos",
               "blog post": "http://marijnhaverbeke.nl/blog/collaborative-editing.html"}}>>
 
+<h2>Collaborate</h2>
+
 <style>
 .subtle { color: #777 }
 
@@ -75,8 +77,6 @@
 }
 </style>
 
-<h3>Collaborate</h3>
-
 <p>The editor below talks to a simple server-side service to allow
 real-time <a href="http://marijnhaverbeke.nl/blog/collaborative-editing.html">collaborative
 editing</a>. Everybody connected to a given document sees the same

diff --git a/pages/demo/dino.html b/pages/demo/dino.html
@@ -1,14 +1,14 @@
 <<head {title: "ProseMirror Document Model Extension",
         nav: {demos: "index.html#demos"}}>>
 
+<h2>Extending the document model</h2>
+
 <style>
   img.dinosaur { height: 40px; vertical-align: bottom; border: 1px solid #0ae; border-radius: 4px; background: #ddf6ff }
   .dinoicon { height: 20px; vertical-align: bottom }
   .ProseMirror-tooltip .dinoicon { vertical-align: middle }
 </style>
 
-<h3>Extending the document model</h3>
-
 <p>Imagine we need to include exotic, site-specific elements in our
 documents. These may be handles to other objects in our system
 (documents, users, etc), domain-specific widgets, or, in the case of

diff --git a/pages/demo/lint.html b/pages/demo/lint.html
@@ -1,6 +1,8 @@
 <<head {title: "ProseMirror Document Checking Demo",
         nav: {demos: "index.html#demos"}}>>
 
+<h2>Working with content</h2>
+
 <style>
   .markprob { background: #fdd; border-bottom: 1px solid #f22 }
   .problem { padding: 2px; cursor: pointer }
@@ -11,8 +13,6 @@
   .fixbutton { background: #0ae; color: white; border: none; border-radius: 5px; cursor: pointer; margin-left: 10px }
 </style>
 
-<h3>Working with content</h3>
-
 <p>The browser DOM serves its purpose—representing complex
 webpages—very well. But its huge scope and loose structure makes it
 difficult to make assumptions about. A document model that represents

diff --git a/pages/demo/markdown.html b/pages/demo/markdown.html
@@ -1,15 +1,15 @@
 <<head {title: "ProseMirror Markdown Demo",
         nav: {demos: "index.html#demos"}}>>
 
+<h2>Friendly Markdown</h2>
+
 <style>
   .ProseMirror-content { height: 120px; overflow-y: auto; box-sizing: border-box; -moz-box-sizing: border-box }
   textarea { width: 100%; height: 123px; border: 1px solid silver; box-sizing: border-box; -moz-box-sizing: border-box; padding: 3px 10px;
              border-radius: 3px; border: 1px solid #38a }
   .ProseMirror, #markdown textarea { display: block; margin-bottom: 4px }
 </style>
 
-<h3>Friendly Markdown</h3>
-
 <p>Say you have a site that allows users to enter comments, and you've
 decided to use Markdown for the comment input. Your target group
 mostly knows how to use Markdown, and finds it convenient to type. But

diff --git a/pages/demo/track.html b/pages/demo/track.html
@@ -1,6 +1,8 @@
 <<head {title: "ProseMirror Change Tracking",
         nav: {demos: "index.html#demos"}}>>
 
+<h2>Tracking changes</h2>
+
 <style>
   .commit {
     margin-bottom: 4px;
@@ -37,8 +39,6 @@
   }
 </style>
 
-<h3>Tracking changes</h3>
-
 <p>Changes are first-class values in ProseMirror. You can hold on to
 them, and do things with them. Such
 as <a href="http://marijnhaverbeke.nl/blog/collaborative-editing.html">rebasing</a>

diff --git a/pages/index.html b/pages/index.html
@@ -10,6 +10,9 @@
         demos: "#demos"}
 }>>
 
+<p>ProseMirror is an in-browser semantic rich text editor component.
+This is what it might look like:</p>
+
 <style>
 .demoblocks {
   margin: 0 -20px;
@@ -59,9 +62,6 @@
 }
 </style>
 
-<p>ProseMirror is an in-browser semantic rich text editor component.
-This is what it might look like:</p>
-
 <div id="content">
   <h3>Control your Content</h3>
 

diff --git a/pages/ref.html b/pages/ref.html
@@ -0,0 +1,48 @@
+<<do
+  var toc = []
+  for (var name in modules) toc[name] = "#" + name
+>>
+<<head {title: "ProseMirror Reference Guide",
+        nav: toc}>>
+
+<h1>Reference Guide</h1>
+
+<style>
+dd p { margin: 0 }
+dl { margin: 1em 0 }
+dd { margin-left: 20px }
+dt {
+  margin-top: 1em;
+  padding-left: 20px;
+  text-indent: -20px;
+}
+
+.kind {
+  font-weight: normal;
+  font-size: 85%;
+}
+
+code a, h2 a, h3 a, code a:visited, h2 a:visited, h3 a:visited {
+  color: inherit;
+  text-decoration: none;
+}
+
+a.code-link {
+  float: right;
+  color: #999;
+  font-size: 16px;
+  font-weight: normal;
+  font-family: monospace;
+  line-height: .7;
+  text-decoration: none;
+  text-indent: 0;
+}
+</style>
+
+<<markdownFile "ref_intro">>
+
+<<for name, mod in modules>>
+  <<module {name: name, mod: mod}>>
+<</for>>
+
+<<foot>>