jasonhodges · August 29, 2015 13:58 · Apr 7, 2014 · Oct 16, 2013
diff --git a/raw.rb b/raw.rb
@@ -0,0 +1,40 @@
+# Author: Brandon Mathis
+# Description: Provides plugins with a method for wrapping and unwrapping input to prevent Markdown and Textile from parsing it.
+# Purpose: This is useful for preventing Markdown and Textile from being too aggressive and incorrectly parsing in-line HTML.
+module TemplateWrapper
+  # Wrap input with a <div>
+  def safe_wrap(input)
+    "<div class='bogus-wrapper'><notextile>#{input}</notextile></div>"
+  end
+  # This must be applied after the
+  def unwrap(input)
+    input.gsub /<div class='bogus-wrapper'><notextile>(.+?)<\/notextile><\/div>/m do
+      $1
+    end
+  end
+end
+
+# Author: phaer, https://github.com/phaer
+# Source: https://gist.github.com/1020852
+# Description: Raw tag for jekyll. Keeps liquid from parsing text betweeen {% raw %} and {% endraw %}
+
+module Jekyll
+  class RawTag < Liquid::Block
+    def parse(tokens)
+      @nodelist ||= []
+      @nodelist.clear
+
+      while token = tokens.shift
+        if token =~ FullToken
+          if block_delimiter == $1
+            end_tag
+            return
+          end
+        end
+        @nodelist << token if not token.empty?
+      end
+    end
+  end
+end
+
+Liquid::Template.register_tag('raw', Jekyll::RawTag)
diff --git a/terminal.css b/terminal.css
@@ -1,4 +1,3 @@
-
 /*-----------------------------------------------------------------------------------*/
 /* Window
 /*-----------------------------------------------------------------------------------*/

