30 files changed, 463 insertions, 209 deletions

diff --git a/app/controllers/pages_controller.rb b/app/controllers/pages_controller.rb
index 2d08dea..326fbd4 100644
--- a/app/controllers/pages_controller.rb
+++ b/app/controllers/pages_controller.rb
@@ -6,6 +6,19 @@ class PagesController < ApplicationController
 
   def preview
     @page = Page.find(params[:id])
+    unless @page.node
+      node = Node.find_by(autosave_id: @page.id) ||
+             Node.find_by(draft_id: @page.id) ||
+             Node.find_by(head_id: @page.id)
+      @page.node = node if node
+    end
+
+    node ||= @page.node
+    if node && node.draft_id == @page.id && node.autosave
+      @page = node.autosave
+      @page.node = node
+    end
+
 
     if @page
       template = @page.valid_template
@@ -15,11 +28,4 @@ class PagesController < ApplicationController
       )
     end
   end
-
-  def sort_images
-    page = Page.find(params[:id])
-    page.update_assets(params[:images])
-    
-    head :ok
-  end
 end
diff --git a/app/controllers/related_assets_controller.rb b/app/controllers/related_assets_controller.rb
index da82cde..ca894f2 100644
--- a/app/controllers/related_assets_controller.rb
+++ b/app/controllers/related_assets_controller.rb
@@ -5,10 +5,10 @@ class RelatedAssetsController < ApplicationController
   def search
     term = params[:search_term].to_s.strip
     attached_ids = @node.editable_page.related_assets.pluck(:asset_id)
-    scope = Asset.images.where.not(id: attached_ids)
+    scope = Asset.headline_eligible.where.not(id: attached_ids)
 
     results = if term.present?
-      scope.where("name ILIKE ?", "%#{term}%").limit(10)
+      scope.where("name ILIKE :term OR upload_file_name ILIKE :term", term: "%#{term}%").limit(10)
     else
       scope.order(created_at: :desc).limit(5)
     end
@@ -26,6 +26,7 @@ class RelatedAssetsController < ApplicationController
       id: related.id,
       asset_id: asset.id,
       name: asset.name,
+      has_credit: asset.show_credit?,
       thumb_url: asset.upload.url(:thumb),
       large_url: asset.upload.url(:large),
       original_url: asset.upload.url,
diff --git a/app/controllers/shared_previews_controller.rb b/app/controllers/shared_previews_controller.rb
index f6fb45a..65f744d 100644
--- a/app/controllers/shared_previews_controller.rb
+++ b/app/controllers/shared_previews_controller.rb
@@ -8,7 +8,7 @@ class SharedPreviewsController < ApplicationController
       is_draft = node.draft_id == @page.id
 
       currently_public = is_head && @page.public?
-      superseded        = !is_head && !is_draft
+      superseded       = !is_head && !is_draft
 
       if superseded || currently_public
         redirect_to @page.public_link
diff --git a/app/helpers/content_helper.rb b/app/helpers/content_helper.rb
index 5b67259..7a52d9c 100644
--- a/app/helpers/content_helper.rb
+++ b/app/helpers/content_helper.rb
@@ -53,8 +53,8 @@ module ContentHelper
   end
 
   def headline_image
-    @headline_asset = @page.related_assets.find_by(headline: true)&.asset
-    render :partial => 'content/headline_image' if @headline_asset || @page.assets.images.any?
+    @headline_asset = @page.headline_asset
+    render :partial => 'content/headline_image' if @headline_asset || @page.assets.images.any? || @page.assets.pdfs.any?
   end
 
   # Returns the published_at attribute of a page if it is not nil, otherwise
@@ -153,7 +153,7 @@ module ContentHelper
 
   def asset_credit(asset)
     return nil unless asset
-    return nil if asset.creator.blank? && asset.source_url.blank? && asset.license_key.blank?
+    return nil unless asset.has_credit?
 
     license = AssetLicense.find(asset.license_key)
 
@@ -173,4 +173,8 @@ module ContentHelper
     full = license_text ? safe_join([attribution, license_text], ", ") : attribution
     safe_join([full, "."])
   end
+
+  def glightbox_data(image, title)
+    "title: #{title.to_s.tr(';', ',')};"
+  end
 end
diff --git a/app/models/asset.rb b/app/models/asset.rb
index 8bea1b3..ba9c2f0 100644
--- a/app/models/asset.rb
+++ b/app/models/asset.rb
@@ -1,5 +1,6 @@
 class Asset < ApplicationRecord
   IMAGE_CONTENT_TYPES = ["image/gif", "image/jpeg", "image/png", "image/webp"]
+  PDF_CONTENT_TYPE = "application/pdf"
 
   include FileAttachment
   
@@ -9,10 +10,25 @@ class Asset < ApplicationRecord
   scope :images,    -> { where(:upload_content_type => IMAGE_CONTENT_TYPES) }
   scope :documents, -> { where(:upload_content_type => ["application/pdf", "text/plain", "text/rtf"]) }
   scope :audio,     -> { where(:upload_content_type => ["audio/mpeg", "audio/x-m4a", "audio/wav", "audio/x-wav"]) }
+  scope :pdfs,      -> { where(:upload_content_type => PDF_CONTENT_TYPE) }
+
+  scope :headline_eligible, -> { where(:upload_content_type => IMAGE_CONTENT_TYPES + [PDF_CONTENT_TYPE]) }
 
   validates :license_key, inclusion: { in: -> { AssetLicense.keys } }, allow_blank: true
 
   def image?
     IMAGE_CONTENT_TYPES.include?(upload_content_type)
   end
+
+  def pdf?
+    upload_content_type == PDF_CONTENT_TYPE
+  end
+
+  def has_credit?
+    creator.present? || source_url.present? || license_key.present?
+  end
+
+  def show_credit?
+    image? && has_credit?
+  end
 end
