ragerender 0.1.7 → 0.1.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 152c14ba01c06c930b537a0e1c72a994e673fa8aea1176b82f92adfc912e5e77
-  data.tar.gz: bfb9fa9e0e5d4e1dae45c3bdc7fc09fd7de45fdcbb3043fd45c26e11404b0d1d
+  metadata.gz: 20419a400d4c37d35c8c0aabe8c56f8ffedc814d155c47c5617d2434f1a8e29e
+  data.tar.gz: 9286ac86f23882cebb842164276366ddeb00bc5df86b07792bf23951224c8019
 SHA512:
-  metadata.gz: 78e6690eb005da5ac9604c4111612b3e3dcf2d68c52bb8b351dc6165d3fecf9acc8267cfb69d551a6ee8374bb6b660d812465e2bb14875e2d95199c5b1a81a6e
-  data.tar.gz: 841b860abb04b124f88aa730ece8650fce559f08a889598f4121b503eb6d5c3ef03bb396f6afffe860ded22cffb92d887750cd597b170369dbc74e7660d8f1ea
+  metadata.gz: 4260db9a06ce8119bcc298b9a0d9c1c570ad3b6f11cae47ba1a53903facfb373d89afa17706285aff94a032af95ce7f6e15d0b19ea061182b42db31d7c29cff8
+  data.tar.gz: d3e93dfee30f0a42b19199f9dcaa0a63b236ae8185c6e56b4414f7d3ce271440674740cc3827bb6bdc01a411f7f0bbcbef401c32f8b8455786901d46cf970a4a

data/README.rdoc

@@ -92,6 +92,7 @@ Put something like this in your webcomic folder and call it
   description: >
     My epic story about how him and her
     fell into a romantic polycule with they and them
+  status: active
   genres:
   - Comedy
   - Romance
@@ -154,6 +155,8 @@ details of your author notes and blogs manually:
   date: "2025-03-05 16:20"
   image: "images/ghost.png"
   author: "Jane doe"
+  description: "Some spooky mouseover text"
+  keywords: [excellent, comic page, spooky]
   custom:
     # use yes and no for tickbox settings
     spooky: yes
@@ -164,6 +167,9 @@ details of your author notes and blogs manually:
       Testing webcomics
       Now easier than ever
       Thanks to RageRender
+  transcript: >
+    The transcript contains a machine-readable version
+    of all the text in your comic image.
   comments:
     - author: "Skippy"
       date: "13 Mar 2025, 3.45 PM"
@@ -203,6 +209,44 @@ You control this by setting a <tt>frontpage</tt> key in your site config.
 - anything else will display the extra page that has the matching
   <tt>slug</tt> in its Front Matter
 
+=== Comics with custom HTML code
+
+You can use custom HTML code in place of an image for your comic page. Instead
+of creating an image, just create an HTML file in your <tt>images</tt> folder:
+
+  cat '<video src="/files/my-animation.webm"></video>" > images/1.html
+
+=== Multi-image comics
+
+You can add up to 12 images to each comic page on ComicFury. To do that in
+RageRender, add each image to an <tt>images</tt> key in your comic page:
+
+  ---
+  title: "Comic with many pages"
+  date: "2026-04-20 16:20"
+  images:
+  - /images/first.png
+  - /images/second.png
+  - /images/third.png
+  ---
+
+=== Testing search pages
+
+Live search does not work in RageRender, as your site is statically built and
+can't respond to new data from the browser. However, you can simulate a search
+when you build the site to help test search results designs. To do that, add a
+`searchterm` to the search page using defaults in your `_config.yml`:
+
+    defaults:
+    - scope:
+        path: ''
+        layout: search
+      values:
+        searchterm: "my character"
+
+The search that gets performed will be somewhat similar to how ComicFury will
+search your comic, but may not be exactly the same.
+
 === Putting changes on ComicFury
 
 Once you're done making changes, you can <tt>pack</tt> your layout:

data/inspector/.gitignore

