Align release/3.0.0 branch with changes to develop.

CHANGELOG.md

@@ -26,6 +26,7 @@ All notable changes to this project will be documented in this file.
 - Refactored screen layout commands.
 - Moved list components (search and checkboxes) around.
 - Replaced lodash functions with native ones.
+- Aligned with v. 2.6.0.
 
 ### NB! Prior to 3.x the project was split into separate repositories
 

Taskfile.yml

@@ -227,4 +227,9 @@ tasks:
   fixtures:copy-assets:
     desc: "Copy the folder from fixtures/public/fixtures to public/fixtures. Rerun if fixtures are changed."
     cmds:
-      - task compose -- exec phpfpm cp -r fixtures/public/fixtures public/fixtures
+      - task compose -- exec phpfpm cp -r fixtures/public/fixtures public/
+
+  assets:build:
+    desc: "Build the assets."
+    cmds:
+      - task compose -- run --rm node npm run build

assets/admin/components/feed-sources/feed-source-form.jsx

@@ -13,6 +13,7 @@ import EventDatabaseApiFeedType from "./templates/event-database-feed-type";
 import ColiboFeedType from "./templates/colibo-feed-type";
 import StickyFooter from "../util/sticky-footer";
 import EventDatabaseApiV2FeedType from "./templates/event-database-v2-feed-type";
