Article update, artwork update (#822)

Closes #680 

Contributes to #503 

* a bunch of new images for forthcoming articles
* discovery tagger tweak
* welcome page shouldn't use markdown on subtitle
* rework the show page
* Add slugs to articles
* update tests
* implement draft functionality for articles

app/controllers/articles_controller.rb

@@ -3,13 +3,14 @@ class ArticlesController < ApplicationController
 
   # GET /articles
   # GET /api/articles
-  # GET api/articles?cves=true
+  # GET /api/articles?cves=true
   def index
     @articles = Article.all_detailed
     render_json_for_api @articles
   end
 
   # GET /articles/1
+  # GET /api/articles/foo-bar
   # GET /api/articles/1
   def show
     render_json_for_api @article
@@ -18,12 +19,14 @@ def show
   private
     # Use callbacks to share common setup or constraints between actions.
     def set_article
-      id = params[:id]
-      if Article.exists? id
-        @article = Article.find id
-      else
-        flash[:error] = "Error: Article not found"
+      db_params = { id: params[:id].to_i, slug: params[:id].to_s }
+      article = Article.where('id = :id OR slug = :slug', db_params).first
+
+      if article.nil?
+        flash[:error] = "Error: Article #{params[:id]} not found"
         redirect_to controller: 'articles'
+      else
+        @article = article
       end
     end
 end

app/frontend/global/art.scss

@@ -6,14 +6,20 @@
   }
 }
 
+@include vhp-art("beginning");
 @include vhp-art("broken");
-@include vhp-art("stones");
 @include vhp-art("eroded");
 @include vhp-art("fuzz");
+@include vhp-art("ice-cream-spill");
 @include vhp-art("lock-alike");
 @include vhp-art("money");
+@include vhp-art("papers");
+@include vhp-art("question");
+@include vhp-art("refactor");
+@include vhp-art("revert");
+@include vhp-art("rit");
 @include vhp-art("rollercoaster");
-@include vhp-art("snowflake");
 @include vhp-art("silent");
-@include vhp-art("ice-cream-spill");
-@include vhp-art("rit");
+@include vhp-art("snowflake");
+@include vhp-art("stones");
+@include vhp-art("trash");

app/frontend/global/articleListing.js

@@ -32,7 +32,7 @@ export default function articleListing(jsonData, container = '#article-listing')
     blurbs[i].innerHTML = vhpMarkdown(`
 ### ${article.title} ###
 ${article.blurb}
-[Full Article](/articles/${article.id})
+[Full Article](/articles/${article.slug})
 `)
   }
 }
@@ -47,7 +47,7 @@ export function articleListingOneSize(jsonData, container = '#article-listing-sa
     blurbs[i].innerHTML = vhpMarkdown(`
 ### ${article.title} ###
 ${article.blurb}
-[Full Article](/articles/${article.id})
+[Full Article](/articles/${article.slug})
     `);
   }
 }

app/models/article_filepath.rb

@@ -1,4 +1,9 @@
 class ArticleFilepath < ApplicationRecord
   belongs_to :article,  foreign_key: 'article_id'
   belongs_to :filepath, foreign_key: 'filepath_id'
+
+  # Instead of routing to an article like /articles/1 we do /articles/foo-bar
+  def to_param
+    slug
+  end
 end

app/views/articles/show.html.erb

@@ -15,15 +15,14 @@
   </div>
 </div>
 
-<div id="blurb-1big-template"
-     class="vhp-articles blurb blurb-big cell medium-9">
-  <div class="grid-x grid-margin-x grid-margin-y align-center">
-    <div class="blurb-art cell medium-5">
-      <div class="vhp-art-<%= @article.art %>"></div>
-    </div>
-    <div class="blurb-text cell medium-4">
-      <%= @article.blurb.html_safe %>
-      <%= @article.fulltext.html_safe %>
-    </div>
+<div class="grid-x grid-margin-x grid-margin-y">
+  <div class="cell medium-8 medium-offset-2">
+    <div class="vhp-art-<%= @article.art %>"></div>
+  </div>
+</div>
+
+<div class="grid-x grid-margin-x grid-margin-y">
+  <div class="cell medium-6 medium-offset-3 vhp-markdown">
+    <%= @article.fulltext %>
   </div>
 </div>

app/views/welcome/index.html.erb

@@ -5,10 +5,9 @@
 </div>
 
 <div class="welcome grid-x">
-  <div class="subtitle cell text-center vhp-markdown">
-A **museum** of **mistakes**
-
-to help us engineer secure software.
+  <div class="subtitle cell text-center">
+    <p>A <b>museum</b> of <b>mistakes</b></p>
+    <p>to help us engineer secure software.</p>
   </div>
 </div>
 

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2020_09_02) do
+ActiveRecord::Schema.define(version: 2020_10_20) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "plpgsql"
@@ -21,6 +21,7 @@
     t.string   "art",      null: false
     t.string   "blurb",    null: false
     t.string   "fulltext", null: false