@@ -0,0 +1,2 @@
+_layouts
+test-layout.cflxml

data/inspector/Rakefile

@@ -0,0 +1,51 @@
+require 'forwardable'
+require 'liquid'
+require_relative '../lib/ragerender/cflxml'
+require_relative '../lib/ragerender/jekyll'
+
+TEMPLATE_DROPS = {
+  'archive' => RageRender::ArchiveDrop,
+  'comic-page' => RageRender::ComicDrop,
+  'error-page' => RageRender::ErrorDrop,
+  'blog-archive' => RageRender::BlogArchiveDrop,
+  'blog-display' => RageRender::BlogDrop,
+  'overview' => RageRender::OverviewDrop,
+  'search' => RageRender::SearchDrop,
+}
+
+Liquid::Template.error_mode = :strict
+Liquid::Template.file_system = Liquid::LocalFileSystem.new('_includes', '%s.html')
+
+directory '_layouts'
+
+TEMPLATE_DROPS.each do |layout, drop|
+  file "_layouts/#{layout}.html" => ['_layouts', RageRender.const_source_location(drop.name).first, "_templates/#{layout}.html", __FILE__] do |t|
+    fields = Set.new(drop.invokable_methods) -
+             Set.new(Jekyll::Drops::DocumentDrop.invokable_methods)
+    all_fields = Set.new(RageRender::WebcomicDrop.invokable_methods) -
+                 Set.new(Jekyll::Drops::DocumentDrop.invokable_methods)
+    template_name = "_templates/#{layout}.html"
+    template = Liquid::Template.parse File::read template_name, environment: ENV
+
+    rake_output_message "liquid ... >#{t.name} <#{template_name}"
+    File::write t.name, template.render!({
+      'title' => "#{drop.name.rpartition(/[A-Z]/).first.split('::').last} Page",
+      'all_fields' => all_fields.to_a.sort,
+      'fields' => fields.to_a.sort,
+      'loops' => [*drop.loops, *RageRender::WebcomicDrop.loops].map {|k, v| {"name" => k.to_s, "fields" => v.map(&:to_s)} },
+    }, strict_variables: true, strict_filters: true)
+  end
+end
+
+file '_layouts/overall.html' => '_templates/overall.html' do |t|
+  cp t.source, t.name
+end
+
+file 'test-layout.cflxml' => ['layout.css', '_layouts/overall.html', *TEMPLATE_DROPS.keys.map {|n| "_layouts/#{n}.html"}] do |t|
+  File.open t.name, 'w' do |f|
+    rake_output_message 'bundle exec jekyll pack'
+    RageRender.pack '_layouts', '.', f
+  end
+end
+
+task :default => 'test-layout.cflxml'

data/inspector/_includes/field_row.html

@@ -0,0 +1,8 @@
+<tr>
+    <td>{{ name }}</td>
+    <td>[v:{{field}}]</td>
+    <td>
+        <script type="text/javascript">document.currentScript.parentElement.append(document.createTextNode([f:js|v:{{field}}]))</script>
+    </td>
+    <td>[c:{{field}}]true[/][c:!{{field}}]false[/]</td>
+</tr>

data/inspector/_includes/field_rows.html

@@ -0,0 +1,15 @@
+{% assign looped_fields = loops | map: "name" %}
+{% for field in fields -%}
+    {%- include "field_row", name: field, field: field -%}
+    {% if looped_fields contains field %}
+        {% assign field_obj = loops | where: "name", field %}
+        {% assign field_fields = field_obj[0].fields %}
+        [l:{{field}}]
+            {% for field_field in field_fields %}
+                {% capture name %}{{field}}[[v:l.aiteration]] → {{ field_field }}{% endcapture %}
+                {% assign field_name = field_field | prepend: "l." %}
+                {%- include "field_row", name: name, field: field_name %}
+            {% endfor %}
+        [/]
+    {% endif %}
+{% endfor -%}

data/inspector/_includes/field_table.html

