Task 2396: Migrate Large Static Images to S3 Bucket

ak/views.py

@@ -9,6 +9,7 @@
 
 from core.calendar import extract_calendar_events, events_by_month, get_calendar
 from core.mixins import V3Mixin
+from core.templatetags.custom_static import large_static
 from libraries.constants import LATEST_RELEASE_URL_PATH_STR
 from libraries.mixins import ContributorMixin
 from news.models import Entry
@@ -128,7 +129,7 @@ def get_v3_context_data(self, **kwargs):
             "primary_button_label": "View the Release Calendar",
             "secondary_button_url": "www.example.com",
             "secondary_button_label": "Secondary Button",
-            "image": f"{settings.STATIC_URL}/img/v3/demo_page/Calendar.png",
+            "image": large_static("img/v3/demo-page/calendar.png"),
         }
         ctx["info_card"] = {
             "title": "How we got here",

core/mock_data.py

@@ -4,6 +4,7 @@
 from django.utils.text import slugify
 
 from core.constants import BadgeToken, SLACK_MEMBER_COUNT
+from core.templatetags.custom_static import large_static
 from libraries.utils import commit_data_to_stats_bars
 
 
@@ -233,7 +234,7 @@ class SharedResources:
             "author": {
                 "name": "Prof. Sven G. Bilén, Ph.D.",
                 "profile_url": "#",
-                "avatar_url": "/static/img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo_page/avatar.png"),
                 "role": "The Pennsylvania State University",
                 "badge": BadgeToken.TIER_3,
             },
