livingstyleguide 2.0.0.pre.3 → 2.0.0.pre.4

data/lib/livingstyleguide/integration/compass.rb

@@ -1,4 +1,7 @@
 if defined?(Compass)
-  base_directory = File.join(File.dirname(__FILE__), "..", "..", "..")
-  Compass::Frameworks.register "livingstyleguide", path: base_directory
+  options = {
+    path: LivingStyleGuide::ROOT_PATH,
+    stylesheets_directory: LivingStyleGuide::SASS_PATH
+  }
+  Compass::Frameworks.register "livingstyleguide", options
 end

data/lib/livingstyleguide/integration/rails.rb

@@ -1,11 +1,13 @@
-if defined?(Rails) and defined?(Rails::Railtie)
+if defined?(Rails) && defined?(Rails::Railtie)
   require "rails"
   class LivingStyleGuideRailtie < Rails::Railtie
-    initializer "living_style_guide.assets" do
+    initializer "living_style_guide.assets" do |app|
       Rails.application.config.assets.configure do |env|
         env.register_engine(".lsg", ::LivingStyleGuide::Document)
       end
-      LivingStyleGuide.default_options[:scss_template] = ::Sass::Rails::ScssTemplate
+      LivingStyleGuide.default_options[:scss_template] =
+        ::Sass::Rails::ScssTemplate
+      app.config.assets.paths << ::LivingStyleGuide::SASS_PATH
     end
   end
 end

data/lib/livingstyleguide/integration/sass.rb

@@ -1,4 +1,4 @@
-sass_directory = File.join(File.dirname(__FILE__), "..", "..", "..", "stylesheets")
+sass_directory = LivingStyleGuide::SASS_PATH
 if ENV.has_key?("SASS_PATH")
   ENV["SASS_PATH"] = ENV["SASS_PATH"] + File::PATH_SEPARATOR + sass_directory
 else

data/lib/livingstyleguide/integration/sprockets.rb

@@ -1,5 +1,10 @@
-begin
-  require "sprockets"
-  Sprockets.register_engine(".lsg", ::LivingStyleGuide::Document)
-rescue LoadError
+if defined?(Sprockets)
+  begin
+    require "sprockets"
+    Sprockets.register_engine(".lsg", ::LivingStyleGuide::Document)
+    if Sprockets.respond_to?(:append_path)
+      Sprockets.append_path(::LivingStyleGuide::SASS_PATH)
+    end
+  rescue LoadError
+  end
 end

data/lib/livingstyleguide/markdown_extensions.rb

@@ -14,9 +14,9 @@ module LivingStyleGuide
   }
 
   class RedcarpetHTML < ::Redcarpet::Render::HTML
-    def initialize(options = {}, document)
+    def initialize(document, options = {})
       @options = options
-      @options[:prefix] ||= "lsg--"
+      @options[:prefix] ||= "lsg-"
       @document = document
       @header = nil
       @ids = {}
@@ -25,9 +25,11 @@ module LivingStyleGuide
 
     def header(text, header_level)
       @header = id = slug(text)
-      klass = %w(page-title headline sub-headline sub-sub-headline)[header_level]
+      class_names = %w(page-title headline sub-headline sub-sub-headline)
+      class_name = "#{@options[:prefix]}#{class_names[header_level]}"
       header_level += 1
