Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🗑️ [#2062] Remove card templatetags #1010

Merged
merged 2 commits into from
Feb 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,34 +1,38 @@
{% load card_tags helpers %}
{% load helpers %}
<div class="card-container{% if columns %} card-container--columns-{{columns}}{% endif %}{% if small %} card-container--small{% endif %}">
{% if categories %}
{% for category in categories %}
{% url 'products:category_detail' slug=category.slug as category_url %}
{% if category.icon %}
{% card src=category.icon.file.url alt=category.icon.name title=category.name href=category_url compact=True image_object_fit=image_object_fit %}
{% include "components/Card/Card.html" with src=category.icon.file.url alt=category.icon.name title=category.name href=category_url compact=True image_object_fit=image_object_fit only %}
{% else %}
{% card src=category.image.file.url alt=category.image.name title=category.name href=category_url compact=True image_object_fit=image_object_fit %}
{% include "components/Card/Card.html" with src=category.image.file.url alt=category.image.name title=category.name href=category_url compact=True image_object_fit=image_object_fit only %}
{% endif %}
{% endfor %}
{% endif %}

{% if subcategories %}
{% for subcategory in subcategories %}
{% category_card category=subcategory parent_category=parent_category compact=True image_object_fit=image_object_fit %}
{% include "components/Card/CategoryCard.html" with category=subcategory parent_category=parent_category compact=True image_object_fit=image_object_fit only %}
{% endfor %}
{% endif %}

{% if products %}
{% for product in products %}
{% get_product_url product as product_url %}
{% product_card title=product.name description=product.summary url=product_url image=product.icon compact=True image_object_fit=image_object_fit %}
{% include "components/Card/ProductCard.html" with title=product.name description=product.summary url=product_url image=product.icon compact=True image_object_fit=image_object_fit only %}
{% endfor %}
{% endif %}

{% if plans %}
{% for plan in plans %}
{% description_card title=plan.title description=plan.goal|truncatechars:51 url=plan.get_absolute_url elypsis=True object=plan compact=True image_object_fit=image_object_fit %}
{% include "components/Card/DescriptionCard.html" with title=plan.title description=plan.goal|truncatechars:51 url=plan.get_absolute_url elypsis=True object=plan compact=True image_object_fit=image_object_fit only %}
{% endfor %}
{% endif %}

{{ contents }}
{% if locations %}
{% for location in locations %}
{% include "components/Card/LocationCard.html" with location_name=location.name address_line_1=location.address_line_1 address_line_2=location.address_line_2 compact=True phonenumber=location.phonenumber email=location.email only %}
{% endfor %}
{% endif %}
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{% load link_tags string_tags %}
<div class="card card__body">
{% if location_name %}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see this card is in the 'old' style and contains a link inside, (as opposed to all the other cards that are entirely clickable with a surrounding anchor instead) but then again: we'll indeed need to keep the phone/mail as clickable items.

{% link href=location.get_absolute_url primary=True text=location_name extra_classes="h3" %}
{% endif %}
<div class="card__body--flex p--no-margin">
<p class="p">{{ address_line_1 }}</p>
<p class="p">{{ address_line_2 }}</p>
{% if phonenumber %}
{% link href='tel:'|addstr:phonenumber secondary=True text=phonenumber %}
{% endif %}
{% if email %}
{% link href='mailto:'|addstr:email secondary=True text=email %}
{% endif %}
</div>
</div>
139 changes: 0 additions & 139 deletions src/open_inwoner/components/templatetags/card_tags.py
Original file line number Diff line number Diff line change
Expand Up @@ -2,38 +2,9 @@

from open_inwoner.components.utils import ContentsNode, parse_component_with_args

from ...pdc.models import Category

register = template.Library()


@register.inclusion_tag("components/Card/Card.html")
def card(href, title, **kwargs):
"""
Render in a card. Only using variables.

Usage:
{% card href="https://maykinmedia.nl" %}

Variables:
+ href: url | where the card links to.
+ title: string | this will be the card title.
- alt: string | the alt of the header image.
- compact: bool | Whether to use compact styling.
- direction: string | can be set to "horizontal" to show contents horizontally.
- inline: bool | Whether the card should be rendered inline.
- src: string | the src of the header image.
- compact: bool | Whether the card has uniform padding on all sides.
- stretch: bool | Whether to stretch the card vertically.
- tinted: bool | whether to use gray as background color.
- type: string (info) | Set to info for an info card.
- image: FilerImageField | an image that should be used.
- image_object_fit: string | Can be set to either "cover" (default) or "contain".
- grid: boolean | if the card should be a grid.
"""
return {**kwargs, "href": href, "title": title}


@register.tag
def render_card(parser, token):
alextreme marked this conversation as resolved.
Show resolved Hide resolved
"""
Expand All @@ -55,113 +26,3 @@ def render_card(parser, token):
nodelist = parser.parse(("endrender_card",))
parser.delete_first_token()
return ContentsNode(nodelist, "components/Card/RenderCard.html", **context_kwargs)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Very pleasant clean-up :-)



@register.inclusion_tag("components/Card/CategoryCard.html")
def category_card(category: Category, **kwargs):
"""
Renders a card prepopulated based on `category`.

Usage:
{% category_card category %}

Available options:
- category: Category | the category to render card for.
"""
return {**kwargs, "category": category}


@register.inclusion_tag("components/Card/DescriptionCard.html")
def description_card(title, description, url, **kwargs):
"""
Renders a card prepopulated based on `product`.

Usage:
{% description_card title=product.title description=product.intro url=product.get_absolute_url %}
{% description_card title="title" description="description" url="https://maykinmedia.nl" %}

Available options:
+ title: string | The title of the card that needs to be displayed.
+ description: string | The description that needs to be displayed.
+ url: string | The url that the card should point to.
- object: any | The object that needs to render aditional data.
- image: FilerImageField | an image that should be used.
"""
kwargs.update(title=title, description=description, url=url)
return kwargs


@register.inclusion_tag("components/Card/ProductCard.html")
def product_card(description, url, **kwargs):
"""
Renders a card with or without an image prepopulated based on `product`.

Usage:
{% product_card title=product.title description=product.intro url=product.get_absolute_url %}

Available options:
+ description: string | The description that needs to be displayed.
+ url: string | The url that the card should point to.
- title: string | The title of the card that may be displayed if there is no image.
- object: any | The object that needs to render aditional data.
- image: FilerImageField | an image that should be used.
"""
kwargs.update(description=description, url=url)
return kwargs


@register.inclusion_tag("components/Card/CardContainer.html")
def card_container(categories=[], subcategories=[], products=[], plans=[], **kwargs):
"""
A card container where the category card or product card will be rendered in.

Usage:
{% card_container categories=categories %}

Variables:
- categories: Category[] | categories to render.
- subcategories: Category[] | subcategories to render.
- products: Product[] | products to render.
- parent: Category | The parent of the given card_container
- image_object_fit: string | Can be set to either "cover" (default) or "contain".
"""
if (
categories is None
and subcategories is None
and products is None
and plans is None
):
assert False, "provide categories, subcategories, products or plans"

return {
**kwargs,
"categories": categories,
"subcategories": subcategories,
"products": products,
"plans": plans,
}


@register.tag()
def render_card_container(parser, token):
"""
Nested content supported.

Usage:
{% render_card_container %}
{% card href='https://www.example.com' title='example.com' %}
{% endrender_card_container %}

Variables:
Supports all options from card, but optional.

Extra context:
- contents: string (HTML) | this is the context between the render_card and endrender_card tags
"""
bits = token.split_contents()
context_kwargs = parse_component_with_args(parser, bits, "render_list")
nodelist = parser.parse(("endrender_card_container",)) # End tag
parser.delete_first_token()
return ContentsNode(
nodelist, "components/Card/CardContainer.html", **context_kwargs
) # Template
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{% load i18n button_tags card_tags %}
{% load i18n button_tags %}
{% if categories %}
<h2 class="h2">
{{configurable_text.home_page.home_theme_title}}
Expand All @@ -8,5 +8,5 @@ <h2 class="h2">
</h2>
<p class="p">{{configurable_text.home_page.home_theme_intro|linebreaksbr}}</p>

{% card_container categories=categories columns=4 image_object_fit="cover" %}
{% include "components/Card/CardContainer.html" with categories=categories columns=4 image_object_fit="cover" only %}
{% endif %}
6 changes: 3 additions & 3 deletions src/open_inwoner/templates/pages/category/detail.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{% extends 'master.html' %}
{% load i18n button_tags card_tags faq_tags grid_tags questionnaire_tags string_tags %}
{% load i18n button_tags faq_tags grid_tags questionnaire_tags string_tags %}

{% block header_image %}
{% if object.image %}
Expand All @@ -20,12 +20,12 @@ <h1 class="utrecht-heading-1">
{{ category_rendered_description|safe }}

{% if subcategories %}
{% card_container subcategories=subcategories parent_category=object %}
{% include "components/Card/CardContainer.html" with subcategories=subcategories parent_category=object only %}
{% endif %}

{% if products %}
<div class="categories__products">
{% card_container products=products small=True parent=object %}
{% include "components/Card/CardContainer.html" with products=products small=True parent=object only %}
</div>
{% endif %}

Expand Down
3 changes: 1 addition & 2 deletions src/open_inwoner/templates/pages/category/list.html
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
{% extends 'master.html' %}
{% load card_tags %}

{% block content %}
<div class="categories__content">
<h1 class="h1">{{configurable_text.theme_page.theme_title}}</h1>
<p class="p">{{configurable_text.theme_page.theme_intro|linebreaksbr}}</p>

{% card_container categories=object_list %}
{% include "components/Card/CardContainer.html" with categories=object_list only %}
</div>
{% endblock content %}
50 changes: 0 additions & 50 deletions src/open_inwoner/templates/pages/home.html

This file was deleted.

4 changes: 2 additions & 2 deletions src/open_inwoner/templates/pages/plans/list.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{% extends 'master.html' %}
{% load i18n button_tags string_tags pagination_tags helpers card_tags form_tags link_tags cms_tags %}
{% load i18n button_tags string_tags pagination_tags helpers form_tags link_tags cms_tags %}

{% block header_image %}
{% placeholder 'banner' %}
Expand Down Expand Up @@ -65,7 +65,7 @@ <h1 class="h1">
</tbody>
</table>
{% else %}
{% card_container plans=plans.plan_list columns=2 %}
{% include "components/Card/CardContainer.html" with plans=plans.plan_list columns=2 only %}
{% endif %}

{% pagination page_obj=page_obj paginator=paginator request=request %}
Expand Down
24 changes: 2 additions & 22 deletions src/open_inwoner/templates/pages/product/detail.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{% extends 'master.html' %}
{% load i18n l10n button_tags card_tags faq_tags file_tags grid_tags icon_tags link_tags map_tags notification_tags tag_tags utils condition_tags render_tags anchor_menu_tags product_tags string_tags %}
{% load i18n l10n button_tags faq_tags file_tags grid_tags icon_tags link_tags map_tags notification_tags tag_tags utils condition_tags render_tags anchor_menu_tags product_tags string_tags %}

{% block header_image %}
{% if object.image %}
Expand Down Expand Up @@ -90,27 +90,7 @@ <h3 class="h3">{% trans "U komt niet in aanmerking" %}</h3>
{% map centroid.lat centroid.lng id="locations" title=_('Locaties') geojson_feature_collection=object.locations.get_geojson_feature_collection %}
{% endwith %}

{% render_card_container columns=3 %}
{% for location in object.locations.all %}
{% with location_name=location.name phonenumber=location.phonenumber email=location.email %}
<div class="card card__body">
{% if location_name %}
{% link href=location.get_absolute_url primary=True text=location_name extra_classes="h3" %}
{% endif %}
<div class="card__body--flex p--no-margin">
<p class="p">{{ location.address_line_1 }}</p>
<p class="p">{{ location.address_line_2 }}</p>
{% if phonenumber %}
{% link href='tel:'|addstr:phonenumber secondary=True text=phonenumber %}
{% endif %}
{% if email %}
{% link href='mailto:'|addstr:email secondary=True text=email %}
{% endif %}
</div>
</div>
{% endwith %}
{% endfor %}
{% endrender_card_container %}
{% include "components/Card/CardContainer.html" with locations=object.locations.all columns=3 only %}
{% endif %}

{% render_grid %}
Expand Down
6 changes: 3 additions & 3 deletions src/open_inwoner/templates/pages/product/location_detail.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{% extends 'master.html' %}
{% load i18n l10n card_tags grid_tags %}
{% load i18n l10n grid_tags %}


{% block content %}
Expand All @@ -23,9 +23,9 @@ <h1 class="h1">{{ object.name }}</h1>
</div>
</div>
</div>

{% if products %}
{% card_container products=products small=True %}
{% include "components/Card/CardContainer.html" with products=products small=True only %}
{% else %}
{% trans "There are no products available at this location." %}
{% endif %}
Expand Down
Loading
Loading