Merge pull request #439 from GenderedIntelligence/add-image-to-news

Add image to news
geeksforsocialchange · Oct 7, 2024 · 519dfc5 · 519dfc5
2 parents 10a253a + b4ca3d4
commit 519dfc5
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 70 deletions.
diff --git a/app/Route/News/NewsItem_.elm b/app/Route/News/NewsItem_.elm
@@ -72,7 +72,7 @@ view :
     RouteBuilder.App Data ActionData RouteParams
     -> Shared.Model
     -> View.View (PagesMsg.PagesMsg Msg)
-view app shared =
+view app _ =
     let
         article =
             Data.PlaceCal.Articles.articleFromSlug app.routeParams.newsItem app.sharedData.articles app.sharedData.partners

diff --git a/src/Data/PlaceCal/Articles.elm b/src/Data/PlaceCal/Articles.elm
@@ -1,7 +1,9 @@
 module Data.PlaceCal.Articles exposing (Article, articleFromSlug, articlesData, replacePartnerIdWithName)
 
+import Array
 import BackendTask
 import BackendTask.Custom
+import Copy.Text exposing (isValidUrl)
 import Data.PlaceCal.Api
 import Data.PlaceCal.Partners
 import FatalError
@@ -18,7 +20,7 @@ type alias Article =
     , body : String
     , publishedDatetime : Time.Posix
     , partnerIds : List String
-    , maybeImage : Maybe String
+    , imageSrc : String
     }
 
 
@@ -28,7 +30,7 @@ emptyArticle =
     , body = ""
     , publishedDatetime = Time.millisToPosix 0
     , partnerIds = []
-    , maybeImage = Nothing
+    , imageSrc = "/images/news/article_1.jpg"
     }
 
 
@@ -71,7 +73,7 @@ articlesDecoder =
 
 decode : Json.Decode.Decoder Article
 decode =
-    Json.Decode.succeed Article
+    (Json.Decode.succeed Article
         |> Json.Decode.Pipeline.requiredAt [ "node", "headline" ]
             Json.Decode.string
         |> Json.Decode.Pipeline.requiredAt [ "node", "articleBody" ]
@@ -81,8 +83,10 @@ decode =
         |> Json.Decode.Pipeline.requiredAt [ "node", "providers" ]
             (Json.Decode.list partnerIdDecoder)
         |> Json.Decode.Pipeline.optionalAt [ "node", "image" ]
-            (Json.Decode.nullable Json.Decode.string)
-            Nothing
+            Json.Decode.string
+            ""
+    )
+        |> Json.Decode.andThen (\article -> addStockImage article)
 
 
 partnerIdDecoder : Json.Decode.Decoder String
@@ -109,6 +113,38 @@ replacePartnerIdWithName articleData partnerData =
         articleData
 
 
+addStockImage article =
+    Json.Decode.succeed
+        { article
+            | imageSrc =
+                if isValidUrl article.imageSrc then
+                    article.imageSrc
+
+                else
+                    pickImageFromArticleLength (String.length article.body)
+        }
+
+
+pickImageFromArticleLength : Int -> String
+pickImageFromArticleLength articleLength =
+    Array.get
+        (modBy
+            (List.length stockImages)
+            articleLength
+        )
+        (Array.fromList stockImages)
+        |> Maybe.withDefault "/images/news/article_1.jpg"
+
+
+stockImages : List String
+stockImages =
+    List.map
+        (\id ->
+            "/images/news/article_" ++ String.fromInt id ++ ".jpg"
+        )
+        [ 1, 2, 3, 4, 5, 6 ]
+
+
 articleFromSlug : String -> List Article -> List Data.PlaceCal.Partners.Partner -> Article
 articleFromSlug slug allArticles allPartners =
     List.filter

diff --git a/src/Theme/NewsItemPage.elm b/src/Theme/NewsItemPage.elm
@@ -1,18 +1,12 @@
-module Theme.NewsItemPage exposing (articleImageSource, viewArticle)
+module Theme.NewsItemPage exposing (viewArticle)
 
-import Array
-import Copy.Keys exposing (Key(..))
-import Copy.Text exposing (isValidUrl, t)
 import Css exposing (Style, after, auto, batch, block, bold, borderRadius, center, display, firstChild, fontSize, fontWeight, height, margin, margin2, margin4, marginTop, maxWidth, pct, property, px, rem, textAlign, width)
 import Css.Global exposing (descendants, typeSelector)
 import Data.PlaceCal.Articles
-import Data.PlaceCal.Partners
 import Helpers.TransDate as TransDate
-import Helpers.TransRoutes as TransRoutes exposing (Route(..))
 import Html.Styled exposing (Html, article, div, figure, img, p, span, text, time)
 import Html.Styled.Attributes exposing (alt, css, src)