diff --git a/app/models/concerns/file_attachment.rb b/app/models/concerns/file_attachment.rb
index e7a33c5..6221312 100644
--- a/app/models/concerns/file_attachment.rb
+++ b/app/models/concerns/file_attachment.rb
@@ -31,6 +31,7 @@ module FileAttachment
 
   IMAGE_CONTENT_TYPES    = %w[image/jpeg image/gif image/png image/webp].freeze
   VECTOR_CONTENT_TYPES   = %w[image/svg+xml].freeze
+  RASTERIZED_CONTENT_TYPES = %w[application/pdf].freeze
   DISPLAYABLE_AS_IMAGE   = IMAGE_CONTENT_TYPES + VECTOR_CONTENT_TYPES
 
   included do
@@ -60,29 +61,41 @@ module FileAttachment
     has_variant?(:medium)
   end
 
+  def variant_filename(style)
+    return upload_file_name if style == :original || !RASTERIZED_CONTENT_TYPES.include?(upload_content_type)
+    File.basename(upload_file_name, ".*") + ".png"
+  end
+
   private
 
   def build_upload_proxy
     @upload = UploadProxy.new(self)
   end
 
+  class_methods do
+    def upload_root
+      Rails.env.test? ? Rails.root.join("tmp", "test_uploads") : Rails.root.join("public", "system", "uploads")
+    end
+  end
+
+  def upload_root
+    self.class.upload_root
+  end
+
   def process_upload
     return unless @pending_upload
     uploaded_file = @pending_upload
     @pending_upload = nil
 
-    old_dir = Rails.root.join("public", "system", "uploads", id.to_s)
+    old_dir = upload_root.join(id.to_s)
+
     FileUtils.rm_rf(old_dir) if Dir.exist?(old_dir)
 
     original_path = file_path(:original)
     FileUtils.mkdir_p(File.dirname(original_path))
     FileUtils.cp(uploaded_file.tempfile.path, original_path)
 
-    if IMAGE_CONTENT_TYPES.include?(upload_content_type)
-      generate_variants(original_path)
-    elsif VECTOR_CONTENT_TYPES.include?(upload_content_type)
-      generate_svg_variants(original_path)
-    end
+    generate_all_variants(original_path)
   end
 
   def generate_variants(original_path)
@@ -101,16 +114,23 @@ module FileAttachment
     end
   end
 
+  def generate_all_variants(original_path)
+    if IMAGE_CONTENT_TYPES.include?(upload_content_type)
+      generate_variants(original_path)
+    elsif VECTOR_CONTENT_TYPES.include?(upload_content_type)
+      generate_svg_variants(original_path)
+    elsif RASTERIZED_CONTENT_TYPES.include?(upload_content_type)
+      generate_variants("#{original_path}[0]")
+    end
+  end
+
   def delete_upload_files
-    dir = Rails.root.join("public", "system", "uploads", id.to_s)
+    dir = upload_root.join(id.to_s)
     FileUtils.rm_rf(dir) if Dir.exist?(dir)
   end
 
   def file_path(style)
-    Rails.root.join(
-      "public", "system", "uploads",
-      id.to_s, style.to_s, upload_file_name
-    ).to_s
+    upload_root.join(id.to_s, style.to_s, variant_filename(style)).to_s
   end
 
   def sanitize_filename(filename)
@@ -127,7 +147,7 @@ module FileAttachment
 
     def url(style = :original)
       return "" if @record.upload_file_name.blank?
-      "/system/uploads/#{@record.id}/#{style}/#{@record.upload_file_name}"
+      "/system/uploads/#{@record.id}/#{style}/#{@record.variant_filename(style)}"
     end
 
     def content_type
diff --git a/app/models/page.rb b/app/models/page.rb
index f33d88d..817e3bd 100644
--- a/app/models/page.rb
+++ b/app/models/page.rb
@@ -220,7 +220,12 @@ class Page < ApplicationRecord
     end
 
     # Clone asset references
-    self.assets = page.assets
+    self.related_assets.delete_all
+    page.related_assets.each do |related|
+      self.related_assets.create!(:asset_id => related.asset_id,
+                                  :position => related.position,
+                                  :headline => related.headline)
+    end
 
     self.save
   end
@@ -287,6 +292,10 @@ class Page < ApplicationRecord
     end
   end
 
+  def headline_asset
+    related_assets.find_by(headline: true)&.asset
+  end
+
   # Returns true if a page has translations where one of them is significantly
   # older than the other.
   # Takes the I18n.default locale and a second :locale to test if the
@@ -314,21 +323,6 @@ class Page < ApplicationRecord
     end
   end
 
-  def update_assets image_ids
-
-    transaction do
-      self.related_assets.delete_all
-
-      if image_ids
-        image_ids.each_with_index do |id, index|
-          asset = Asset.find(id)
-          self.related_assets.create!(:asset_id => asset.id, :position => index+1)
-        end
-      end
-    end
-
-  end
-
   # Installs (or re-installs) the trigger that keeps page_translations'
   # search_vector in sync. Idempotent, safe to call on every boot.
   # search_vector is populated by a raw Postgres trigger, not anything
diff --git a/app/models/related_asset.rb b/app/models/related_asset.rb
index 62000cc..8f8d49c 100644
--- a/app/models/related_asset.rb
+++ b/app/models/related_asset.rb
@@ -12,6 +12,6 @@ class RelatedAsset < ApplicationRecord
 
     def headline_only_for_images
       return unless asset
-      errors.add(:headline, "can only be set on image assets") if headline? && !asset.image?
+      errors.add(:headline, "can only be set on image or PDF assets") if headline? && !(asset.image? || asset.pdf?)
     end
 end
diff --git a/app/views/assets/show.html.erb b/app/views/assets/show.html.erb
index a0e4e46..e551e35 100644
--- a/app/views/assets/show.html.erb
+++ b/app/views/assets/show.html.erb
@@ -16,7 +16,6 @@
       </div>
     </div>
 
