Added blog stuff and hidden pages for projects

docpad.js

@@ -22,7 +22,16 @@ var docpadConfig = {
   plugins: {
     cleanurls: {
       static: true
-    }
+    },
+		moment: {
+			formats: [
+				{
+					raw: "date",
+					format: "MMMM Do, YYYY",
+					formatted: "formattedDate"
+				}
+			]
+		}
   }
 }
 

package.json

@@ -7,6 +7,7 @@
     "docpad-plugin-autoprefix": "~2.0.0",
     "docpad-plugin-cleanurls": "~2.8.1",
     "docpad-plugin-ejs": "~2.0.2",
+    "docpad-plugin-moment": "~2.0.2",
     "docpad-plugin-nodesass": "~2.8.1"
   },
   "main": "node_modules/.bin/docpad-server",

src/documents/blog.html

@@ -1,7 +0,0 @@
----
-layout: "imgcontentpage"
-title: "Blog"
-icon: "pencil"
-order: 2
----
-This will be a blog.

src/documents/blog.html.ejs

@@ -0,0 +1,17 @@
+---
+layout: "imgcontentpage"
+title: "Blog"
+icon: "pencil"
+order: 2
+referencesOthers: true
+---
+<% var posts = getCollection("posts").toJSON() %>
+<% posts.forEach(function(post){ %>
+  <div class="post">
+  <h2><a href="<%- post.url %>"><%= post.title %></a></h2>
+  <div class="date"><%- post.formattedDate %></div>
+  <div class="firstcontent">
+    <%- post.contentRenderedWithoutLayouts.split("-split-")[0] %>
+  </div>
+  </div>
+<% }) %>

src/documents/blog/2016-04-11-tvheadend-vm.html.md

@@ -0,0 +1,23 @@
+---
+layout: "blogpost"
+title: "Running TVheadend in a VM"
+date: 2016-04-11
+subtitle: "Or how I went from trying to watch HD TV to changing hypervisor..."
+---
+For the past year or so, I've been running a headless virtualisation server, with a number of both Linux and Windows VMs to store files and for other home server tasks, as well as a load of Linux VMs that I'd spin up for testing software.
+One of these servers streams live TV from Freeview across the network, allowing clients (usually Kodi or VLC) to watch TV. However, the quality of this system wasn't always great, and when I got a shiny new DVB T2 tuner to have a go with Freeview HD, I had a number of issues.
+-split-
+
+
+At this point, the VM server was running VMWare ESXi, and making use of its USB passthrough options to allow a VM to use the USB Tuner. This worked OK(ish) with the standard definition tuner, but once I started using the HD tuner, there were a large number of data errors, making it completely impossible to watch TV.
+
+While I was always impressed with ESXi and its features, even though I used very few of these, I still had some major issues:
+- It's not free - yes, there are free licenses available, but this locks users out of a large number of new features (if you don't pay for vCenter). As well as all of this, it's still not *free* - I want to be able to see the code!
+- It requires either a copy of vCenter, allowing you to use a web UI (but that isn't free), or use a native client, which needed a fairly large installer and was a bit of a pain
+- It still doesn't work with my fancy tuner.
+
+So, I started to look for a replacement. Firstly, I tried Virtualbox - it's free and open source, and I've used it for years to run VMs on my main machines. Sadly, that had even more issues with the tuner, to the extent where Tvheadend couldn't see it at all. After installing Ubuntu server many times, I finally thought to try KVM/Qemu, which is again open source and free. I tried this on a spare Ubuntu install on my laptop, and it worked! I was finally able to watch terrible TV again, but now in HD!
+
+Now that I had the core virtualisation system sorted, I still needed some nice management system. While there was a package for Ubuntu to manage KVM, I normally run Windows, and also wanted to avoid native clients. Let me introduce the solution to all of these problems - Proxmox. It's a full bare-metal hypervisor with a fairly nice Web UI (built upon the same framework as Tvheadend), has a great auth system that'll use various external services (LDAP with AD works well), and supports both full virtualisation with KVM as well as spinning up Linux containers with LXC.
+
+USB passthrough works fine, and I now have Tvheadend sitting in a Linux VM, recording from a USB tuner to a file share hosted in a Windows VM on the same machine, with no issues! I'm also able to create and start linux containers super quickly (< 1 min), which is great for development use.

src/documents/blog/test.html

@@ -1,4 +0,0 @@
----
-layout: "contentpage"
----
-Test

src/documents/projects.html.ejs

@@ -3,6 +3,7 @@ layout: "imgcontentpage"
 title: "Projects"
 icon: "wrench"
 order: 3
+hidden: true
 ---
 <% var projects = getCollection("projects").toJSON() %>
 <% projects.forEach(function(project){ %>

src/documents/styles.css.scss

@@ -84,6 +84,15 @@ body{
       margin-right: auto;
       margin-top: 10px;
     }
+    h1, h2, h3.date{
+      text-align: center;
+    }
+    h3.date{
+      margin-top: 0px;
+    }
+    h1{
+      margin-bottom: 5px;
+    }
   }
 
   #imgcontent{
@@ -112,6 +121,7 @@ body{
       color: black;
       min-height: 100px;
       display: block;
+      padding-bottom: 20px;
       box-shadow: 0px -20px 10px -10px #6d0000 inset;
       @media(min-width: 600px){
         min-height: calc(50vh - 170px);
@@ -344,7 +354,7 @@ body{
           color: white;
         }
         form{
-          width: 80%;
+          width: 100%;
           margin-left: auto;
           margin-right: auto;
           input, textarea{
@@ -359,6 +369,7 @@ body{
           }
           textarea{
             height: 200px;
+            font-family: inherit;
           }
         }
       }
@@ -410,6 +421,20 @@ body{
   }
 }
 
+#content[data-slug="blog"]{
+  .post{
+    width: 80%;
+    margin-left: auto;
+    margin-right: auto;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    h2, .date{
+      text-align: center;
+      margin: 0;
+    }
+  }
+}
+
 .animations{
   #imgcontent{
     animation-name: fadeInUp;

src/layouts/blogpost.html.ejs

@@ -0,0 +1,9 @@
+---
+layout: contentpage
+---
+
+<h3 class="date"><%- document.formattedDate %></h3>
+<% if(document.subtitle){ %>
+  <h2><%- document.subtitle %></h2>
+<% } %>
+<%- content %>

src/layouts/contentpage.html.ejs

@@ -4,6 +4,7 @@ layout: core.html
 
 <div id="lightcontent" class="animated">
   <div>
+    <h1><%- document.title %></h1>
     <%- content %>
   </div>
 </div>

src/layouts/core.html.ejs

@@ -22,13 +22,15 @@
         <div id="nav">
           <% var pages = getCollection("pages").toJSON() %>
           <% pages.forEach(function(page){ %>
+            <% if(!page.hidden){ %>
             <a class="fa fa-<%= page.icon %> <% if(page.url.split("/")[1] == document.url.split("/")[1]){ %>active<% } %>" href="<%= page.url %>" data-rooturl="<%= page.url.split("/")[1] %>"></a>
+            <% } %>
           <% }) %>
         </div>
       </div>
       <div id="content" class="animations" data-slug="<%- document.slug %>">
         <meta data-menu="<%= document.url.split("/")[1] %>" data-slug="<%- document.slug %>" />
-        <%- content %>
+        <%- content.replace("-split-", "") %>
       </div>
     </div>
     <div id="footer">