@@ -360,8 +361,8 @@ class SharedResources:
             "author": {
                 "name": "Ipsum Loremson",
                 "profile_url": "#",
-                "avatar_url": "/static/img/v3/demo_page/Avatar.png",
-                "role": "Lorem Ipsum Industries",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
+                "role": "Maintainer",
                 "badge": BadgeToken.TIER_3,
             },
             "content": """
@@ -385,20 +386,20 @@ class SharedResources:
             {
                 "name": "Vinnie Falco",
                 "role": "Author",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.TIER_3,
                 "bio": "Big C++ fan. Not quite kidney-donation level, but close.",
             },
             {
                 "name": "Alex Wells",
                 "role": "Contributor",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "bio": "C++ enthusiast who has worked at Intel and Microsoft.",
             },
             {
                 "name": "Dave Abrahams",
                 "role": "Maintainer",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.TIER_3,
                 "bio": "Contributor to Boost since 2009.",
             },
@@ -415,19 +416,13 @@ class SharedResources:
         "button_label": "See license details",
     }
 
-    hero_legacy_image_url_light = f"{settings.STATIC_URL}img/v3/home-page/heros.png"
+    hero_legacy_image_url_light = large_static("img/v3/home-page/heros.png")
 
-    hero_legacy_image_url_dark = (
-        f"{settings.STATIC_URL}img/v3/home-page/heros_light.png"
-    )
+    hero_legacy_image_url_dark = large_static("img/v3/home-page/heros_light.png")
 
-    hero_image_url = f"{settings.STATIC_URL}img/v3/home-page/home-page-foreground.png"
-    hero_image_url_light = (
-        f"{settings.STATIC_URL}img/v3/home-page/home-page-foreground.png"
-    )
-    hero_image_url_dark = (
-        f"{settings.STATIC_URL}img/v3/home-page/home-page-foreground.png"
-    )
+    hero_image_url = large_static("img/v3/home-page/home-page-foreground.png")
+    hero_image_url_light = large_static("img/v3/home-page/home-page-foreground.png")
+    hero_image_url_dark = large_static("img/v3/home-page/home-page-foreground.png")
 
     library_about_code = (
         "int main()\n"

core/views.py

@@ -30,6 +30,7 @@
 from django.views.decorators.cache import never_cache
 from django.views.generic import TemplateView
 
+from core.templatetags.custom_static import large_static
 from config.settings import ENABLE_DB_CACHE
 from libraries.constants import LATEST_RELEASE_URL_PATH_STR
 from libraries.mixins import VersionAlertMixin
@@ -160,7 +161,9 @@ def get_v3_context_data(self, **kwargs):
                 "author": {
                     "name": "Character Name",
                     "role": "Contributor",
-                    "avatar_url": "/static/img/v3/community-page/avatar-beaver-character.png",
+                    "avatar_url": large_static(
+                        "img/v3/community-page/avatar-beaver-character.png"
+                    ),
                 },
             },
             {
@@ -171,7 +174,9 @@ def get_v3_context_data(self, **kwargs):
                 "author": {
                     "name": "Character Name",
                     "role": "Author",
-                    "avatar_url": "/static/img/v3/community-page/avatar-mouse-character.png",
+                    "avatar_url": large_static(
+                        "img/v3/community-page/avatar-mouse-character.png"
+                    ),
                 },
             },
             {
@@ -182,7 +187,9 @@ def get_v3_context_data(self, **kwargs):
                 "author": {
                     "name": "Character Name",
                     "role": "Maintainer",
-                    "avatar_url": "/static/img/v3/community-page/avatar-cheetah-character.png",
+                    "avatar_url": large_static(
+                        "img/v3/community-page/avatar-cheetah-character.png"
+                    ),
                 },
             },
             {
@@ -193,7 +200,9 @@ def get_v3_context_data(self, **kwargs):
                 "author": {
                     "name": "Character Name",
                     "role": "Contributor",
-                    "avatar_url": "/static/img/v3/community-page/avatar-fish-character.png",
+                    "avatar_url": large_static(
+                        "img/v3/community-page/avatar-fish-character.png"
+                    ),
                 },
             },
         ]
@@ -323,9 +332,8 @@ def get_v3_context_data(self, **kwargs):
             "<li>Recent activity feed</li>"
             "</ul>"
         )
-        ctx["create_account_card_preview_url"] = (
-            f"{settings.STATIC_URL}img/v3/community-page/"
-            "community-create-account-preview.png"
+        ctx["create_account_card_preview_url"] = large_static(
+            "img/v3/community-page/community-create-account-preview.png"
         )
         now = timezone.now()
         ctx["recent_threads_url"] = (
@@ -509,8 +517,10 @@ def get_v3_context_data(self, **kwargs):
                 ],
                 "url": "https://www.example.com",
                 "label": "Learn more about Boost",
-                "image_src": f"{ settings.STATIC_URL }/img/v3/examples/Learn_Card_Image.png",
-                "mobile_image_src": f"{ settings.STATIC_URL }/img/v3/examples/Cheetah_Mobile.png",
+                "image_src": large_static("/img/v3/learn-page/learn-cheetah.png"),
+                "mobile_image_src": large_static(
+                    "/img/v3/learn-page/cheetah-mobile.png"
+                ),
             },
             {
                 "title": "I want to learn:",
@@ -525,8 +535,10 @@ def get_v3_context_data(self, **kwargs):
                 ],
                 "url": "https://www.example.com",
                 "label": "Learn more about Boost",
-                "image_src": f"{ settings.STATIC_URL}img/v3/examples/Learn_Octopus.png",
-                "mobile_image_src": f"{ settings.STATIC_URL }/img/v3/examples/Octopus_Mobile.png",
+                "image_src": large_static("img/v3/learn-page/learn-octopus.png"),
+                "mobile_image_src": large_static(
+                    "/img/v3/learn-page/octopus-mobile.png"
+                ),
             },
         ]
 
@@ -602,7 +614,7 @@ def get_v3_context_data(self, **kwargs):
             "primary_button_label": "View the Release Calendar",
             "secondary_button_url": "www.example.com",
             "secondary_button_label": "Secondary Button",
-            "image": f"{ settings.STATIC_URL }/img/v3/demo_page/Calendar.png",
+            "image": large_static("/img/v3/demo-page/calendar.png"),
         }
         ctx["info_card"] = {
             "title": "How we got here",
@@ -628,7 +640,7 @@ def get_v3_context_data(self, **kwargs):
                         "name": "Richard Thomson",
                         "role": "Contributor",
                         "show_badge": True,
-                        "avatar_url": "/static/img/v3/demo_page/Avatar.png",
+                        "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                     },
                 }
             ],
@@ -650,7 +662,7 @@ def get_v3_context_data(self, **kwargs):
                         "name": "Richard Thomson",
                         "role": "Contributor",
                         "show_badge": True,
-                        "avatar_url": "/static/img/v3/demo_page/Avatar.png",
+                        "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                     },
                 }
             ],
@@ -1768,8 +1780,8 @@ def get_context_data(self, **kwargs):
         context["create_account_card_preview_url"] = (
             f"{settings.STATIC_URL}img/checker.png"
         )
-        context["hero_background_image_url"] = (
-            f"{settings.STATIC_URL}img/v3/home-page/home-page-background.png"
+        context["hero_background_image_url"] = large_static(
+            "img/v3/home-page/home-page-background.png"
         )
         context["hero_legacy_image_url_light"] = (
             SharedResources.hero_legacy_image_url_light
@@ -1787,7 +1799,7 @@ def get_context_data(self, **kwargs):
             "primary_button_label": "Primary Button",
             "secondary_button_url": "www.example.com",
             "secondary_button_label": "Secondary Button",
-            "image": "/static/img/v3/demo_page/Calendar.png",
+            "image": large_static("img/v3/demo-page/calendar.png"),
         }
 
         context["horizontal_card_data"] = SharedResources.build_anything_with_boost
@@ -1875,8 +1887,8 @@ def get_context_data(self, **kwargs):
             ],
             "url": "https://www.example.com",
             "label": "Get started with Boost",
-            "image_src": f"{settings.STATIC_URL}img/v3/examples/Learn_Card_Image.png",
-            "mobile_image_src": f"{settings.STATIC_URL}img/v3/examples/Cheetah_Mobile.png",
+            "image_src": large_static("img/v3/learn-page/learn-cheetah.png"),
+            "mobile_image_src": large_static("img/v3/learn-page/cheetah-mobile.png"),
         }
 
         context["testimonial_data"] = {
@@ -1979,7 +1991,7 @@ def get_context_data(self, **kwargs):
                 "name": "John Doe",
                 "profile_url": "#",
                 "role": "Author",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.TIER_3,
                 "bio": "",
             },
@@ -2011,15 +2023,15 @@ def get_context_data(self, **kwargs):
                 "name": "Peter Dimov",
                 "profile_url": "#",
                 "role": "Maintainer",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.STAR_TIER_5,
                 "bio": "",
             },
             {
                 "name": "Vinnie Falco",
                 "profile_url": "#",
                 "role": "Author",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.BOOST_DAY,
                 "bio": "Boost Day contributor.",
             },
@@ -2030,7 +2042,7 @@ def get_context_data(self, **kwargs):
                 "name": "John Doe",
                 "profile_url": "#",
                 "role": "Author",
-                "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                 "badge": BadgeToken.TIER_3,
                 "bio": "",
             }
@@ -2059,18 +2071,16 @@ def get_context_data(self, **kwargs):
                 {
                     "name": "Vinnie Falco",
                     "role": "Author",
-                    "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
-                    "badge_url": (
-                        f"{settings.STATIC_URL}img/v3/badges/badge-first-place.png"
-                    ),
+                    "avatar_url": large_static("img/v3/demo-page/avatar.png"),
+                    "badge_url": large_static("img/v3/badges/badge-first-place.png"),
                     "badge": "",
                     "bio": "Big C++ fan. Not quite kidney-donation level, but close.",
                     "profile_url": "",
                 },
                 {
                     "name": "Alex Wells",
                     "role": "Contributor",
-                    "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
+                    "avatar_url": large_static("img/v3/demo-page/avatar.png"),
                     "badge_url": "",
                     "badge": "",
                     "bio": "C++ enthusiast who has worked at Intel and Microsoft.",
@@ -2079,8 +2089,8 @@ def get_context_data(self, **kwargs):
                 {
                     "name": "Dave Abrahams",
                     "role": "Contributor",
-                    "avatar_url": f"{settings.STATIC_URL}img/v3/demo_page/Avatar.png",
-                    "badge_url": f"{settings.STATIC_URL}img/v3/badges/badge-bronze.png",
+                    "avatar_url": large_static("img/v3/demo-page/avatar.png"),
+                    "badge_url": large_static("img/v3/badges/badge-bronze.png"),
                     "badge": "",
                     "bio": "Contributor to Boost since 2009.",
                     "profile_url": "",

libraries/models.py

@@ -18,6 +18,7 @@
 
 from config import settings
 from core.custom_model_fields import NullableFileField
+from core.templatetags.custom_static import large_static
 from core.markdown import process_md
 from core.models import RenderedContent
 from core.asciidoc import convert_adoc_to_html
@@ -549,7 +550,7 @@ def author_details(self):
             "name": author.display_name if author else "Unknown",
             "role": "Author",
             "avatar_url": author.get_avatar_url() if author else "",
-            "badge_url": f"{settings.STATIC_URL}img/v3/badges/badge-first-place.png",
+            "badge_url": large_static("img/v3/badges/badge-first-place.png"),
         }
 
     def get_cpp_standard_minimum_display(self):

templates/v3/community.html

@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% load static %}
+{% load static custom_static %}
 {% block title %}Boost Community{% endblock %}
 
 {% block css %}
@@ -9,7 +9,8 @@
 
 {% block main_content_wrapper %}<div class="community-v3">{% endblock %}
   {% block content %}
-    {% include "v3/includes/_hero_library.html" with title="A community built to help you go further" description="For newcomers and experienced engineers alike, Boost is a place to build real libraries, learn from experts and make contributions that matter." hero_image_url="/static/img/v3/community-page/community-foreground.png" %}
+    {% large_static "img/v3/community-page/community-foreground.png" as hero_image_url %}
+    {% include "v3/includes/_hero_library.html" with title="A community built to help you go further" description="For newcomers and experienced engineers alike, Boost is a place to build real libraries, learn from experts and make contributions that matter." hero_image_url=hero_image_url %}
     <div class="community-container">
       <div class="community-masonry">
         {% include "v3/includes/_help_card.html" with heading="What do you need help with?" items=help_options extra_classes="community-masonry__help" %}