From d5889a67a184e500c603fc774d8458c37cc7e4e6 Mon Sep 17 00:00:00 2001 From: Hendrik Kleinwaechter Date: Tue, 11 Jul 2023 09:03:07 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=89=20Book=20Website=20=20(#145)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Basic script to modify html output * Modify HTML of website * Add makefile * Compile website in CI * Improve readme --- .github/workflows/release-website.yml | 4 +- .gitignore | 1 + Dockerfile | 14 ++++- README.md | 14 +++++ book/style.css | 70 ++++++++++------------- makefile | 4 ++ website/.ruby-version | 1 + website/Gemfile | 8 +++ website/Gemfile.lock | 27 +++++++++ website/makefile | 5 ++ website/modify_build.rb | 82 +++++++++++++++++++++++++++ 11 files changed, 185 insertions(+), 45 deletions(-) create mode 100644 website/.ruby-version create mode 100644 website/Gemfile create mode 100644 website/Gemfile.lock create mode 100644 website/makefile create mode 100644 website/modify_build.rb diff --git a/.github/workflows/release-website.yml b/.github/workflows/release-website.yml index d9bfe86..705796d 100644 --- a/.github/workflows/release-website.yml +++ b/.github/workflows/release-website.yml @@ -31,7 +31,7 @@ jobs: image: ghcr.io/hendricius/the-sourdough-framework:latest options: -v ${{ github.workspace }}:/app run: | - cd /app/book + cd /app/website make website - name: Release baked website to S3 uses: shallwefootball/s3-upload-action@master @@ -39,7 +39,7 @@ jobs: aws_key_id: ${{ secrets.AWS_KEY_ID }} aws_secret_access_key: ${{ secrets.AWS_SECRET_ACCESS_KEY}} aws_bucket: ${{ secrets.AWS_BUCKET_WEBSITE }} - source_dir: book/static_website_html + source_dir: website/static_website_html destination_dir: static_html_root - name: Invalidate Cloudfront website cache uses: chetan/invalidate-cloudfront-action@v2 diff --git a/.gitignore b/.gitignore index 8a10bc2..3fe0515 100644 --- a/.gitignore +++ b/.gitignore @@ -60,3 +60,4 @@ book/book_sans_serif-epub/ book/static_website_html/* epub/ *.opf +website/static_website_html/* diff --git a/Dockerfile b/Dockerfile index 4d638f7..1a220ba 100644 --- a/Dockerfile +++ b/Dockerfile @@ -17,11 +17,21 @@ RUN apt-get update && \ pandoc \ zip \ git \ - wget + wget \ + ruby3.1 \ + ruby-dev \ + build-essential WORKDIR /root -# Support to build amazon kindle books +# Install ruby for the website build process +RUN gem install bundler +COPY website/Gemfile.lock /root +COPY website/Gemfile /root +COPY website/.ruby-version /root +RUN bundle install + +# Install support to build amazon kindle books RUN wget https://archive.org/download/kindlegen_linux_2_6_i386_v2_9/kindlegen_linux_2.6_i386_v2_9.tar.gz && \ tar xzf kindlegen_linux_2.6_i386_v2_9.tar.gz && \ mv kindlegen /usr/bin diff --git a/README.md b/README.md index 817e5b4..12a8f4a 100644 --- a/README.md +++ b/README.md @@ -85,6 +85,20 @@ There's an additional enhanced accessibility version using a sans serif font: Head over to [https://www.the-sourdough-framework.com](https://www.the-sourdough-framework.com) +To build the website make sure to have the ruby version installed specified in +`website/.ruby-version`. + +```console +cd website/ +make website +``` + +Alternatively you can build the website directly with Docker: + +```console +make website +``` + ## Hardcover version There is a hardcover version of the book available for purchase. [You can diff --git a/book/style.css b/book/style.css index 723f23d..f546124 100644 --- a/book/style.css +++ b/book/style.css @@ -78,55 +78,43 @@ nav.TOC{ .chapterToc ~ .likesectionToc ~ .likesubsectionToc, .chapterToc ~ .likesectionToc ~ .subsectionToc, .chapterToc ~ .sectionToc ~ .likesubsectionToc, .chapterToc ~ .sectionToc ~ .subsectionToc, .likechapterToc ~ .likesectionToc ~ .likesubsectionToc, .likechapterToc ~ .likesectionToc ~ .subsectionToc, .likechapterToc ~ .sectionToc ~ .likesubsectionToc, .likechapterToc ~ .sectionToc ~ .subsectionToc {padding-left:4em;margin-left:0;} nav.TOC span{ - display:block; margin-top:0; font-size:0.8rem; - padding:0.5rem; - display: flex; - justify-content: flex-start; -} - -/* HACKZS since table of contents number is not in HTML Tag */ -/* nav.TOC span { - letter-spacing: 10px; -} - -nav.TOC span a { - letter-spacing: normal; - flex-grow: 1; -} - -nav.TOC span.sectionToc { - letter-spacing: normal; -} - -nav.TOC span.sectionToc a { - margin-left: 10px; -} - -nav.TOC span.subsectionToc { - letter-spacing: normal; -} - -nav.TOC span.subsectionToc a { - margin-left: 10px; -} - - -/* END HACKZS */ - -nav.TOC span a { - flex-grow: 1; -} - -nav.TOC span a:only-child { - margin-left: 10px; } nav.TOC a, nav.TOC a:visited{ text-decoration:none; } +.chapterToc, +.sectionToc, +.subsectionToc, +.likechapterToc { + display: block; +} + +.chapterToc a, +.sectionToc a, +.subsectionToc a, +.likechapterToc a { + display: flex; + flex-grow: 1; + padding: 7px 10px 7px 15px; + justify-content: flex-start; + align-items: center; +} + +.chapterToc span, +.sectionToc span, +.subsectionToc span { + display: block; +} + +.chapterToc .chapter_number, .sectionToc .chapter_number, .subsectionToc .chapter_number { + margin-right: 7px; + white-space: nowrap; +} + /* ************** */ /* *** Colors *** */ /* ************** */ diff --git a/makefile b/makefile index 1e9b597..a088a86 100644 --- a/makefile +++ b/makefile @@ -18,6 +18,10 @@ push_docker_image: .PHONY: website website: mrproper + docker run -it -v $(PWD):/opt/repo $(DOCKER_IMAGE) /bin/bash -c "cd /opt/repo/website && make website" + +.PHONY: latex_website +latex_website: mrproper docker run -it -v $(PWD):/opt/repo $(DOCKER_IMAGE) /bin/bash -c "cd /opt/repo/book && make website" .PHONY: validate diff --git a/website/.ruby-version b/website/.ruby-version new file mode 100644 index 0000000..ef538c2 --- /dev/null +++ b/website/.ruby-version @@ -0,0 +1 @@ +3.1.2 diff --git a/website/Gemfile b/website/Gemfile new file mode 100644 index 0000000..e0c9ba7 --- /dev/null +++ b/website/Gemfile @@ -0,0 +1,8 @@ +# frozen_string_literal: true + +source 'https://rubygems.org' + +ruby File.read('.ruby-version').strip + +gem 'nokogiri' +gem 'pry' diff --git a/website/Gemfile.lock b/website/Gemfile.lock new file mode 100644 index 0000000..527e36e --- /dev/null +++ b/website/Gemfile.lock @@ -0,0 +1,27 @@ +GEM + remote: https://rubygems.org/ + specs: + coderay (1.1.3) + method_source (1.0.0) + nokogiri (1.15.3-arm64-darwin) + racc (~> 1.4) + nokogiri (1.15.3-x86_64-linux) + racc (~> 1.4) + pry (0.14.2) + coderay (~> 1.1) + method_source (~> 1.0) + racc (1.7.1) + +PLATFORMS + arm64-darwin-22 + x86_64-linux + +DEPENDENCIES + nokogiri + pry + +RUBY VERSION + ruby 3.1.2p20 + +BUNDLED WITH + 2.4.12 diff --git a/website/makefile b/website/makefile new file mode 100644 index 0000000..83f95f6 --- /dev/null +++ b/website/makefile @@ -0,0 +1,5 @@ +.PHONY: website +website: + cd ../book && make mrproper && make website + bundle install + ruby modify_build.rb diff --git a/website/modify_build.rb b/website/modify_build.rb new file mode 100644 index 0000000..6f65a93 --- /dev/null +++ b/website/modify_build.rb @@ -0,0 +1,82 @@ +require 'pry' +require 'nokogiri' + +# This class goes through the generated default LaTeX HTML and performs +# several optimisations on the HTML. Nokogiri is used to facilitate the +# modifications. + +class ModifyBuild + def self.build + new.build + end + + def build + build_latex_html + end + + def build_latex_html + system("rm -rf #{build_dir}/") + system("mkdir #{build_dir}/") + copy_source_to_local_dir_for_modification + list_of_files_to_modify.each do |filename| + modify_file(filename) + end + end + + private + + def modify_file(filename) + orig_text = File.read(filename) + text = fix_double_slashes(orig_text) + text = fix_navigation_bar(text) + File.open(filename, "w") {|file| file.puts text } + end + + def list_of_files_to_modify + Dir.glob("#{build_dir}/*.html") + end + + def copy_source_to_local_dir_for_modification + system("cd ../book/ && make website") unless source_website_output_exists? + system("cp -R ../book/#{build_dir}/* #{build_dir}") + end + + def source_website_output_exists? + File.directory?("../book/#{build_dir}/") + end + + def build_dir + 'static_website_html' + end + + def fix_double_slashes(text) + text.gsub(/\/\//, "/") + end + + def fix_navigation_bar(text) + doc = Nokogiri::HTML(text) + elements = [doc.search('.chapterToc'), doc.search('.sectionToc'), doc.search('.subsectionToc')].flatten + elements.each do |n| + chapter_number_or_nothing = n.children[0].text.strip + hyperlink_node = n.children[1] + # remove unneeded text and merge into single a tag + n.children[0].remove + link_text = hyperlink_node.content + # no chapter number + if chapter_number_or_nothing.length == 0 + content = hyperlink_node.to_s + else + link_node_content = %Q{ + #{chapter_number_or_nothing} + #{link_text} + } + hyperlink_node.inner_html = link_node_content + content = hyperlink_node.to_s + end + n.inner_html = content + end + doc.to_html + end +end + +ModifyBuild.build