More website goodies (meta tags, open graph images, menu selection) (#151)

* Add description

* Fix margin

* Add og_image

* Mark menu as selected

book/style.css

@@ -137,7 +137,10 @@ nav.TOC,nav.TOC a, nav.TOC a:visited{
   color:#000000;
 }
 
-nav.TOC span:hover, nav.TOC span:hover *{
+nav.TOC span:hover,
+nav.TOC span:hover *,
+nav.TOC span.chapterToc.selected,
+nav.TOC span.chapterToc.selected a {
   background-color:#dad5ca;
 }
 
@@ -296,6 +299,6 @@ figcaption.caption {
 }
 
 div.center {
-  margin-left: 0;
+  margin-left: 0 !important;
-  margin-right: 0;
+  margin-right: 0 !important;
 }

website/modify_build.rb

@@ -36,6 +36,9 @@ class ModifyBuild
     text = add_home_link_to_menu(text)
     text = fix_anchor_hyperlinks_menu(text)
     text = add_favicon(text)
+    text = add_meta_tags(text, filename)
+    text = remove_section_table_of_contents(text)
+    text = mark_menu_as_selected_if_on_page(text, extract_file_from_path(filename))
     File.open(filename, "w") {|file| file.puts text }
   end
 
@@ -218,7 +221,7 @@ class ModifyBuild
     menu = doc.css(".menu-items")[0]
     return text if menu.nil?
 
-    home_html = %Q{<span class="chapterToc"><a href="/">Home</a></span>}
+    home_html = %Q{<span class="chapterToc home-link"><a href="/">Home</a></span>}
     menu.inner_html = "#{home_html} #{menu.inner_html}"
     doc.to_html
   end
@@ -248,6 +251,109 @@ class ModifyBuild
     doc.to_html
   end
 
+  def add_meta_tags(text, filename)
+    doc = build_doc(text)
+    head = doc.css("head")[0]
+    title = head.css("title")[0].text
+    cleaned_filename = extract_file_from_path(filename)
+    description = extract_description(text, filename)
+    og_image = og_image_for_chapter(cleaned_filename)
+    meta_html = %Q{
+      <meta property="og:locale" content="en_US">
+      <meta property="og:site_name" content="The Sourdough Framework">
+      <meta property="og:title" content="#{title}">
+      <meta property="og:type" content="article">
+      <meta property="og:url" content="https://www.the-sourdough-framework.com/#{cleaned_filename}">
+      <meta property="og:description" content="#{description}">
+      <meta property="description" content="#{description}">
+      <meta property="og:image" content="https://the-sourdough-framework/#{og_image}" />
+    }
+    head.inner_html = "#{head.inner_html} #{meta_html}"
+    doc.to_html
+  end
+
+  # Takes a name like "static_website_html/book.html" and returns "book.html"
+  def extract_file_from_path(filename)
+    result = filename.split("/")
+    return filename if result.length == 1
+    raise ArgumentError.new("The filename #{filename} is odd. Don't know how to handle it") if result.length > 2
+
+    result[1]
+  end
+
+  def extract_description(text, filename)
+    doc = build_doc(text)
+    el = doc.css(".main-content p:first-of-type")[0]
+    custom = custom_titles_per_filename(clean_filename(filename))
+    return custom if custom
+    return "" if el.nil?
+    el.text
+  end
+
+  # static_website_html/Acknowledgements.html => "Acknowledgements.html"
+  def clean_filename(filename)
+    filename.split("/")[1]
+  end
+
+  def custom_titles_per_filename(filename)
+    index_text = "The Sourdough Framework goes beyond just recipes and provides a solid knowledge foundation, covering the science of sourdough, the basics of bread making, and advanced techniques for achieving the perfect sourdough bread at home."
+    data = {
+      "book.html" => index_text,
+      "index.html" => index_text
+    }
+    data[filename]
+  end
+
+  def remove_section_table_of_contents(text)
+    doc = build_doc(text)
+    el = doc.css(".sectionTOCS")[0]
+    return text unless el
+
+    el.remove
+    doc.to_html
+  end
+
+  def og_image_for_chapter(chapter_name)
+    open_graph_images_map[chapter_name] || open_graph_images_map["index.html"]
+  end
+
+  def open_graph_images_map
+    {
+      "Baking.html" => "og_image_baking.png",
+      "Breadtypes.html" => "og_image_bread_types.png",
+      "Flourtypes.html" => "og_image_flour_types.png",
+      "index.html" => "og_image_general.png",
+      "Howsourdoughworks.html" => "og_image_how_sourdough_works.png",
+      "Makingasourdoughstarter.html" => "og_image_making_a_sourdough_starter.png",
+      "Nonwheatsourdough.html" => "og_image_non_wheat_sourdough.png",
+      "Sourdoughstartertypes.html" => "og_image_sourdough_starter_types.png",
+      "Storingbread.html" => "og_image_storing_bread.png",
+      "Thehistoryofsourdough.html" => "og_image_the_history_of_sourdough.png",
+      "Wheatsourdough.html" => "og_image_troubleshooting.png",
+    }
+  end
+
+  def mark_menu_as_selected_if_on_page(text, filename)
+    doc = build_doc(text)
+    selected = doc.css(".menu-items .chapterToc > a").find do |el|
+      el["href"] == ""
+    end
+
+    # Special case for index page
+    if ["index.html", "book.html"].include?(filename)
+      doc.css(".menu-items .chapterToc.home-link")[0].add_class("selected")
+      return doc.to_html
+    end
+    return doc.to_html unless selected
+
+    # Fix that when the menu is selected the href is empty. This way users can
+    # click the menu and the page will reload.
+    selected["href"] = filename
+    selected.parent.add_class("selected")
+    doc.to_html
+  end
+
+
   def build_doc(text)
     Nokogiri::HTML(text)
   end