-    <div class="node_description">Thumbnail</div>
     <% if @asset.has_variant?(:medium) %>
       <div class="node_description">Thumbnail</div>
       <div class="node_content"><%= image_tag @asset.upload.url(:medium), style: "max-width: 300px; max-height: 300px;" %></div>
diff --git a/app/views/content/_asset_credits.html.erb b/app/views/content/_asset_credits.html.erb
index 85739d0..5959abd 100644
--- a/app/views/content/_asset_credits.html.erb
+++ b/app/views/content/_asset_credits.html.erb
@@ -1,11 +1,9 @@
 <% if @page.assets.images.any? %>
   <div id="asset_credits">
     <% @page.assets.images.each do |image| %>
-      <% credit = asset_credit(image) %>
-      <% next unless credit %>
       <div id="credit_for_asset_<%= image.id %>"
-           class="glightbox-desc<%= " headline_credit" if image == @headline_asset %>">
-        <%= credit %>
+          class="asset_credit_block<%= " headline_credit" if image == @headline_asset %>">
+        <%= asset_credit(image) %>
       </div>
     <% end %>
   </div>
diff --git a/app/views/content/_headline_image.html.erb b/app/views/content/_headline_image.html.erb
index c764d22..4a3dfdc 100644
--- a/app/views/content/_headline_image.html.erb
+++ b/app/views/content/_headline_image.html.erb
@@ -1,12 +1,25 @@
 <% gallery_images = @page.assets.images %>
+<% image_headline = @headline_asset if @headline_asset&.image? %>
+<% other_pdfs = @page.assets.pdfs.where.not(id: @headline_asset&.id) %>
 
-<% if @headline_asset %>
+<% if @headline_asset&.pdf? %>
+  <%= link_to @headline_asset.upload.url, :class => "headline_document_card", :target => "_blank", :rel => "noopener" do %>
+    <%= image_tag @headline_asset.upload.url(:medium), :alt => "", :class => "headline_document_card_thumb" %>
+    <div class="headline_document_card_info">
+      <%= icon("file-text", library: "tabler", "aria-hidden": true) %>
+      <span class="headline_document_card_title"><%= @headline_asset.name %></span>
+    </div>
+  <% end %>
+<% end %>
+
+<% if image_headline %>
   <%= link_to(
-    image_tag(@headline_asset.upload.url(:headline)),
-    @headline_asset.upload.url,
+    image_tag(image_headline.upload.url(:headline)),
+    image_headline.upload.url,
     :class => "glightbox",
-    :data  => { :gallery => "page-#{@page.node.id}", :title => @headline_asset.name,
-                :description => "#credit_for_asset_#{@headline_asset.id}" }
+    :data => { :gallery => "page-#{@page.node.id}",
+               :glightbox => glightbox_data(image_headline, image_headline.name),
+               :"credit-selector" => (image_headline.show_credit? ? "#credit_for_asset_#{image_headline.id}" : nil) }
   ) %>
   <% if gallery_images.size > 1 %>
     <div class="right"><%= "#{gallery_images.size} #{t(:images)}" %></div>
@@ -15,14 +28,32 @@
   <%= link_to "#{gallery_images.size} #{t(:images)}, #{t(:open_gallery)}",
         gallery_images.first.upload.url,
         :class => "glightbox right",
-        :data  => { :gallery => "page-#{@page.node.id}", :title => gallery_images.first.name,
-                    :description => "#credit_for_asset_#{gallery_images.first.id}" } %>
+        :data => { :gallery => "page-#{@page.node.id}",
+                   :glightbox => glightbox_data(gallery_images.first, gallery_images.first.name),
+                   :"credit-selector" => (gallery_images.first.show_credit? ? "#credit_for_asset_#{gallery_images.first.id}" : nil) } %>
 <% end %>
 
 <% gallery_images.each do |image| %>
-  <% next if image == @headline_asset %>
-  <% next if !@headline_asset && image == gallery_images.first %>
+  <% next if image == image_headline %>
+  <% next if !image_headline && image == gallery_images.first %>
   <%= link_to "", image.upload.url, :class => "glightbox", :style => "display: none",
-        :data => { :gallery => "page-#{@page.node.id}", :title => image.name,
-                   :description => "#credit_for_asset_#{image.id}" } %>
+        :data => { :gallery => "page-#{@page.node.id}",
+                   :glightbox => glightbox_data(image, image.name),
+                   :"credit-selector" => (image.show_credit? ? "#credit_for_asset_#{image.id}" : nil) } %>
+<% end %>
+
+<% if other_pdfs.any? %>
+  <div class="related_documents">
+    <div class="related_documents_label"><%= t(:related_documents) %></div>
+    <ul class="related_documents_list">
+      <% other_pdfs.each do |pdf| %>
+        <li>
+          <%= link_to pdf.upload.url, :class => "related_document_link", :target => "_blank", :rel => "noopener" do %>
+            <%= icon("file-text", library: "tabler", "aria-hidden": true) %>
+            <span><%= pdf.name %></span>
+          <% end %>
+        </li>
+      <% end %>
+    </ul>
+  </div>
 <% end %>
diff --git a/app/views/custom/partials/_chapter.html.erb b/app/views/custom/partials/_chapter.html.erb
index 47f3950..5d47679 100644
--- a/app/views/custom/partials/_chapter.html.erb
+++ b/app/views/custom/partials/_chapter.html.erb
@@ -1,7 +1,7 @@
 <div class="article_partial chapter_partial" lang="<%= page.effective_lang %>">
   <div class="chapter_partial_layout">