+import BrndFeedType from "./templates/brnd-feed-type.jsx";
 
 /**
  * The feed-source form component.
@@ -124,6 +125,14 @@ function FeedSourceForm({
                   feedSourceId={feedSource["@id"]}
                 />
               )}
+              {feedSource?.feedType === "App\\Feed\\BrndFeedType" && (
+                <BrndFeedType
+                  handleInput={handleSecretInput}
+                  formStateObject={feedSource.secrets}
+                  mode={mode}
+                  feedSourceId={feedSource["@id"]}
+                />
+              )}
               {feedSource?.feedType ===
                 "App\\Feed\\EventDatabaseApiFeedType" && (
                 <EventDatabaseApiFeedType

assets/admin/components/feed-sources/templates/brnd-feed-type.jsx

@@ -0,0 +1,50 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import FormInput from "../../util/forms/form-input";
+
+const BrndFeedType = ({ handleInput, formStateObject, mode }) => {
+  const { t } = useTranslation("common", {
+    keyPrefix: "brnd-feed-type",
+  });
+
+  return (
+    <>
+      <FormInput
+        name="api_base_uri"
+        type="text"
+        label={t("api-base-uri")}
+        className="mb-2"
+        onChange={handleInput}
+        placeholder={
+          mode === "PUT" ? t("redacted-value-input-placeholder") : ""
+        }
+        value={formStateObject?.api_base_uri}
+      />
+
+      <FormInput
+        name="company_id"
+        type="text"
+        className="mb-2"
+        label={t("company-id")}
+        onChange={handleInput}
+        placeholder={
+          mode === "PUT" ? t("redacted-value-input-placeholder") : ""
+        }
+        value={formStateObject?.company_id}
+      />
+
+      <FormInput
+        name="api_auth_key"
+        type="text"
+        label={t("api-auth-key")}
+        onChange={handleInput}
+        placeholder={
+          mode === "PUT" ? t("redacted-value-input-placeholder") : ""
+        }
+        value={formStateObject?.api_auth_key}
+      />
+    </>
+  );
+};
+
+export default BrndFeedType;

assets/admin/translations/da/common.json

@@ -285,6 +285,9 @@
     "colibo-feed-type": {
       "title": "Colibo"
     },
+    "brnd-feed-type": {
+      "title": "BRND"
+    },
     "dynamic-fields": {
       "event-database-api-feed-type": {
         "title": "Eventdatabase API",
@@ -1158,6 +1161,14 @@
     "save-before-recipients-can-be-set": "Bemærk! Datakilden skal gemmes før der kan tilkobles tilladte modtagergrupper. Gem og åbn datakilden igen.",
     "allowed-recipients-help": "Det er kun disse modtagergrupper, der vil være tilgængelige, når man opretter et slide, der bruger datakilden."
   },
+  "brnd-feed-type": {
+    "title": "BRND feed",
+    "api-base-uri": "API Base URI",
+    "company-id": "Company ID",
+    "api-auth-key": "API Auth Key",
+    "values-info": "Værdierne Company ID og API Auth Key udleveres af BRND. Ret henvendelse til BRND support.",
+    "redacted-value-input-placeholder": "Skjult værdi"
+  },
   "event-database-api-v2-feed-type": {
     "title": "Event databasen v.2",
     "host": "Host",

assets/shared/templates/brnd.json

@@ -0,0 +1,109 @@
+{
+  "title": "BRND sportcenter dagsprogram",
+  "id": "01K8TNT13XVCYYPXBJBBJVFENS",
+  "options": {},
+  "adminForm": [
+    {
+      "key": "brnd-form-1",
+      "input": "header",
+      "text": "Skabelon: BRND",
+      "name": "header1",
+      "formGroupClasses": "h4 mb-3"
+    },
+    {
+      "key": "brnd-form-2",
+      "input": "header-h3",
+      "text": "Opsæt feed",
+      "name": "header2",
+      "formGroupClasses": "h5 mb-3"
+    },
+    {
+      "key": "brnd-form-3",
+      "input": "feed",
+      "text": "Opsæt feed",
+      "name": "feed",
+      "supportedFeedOutputType": "brnd-booking",
+      "formGroupClasses": "mb-3"
+    },
+    {
+      "key": "brnd-form-4",
+      "input": "header-h3",
+      "text": "Konfigurér slide",
+      "name": "header2",
+      "formGroupClasses": "h5 mb-3"
+    },
+    {
+      "key": "calendar-form-layout",
+      "input": "select",
+      "name": "layout",
+      "label": "Vælg layout",
+      "required": true,
+      "formGroupClasses": "col-md-6 mb-3",
+      "options": [
+        {
+          "key": "layout1",
+          "title": "Sportcenter Dagsprogram",
+          "value": "sportcenter-today"
+        }
+      ]
+    },
+    {
+      "key": "brnd-form-form-14",
+      "input": "select",
+      "required": true,
+      "label": "Tekststørrelse",
+      "formGroupClasses": "col-md-6 mb-3",
+      "options": [
+        {
+          "key": "fontsize1",
+          "title": "xs",
+          "value": "font-size-xs"
+        },
+        {
+          "key": "fontsize2",
+          "title": "s",
+          "value": "font-size-s"
+        },
+        {
+          "key": "fontsize3",
+          "title": "m",
+          "value": "font-size-m"
+        },
+        {
+          "key": "fontsize4",
+          "title": "l",
+          "value": "font-size-lg"
+        },
+        {
+          "key": "fontsize5",
+          "title": "xl",
+          "value": "font-size-xl"
+        }
+      ],
+      "name": "fontSize"
+    },
+    {
+      "key": "brnd-form-title",
+      "input": "input",
+      "name": "title",
+      "type": "text",
+      "label": "Overskrift",
+      "helpText": "Her kan du skrive overskrift.",
+      "formGroupClasses": "col-md-6"
+    },
+    {
+      "key": "brnd-form-image",
+      "multipleImages": false,
+      "input": "image",
+      "name": "image",
+      "label": "Baggrundsbillede"
+    },
+    {
+      "key": "form-media-contain",
+      "input": "checkbox",
+      "name": "mediaContain",
+      "label": "Deaktivér billedbeskæring",
+      "helpText": "Billedet vil blive vist ubeskåret med tomme områder omkring"
+    }
+  ]
+}

assets/shared/templates/brnd.jsx

@@ -0,0 +1,115 @@
+import React, { useEffect, Fragment, useState } from "react";
+import dayjs from "dayjs";
+import localizedFormat from "dayjs/plugin/localizedFormat";
+import { FormattedMessage, IntlProvider } from "react-intl";
+import BaseSlideExecution from "../slide-utils/base-slide-execution";
+import da from "./brnd/lang/da.json";
+import {
+  getFirstMediaUrlFromField,
+  ThemeStyles,
+} from "../slide-utils/slide-util";
+import BrndSportcenterToday from "./brnd/brnd-sportcenter-today";
+import GlobalStyles from "../slide-utils/GlobalStyles";
+import "./brnd/brnd.scss";
+import templateConfig from "./brnd.json";
+
+function id() {
+  return templateConfig.id;
+}
+
+function config() {
+  return templateConfig;
+}
+
+function renderSlide(slide, run, slideDone) {
+  return (
+    <Brnd
+      slide={slide}
+      run={run}
+      slideDone={slideDone}
+      content={slide.content}
+      executionId={slide.executionId}
+    />
+  );
+}
+
+/**
+ * Brnd component.
+ *
+ * @param {object} props Props.
+ * @param {object} props.slide The slide.
+ * @param {object} props.content The slide content.
+ * @param {string} props.run Whether or not the slide should start running.
+ * @param {Function} props.slideDone Function to invoke when the slide is done playing.
+ * @param {string} props.executionId Unique id for the instance.
+ * @returns {JSX.Element} The component.
+ */
+function Brnd({ slide, content, run, slideDone, executionId }) {
+  const [translations, setTranslations] = useState();
+
+  const {
+    layout = "sportcenter-today",
+    duration = 15000,
+    fontSize,
+    resourceUnavailableText,
+  } = content;
+  const { feedData = [] } = slide;
+
+  const classes = ["template-brnd", fontSize];
+  const rootStyle = {};
+
+  const imageUrl = getFirstMediaUrlFromField(slide.mediaData, content.image);
+
+  if (imageUrl) {
+    rootStyle["--bg-image"] = `url("${imageUrl}")`;
+  }
+
+  /** Setup slide run function. */
+  const slideExecution = new BaseSlideExecution(slide, slideDone);
+  useEffect(() => {
+    if (run) {
+      slideExecution.start(duration);
+    }
+
+    return function cleanup() {
+      slideExecution.stop();
+    };
+  }, [run]);
+
+  /** Imports language strings, sets localized formats. */
+  useEffect(() => {
+    dayjs.extend(localizedFormat);
+
+    setTranslations(da);
+  }, []);
+
+  const getTitle = (eventTitle) => {
+    if (!eventTitle || eventTitle === "") {
+      if (resourceUnavailableText) {
+        return resourceUnavailableText;
+      }
+      return <FormattedMessage id="unavailable" defaultMessage="Unavailable" />;
+    }
+    return eventTitle;
+  };
+
+  return (
+    <>
+      <IntlProvider messages={translations} locale="da" defaultLocale="da">
+        {layout === "sportcenter-today" && (
+          <BrndSportcenterToday
+            bookings={feedData.bookings}
+            content={content}
+            templateClasses={classes}
+            templateRootStyle={rootStyle}
+            getTitle={getTitle}
+          />
+        )}
+      </IntlProvider>
+      <ThemeStyles id={executionId} css={slide?.theme?.cssStyles} />
+      <GlobalStyles />
+    </>
+  );
+}
+
+export default { id, config, renderSlide };