-import Shared
-import Theme.Global exposing (viewBackButton, withMediaSmallDesktopUp, withMediaTabletLandscapeUp, withMediaTabletPortraitUp)
+import Theme.Global exposing (withMediaSmallDesktopUp, withMediaTabletLandscapeUp, withMediaTabletPortraitUp)
 import Theme.TransMarkdown as TransMarkdown
 
 
@@ -28,60 +22,15 @@ viewArticle newsItem =
                 text ""
             , time [] [ text (TransDate.humanDateFromPosix newsItem.publishedDatetime) ]
             ]
-        , articleImage newsItem.maybeImage newsItem.body
+        , articleImage newsItem.imageSrc
         , div [ css [ articleContentStyle ] ] (TransMarkdown.markdownToHtml newsItem.body)
         ]
 
 
-articleImage : Maybe String -> String -> Html msg
-articleImage maybeImage articleBody =
+articleImage : String -> Html msg
+articleImage imageSrc =
     figure [ css [ articleFigureStyle ] ]
-        [ img [ src (articleImageSource maybeImage articleBody), css [ articleFigureImageStyle ], alt "" ] []
-        ]
-
-
-articleImageSource : Maybe String -> String -> String
-articleImageSource maybeImage articleBody =
-    let
-        defaultImageUrl =
-            Maybe.withDefault
-                "/images/news/article_1.jpg"
-                (Array.get
-                    (modBy
-                        (Array.length defaultNewsImages)
-                        (String.length articleBody)
-                    )
-                    defaultNewsImages
-                )
-    in
-    case maybeImage of
-        Just imageUrl ->
-            if isValidUrl imageUrl then
-                imageUrl
-
-            else
-                defaultImageUrl
-
-        Nothing ->
-            defaultImageUrl
-
-
-defaultNewsImages : Array.Array String
-defaultNewsImages =
-    Array.fromList
-        [ "/images/news/article_1.jpg"
-        , "/images/news/article_2.jpg"
-        , "/images/news/article_3.jpg"
-        , "/images/news/article_4.jpg"
-        , "/images/news/article_5.jpg"
-        , "/images/news/article_6.jpg"
-        ]
-
-
-viewPagination : Html msg
-viewPagination =
-    div []
-        [ viewBackButton (TransRoutes.toAbsoluteUrl News) (t NewsItemReturnButton)
+        [ img [ src imageSrc, css [ articleFigureImageStyle ], alt "" ] []
         ]
 
 

diff --git a/src/Theme/NewsPage.elm b/src/Theme/NewsPage.elm
@@ -1,4 +1,4 @@
-module Theme.NewsPage exposing (viewNewsList)
+module Theme.NewsPage exposing (viewNewsArticle, viewNewsList)
 
 import Copy.Keys exposing (Key(..))
 import Copy.Text exposing (t)
@@ -8,9 +8,7 @@ import Helpers.TransDate as TransDate
 import Helpers.TransRoutes as TransRoutes exposing (Route(..))
 import Html.Styled exposing (Html, a, article, div, h3, img, li, p, section, span, text, time, ul)
 import Html.Styled.Attributes exposing (alt, css, href, src)
-import Shared
 import Theme.Global exposing (buttonFloatingWrapperStyle, darkBlueBackgroundStyle, linkStyle, pinkButtonOnLightBackgroundStyle, withMediaSmallDesktopUp, withMediaTabletLandscapeUp, withMediaTabletPortraitUp)
-import Theme.NewsItemPage
 
 
 viewNewsList : List Data.PlaceCal.Articles.Article -> Html msg
@@ -33,7 +31,7 @@ viewNewsItem newsItem =
 viewNewsArticle : Data.PlaceCal.Articles.Article -> Html msg
 viewNewsArticle newsItem =
     article [ css [ newsItemArticleStyle ] ]
-        [ newsArticleImage newsItem.maybeImage newsItem.body
+        [ newsArticleImage newsItem.imageSrc
         , div [ css [ newsItemInfoStyle ] ]
             [ h3 [ css [ newsItemTitleStyle ] ]
                 [ a
@@ -76,10 +74,10 @@ summaryFromArticleBody articleBody =
         |> String.join " "
 
 
-newsArticleImage : Maybe String -> String -> Html msg
-newsArticleImage maybeImage articleBody =
+newsArticleImage : String -> Html msg
+newsArticleImage imageSrc =
     img
-        [ src (Theme.NewsItemPage.articleImageSource maybeImage articleBody)
+        [ src imageSrc
         , css [ newsImageStyle ]
         , alt ""
         ]