-    <% if page.assets.images.any? %>
-      <%= link_to_path image_tag(page.assets.images.first.upload.url(:thumb), :alt => ""), page.node.unique_name, class: "chapter_thumbnail" %>
+    <% if page.headline_asset %>
+      <%= link_to_path image_tag(page.headline_asset.upload.url(:thumb), :alt => ""), page.node.unique_name, class: "chapter_thumbnail" %>
     <% end %>
     <div class="chapter_partial_content">
       <h2 class="headline"><%= link_to_path page.title, page.node.unique_name %></h2>
diff --git a/app/views/nodes/edit.html.erb b/app/views/nodes/edit.html.erb
index da682f0..12dc000 100644
--- a/app/views/nodes/edit.html.erb
+++ b/app/views/nodes/edit.html.erb
@@ -86,6 +86,7 @@
                   data-large-url="<%= related.asset.upload.url(:large) %>"
                   data-original-url="<%= related.asset.upload.url %>"
                   data-name="<%= related.asset.name %>"
+                  data-has-credit="<%= related.asset.show_credit? %>"
                   data-headline="<%= related.headline? %>"
                   class="<%= "is_headline" if related.headline? %>">
                 <span class="related_asset_handle"><%= icon("grip-vertical", library: "tabler", "aria-hidden": true) %></span>
@@ -101,7 +102,7 @@
               </li>
             <% end %>
           </ul>
-          <p class="field_hint">The starred photo becomes this page's headline image on the public site. If none is starred, visitors get a link to browse all attached images instead.</p>
+          <p class="field_hint">The starred image or PDF becomes this page's headline on the public site. If none is starred, visitors get a link to browse all attached images instead.</p>
           <%= text_field_tag nil, nil, id: "related_asset_search_term", placeholder: "Search images to attach…", autocomplete: "off" %>
           <div id="related_asset_search_results" class="search_results"></div>
         </div>
diff --git a/app/views/nodes/show.html.erb b/app/views/nodes/show.html.erb
index af05778..adf79dd 100644
--- a/app/views/nodes/show.html.erb
+++ b/app/views/nodes/show.html.erb
@@ -253,12 +253,20 @@
       <% end %>
     </div>
 
-    <% if @page.assets.images.any? %>
+    <% if @page.assets.any? %>
+      <% headline_asset_id = @page.headline_asset&.id %>
       <div class="node_description">Images</div>
       <div class="node_content node_info_group">
         <ul class="thumbnail_list">
-          <% @page.assets.images.each do |asset| %>
-            <li><%= link_to image_tag(asset.upload.url(:thumb)), asset_path(asset) %></li>
+          <% @page.assets.each do |asset| %>
+            <li class="<%= "is_headline" if asset.id == headline_asset_id %>">
+              <%= link_to image_tag(asset.upload.url(:thumb)), asset_path(asset) %>
+              <% if asset.id == headline_asset_id %>
+                <span class="headline_indicator" title="This page's headline image">
+                  <%= icon("star", library: "tabler", "aria-hidden": true) %>
+                </span>
+              <% end %>
+            </li>
           <% end %>
         </ul>
       </div>
diff --git a/config/locales/de.yml b/config/locales/de.yml
index 21c8ebf..dd22cef 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -130,3 +130,5 @@ de:
     photo: "Foto %{name}"
     by: "von %{creator}"
     licensed_under: "Lizenziert unter %{license}"
+
+  related_documents: "Weitere Dokumente"
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 1afcf21..9be0152 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -82,3 +82,5 @@ en:
     photo: "Photo %{name}"
     by: "by %{creator}"
     licensed_under: "Licensed under %{license}"
+
+  related_documents: "Related documents"
diff --git a/config/routes.rb b/config/routes.rb
index 6ddf48c..20602f7 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -30,7 +30,6 @@ Cccms::Application.routes.draw do
     end
 
     get  'pages/:id/preview',     to: 'pages#preview',     as: :preview_page
-    put  'pages/:id/sort_images', to: 'pages#sort_images', as: :sort_images_page
 
     get 'preview/:token', to: 'shared_previews#show', as: :shared_preview
 
diff --git a/lib/tasks/assets.rake b/lib/tasks/assets.rake
index 9d4b048..e778021 100644
--- a/lib/tasks/assets.rake
+++ b/lib/tasks/assets.rake
@@ -1,7 +1,9 @@
 namespace :assets do
   desc "Regenerate ImageMagick variants for every image asset from its stored original -- rerun whenever a new style is added to FileAttachment::STYLES after assets already exist. Scope to one asset first with ASSET_ID=123."
   task :regenerate_variants => :environment do
-    scope = Asset.images
+    scope = Asset.where(upload_content_type: FileAttachment::IMAGE_CONTENT_TYPES +
+                                              FileAttachment::VECTOR_CONTENT_TYPES +
+                                              FileAttachment::RASTERIZED_CONTENT_TYPES)
     scope = scope.where(id: ENV["ASSET_ID"]) if ENV["ASSET_ID"].present?
 
     scope.find_each do |asset|
@@ -12,7 +14,7 @@ namespace :assets do
         next
       end
 
-      asset.send(:generate_variants, original_path)
+      asset.send(:generate_all_variants, original_path)
       puts "Regenerated variants for Asset##{asset.id} (#{asset.name})"
     end
   end
