photo album inline at least compiles

src/onegov/org/models/extensions.py

@@ -47,6 +47,7 @@
     from onegov.form.types import FormT
     from onegov.org.models import GeneralFile  # noqa: F401
     from onegov.org.request import OrgRequest
+    from onegov.org.models import ImageSet
     from sqlalchemy import Column
     from sqlalchemy.orm import relationship
     from typing import type_check_only, Protocol
@@ -1124,3 +1125,41 @@ class DeletableContentForm(form_class):  # type:ignore
             )
 
         return DeletableContentForm
+
+
+class InlinePhotoAlbumExtension(ContentExtension):
+    """ Adds ability to reference photo albums (ImageSets) and show them
+    inline at the end of the content of the page.
+
+    """
+
+    photo_album_id: dict_property[str | None] = content_property()
+
+    @property
+    def photo_album(self) -> 'ImageSet | None':
+        from onegov.org.models import ImageSetCollection
+        return ImageSetCollection(object_session(self)).by_id(
+            self.photo_album_id
+        )
+
+    def extend_form(
+        self, form_class: type['FormT'], request: 'OrgRequest'
+    ) -> type['FormT']:
+
+        from onegov.org.models import ImageSetCollection
+        albums: list['ImageSet'] = (
+            ImageSetCollection(request.session).query().all()
+        )
+
+        choices = [('', '')] + [
+            (album.id, album.title) for album in albums
+        ]
+
+        class PhotoAlbumForm(form_class):  # type:ignore
+            photo_album_id = SelectField(
+                label=_('Photo Album'),
+                choices=choices,
+                fieldset=_('Photos'),
+            )
+
+        return PhotoAlbumForm

src/onegov/org/models/page.py

@@ -8,7 +8,8 @@
 from onegov.org.models.extensions import (
     InheritableContactExtension, ContactHiddenOnPageExtension,
     PeopleShownOnMainPageExtension, ImageExtension,
-    NewsletterExtension, PublicationExtension, DeletableContentExtension
+    NewsletterExtension, PublicationExtension, DeletableContentExtension,
+    InlinePhotoAlbumExtension
 )
 from onegov.org.models.extensions import AccessExtension
 from onegov.org.models.extensions import CoordinatesExtension
@@ -37,7 +38,8 @@ class Topic(Page, TraitInfo, SearchableContent, AccessExtension,
             InheritableContactExtension, ContactHiddenOnPageExtension,
             PeopleShownOnMainPageExtension, PersonLinkExtension,
             CoordinatesExtension, ImageExtension,
-            GeneralFileLinkExtension, SidebarLinksExtension):
+            GeneralFileLinkExtension, SidebarLinksExtension,
+            InlinePhotoAlbumExtension):
 
     __mapper_args__ = {'polymorphic_identity': 'topic'}
 

src/onegov/town6/templates/macros.pt

@@ -819,7 +819,7 @@
 </metal:page_content>
 
 <metal:page_content define-macro="page_content" i18n:domain="onegov.town6">
-    <div class="grid-x grid-padding-x wrapper" tal:define="show_side_panel show_side_panel|False; location location|False; show_page_image page.show_page_image|None; files files|None; sidepanel_links sidepanel_links|None; news page.type == 'news'|False;">
+    <div class="grid-x grid-padding-x wrapper" tal:define="show_side_panel show_side_panel|False; location location|False; show_page_image page.show_page_image|None; files files|None; sidepanel_links sidepanel_links|None; news page.type == 'news'|False; imageset page.photo_album|None; ">
         <tal:b condition="not: people or files or contact or coordinates or location or show_side_panel or more_entries|False">
             <div class="small-12 cell page-content-main">
                 <img class="page-image" tal:condition="news or show_page_image and layout.org.theme_options.get('page-image-position', 'as_content') ==  'as_content' and page.page_image" src="${page.page_image}">
@@ -830,7 +830,10 @@
                 <div metal:define-slot="after-lead"></div>
 
                 <div class="page-text" tal:condition="text" tal:content="text" />
+                <metal:b tal:condition="imageset" use-macro="layout.macros['render_inline_photo_album']"
+                         tal:define="imageset imageset" />
                 <div metal:define-slot="after-text"></div>
+
             </div>
         </tal:b>
         <tal:b condition="people or files or contact or coordinates or show_side_panel or more_entries|False">
@@ -843,8 +846,12 @@
                     <div metal:define-slot="after-lead"></div>
 
                     <div class="page-text" tal:condition="text" tal:content="text" />