@@ -0,0 +1,22 @@
+<table>
+    <thead>
+        <tr>
+            <th>Variable name</th>
+            <th>Value on this page</th>
+            <th>Value (escaped)</th>
+            <th>True or false in conditional</th>
+        </tr>
+    </thead>
+    <tbody>
+        <tr>
+            <th colspan=4>Unique to this page</th>
+        </tr>
+        {%- include "field_rows", fields: fields, loops: loops -%}
+    </tbody>
+    <tbody>
+        <tr>
+            <th colspan=4>On all pages</th>
+        </tr>
+        {%- include "field_rows", fields: all_fields, loops: loops -%}
+    </tbody>
+</table>

data/inspector/_templates/archive.html

@@ -0,0 +1,3 @@
+<h2>{{ title }}</h2>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/blog-archive.html

@@ -0,0 +1,3 @@
+<h2>{{ title }}</h2>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/blog-display.html

@@ -0,0 +1,3 @@
+<h2>{{ title }}</h2>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/comic-page.html

@@ -0,0 +1,6 @@
+<h2>{{ title }}</h2>
+
+[c:prevcomic]<a href="[v:prevcomic]">Prev</a>[/]
+[c:nextcomic]<a href="[v:nextcomic]">Next</a>[/]
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/error-page.html

@@ -0,0 +1,3 @@
+<h2>{{ title }}</h2>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/overall.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
+
+        <meta property="og:type" content="website" />
+        <meta property="og:title" content="[v:webcomicname]" />
+        <meta property="og:description" content="[v:pagetitle]" />
+        [c:permalink]
+        <meta property="og:url" content="[v:permalink]" />
+        [/]
+        <meta name="twitter:card" content="summary_large_image" />
+        <meta name="twitter:title" content="[v:webcomicname]" />
+        <meta name="twitter:description" content="[v:pagetitle]" />
+
+        [c:previewimageurl]
+            <meta property="og:image" content="[v:previewimageurl]" />
+            <meta property="og:image:width" content="[v:previewimagewidth]" />
+            <meta property="og:image:height" content="[v:previewimageheight]" />
+            <meta name="twitter:image" content="[v:previewimageurl]" />
+        [/]
+
+		<link rel="alternate" type="application/rss+xml" title="RSS" href="/rss/" />
+
+		<title>[v:webcomicname] - [v:pagetitle]</title>
+		[v:layoutcss]
+	</head>
+	<body>
+        <header>
+            <h1><a href="/">[v:webcomicname]</a></h1>
+            <div id="slogan">[v:webcomicslogan]</div>
+        </header>
+
+
+        <nav class="site-nav">
+            <ul id="navigation">
+                <li><a href="/">Home</a></li>
+                <li><a href="/comics/#content-start">Latest</a></li>
+                <li><a href="/comics/1/#content-start">First</a></li>
+                [c:searchon]
+                    <li><a href="/search/">Search</a></li>
+                [/]
+                <li><a href="/archive/">Archive</a></li>
+                [c:infinitescrollenabled]
+                    <li><a href="[v:infinitescrolllink]">Scroll View</a></li>
+                [/]
+                [c:hasblogs]
+                    <li><a href="/blog/">Blog</a></li>
+                [/]
+                [c:!hidefromhost]
+                    <li><a href="[v:addsubscriptionlink]">Subscribe</a></li>
+                [/]
+                [l:extrapages]
+                    <li><a href="[v:l.link]">[v:l.title]</a></li>
+                [/]
+            </ul>
+        </nav>
+
+        <!--layout:[content]-->
+        <footer>
+            <div>
+                <ul>
+                    <li>
+                        <a href="/rss/">RSS</a>
+                    </li>
+                    [c:!hidefromhost]
+                        <li>
+                            <a href="[v:comicprofile]">Comic Profile</a>
+                        </li>
+                    [/]
+                    <li>
+                        <a href="#">Top</a>
+                    </li>
+                </ul>
+            </div>
+
+            <div class="hostedby">
+                <span>Hosted by </span>
+                <a href="https://comicfury.com">
+                    <img src="https://comicfury.com/images/gator-icon-black.png" height="22" style="height:22px; width:auto;" />
+                    ComicFury
+                </a>
+            </div>
+            <div>
+                &copy; [v:copyrights]<br />
+            </div>
+        </footer>
+	</body>
+</html>