diff --git a/public/javascripts/admin_interface.js b/public/javascripts/admin_interface.js
index 7fb1dc2..f6d915f 100644
--- a/public/javascripts/admin_interface.js
+++ b/public/javascripts/admin_interface.js
@@ -45,10 +45,6 @@ $(document).ready(function () {
     menu_item_sorter.initialize();
   }
 
-  if ($("#metadata").length != 0) {
-    meta_data.initialize();
-  }
-
   if ($("#parent_search_term").length != 0) {
     parent_search.initialize_search();
   }
@@ -110,14 +106,6 @@ $(document).ready(function () {
 });
 
 
-meta_data = {
-  initialize : function() {
-    document.getElementById("metadata_details").addEventListener("toggle", function() {
-      if (this.open) image_interface.initialize();
-    });
-  }
-};
-
 cccms = {
   setup_autosave : function() {
 
@@ -282,6 +270,7 @@ cccms = {
           large: $(this).data('large-url'),
           original: $(this).data('original-url'),
           name: $(this).data('name'),
+          hasCredit: $(this).data('has-credit') === true,
           headline: $(this).data('headline') === true
         };
       }).get();
@@ -320,8 +309,11 @@ cccms = {
         : 'inline-image inline-image--half inline-image--' + placement;
 
       var esc = cccms.inline_images.escape_attr;
+      var titleForGlightbox = (item.name || '').replace(/;/g, ',');
+      var glightboxOpts = 'title: ' + esc(titleForGlightbox) +
+        (item.hasCredit ? '; description: #credit_for_asset_' + esc(item.id) : '') + ';';
       var html = '<a href="' + esc(item.original) + '" class="glightbox" data-gallery="page-' + esc(cccms.inline_images.node_id) + '"' +
-                 ' data-title="' + esc(item.name) + '" data-description="#credit_for_asset_' + esc(item.id) + '">' +
+                 ' data-glightbox="' + glightboxOpts + '">' +
                  '<img src="' + esc(item.large) + '" class="' + classes + '" alt="' + esc(item.name) + '"></a>';
 
       cccms.inline_images.editor.insertContent(html);
@@ -360,77 +352,6 @@ menu_item_sorter = {
   }
 }
 
-image_interface = {
-
-  initialize : function() {
-
-    $("#image_browser").hide();
-    image_interface.initialize_sortable_image_box();
-    image_interface.connect_browser_and_box();
-    image_interface.set_droppable_behavior();
-    image_interface.bind_image_browser_toggle();
-  },
-
-
-  set_droppable_behavior : function() {
-    $("ul#image_box").droppable({
-      out : function(event, ui) {
-        $(ui.draggable).fadeTo("fast", 0.4);
-
-        $(ui.draggable).bind("mouseup", function() {
-          $(this).remove();
-        });
-      },
-      over : function(event, ui) {
-        $(ui.draggable).fadeTo("fast", 1.0);
-        $(ui.draggable).unbind("mouseup");
-      }
-    });
-  },
-
-  connect_browser_and_box : function() {
-    $("#image_browser ul li").draggable({
-      connectToSortable : 'ul#image_box',
-      helper : 'clone',
-      revert : 'invalid'
-    });
-  },
-
-  initialize_sortable_image_box : function() {
-
-    $("ul#image_box").sortable({
-      revert  : true,
-      update    : function(event, ui) {
-        images = $("ul#image_box").sortable("serialize", {attribute : "rel"});
-
-        $.ajax({
-          type : "POST",
-          url  : "/pages/" + $("ul#image_box").attr("rel") + "/sort_images",
-          dataType : "json",
-          data : images + "&_method=put",
-          success : function() {
-          }
-        });
-      }
-    });
-  },
-
-  bind_image_browser_toggle : function() {
-    $("#image_browser_toggle").bind("click", function(){
-      if ($("#image_browser_toggle").attr("class") == "unselected") {
-        $("#image_browser_toggle").attr("class", "selected");
-        $("#image_browser").show();
-      }
-      else {
-        $("#image_browser_toggle").attr("class", "unselected");
-        $("#image_browser").hide();
-      }
-
-      return false;
-    });
-  }
-}
-
 rrule_builder = {
   initialize : function() {
     rrule_builder.try_populate_from_rrule($("#event_rrule").val());
diff --git a/public/javascripts/public.js b/public/javascripts/public.js
index a9250ca..7f38f66 100644
--- a/public/javascripts/public.js
+++ b/public/javascripts/public.js
@@ -1,6 +1,25 @@
 document.addEventListener('DOMContentLoaded', function(){
 
-  GLightbox({ selector: '.glightbox' });
+  GLightbox({
+    selector: '.glightbox',
+    afterSlideLoad: function(slideData) {
+      var trigger = document.querySelectorAll('.glightbox')[slideData.index];
+      var selector = trigger && trigger.dataset.creditSelector;
+      if (!selector) return;
+
+      var source = document.querySelector(selector);
+      var container = slideData.slide.querySelector('.gdesc-inner');
+      if (!source || !container) return;
+
+      var target = container.querySelector('.gslide-desc');
+      if (!target) {
+        target = document.createElement('div');
+        target.className = 'gslide-desc';
+        container.appendChild(target);
+      }
+      target.innerHTML = source.innerHTML;
+    }
+  });
 
   document.getElementById("light-mode").addEventListener("change", () => {
     if (document.getElementById("light-mode").checked)
diff --git a/public/javascripts/related_assets.js b/public/javascripts/related_assets.js
index cc07d86..c6c6a19 100644
--- a/public/javascripts/related_assets.js
+++ b/public/javascripts/related_assets.js
@@ -87,6 +87,7 @@ related_assets = {
         var item = $($("#related_asset_template").html().trim());
         item.attr("data-url", related.url);
         item.attr("data-asset-id", related.asset_id);
+        item.attr("data-has-credit", related.has_credit);
         item.attr("data-large-url", related.large_url);
         item.attr("data-original-url", related.original_url);
         item.attr("data-name", related.name);
diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css
index 086e73d..ef6cb11 100644
--- a/public/stylesheets/admin.css
+++ b/public/stylesheets/admin.css
@@ -1042,10 +1042,6 @@ div#page_editor {
   select {
     font-size: 1.5rem;
   }
-
-  #metadata ul#image_box {
-    width: 100% !important;
-  }
 }
 
 /* ============================================================
@@ -1264,31 +1260,6 @@ div#draft_list table td.actions a {
    Image box / browser
    ============================================================ */
 
-#metadata ul#image_box {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 10px 5px 10px 5px;
-  height: 100px;
-  width: 702px;
-  border: 1px solid #989898;
-}
-
-#metadata ul#image_box li {
-  float: left;
-  list-style-type: none;
-  margin: 5px;
-}
-
-div#image_browser {
-  position: absolute;
-  top: 40px;
-  left: 800px;
-}
-
-div#image_browser ul li {
-  list-style-type: none;
-}
-
 .thumbnail_list {
   display: flex;
   flex-wrap: wrap;
@@ -1316,6 +1287,30 @@ div#image_browser ul li {
   border-radius: 4px;
 }
 
+.thumbnail_list li {
+  position: relative;
+}
+
+.thumbnail_list li .headline_indicator {
+  position: absolute;
+  top: 4px;
+  right: 4px;
+  width: 1.4rem;
+  height: 1.4rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.85);
+  color: #f5b400;
+}
+
+.thumbnail_list li .headline_indicator svg {
+  width: 0.9rem;
+  height: 0.9rem;
+  fill: currentColor;
+}
+
 .related_asset_handle {
   display: flex;
   color: #969696;
diff --git a/public/stylesheets/ccc.css b/public/stylesheets/ccc.css
index 8358d06..91f7a06 100644
--- a/public/stylesheets/ccc.css
+++ b/public/stylesheets/ccc.css
@@ -727,7 +727,6 @@ div.teaser_ruler {
   min-width: 0;
 }
 
-
 .inline-image--full {
   width: 100%;
   margin: 1rem 0;
@@ -748,10 +747,88 @@ div.teaser_ruler {
   margin-left: 1rem;
 }
 
-#asset_credits .glightbox-desc {
+#asset_credits .asset_credit_block {
   display: none;
 }
 
-#asset_credits .headline_credit {
+#asset_credits .asset_credit_block.headline_credit {
   display: block;
 }
+
+#asset_credits {
+  border-top: dotted 1px silver;
+}
+
+#asset_credits,
+.right {
+  font-style: italic;
+  font-family: Georgia;
+  font-size: 0.9rem;
+  color: color-mix(in srgb, CanvasText, #808080);
+}
+
+.glightbox-clean .gslide-description {
+  background: Canvas !important;
+}
+
+.glightbox-clean .gslide-title,
+.glightbox-clean .gslide-desc {
+  color: CanvasText !important;
+}
+
+.headline_document_card {
+  display: flex;
+  gap: 1rem;
+  align-items: flex-start;
+  border: 1px solid color-mix(in srgb, CanvasText, #808080 25%);
+  border-radius: 6px;
+  padding: 1rem;
+  text-decoration: none;
+  color: inherit;
+}
+
+.headline_document_card:hover {
+  border-color: CanvasText;
+}
+
+.headline_document_card_thumb {
+  max-width: 120px;
+  max-height: 160px;
+  border: 1px solid color-mix(in srgb, CanvasText, #808080 25%);
+  flex-shrink: 0;
+}
+
+.headline_document_card_info {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.headline_document_card_title {
+  font-weight: bold;
+}
+
+.related_documents {
+  margin-top: 1rem;
+}
+
+.related_documents_label {
+  font-style: italic;
+  font-family: Georgia;
+  font-size: 0.9rem;
+  color: color-mix(in srgb, CanvasText, #808080);
+  margin-bottom: 0.3rem;
+}
+
+.related_documents_list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.related_document_link {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  text-decoration: none;
+}
diff --git a/test/controllers/assets_controller_test.rb b/test/controllers/assets_controller_test.rb
index 5f5f6e5..f834541 100644
--- a/test/controllers/assets_controller_test.rb
+++ b/test/controllers/assets_controller_test.rb
@@ -4,17 +4,16 @@ class AssetsControllerTest < ActionController::TestCase
 
   def setup
     login_as :quentin
+    @existing_asset_ids = Asset.pluck(:id)
   end
 
   def teardown
-    # Clean up any files written to disk during tests
-    Dir.glob(Rails.root.join('public', 'system', 'uploads', 'test_*')).each do |dir|
+    (Asset.pluck(:id) - @existing_asset_ids).each do |id|
+      dir = Asset.upload_root.join(id.to_s)
+      raise "Refusing to delete #{dir} -- outside tmp/, Rails.env.test? may be false" unless
+        dir.to_s.start_with?(Rails.root.join("tmp").to_s)
       FileUtils.rm_rf(dir)
     end
-    # Remove uploads created for assets created during tests
-    Asset.where("upload_file_name IS NOT NULL").where("id > 1000000").each do |a|
-      FileUtils.rm_rf(Rails.root.join('public', 'system', 'uploads', a.id.to_s))
-    end
   end
 
   # --- index ---
@@ -64,15 +63,14 @@ class AssetsControllerTest < ActionController::TestCase
 
     # original and all four variants should exist on disk
     %w[original medium thumb headline large].each do |style|
-      path = Rails.root.join('public', 'system', 'uploads',
-                             asset.id.to_s, style, 'test_image.png')
+      path = asset.send(:file_path, style)
       assert File.exist?(path), "Expected #{style} variant at #{path}"
     end
   end
 
   # --- create with PDF ---
 
-  test "create asset with PDF upload generates only original" do
+  test "create asset with PDF upload generates rasterized variants" do
     uploaded = Rack::Test::UploadedFile.new(
       Rails.root.join('test', 'fixtures', 'files', 'test_document.pdf'),
       'application/pdf'
@@ -83,18 +81,14 @@ class AssetsControllerTest < ActionController::TestCase
     assert_response :redirect
 
     asset = Asset.last
-    assert_equal 'test_document.pdf', asset.upload_file_name
-    assert_equal 'application/pdf',   asset.upload_content_type
-
-    # only original should exist, no image variants
-    original_path = Rails.root.join('public', 'system', 'uploads',
-                                    asset.id.to_s, 'original', 'test_document.pdf')
+    original_path = asset.send(:file_path, :original)
     assert File.exist?(original_path), "Expected original at #{original_path}"
+    assert_equal 'test_document.pdf', File.basename(original_path)
 
     %w[medium thumb headline large].each do |style|
-      path = Rails.root.join('public', 'system', 'uploads',
-                             asset.id.to_s, style, 'test_document.pdf')
-      assert !File.exist?(path), "Expected no #{style} variant for PDF"
+      path = asset.send(:file_path, style)
+      assert File.exist?(path), "Expected a #{style} variant at #{path}"
+      assert_equal '.png', File.extname(path), "Expected #{style} variant to be a PNG, not a PDF"
     end
   end
 
@@ -137,7 +131,7 @@ class AssetsControllerTest < ActionController::TestCase
     )
     post :create, params: { asset: { name: 'To be deleted', upload: uploaded } }
     asset = Asset.last
-    upload_dir = Rails.root.join('public', 'system', 'uploads', asset.id.to_s)
+    upload_dir = asset.send(:upload_root).join(asset.id.to_s)
     assert Dir.exist?(upload_dir), "Upload directory should exist before destroy"
 
     assert_difference 'Asset.count', -1 do
diff --git a/test/controllers/pages_controller_test.rb b/test/controllers/pages_controller_test.rb
index 3879014..732869b 100644
--- a/test/controllers/pages_controller_test.rb
+++ b/test/controllers/pages_controller_test.rb
@@ -1,5 +1,72 @@
 require 'test_helper'
 
 class PagesControllerTest < ActionController::TestCase
-  # will be removed anyway
+  test "preview shows the autosave when a draft and an autosave both exist" do
+    login_as :quentin
+
+    node = Node.root.children.create!(:slug => "preview_retest")
+    node.draft.update!(:title => "draft title")
+    node.publish_draft!
+
+    node.draft
+    node.lock_for_editing!(users(:quentin))
+    node.autosave!({ :title => "draft title" }, users(:quentin))
+    node.save_draft!(users(:quentin))
+    node.autosave!({ :title => "autosave title" }, users(:quentin))
+
+    get :preview, params: { :id => node.draft_id }
+
+    assert_response :success
+    assert_match "autosave title", response.body
+  end
+
+  test "preview renders a headlined image on the autosave without crashing" do
+    login_as :quentin
+
+    node = Node.root.children.create!(:slug => "preview_retest_with_image")
+    node.lock_for_editing!(users(:quentin))
+    node.autosave!({ :title => "draft title" }, users(:quentin))
+    node.save_draft!(users(:quentin))
+    node.autosave!({ :title => "autosave title" }, users(:quentin))
+
+    asset = Asset.create!(:name => "test", :upload_content_type => "image/png")
+    node.autosave.related_assets.create!(:asset_id => asset.id, :position => 1, :headline => true)
+
+    get :preview, params: { :id => node.draft_id }
+
+    assert_response :success
+    assert_match "autosave title", response.body
+  end
+
+  test "preview shows the autosave when no draft exists at all" do
+    login_as :quentin
+
+    node = Node.root.children.create!(:slug => "preview_retest_no_draft")
+    node.draft.destroy
+    node.update_column(:draft_id, nil)
+
+    node.lock_for_editing!(users(:quentin))
+    node.autosave!({ :title => "autosave only title" }, users(:quentin))
+
+    asset = Asset.create!(:name => "test", :upload_content_type => "image/png")
+    node.autosave.related_assets.create!(:asset_id => asset.id, :position => 1)
+
+    get :preview, params: { :id => node.autosave_id }
+
+    assert_response :success
+    assert_match "autosave only title", response.body
+  end
+
+  test "preview shows head normally when there is no draft or autosave" do
+    login_as :quentin
+
+    node = Node.root.children.create!(:slug => "preview_retest_head_only")
+    node.draft.update!(:title => "head title")
+    node.publish_draft!
+
+    get :preview, params: { :id => node.head_id }
+
+    assert_response :success
+    assert_match "head title", response.body
+  end
 end
diff --git a/test/controllers/related_assets_controller_test.rb b/test/controllers/related_assets_controller_test.rb
index 2384adc..ced4b74 100644
--- a/test/controllers/related_assets_controller_test.rb
+++ b/test/controllers/related_assets_controller_test.rb
@@ -134,4 +134,29 @@ class RelatedAssetsControllerTest < ActionController::TestCase
     assert_response :success
     assert_not related.reload.headline?
   end
+
+  test "search includes PDF assets as headline-eligible candidates" do
+    login_as :quentin
+    node = Node.root.children.create!(:slug => "related_assets_search_pdf_test")
+    asset = Asset.create!(:name => "expert-opinion-searchable", :upload_content_type => "application/pdf")
+
+    get :search, params: { :node_id => node.id, :search_term => "expert-opinion-searchable" }
+
+    assert_response :success
+    ids = JSON.parse(response.body).map { |r| r["id"] }
+    assert_includes ids, asset.id
+  end
+
+  test "search matches by filename as well as name" do
+    login_as :quentin
+    node = Node.root.children.create!(:slug => "related_assets_search_filename_test")
+    asset = Asset.create!(:name => "Untitled", :upload_content_type => "application/pdf",
+                           :upload_file_name => "Stellungnahme_Patientendaten_Schutz.pdf")
+
+    get :search, params: { :node_id => node.id, :search_term => "Patientendaten" }
+
+    assert_response :success
+    ids = JSON.parse(response.body).map { |r| r["id"] }
+    assert_includes ids, asset.id
+  end
 end
diff --git a/test/models/asset_test.rb b/test/models/asset_test.rb
index d246abe..ab1cc5d 100644
--- a/test/models/asset_test.rb
+++ b/test/models/asset_test.rb
@@ -41,4 +41,16 @@ class AssetTest < ActiveSupport::TestCase
   test "license_key may be blank" do
     assert Asset.new(:license_key => nil).valid?
   end  
+
+  test "pdf? is true only for application/pdf" do
+    assert Asset.new(:upload_content_type => "application/pdf").pdf?
+    assert_not Asset.new(:upload_content_type => "image/png").pdf?
+  end
+
+  test "show_credit? is false for a PDF even with every credit field present" do
+    asset = Asset.new(:name => "demo", :upload_content_type => "application/pdf",
+                       :creator => "Jane Doe", :source_url => "https://example.org", :license_key => "cc_by_4")
+    assert asset.has_credit?
+    assert_not asset.show_credit?
+  end
 end
diff --git a/test/models/helpers/content_helper_test.rb b/test/models/helpers/content_helper_test.rb
index d6c7b43..c69ef4e 100644
--- a/test/models/helpers/content_helper_test.rb
+++ b/test/models/helpers/content_helper_test.rb
@@ -79,4 +79,50 @@ class ContentHelperTest < ActionView::TestCase
 
     I18n.with_locale(:en) { assert_match t(:open_gallery), headline_image }
   end
+
+  test "headline_image renders a document card for a PDF headline, not a lightbox image" do
+    node = Node.root.children.create!(:slug => "headline_image_pdf_test")
+    asset = Asset.create!(:name => "Expert Opinion", :upload_content_type => "application/pdf")
+    node.draft.assets << asset
+    node.draft.related_assets.find_by(:asset_id => asset.id).update!(:headline => true)
+    @page = node.draft
+
+    result = headline_image
+
+    assert_match "headline_document_card", result
+    assert_match "Expert Opinion", result
+    assert_no_match "data-gallery", result
+  end
+
+  test "headline_image lists other attached PDFs below the headline" do
+    node = Node.root.children.create!(:slug => "headline_image_multi_pdf_test")
+    headline_pdf = Asset.create!(:name => "Main Filing", :upload_content_type => "application/pdf")
+    other_pdf = Asset.create!(:name => "Supplementary Exhibit", :upload_content_type => "application/pdf")
+    node.draft.assets << headline_pdf
+    node.draft.assets << other_pdf
+    node.draft.related_assets.find_by(:asset_id => headline_pdf.id).update!(:headline => true)
+    @page = node.draft
+
+    result = headline_image
+
+    assert_match "Main Filing", result
+    assert_match "Supplementary Exhibit", result
+    assert_match "headline_document_card", result
+    assert_match "related_documents_list", result
+  end
+
+  test "headline_image lists attached PDFs even with no headline chosen" do
+    node = Node.root.children.create!(:slug => "headline_image_pdf_no_headline_test")
+    pdf_a = Asset.create!(:name => "Document A", :upload_content_type => "application/pdf")
+    pdf_b = Asset.create!(:name => "Document B", :upload_content_type => "application/pdf")
+    node.draft.assets << pdf_a
+    node.draft.assets << pdf_b
+    @page = node.draft
+
+    result = headline_image
+
+    assert_no_match "headline_document_card", result
+    assert_match "Document A", result
+    assert_match "Document B", result
+  end
 end
diff --git a/test/models/page_test.rb b/test/models/page_test.rb
index 1f924f9..98a00d2 100644
--- a/test/models/page_test.rb
+++ b/test/models/page_test.rb
@@ -309,11 +309,15 @@ class PageTest < ActiveSupport::TestCase
 
     kept_asset    = Asset.create!(:upload_file_name => "kept.png", :upload_content_type => "image/png", :upload_file_size => 1)
     removed_asset = Asset.create!(:upload_file_name => "removed.pdf", :upload_content_type => "application/pdf", :upload_file_size => 1)
-    n.head.update_assets([kept_asset.id, removed_asset.id])
+    n.head.related_assets.delete_all
+    n.head.related_assets.create!(:asset_id => kept_asset.id, :position => 1)
+    n.head.related_assets.create!(:asset_id => removed_asset.id, :position => 2)
 
     d2 = find_or_create_draft(n, @user1)
     added_asset = Asset.create!(:upload_file_name => "added.png", :upload_content_type => "image/png", :upload_file_size => 1)
-    d2.update_assets([kept_asset.id, added_asset.id])
+    d2.related_assets.delete_all
+    d2.related_assets.create!(:asset_id => kept_asset.id, :position => 1)
+    d2.related_assets.create!(:asset_id => added_asset.id, :position => 2)
     d2.save!
 
     diff = d2.diff_against(n.head)
diff --git a/test/models/related_asset_test.rb b/test/models/related_asset_test.rb
index 710b4cc..bb86ddb 100644
--- a/test/models/related_asset_test.rb
+++ b/test/models/related_asset_test.rb
@@ -11,15 +11,25 @@ class RelatedAssetTest < ActiveSupport::TestCase
     assert related.valid?
   end
 
-  test "headline cannot be set on a non-image asset" do
+  test "headline can be set on a PDF asset" do
     node = Node.root.children.create!(:slug => "related_asset_headline_pdf_test")
-    asset = Asset.create!(:name => "programme", :upload_content_type => "application/pdf")
+    asset = Asset.create!(:name => "expert opinion", :upload_content_type => "application/pdf")
+    node.draft.assets << asset
+    related = node.draft.related_assets.find_by(:asset_id => asset.id)
+
+    related.headline = true
+    assert related.valid?
+  end
+
+  test "headline cannot be set on a non-image, non-PDF asset" do
+    node = Node.root.children.create!(:slug => "related_asset_headline_text_test")
+    asset = Asset.create!(:name => "programme", :upload_content_type => "text/plain")
     node.draft.assets << asset
     related = node.draft.related_assets.find_by(:asset_id => asset.id)
 
     related.headline = true
     assert_not related.valid?
-    assert_includes related.errors[:headline], "can only be set on image assets"
+    assert_includes related.errors[:headline], "can only be set on image or PDF assets"
   end
 
   test "the headline validation does not raise when asset is missing" do