+    t.string   "slug",     null: false
   end
 
   add_index :articles, :id, unique: true

lib/loaders/article_loader.rb

@@ -5,56 +5,64 @@ class ArticleLoader
   include ApplicationHelper
 
   def load_data(repo_path)
-    logger = TimingLogger.new(STDOUT, 'data:load:articles')
+    @logger = TimingLogger.new(STDOUT, 'data:load:articles')
     Dir["#{repo_path}/articles/*.md"].each do |file|
       begin
         content = File.read(file)
         md = YAML.load(content)
-        if md['title'].nil? or md['art'].nil? or md['blurb'].nil?
-          logger.warn "INVALID ARTICLE: title, art, or blurb missing in #{file}"
-          continue
-        end
+        create_article(file, md, content) unless md['draft'] || bad_md?(file, md)
+      rescue => e
+        @logger.error("Exception in #{file}: #{e}")
+        @logger.error(e.full_message)
+      end
+    end
+    @logger.info('Done.')
+  end
 
-        article = Article.create!(
-          title: md['title'],
-          author: md['author'],
-          art: md['art'],
-          blurb: md['blurb'],
-          fulltext: content.split("---")[2]
-        )
+  def bad_md?(file, md)
+    bad_md = md['title'].nil? or md['art'].nil? or md['blurb'].nil?
+    if bad_md
+      @logger.warn "INVALID ARTICLE: title, art, or blurb missing in #{file}"
+    end
+    return bad_md
+  end
 
-        md['cves']&.each do |cve|
-          vuln = Vulnerability.find_by(cve: cve)
-          if vuln.nil?
-            logger.warn("BAD ARTICLE METADATA: can't find #{cve} in #{file}")
-          else
-            ArticleVulnerability.create!(article: article, vulnerability: vuln)
-          end
-        end
+  def create_article(file, md, content)
+    slug = file.match(%r{^.*/(?<slug>.+).md$}).named_captures['slug']
+    article = Article.create!(
+      title: md['title'],
+      author: md['author'],
+      art: md['art'],
+      blurb: md['blurb'],
+      fulltext: content.split("---")[2],
+      slug: slug,
+    )
 
-        md['tags']&.each do |tag|
-          db_tag = Tag.find_by(shortname: tag)
-          if db_tag.nil?
-            logger.warn("BAD ARTICLE METADATA: can't find #{tag} in #{file}")
-          else
-            ArticleTag.create!(article: article, tag: db_tag)
-          end
-        end
+    md['cves']&.each do |cve|
+      vuln = Vulnerability.find_by(cve: cve)
+      if vuln.nil?
+        @logger.warn("BAD ARTICLE METADATA: can't find CVE #{cve} in #{file}")
+      else
+        ArticleVulnerability.create!(article: article, vulnerability: vuln)
+      end
+    end
 
-        md['filepaths']&.each do |f|
-          db_filepath = Filepath.find_by(filepath: f)
-          if db_filepath.nil?
-            logger.warn("BAD ARTICLE METADATA: can't find #{tag} in #{file}")
-          else
-            ArticleFilepath.create!(article: article, filepath: db_filepath)
-          end
-        end
-      rescue => e
-        logger.error("Exception in #{file}: #{e}")
-        logger.error(e.full_message)
+    md['tags']&.each do |tag|
+      db_tag = Tag.find_by(shortname: tag)
+      if db_tag.nil?
+        @logger.warn("BAD ARTICLE METADATA: can't find tag #{tag} in #{file}")
+      else
+        ArticleTag.create!(article: article, tag: db_tag)
       end
     end
-    logger.info('Done.')
-  end
 
+    md['filepaths']&.each do |f|
+      db_filepath = Filepath.find_by(filepath: f)
+      if db_filepath.nil?
+        @logger.warn("BAD ARTICLE METADATA: can't find filepath #{f} in #{file}")
+      else
+        ArticleFilepath.create!(article: article, filepath: db_filepath)
+      end
+    end
+  end
 end

lib/taggers/discovery_tagger.rb

@@ -7,14 +7,14 @@ def initialize(project)
   end
 
   def create_tags
-    @automated_tag = Tag.find_by(shortname: 'automated')
+    @automated_tag = Tag.find_by(shortname: 'discover-automated')
     if not @automated_tag
       @automated_tag = Tag.create!(
           name: 'Discovered Automatically',
-          shortname: 'automated',
+          shortname: 'discover-automated',
           color: '#9999ff',
           icon: 'robot',
-          description: Writing.tag_article('automated')
+          description: Writing.tag_article('discover-automated')
       )
     end
 

test/fixtures/articles.yml

@@ -1,6 +1,7 @@
 article1:
   title: Test Article
   author: Some Author
+  slug: test-article
   art: testing
   blurb: Articles are difficult to write.
   fulltext: |