structure template pieces

guide-generator.js

@@ -8,9 +8,9 @@ const guidesDir = path.resolve(__dirname, 'guides');
 const markdownDir = path.resolve(__dirname, 'guides-markdown');
 
 const args = process.argv.slice(2);
-let author, 
-    file, 
-    postMeta, 
+let author,
+    file,
+    postMeta,
     all=false;
 
 args.forEach(arg => {
@@ -26,9 +26,9 @@ args.forEach(arg => {
 if ( args.indexOf('--help') > -1 || args.length === 0 ) {
   console.log('Build guides from markdown files. Available options are:');
   console.log('\'--author\'    e.g. `--author="JOHN SNOW"`');
-  console.log('\'--file\'      e.g. `--file="my-markdown.md"`'); 
+  console.log('\'--file\'      e.g. `--file="my-markdown.md"`');
   console.log('\'--all\'       Clears all guides and builds from files in markdown directory')
-  
+
   console.log('\nNOTES:');
   console.log('- code block with lang set to "post-author" will get set in post-meta')
   console.log('- CLI argument takes precedence over "post-author" code block for setting author');
@@ -44,13 +44,13 @@ if ( args.indexOf('--help') > -1 || args.length === 0 ) {
 
 
 /******
-Prepare the marked renderer 
+Prepare the marked renderer
 ******/
 const renderer = new marked.Renderer();
 
 
 // Custom renderer for code snippet highlighting
-const getPostMeta = (author='bcoin-org') => '<ul class="post-meta">' 
+const getPostMeta = (author='bcoin-org') => '<ul class="post-meta">'
            + '<li class="author">By ' + author + '</li>'
            + '</ul>';
 
@@ -65,7 +65,7 @@ renderer.heading = (text, level) => {
       postMeta = getPostMeta(author)
       header += postMeta;
     }
-    
+
     return header;
   } else {
     return `<h${level}>${text}</h${level}>`;
@@ -78,9 +78,9 @@ renderer.code = function (code, language) {
     return postMeta ? '' : getPostMeta(code);
   }
 
-  return `<pre class="line-numbers language-${language}">` 
+  return `<pre class="line-numbers language-${language}">`
            + `<code class="line-numbers language-${language}">`
-           + Prism.highlight(code, PrismLanguages[language]) 
+           + Prism.highlight(code, PrismLanguages[language])
            + '</code></pre>';
 }
 
@@ -123,14 +123,14 @@ if (all) {
   fs.readdir(markdownDir, (err, files) => {
     if (err) throw err;
     for (let i=0; i < files.length; i++) {
-      const file = files[i]; 
+      const file = files[i];
       const ext = path.extname(file);
       if (ext === '.md') {
       console.log('Starting file conversion: ', file);
         markdownFile = path.resolve(markdownDir, file);
         htmlFile = path.resolve(guidesDir, file.replace(/\.[^/.]+$/, ".html"));
         createHTML(markdownFile);
-    }  
+    }
     }
     console.log('All files done!');
   });
@@ -140,3 +140,12 @@ if (all) {
   createHTML(markdownFile);
 }
 
+/** Notes for building out page template:
+  - page-wrapper (head scripts, html and body open and close)
+    - header (includes main nav)
+    - guides-wrapper (main content wrapper)
+      - guides-sidebar
+      - guides-wrapper
+      - footer
+    - footer-scripts
+**/

page-templates/close.html → page-templates/footer-scripts.html

@@ -11,6 +11,3 @@
 
   <!-- github button js -->
   <script async defer src="https://buttons.github.io/buttons.js"></script>
-
-</body>
-</html>

page-templates/footer.html

@@ -0,0 +1,30 @@
+<footer id="footer" class="footer-minimal">
+  <div class="container">
+
+    <div class="row">
+      <div class="col-sm-12">
+        <ul class="social-icons social-icons-circle text-center m-b-35">
+          <li><a href="https://twitter.com/bcoin"><i class="fa fa-twitter"></i></a></li>
+          <li><a href="https://github.com/bcoin-org/bcoin"><i class="fa fa-github"></i></a></li>
+
+
+          <li><a href="../slack-signup.html" target="_blank"><i class="fa fa-slack"></i></a></li>
+        </ul>
+      </div>
+    </div>
+    <div class="row">
+      <div class="col-sm-12 text-center m-b-35">
+        <img class="m-b-35 QR-code" src="../assets/images/donation_QR.png"/>
+        <p class="m-0"><strong>Bcoin Development Donation Address:</strong><br />3Bi9H1hzCHWJoFEjc4xzVzEMywi35dyvsV</p>
+
+      </div>
+    </div>
+    <div class="row">
+      <div class="col-sm-12 text-center">
+        <p class="m-0">Copyright <a href="#">bcoin.io, Purse</a>, 2017, All Rights Reserved.</p>
+
+      </div>
+    </div>
+
+  </div>
+</footer>

page-templates/guides-sidebar.html

@@ -0,0 +1,36 @@
+<div class="col-sm-3 sidebar">
+  <!-- CATEGORIES WIDGET -->
+  <div class="widget guide-list">
+    <h6 class="montserrat text-uppercase bottom-line">Install</h6>
+    <ul class="icons-list">
+      <li><a href="install-linux.html">Install on Linux</a></li>
+      <li><a href="install-mac.html">Install on Mac OS</a></li>
+      <li><a href="install-windows.html">Install on Windows</a></li>
+      <!--<li><a data-toggle="" href="">Quick Sync (Torrent) </a></li>-->
+    </ul>
+    <br>
+    <h6 class="montserrat text-uppercase bottom-line">Guides</h6>
+    <ul class="icons-list">
+      <li><a href="generate-address.html">Generate A Bitcoin Address</a></li>
+      <li><a href="scripting.html">Intro to Scripting</a></li>
+      <li><a href="op_return.html">Create an OP_RETURN</a></li>
+      <!--<li><a data-toggle="" href="">Quick Sync (Torrent) </a></li>-->
+    </ul>
+  </div>
+  <!-- END CATEGORIES WIDGET -->
+
+  <!-- TEXT WIDGET -->
+  <div class="widget">
+    <h6 class="montserrat text-uppercase bottom-line">Looking for Docs?</h6>
+    <p>Checkout our <a href="../api-docs/index.html">API Docs</a> or the <a href="http://bcoin.io/docs/index.html">Full Documentation</a></p>
+  </div>
+  <!-- END TEXT WIDGET -->
+
+  <!-- TEXT WIDGET -->
+  <div class="widget">
+    <h6 class="montserrat text-uppercase bottom-line">Get Involved</h6>
+    <p>If you think you've got what it takes to make your own bcoin guides and tutorials, reach out to us on <a href="../slack-signup.html"> Slack!</a></p>
+    <p>Want to join the team?<a href="https://angel.co/purse/jobs/90956-bitcoin-protocol-engineer-bcoin"> We’re hiring.</a></p>
+  </div>
+  <!-- END TEXT WIDGET -->
+</div>

page-templates/guides-wrapper.html

@@ -0,0 +1,93 @@
+<!-- WRAPPER -->
+  <div class="wrapper">
+
+    <!-- PAGE TITLE -->
+    <section class="module-sm bg-white-dark" data-background="../assets/images/bg-header.jpg">
+      <div class="container">
+
+        <div class="row">
+          <div class="col-sm-12 text-center">
+
+            <h2 class="montserrat text-uppercase m-b-10"><span class="text-highlight-black" style="line-height: 1.5;">&nbsp;Guides &nbsp;and &nbsp;Videos&nbsp;</span></h2>
+
+          </div>
+        </div>
+
+      </div>
+    </section>
+    <!-- END PAGE TITLE -->
+
+    <!-- GUIDES/TUTORIALS -->
+    <section class="module" style="padding-top:70px !important;">
+      <div class="container">
+
+        <div class="row">
+
+          <!-- SIDEBAR -->
+          <!-- END SIDEBAR -->
+
+          <!-- START OF ARTICLE CONTAINER -->
+          <div class="col-sm-9 blog-content post-thumbnail">
+            <!-- POST IMAGE -->
+            <article class="post format-image">
+              <div class="row">
+                <!--<div class="col-sm-5">
+                  <div class="post-preview">
+                    <a href="#"><img src="../assets/images/guides/get-started.png" alt=""></a>
+                  </div>
+                </div>-->
+
+                <!-- after re-enabling the above code, change the col-sm below to col-sm-7 -->
+                <div class="panel-group">
+                  <div class="col-sm-12 panel panel-default">
+                    <div class="post-content" style="color:#000;">
+          <!-- START OF GUIDE -->
+
+          <!-- END OF GUIDE -->
+                  </div>
+                </div>
+              </div>
+            </div>
+          </article>
+          <!-- END OF ARTICLE CONTAINER -->
+
+          </div>
+          <!-- END BLOG CONTENT -->
+
+
+
+        </div><!-- .row -->
+
+      </div>
+    </section>
+    <!-- END NEW BLOGS -->
+
+        </div><!-- .row -->
+
+      </div>
+    </section>
+    <!-- END BLOGS -->
+
+
+    <!-- PARALLAX DOCS CTA -->
+    <section class="module bg-white-alfa-30 parallax color-white" data-background="../assets/images/bg-header.jpg">
+      <div class="container">
+
+        <div class="row">
+          <div class="col-sm-12">
+            <div class="text-center">
+              <h2 class="montserrat text-uppercase m-b-30">Ready to start building? Read the docs!</h2>
+              <a href="http://bcoin.io/docs/index.html" target="_blank" class="btn btn-lg btn-purple">Documentation</a>
+            </div>
+          </div>
+        </div><!-- .row -->
+
+      </div>
+    </section>
+    <!-- END PARALLAX DOCS CTA -->
+
+    <!-- FOOTER -->
+    <!-- END FOOTER -->
+
+  </div>
+  <!-- /WRAPPER -->

page-templates/head.html → page-templates/page-wrapper.html

@@ -65,4 +65,7 @@
         ga('send', 'pageview');
     </script>
 </head>
-<body>
+<body>
+
+</body>
+</html>