+                    <metal:b tal:condition="imageset" use-macro="layout.macros['render_inline_photo_album']"
+                             tal:define="imageset imageset" />
+
                     <div metal:define-slot="after-text"></div>
 
+
                     <div class="people-panel" tal:condition="people and show_people_on_main_page" tal:define="show_people_on_main_page page.show_people_on_main_page|resource.show_people_on_main_page|False; western_name_order page.western_name_order|resource.western_name_order|False">
                         <h3 i18n:translate>People</h3>
                         <ul data-sortable data-sortable-url="${layout.move_person_url_template}">
@@ -2971,3 +2978,23 @@
         </div>
     </div>
 </metal:display_results>
+
+<metal:b define-macro="render_inline_photo_album">
+    <tal:b tal:condition="imageset and imageset.files">
+        <!--! Inline imagesets are always renderd as grid -->
+        <div class="page-text grid-imageset photoswipe">
+            <div class="image-grid">
+                <div tal:repeat="image imageset.files" class="image-container">
+                    <tal:b define="width image.reference.thumbnail_small.size[0]|image.reference.size[0]; height image.reference.thumbnail_small.size[1]|image.reference.size[1]">
+                        <!--! the first eight images are loaded conventionally, the rest are loaded lazily -->
+                        <img src="${request.link(image, 'thumbnail')}" alt="${image.note}" width="${width}" height="${height}" tal:condition="repeat.image.number <= 8" data-full-width="${image.reference.size[0]}" data-full-height="${image.reference.size[1]}" />
+                        <img src="${request.link(image, 'thumbnail')}" alt="${image.note}" width="${width}" height="${height}" class="lazyload" tal:condition="repeat.image.number > 8" data-full-width="${image.reference.size[0]}" data-full-height="${image.reference.size[1]}" />
+                    </tal:b>
+                </div>
+            </div>
+        </div>
+
+    <tal:b metal:use-macro="layout.macros.photoswipe" />
+
+    </tal:b>
+</metal:b>

src/onegov/town6/templates/news.pt

@@ -55,7 +55,7 @@
         </div>
 
         <tal:b metal:use-macro="layout.macros.page_content" tal:condition="page.parent"
-            tal:define="lead page.content.get('lead');text page.text|None; people page.people; contact None if children else layout.contact_html; coordinates page.coordinates; files page.files; sidepanel_links page.sidepanel_links|False;" />
+            tal:define="lead page.content.get('lead');text page.text|None; people page.people; contact None if children else layout.contact_html; coordinates page.coordinates; files page.files; sidepanel_links page.sidepanel_links|False; imageset page.photo_album|False;" />
 
     </tal:b>
 

src/onegov/town6/templates/topic.pt

@@ -20,7 +20,7 @@
 
 
             <tal:b metal:use-macro="layout.macros.page_content"
-             tal:define="lead layout.linkify(page.content.get('lead'));text page.text|None; people page.people; contact layout.contact_html; coordinates page.coordinates; files page.files; sidepanel_links page.sidepanel_links;">
+             tal:define="lead layout.linkify(page.content.get('lead'));text page.text|None; people page.people; contact layout.contact_html; coordinates page.coordinates; files page.files; sidepanel_links page.sidepanel_links; imageset page.photo_album|False;">
                 <tal:b metal:fill-slot="after-text">
                     <ul class="more-list page-links grid-x grid-padding-x">
                         <li tal:repeat="(lead, title, link, url, edit_link, page_image, show_preview_image) children" class="small-12 ${'medium-6' if children_images else ''} cell" >

tests/onegov/org/test_views_pages.py

@@ -236,7 +236,6 @@ def test_pages_person_link_extension(client):
     new_page.form['text'] = ("<h2>Living in Govikon is Really "
                              "Great</h2><i>Experts say it's the fact that "
                              "Govikon does not really exist.</i>"
-                             + embedded_img
                              )
     new_page.form['western_name_order'] = False
     new_page.form['people-0-person'] = person_uuid

tests/onegov/town6/test_views_topics.py

@@ -145,3 +145,15 @@ def test_view_page_as_member(client):
     anon.get(page_url, status=403)
     page = anon.get('/topics/organisation')
     assert 'Test' not in page
+
+
+def test_inline_photo_album(client):
+    admin = client
+    client.login_admin()
+
+    new_page = admin.get('/topics/organisation').click('Thema')
+    new_page.form['title'] = "Test"
+    new_page.form['access'] = 'member'
+    page = new_page.form.submit().follow()
+
+    # edit_page = page.click('Bearbeiten')