data/inspector/_templates/overview.html

@@ -0,0 +1,3 @@
+<h2>{{ title }}</h2>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/_templates/search.html

@@ -0,0 +1,10 @@
+<h2>{{ title }}</h2>
+
+<form method="post" action="/search/" id="searchbox">
+    <div class="searchbar">
+        <input type="text" name="search" value="[v:searchterm]" placeholder="Search Term" id="bigsearchbox" />
+        <input type="submit" value="Search!" class="submit" />
+    </div>
+</form>
+
+{%- include "field_table", all_fields: all_fields, fields: fields, loops: loops -%}

data/inspector/layout.css

@@ -0,0 +1,50 @@
+body {
+  max-width: 1024px;
+  margin: 2em auto 0;
+
+  font-family: monospace;
+}
+
+body::before {
+	content: "";
+	display: block;
+	position: absolute;
+	left: 0;
+	top: 0;
+	right: 0;
+	height: 0;
+	background: yellow;
+	border-top: 1em black dashed;
+	transform: skewX(-35deg);
+  max-width: 99vw;
+}
+
+table td, table th {
+  background: white;
+  padding: 1ch;
+}
+
+table td:nth-child(2) {
+  max-width: 35vw;
+  overflow: scroll;
+}
+
+table td:nth-child(3) {
+  word-wrap: anywhere;
+}
+
+table tr:nth-child(even) {
+  filter: invert(0.1);
+}
+
+table th {
+  filter: invert(0.2);
+}
+
+td:empty::before {
+  content: 'blank';
+  display: inline-block;
+  background: rgba(0, 0, 0, 0.15);
+  padding: 0px 4px;
+  border-radius: 5px;
+}

data/lib/ragerender/jekyll/archive.rb

@@ -125,34 +125,28 @@ module RageRender
       end
     end
 
-    def_loop :comics_paginated, :number, :newchapter, :chapterend, *ComicDrop::PAGINATION_FIELDS, *ChapterDrop::PAGINATION_FIELDS
+    def_loop :comics_paginated, *PaginatedComicDrop.own_methods
     def comics_paginated
       number = @obj.data['number']
       comics = if number
         selected_comics.to_a[number - 1]
       else
         selected_comics.to_a.flatten
-      end&.group_by {|c| c.data['chapter'] } || []
-
-      comics.map do |chapter, comics|
-        chapter_data = ChapterDrop.new(@obj.site.collections['chapters'].docs.detect {|c| c.data['slug'] == chapter })
-        comics.each_with_index.map do |comic, index|
-          drop = ComicDrop.new(comic)
-          {
-            **ComicDrop::PAGINATION_FIELDS.map {|field| [field, drop[field]] }.to_h,
-            **ChapterDrop::PAGINATION_FIELDS.map {|field| [field, chapter_data[field]] }.to_h,
-            'number' => index + 1,
-            'newchapter' => index == 0,
-            'chapterend' => index == comics.size - 1,
-          }
-        end
-      end.flatten
+      end || []
+
+      comics.map do |comic|
+        PaginatedComicDrop.new(comic, comics)
+      end
     end
 
     def lastpagenumber
       selected_comics.size
     end
 
+    def thumbnail_box_styles
+      'position:fixed; opacity:0; pointer-events:none; z-index:10000;'
+    end
+
     private
     def selected_comics
       comics = @obj.site.collections['comics'].docs.reject {|c| SPECIAL_COMIC_SLUGS.include? c.data['slug'] }

data/lib/ragerender/jekyll/blog.rb

@@ -1,8 +1,13 @@
 require 'jekyll/hooks'
 require 'jekyll/drops/document_drop'
 require_relative '../date_formats'