diff --git a/sample_entry.markdown b/sample_entry.markdown
@@ -0,0 +1,11 @@
+To get started with Rails we need to install the gem. From the terminal type:
+
+```
+{% terminal %}
+$ gem install rails
+Fetching: i18n-0.6.1.gem (100%)
+Fetching: multi_json-1.3.6.gem (100%)
+Fetching: activesupport-3.2.8.gem (100%)
+...
+{% endterminal %}
+```
diff --git a/terminal.css b/terminal.css
@@ -0,0 +1,137 @@
+
+/*-----------------------------------------------------------------------------------*/
+/* Window
+/*-----------------------------------------------------------------------------------*/
+
+.window {
+  margin: 0px auto 30px auto;
+  background: -webkit-linear-gradient(rgba(233, 233, 233, 1.0), rgba(178, 178, 178, 1.0) 21px, #EDEDED, #EDEDED 23px);
+  background: -moz-linear-gradient(rgba(233, 233, 233, 1.0), rgba(178, 178, 178, 1.0) 21px, #EDEDED, #EDEDED 23px);
+  border-radius: 5px;
+  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 22px 50px 4px rgba(0,0,0,0.56), 0 0 0 1px rgba(0, 0, 0, 0.3);
+  text-align: left;
+  z-index:0;
+  visibility:hidden;
+  opacity:0;
+  visibility:visible;
+  opacity:1;
+}
+
+.container {
+  border-radius: 5px;
+}
+
+h1.titleInside {
+  margin: 0px;
+  position:relative;
+  z-index:2;
+  color:#3c3c3c;
+  font-size:13px;
+  line-height:21px;
+  text-decoration:none;
+  text-shadow: 0 1px 1px #e7e7e7;
+  text-align:center;
+  text-transform:capitalize;
+}
+
+nav.control-window {
+  float: left;
+  padding: 2px 0px 0px 10px;
+  left:5px;
+  top:3px;
+  z-index:10;
+  height:19px;
+}
+
+nav.control-window a {
+  display: inline-block;
+  margin: 2px 0px 3px 1px;
+  width: 12px;
+  height: 12px;
+  border-radius: 100%;
+  box-shadow: 0px 1px 0px rgba(255,255,255,.5);
+  text-indent: -9999px;
+  position: relative;
+}
+nav.control-window a:before {
+  content: '';
+  display: block;
+  position: absolute;
+  border-radius: 100%;
+  box-shadow:inset 0 1px 4px rgba(0, 0, 0, .8);
+  top: 0px;
+  left: 0px;
+  bottom: 0px;
+  right: 0px;
+}
+nav.control-window a:after {
+  content: '';
+  display: block;
+  position: absolute;
+  top: 2px;
+  left: 1px;
+  bottom: 1px;
+  right: 1px;
+  border-radius: 100%;
+  background: -webkit-linear-gradient(white, rgba(255, 255, 255, .9) 2%, white, rgba(255, 255, 255, .4) 16%, rgba(255, 255, 255, 0) 43%, rgba(255, 255, 255, .74), rgba(255, 255, 255, .7) 122%, rgba(255, 255, 255, .7));
+  background: -moz-linear-gradient(white, rgba(255, 255, 255, .9) 2%, white, rgba(255, 255, 255, .4) 16%, rgba(255, 255, 255, 0) 43%, rgba(255, 255, 255, .74), rgba(255, 255, 255, .7) 122%, rgba(255, 255, 255, .7));
+  box-shadow: inset 0px -3px -5px 3px rgba(255, 255, 255, 0.2), inset 0px 2px -5px 3px rgba(255, 255, 255, 0.2);
+}
+nav.control-window a.close {
+  background: #FD4E4E;
+}
+nav.control-window a.minimize {
+  background: #F3BB55;
+}
+nav.control-window a.maximize {
+  background: #96D16F;
+}
+nav.control-window a.deactivate {
+  background: #b5b5b5;
+}
+
+/*-----------------------------------------------------------------------------------*/
+/* Terminal Console Layout
+/*-----------------------------------------------------------------------------------*/
+
+.terminal {
+  background: #333;
+  color: #DDD;
+  white-space: pre-line;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  width: 100%;
+}
+
+.terminal table {
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+div.terminal td {
+  vertical-align: top;
+}
+
+div.terminal pre {
+  background: none;
+  border: none;
+  padding-left: 0px;
+  box-shadow: none;
+  -webkit-box-shadow: none;
+}
+
+div.terminal pre span {
+  display: block;
+}
+
+div.terminal {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+div.terminal pre.line-numbers span {
+  display: inline;
+}
+
+div.terminal span.command { color: #FFF; }
+div.terminal span.output { color: #BBB; }
diff --git a/terminal_tag.rb b/terminal_tag.rb
@@ -0,0 +1,58 @@
+module Jekyll
+
+  class TerminalTag < Liquid::Block
+    include TemplateWrapper
+
+    def initialize(tag_name, markup, tokens)
+      super
+    end
+
+    def render(context)
+      output = super(context)
+
+      %{<div class="window">
+          <nav class="control-window">
+            <a href="#finder" class="close" data-rel="close">close</a>
+            <a href="#" class="minimize">minimize</a>
+            <a href="#" class="deactivate">deactivate</a>
+          </nav>
+          <h1 class="titleInside">Terminal</h1>
+          <div class="container"><div class="terminal">#{promptize(output)}</div></div>
+        </div>}
+    end
+
+    def promptize(content)
+      content = content.strip
+      gutters = content.lines.map { |line| gutter(line) }
+      lines_of_code = content.lines.map { |line| line_of_code(line) }
+
+      table = "<table><tr>"
+      table += "<td class='gutter'><pre class='line-numbers'>#{gutters.join("\n")}</pre></td>"
+      table += "<td class='code'><pre><code>#{lines_of_code.join("")}</code></pre></td>"
+      table += "</tr></table>"
+    end
+
+    def gutter(line)
+      gutter_value = line.start_with?(command_character) ? command_character : "&nbsp;"
+      "<span class='line-number'>#{gutter_value}</span>"
+    end
+
+    def line_of_code(line)
+      if line.start_with?(command_character)
+        line_class = "command"
+        line = line.sub(command_character,'').strip
+      else
+        line_class = "output"
+      end
+      "<span class='line #{line_class}'>#{line}</span>"
+    end
+
+    def command_character
+      "$"
+    end
+
+  end
+
+end
+
+Liquid::Template.register_tag('terminal', Jekyll::TerminalTag)
No results found