-      %Q(<h#{header_level} class="#{@options[:prefix]}#{klass}" id="#{id}"><a class="lsg--anchor" href="##{id}"></a>#{text}</h#{header_level}>\n)
+      %Q(<h#{header_level} class="#{class_name}" id="#{id}">) +
+        %Q(<a class="lsg-anchor" href="##{id}"></a>#{text}</h#{header_level}>\n)
     end
 
     def paragraph(text)
@@ -36,11 +38,13 @@ module LivingStyleGuide
 
     def list(contents, list_type)
       tag_name = "#{list_type.to_s[0, 1]}l"
-      %Q(<#{tag_name} class="#{@options[:prefix]}#{list_type}-list">\n#{contents}</#{tag_name}>\n)
+      class_name = "#{@options[:prefix]}#{list_type}-list"
+      %Q(<#{tag_name} class="#{class_name}">\n#{contents}</#{tag_name}>\n)
     end
 
     def list_item(text, list_type)
-      %Q(<li class="#{@options[:prefix]}#{list_type}-list-item">#{text.strip}</li>\n)
+      class_name = "#{@options[:prefix]}#{list_type}-list-item"
+      %Q(<li class="#{class_name}">#{text.strip}</li>\n)
     end
 
     def block_code(code, language)
@@ -48,17 +52,22 @@ module LivingStyleGuide
       language = @options[:default_language] if language == :""
       document = Document.new(livingstyleguide: @document) { code }
       document.id = document_id
-      document.type = language == :example ? @document.defaults[:global][:type] : language
+      document.type = if language == :example
+                      then @document.defaults[:global][:type]
+                      else language
+                      end
       document.template = template_for(language)
       document.render(@document.scope)
     end
 
     def codespan(code)
       code = ERB::Util.html_escape(code)
-      %Q(<code class="#{@options[:prefix]}code-span #{@options[:prefix]}code">#{code}</code>)
+      class_name = "#{@options[:prefix]}code-span #{@options[:prefix]}code"
+      %Q(<code class="#{class_name}">#{code}</code>)
     end
 
     private
+
     def slug(text)
       require "active_support/core_ext/string/inflections"
       ::ActiveSupport::Inflector.parameterize(text, "-")
@@ -66,9 +75,10 @@ module LivingStyleGuide
       text.downcase.gsub(/[ _\.\-!\?\(\)\[\]]+/, "-").gsub(/^-|-$/, "")
     end
 
-    private
     def document_id
-      file = File.basename(@document.file, ".lsg").sub(/^_/, "") if @document.file
+      if @document.file
+        file = File.basename(@document.file, ".lsg").sub(/^_/, "")
+      end
       id = [file, @header].compact.uniq.join("-")
       if id != ""
         @ids[id] ||= 0
@@ -77,7 +87,6 @@ module LivingStyleGuide
       end
     end
 
-    private
     def template_for(language)
       language == :example ? :example : :code
     end

data/lib/livingstyleguide/templates/code.html.erb

@@ -1,3 +1,3 @@
 <section class="<%= classes.join(" ") %>" id="<%= id %>">
-  <pre class="lsg--code-block"><code class="lsg--code"><%= highlighted_source %></code></pre>
+  <pre class="lsg-code-block"><code class="lsg-code"><%= highlighted_source %></code></pre>
 </section>

data/lib/livingstyleguide/templates/example.html.erb

@@ -1,6 +1,6 @@
 <section class="<%= classes.join(" ") %>" id="<%= id %>">
-  <div class="lsg--html">
+  <div class="lsg-html">
     <%= html %>
   </div>
-  <pre class="lsg--code-block"><code class="lsg--code"><%= highlighted_source %></code></pre>
+  <pre class="lsg-code-block"><code class="lsg-code"><%= highlighted_source %></code></pre>
 </section>

data/lib/livingstyleguide/templates/font-example.html.erb

@@ -1,6 +1,6 @@
-<div class="lsg--font-example">
-  <p class="lsg--font-example-text" style="font: <%= font %>">
+<div class="lsg-font-example">
+  <p class="lsg-font-example-text" style="font: <%= font %>">
     <%= text %>
   </p>
-  <pre class="lsg--code-block"><code class="lsg--code"><%= font %></code></pre>
+  <pre class="lsg-code-block"><code class="lsg-code"><%= font %></code></pre>
 </div>

data/lib/livingstyleguide/templates/javascript.html.erb

@@ -1,4 +1,4 @@
 <section class="<%= classes.join(" ") %>" id="<%= id %>">
   <script><%= html %></script>
-  <pre class="lsg--code-block"><code class="lsg--code"><%= highlighted_source %></code></pre>
+  <pre class="lsg-code-block"><code class="lsg-code"><%= highlighted_source %></code></pre>
 </section>

data/lib/livingstyleguide/templates/layout.html.erb

@@ -1,41 +1,35 @@
 <!doctype html>
 <html id="<%= id %>">
-
-<head>
-<meta charset="utf-8">
-<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
-<meta content="width=device-width, initial-scale=1.0" name="viewport">
-<meta content="The LivingStyleGuide Gem v<%= LivingStyleGuide::VERSION %> – https://livingstyleguide.org" name="generator">
-<title><%= ERB::Util.h(title) %></title>
-<script>
-// see: http://www.hagenburger.net/BLOG/Simple-HTML5-Fix-for-IE.html
-for(var e,l="article aside footer header nav section time picture".split(" ");e=l.pop();document.createElement(e));
-<%= javascript %>
-</script>
-<style>
-<%= css %>
-</style>
-<%= head %>
-</head>
-
-<body class="livingstyleguide">
-<%= header %>
-<% unless before.empty? %>
-  <section class="lsg--before">
-  <%= before %>
-  </section>
-<% end %>
-<div class="lsg--container">
-<%= html %>
-</div>
-<% unless after.empty? %>
-  <section class="lsg--after">
-  <%= after %>
-  </section>
-<% end %>
-
-<%= footer %>
-<%= logo %>
-</body>
-
+  <head>
+    <meta charset="utf-8">
+    <meta content="ie=edge" http-equiv="x-ua-compatible">
+    <meta content="width=device-width,initial-scale=1" name="viewport">
+    <meta content="livingstyleguide.org <%= LivingStyleGuide::VERSION %>" name="generator">
+    <title><%= ERB::Util.h(title) %></title>
+    <script>
+      <%= javascript %>
+    </script>
+    <style>
+      <%= css %>
+    </style>
+    <%= head %>
+  </head>
+  <body class="lsg">
+    <%= header %>
+    <% unless before.empty? %>
+      <section class="lsg-before">
+        <%= before %>
+      </section>
+    <% end %>
+    <article class="lsg-container">
+      <%= html %>
+    </article>
+    <% unless after.empty? %>
+      <section class="lsg-after">
+        <%= after %>
+      </section>
+    <% end %>
+    <%= footer %>
+    <%= logo %>
+  </body>
 </html>

data/lib/livingstyleguide/templates/logo.html.erb

@@ -1,3 +1,3 @@
-<a href="http://livingstyleguide.org" class="lsg--logo">
+<a class="lsg-logo" href="https://livingstyleguide.org">
   Made with The LivingStyleGuide Gem
 </a>

data/lib/livingstyleguide/templates/scripts/copy.js.erb

@@ -1,24 +1,24 @@
 function selectElementRange(copyElementSelect) {
-  var range = document.createRange();
-  range.selectNode(copyElementSelect);
-  window.getSelection().removeAllRanges();
-  window.getSelection().addRange(range);
+  var range = document.createRange()
+  range.selectNode(copyElementSelect)
+  window.getSelection().removeAllRanges()
+  window.getSelection().addRange(range)
 
-  document.execCommand("copy");
+  document.execCommand("copy")
 
-  if (copyElementSelect.classList.contains("-lsg-remove")) {
-    document.body.removeChild(copyElementSelect);
+  if (copyElementSelect.classList.contains("lsg-remove")) {
+    document.body.removeChild(copyElementSelect)
   }
 
-  window.getSelection().removeAllRanges();
+  window.getSelection().removeAllRanges()
 }
 
 function testCopy() {
   try {
-    document.execCommand("copy");
-    return true;
+    document.execCommand("copy")
+    return true
   }
-  catch(err) {
-    return false;
+  catch (error) {
+    return false
   }
 }

data/lib/livingstyleguide/templates/scripts/copy_code.js.erb

@@ -1,19 +1,19 @@
 document.addEventListener("DOMContentLoaded", function() {
   if (testCopy()) {
-    var code = document.getElementsByClassName("lsg--code");
+    var code = document.getElementsByClassName("lsg-code")
 
     for (var i = 0; i < code.length; i++) {
       var newButton = createButton()
       code[i].appendChild(newButton)
       newButton.addEventListener("click", function(event) {
-        selectElementRange(this.parentNode);
-      });
+        selectElementRange(this.parentNode)
+      })
     }
   }
-});
+})
 
 function createButton(copyCodeSelect) {
-  var buttonCopy = document.createElement("button");
-  buttonCopy.className = "lsg--button";
-  return buttonCopy;
+  var buttonCopy = document.createElement("button")
+  buttonCopy.className = "lsg-button"
+  return buttonCopy
 }

data/lib/livingstyleguide/templates/scripts/copy_colors.js.erb

@@ -1,28 +1,28 @@
 document.addEventListener("DOMContentLoaded", function() {
   if (testCopy()) {
-    var colorSwatches = document.getElementsByClassName("lsg--color-swatch");
+    var colorSwatches = document.getElementsByClassName("lsg-color-swatch")
     for (var i = 0; i < colorSwatches.length; i++) {
-      if (!colorSwatches[i].classList.contains("-lsg-empty")) {
+      if (!colorSwatches[i].classList.contains("lsg-empty")) {
         colorSwatches[i].addEventListener("click", function(event) {
           if (event.target == this.children[0]) {
-            selectElementRange(createDiv(this.children[0].innerHTML));
+            selectElementRange(createDiv(this.children[0].innerHTML))
           }
           else {
-            var copyHexColors = window.getComputedStyle(this, "::after").getPropertyValue("content");
-            copyHexColors = copyHexColors.replace(/'|"/g, "");
-            selectElementRange(createDiv(copyHexColors));
+            var copyHexColors = window.getComputedStyle(this, "::after").getPropertyValue("content")
+            copyHexColors = copyHexColors.replace(/'|"/g, "")
+            selectElementRange(createDiv(copyHexColors))
           }
-        });
+        })
       }
     }
   }
-});
+})
 
 function createDiv(copyHexColors) {
-  var divCopy = document.createElement("div");
-  divCopy.className = "-lsg-remove";
-  divCopy.setAttribute("style", "opacity: 0; position: absolute; top: -10000px");
-  divCopy.appendChild(document.createTextNode(copyHexColors));
-  document.body.appendChild(divCopy);
-  return divCopy;
+  var divCopy = document.createElement("div")
+  divCopy.className = "lsg-remove"
+  divCopy.setAttribute("style", "opacity: 0; position: absolute; top: -10000px")
+  divCopy.appendChild(document.createTextNode(copyHexColors))
+  document.body.appendChild(divCopy)
+  return divCopy
 }

data/lib/livingstyleguide/templates/scripts/search.js.erb

@@ -1,11 +1,11 @@
 function hasClass(element, cls) {
-  return element.classList.contains(cls);
+  return element.classList.contains(cls)
 }
 
 function addMatch(matched, node) {
   if (node.nodeType !== Node.TEXT_NODE) {
-    if (node.className.match(/lsg--/)) {
-      matched.push(node);
+    if (node.className.match(/lsg-/)) {
+      matched.push(node)
     }
   }
 }
@@ -13,54 +13,54 @@ function addMatch(matched, node) {
 function addNextElement(selection, matched, i) {
   var j = i + 1;
   while (j < selection.length) {
-    if (hasClass(selection[j], "lsg--headline")) {
+    if (hasClass(selection[j], "lsg-headline")) {
       break;
     }
-    addMatch(matched, selection[j]);
+    addMatch(matched, selection[j])
     j++;
   }
 }
 
 function addPreviousElement(selection, matched, i) {
-  var j = i;
+  var j = i
   while (j >= 0) {
-    addMatch(matched, selection[j]);
-    if (hasClass(selection[j], "lsg--headline")) {
-      break;
+    addMatch(matched, selection[j])
+    if (hasClass(selection[j], "lsg-headline")) {
+      break
     }
-    j--;
+    j--
   }
 }
 
 document.addEventListener("DOMContentLoaded", function() {
 
-  document.querySelector(".lsg--search-box").addEventListener("input", function(event) {
-    var searchTerm = this.value;
+  document.querySelector(".lsg-search-box").addEventListener("input", function(event) {
+    var searchTerm = this.value
 
-    var selection = document.querySelectorAll(".lsg--example, .lsg--color-swatches, .lsg--font-example, .lsg--paragraph, .lsg--unordered-list, .lsg--ordered-list, .lsg--headline, .lsg--sub-headline, .lsg--sub-sub-headline");
-    var regexp = new RegExp(searchTerm, "i");
-    selection = Array.prototype.slice.call(selection);
-    var matched = [];
-    var unmatched = [];
+    var selection = document.querySelectorAll(".lsg-example, .lsg-color-swatches, .lsg-font-example, .lsg-paragraph, .lsg-unordered-list, .lsg-ordered-list, .lsg-headline, .lsg-sub-headline, .lsg-sub-sub-headline")
+    var regexp = new RegExp(searchTerm, "i")
+    selection = Array.prototype.slice.call(selection)
+    var matched = []
+    var unmatched = []
 
     for (var i = 0; i < selection.length; i++) {
       if (selection[i].textContent.match(regexp)) {
-        addMatch(matched, selection[i]);
-        addNextElement(selection, matched, i);
-        addPreviousElement(selection, matched, i);
-      };
-    };
+        addMatch(matched, selection[i])
+        addNextElement(selection, matched, i)
+        addPreviousElement(selection, matched, i)
+      }
+    }
 
     unmatched = selection.filter(function(element) {
-      return matched.indexOf(element) === -1;
-    });
+      return matched.indexOf(element) === -1
+    })
 
     unmatched.map(function(item) {
-      item.style.display = "none";
-    });
+      item.style.display = "none"
+    })
 
     matched.map(function(item) {
-      item.style.display = "block";
-    });
-  });
-});
+      item.style.display = "block"
+    })
+  })
+})