+require_relative 'setup_collection'
 require_relative 'pipettes'
 
+Jekyll::Hooks.register :site, :after_init do |site|
+  setup_collection site, :posts, '/blogarchive/:slug/', layout: 'blog-display'
+end
+
 Jekyll::Hooks.register :posts, :pre_render do |post, payload|
   RageRender::Pipettes.clean_payload payload
   payload.merge! RageRender::BlogDrop.new(post).to_liquid

data/lib/ragerender/jekyll/blog_archive.rb

@@ -90,31 +90,16 @@ module RageRender
       all_blogs[number-1]&.map {|blog| PaginatedBlogDrop.new(blog).to_liquid } || []
     end
 
-    def lastpagenumber
-      all_blogs.size
-    end
-
-    # Objects used for laying out page numbers.
-    #
-    # The page numbers always include:
-    # - the first page
-    # - the last page
-    # - two pages around the current page
-    def pages
-      [1].chain([1, all_blogs.size, *(number-2..number+2).to_a].uniq).select {|i| i >= 1 && i <= all_blogs.size }.sort.each_cons(2).map do |prev, page|
-        {
-          'page' => page,
-          'pagelink' => File.join(@obj.url, 'page', page.to_s),
-          'is_current' => page == number,
-          'skipped_ahead' => page - prev > 1,
-        }
-      end
-    end
-    def_loop :pages, :page, :pagelink, :is_current, :skipped_ahead
+    def_pages :all_pages
 
     private
     def all_blogs
       @all_blogs = @obj.site.posts.docs.each_slice(BLOGS_PER_PAGE).to_a
     end
+
+    def all_pages
+      root = Pathname.new(@obj.permalink).split.first.to_s
+      @obj.site.pages.select {|page| page.permalink =~ /#{root}\/page/ }
+    end
   end
 end

data/lib/ragerender/jekyll/chapter.rb

@@ -74,9 +74,6 @@ module RageRender
     COVER_MAX_HEIGHT = 420
     COVER_MAX_WIDTH = 300
 
-    PAGINATION_FIELDS = %w[ chaptername chapterdescription chapterid ]
-
-    delegate_method_as :data, :fallback_data
     extend Pipettes
     extend Forwardable
 
@@ -85,7 +82,7 @@ module RageRender
     def_delegator :@obj, :url, :chapterarchiveurl
 
     def chapterid
-      @obj.collection.docs.index @obj
+      @obj.collection.docs.sort_by(&:path).index @obj
     end
 
     def chaptername
@@ -93,19 +90,11 @@ module RageRender
     end
 
     def cover_width_small
-      if (cover_height.to_f / COVER_MAX_HEIGHT) > (cover_width.to_f / COVER_MAX_WIDTH)
-        (cover_height_small * cover_width) / cover_height
-      else
-        [COVER_MAX_WIDTH, cover_width].min
-      end
+      scaled_width(cover_width, cover_height, COVER_MAX_WIDTH, COVER_MAX_HEIGHT)
     end
 
     def cover_height_small
-      if (cover_height.to_f / COVER_MAX_HEIGHT) > (cover_width.to_f / COVER_MAX_WIDTH)
-        [COVER_MAX_HEIGHT, cover_height].min
-      else
-        (cover_width_small * cover_height) / cover_width
-      end
+      scaled_height(cover_width, cover_height, COVER_MAX_WIDTH, COVER_MAX_HEIGHT)
     end
 
     def firstcomicinchapter
@@ -122,8 +111,16 @@ module RageRender
     def_image_metadata :image
     private :image_url, :image_width, :image_height
 
+    def comics
+      @obj.site.collections['comics'].docs.select {|c| c.data['chapter'] == @obj.data['slug'] }
+    end
+
     def first_comic
-      @obj.site.collections['comics'].docs.select {|c| c.data['chapter'] == @obj.data['slug'] }.first
+      comics.first
+    end
+
+    def fallback_data
+      {}
     end
 
     public