mchapman/the-sourdough-framework
1
0
Fork 0
mirror of https://github.com/hendricius/the-sourdough-framework synced 2025-11-09 04:31:11 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

Website Redesign (#344)

Browse Source 
* Desktop version

* Mobile adjustments
This commit is contained in:
Hendrik Kleinwaechter
2024-03-31 13:39:42 +02:00
committed by GitHub
parent 4665d88241
commit 2fcd9fc5bd
4 changed files with 366 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

175
website/modify_build.rb
View File

@@ -52,20 +52,26 @@ class ModifyBuild
text = fix_titles(text)
text = fix_menu(text)
text = fix_cover_page(text) if is_cover_page?(filename)
text = add_header_banner(text)
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))
text = add_canonical_for_duplicates(text, extract_file_from_path(filename))
text = include_javascript(text)
text = add_text_to_coverpage(text, extract_file_from_path(filename))
text = fix_js_dependency_link(text)
text = fix_list_of_tables_figures_duplicates(text)
text = add_anchors_to_headers(text)
text = fix_https_links(text)
text = create_menu_groups(text)
text = fix_top_links(text)
text = fix_flowchart_background(text)
text = remove_empty_menu_links(text)
text = fix_bottom_cross_links(text)
text = insert_mobile_header_graphic(text)
text = add_anchors_to_glossary_items(text) if is_glossary_page?(filename)
text = mark_menu_as_selected_if_on_page(text, extract_file_from_path(filename))
text = fix_menus_list_figures_tables(text) if is_list_figures_tables?(filename)
text = fix_list_of_figures_tables_display(text) if is_list_figures_tables?(filename)
File.open(filename, "w:UTF-8") {|file| file.puts text }
@@ -152,6 +158,45 @@ class ModifyBuild
doc.to_html
end
def create_menu_groups(text)
doc = build_doc(text)
groups = build_groups(doc.css(".menu-items > span"))
menu_el = doc.css(".menu-items")[0]
html = ""
groups.each do |group|
out = ""
group.each do |g|
if g.to_html.length > 0
out += %Q{<div class="menu-entry">#{g.to_html}</div>}
end
end
html += %Q{<div class="menu-group">
<div class="menu-inner">
#{out}
</div>
<img class="menu-arrow" src="arrow.png" />
</div>}
end
menu_el.inner_html = html
doc.to_html
end
def build_groups(menu_items)
final_groups = []
tmp_groups = []
menu_items.each_with_index do |el, index|
# Get next item and check if it is a lower entry level in the menu.
next_item = menu_items[index + 1]
if next_item && next_item["class"].include?("chapterToc") || next_item.nil?
final_groups.push(tmp_groups.push(el))
tmp_groups = []
else
tmp_groups.push(el)
end
end
final_groups
end
# By default the titles look boring. This changes the titles of all the
# pages and adds the book name as appendix
def fix_titles(text)
@@ -237,7 +282,7 @@ class ModifyBuild
content = doc.css("body > .main-content")[0]
menu = doc.css("body > nav")[0]
content = %Q{
<main class="titlepage">
<main class="titlepage main-content">
<a href="Thehistoryofsourdough.html">
<img src="cover-page.jpg" />
<div class="version"><p>#{version}</p></div>
@@ -257,7 +302,7 @@ class ModifyBuild
menu = doc.css(".menu-items")[0]
return text if menu.nil?
home_html = %Q{<span class="chapterToc home-link"><a href="/">The Sourdough Framework</a></span>}
home_html = %Q{<span class="chapterToc home-link"><a href="/">🍞 The Sourdough Framework</a></span>}
# Normally the flowcharts link should be automatically added, but there
# seems to be a problem in the generation. See:
# https://github.com/hendricius/the-sourdough-framework/pull/188 for more
@@ -268,12 +313,12 @@ class ModifyBuild
<span class="link_text">List of Flowcharts</span>
</a>
</span>
<span class="chapterToc">
<span class="chapterToc listtables-menu">
<a href="listtablename.html">
<span class="link_text">List of Tables</span>
</a>
</span>
<span class="chapterToc">
<span class="chapterToc listfigures-menu">
<a href="listfigurename.html">
<span class="link_text">List of Figures</span>
</a>
@@ -310,7 +355,7 @@ class ModifyBuild
<span class="chapterToc">
<a href="https://breadco.de/kofi">
<span class="chapter_number">⭐️</span>
<span class="link_text">Donate</span>
<span class="link_text">Support me</span>
</a>
</span>
}
@@ -318,6 +363,38 @@ class ModifyBuild
doc.to_html
end
# Adds a header banner to each page
def add_header_banner(text)
doc = build_doc(text)
body = doc.css("body")[0]
footnotes = doc.css(".footnotes")[0]
main = doc.css(".main-content")[0]
menu = doc.css(".menu")[0]
if main.nil? || menu.nil?
#raise ArgumentError.new("Don't know how to handle")
return doc.to_html
end
body.inner_html = %Q{
<div class='wrapper'>
#{build_header_html}
<div class='book-content'>
#{menu.to_html}
<main class='main-content'>
#{main.inner_html}
#{footnotes ? footnotes.to_html : ''}
</main>
</div>
</div>
}
return doc.to_html
end
def build_header_html
%Q{
<div class="header"><img src="banner.png"></div>
}
end
# Some of the menu links are added in the wrong order. Remove them since we
# later on add them in the structure that we want.
def remove_duplicate_entries_menu(text)
@@ -441,7 +518,6 @@ class ModifyBuild
def mark_menu_as_selected_if_on_page(text, filename)
doc = build_doc(text)
return doc.to_html
selected = doc.css(".menu-items .chapterToc > a").find do |el|
el["href"] == ""
@@ -456,7 +532,17 @@ class ModifyBuild
# Special case for the flowcharts page which is added by us to the menu.
# This needs to be done for future manually added pages too
if "listoflocname.html" == filename
doc.css(".menu-items .chapterToc.flowcharts-menu")[0].add_class("selected")
doc.css(".menu-items .chapterToc.flowcharts-menu")[0].ancestors(".menu-group")[0].add_class("selected")
return doc.to_html
end
if "listtablename.html" == filename
doc.css(".menu-items .chapterToc.listtables-menu")[0].ancestors(".menu-group")[0].add_class("selected")
return doc.to_html
end
if "listfigurename.html" == filename
doc.css(".menu-items .chapterToc.listfigures-menu")[0].ancestors(".menu-group")[0].add_class("selected")
return doc.to_html
end
@@ -465,7 +551,7 @@ class ModifyBuild
# 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")
selected.ancestors(".menu-group")[0].add_class("selected")
doc.to_html
end
@@ -496,10 +582,7 @@ class ModifyBuild
def add_text_to_coverpage(text, filename)
return text unless is_cover_page?(filename)
doc = build_doc(text)
content = doc.css(".titlepage")[0]
raise ArgumentError.new(".titlepage not found in HTML") if content.nil?
content.add_class("main-content")
content = doc.css(".main-content")[0]
content.inner_html = "#{build_cover_page_content} #{content.inner_html}"
doc.to_html
end
@@ -627,13 +710,10 @@ class ModifyBuild
# this.
def fix_menus_list_figures_tables(text)
doc = build_doc(text)
content = doc.css(".menu-items > .subsectionToc, .menu-items > .sectionToc")
content = doc.css(".menu-group .subsectionToc, .menu-group .sectionToc")
content.each do |node|
node.remove
node.ancestors(".menu-entry")[0].remove
end
doc.css(".menu-items > .lotToc").each(&:remove)
doc.css(".menu-items > .lofToc").each(&:remove)
doc.css(".menu-items > br").each(&:remove)
doc.to_html
end
@@ -673,6 +753,63 @@ class ModifyBuild
def fix_https_links(text)
text.gsub(/https:\/(?!\/)/, 'https://')
end
def fix_top_links(text)
doc = build_doc(text)
el = doc.css(".crosslinks-top")[0]
el.remove if el
doc.to_html
end
def remove_empty_menu_links(text)
doc = build_doc(text)
menus = doc.css(".menu-group")
menus.each do |m|
element = m.css("span.chapterToc")[0]
next unless element
if element.inner_html == "" || element.inner_html == " "
m.remove
end
end
doc.to_html
end
def insert_mobile_header_graphic(text)
doc = build_doc(text)
content = doc.css(".TOC.menu")[0]
content.after('<div class="mobile-banner"><img src="banner.png" /></div>')
doc.to_html
end
def fix_flowchart_background(text)
doc = build_doc(text)
images = doc.css("img")
images.each do |img|
src = img.attr("src")
is_flowchart = src.include?(".svg")
next unless is_flowchart
img.parent.add_class("flowchart-image-wrapper")
end
doc.to_html
end
def fix_bottom_cross_links(text)
doc = build_doc(text)
link_cont = doc.css(".crosslinks-bottom")[0]
return doc.to_html unless link_cont
links = doc.css(".crosslinks-bottom a")
prev_link = links.find {|l| l.inner_html == "prev" }
next_link = links.find {|l| l.inner_html == "next" }
prev_html = prev_link ? "<a class='prev' href='#{prev_link.attr('href')}'>Previous page</a>" : ''
next_html = next_link ? "<a class='next' href='#{next_link.attr('href')}'>Next page</a>" : ''
link_cont.inner_html = %Q{
#{prev_html}
#{next_html}
}
doc.to_html
end
end
ModifyBuild.build