Merge branch 'main' into add-documentation-content-search-help

Author: likp

docs/PxWeb2/documentation/customization.md

@@ -229,6 +229,14 @@ Replace the font files in the `fonts` directory. Keep file names.
 
 Make sure you have the proper license to self-host fonts.
 
+### Change logo and favicon
+To change the logo/favicon in PxWeb replace svgs in the image folder. The names must be the same.
+
+For image replace `images/logo.svg` with your own logo.
+Replace `images/favicon.ico` / `images/favicon-darkmode.svg` with your own favicon.
+
+The svg **must** include viewbox and width/height attributes for it to be rendered correctly.
+
 ### Adjust or fix text / translations
 
 Edit the relevant `locales/<lang>/translation.json`.  
@@ -248,6 +256,69 @@ Keys reflect where in the UI a string is used. Only modify values.
     }  
     ```
 
+### Change date format in translation file
+
+Edit the relevant `locales/<lang>/translation.json` file.  
+We have two date formats defined under `date` in translation files - `simple_date` and `simple_date_with_time`. 
+
+Change the format options as needed. **PxWeb2** uses `Intl.DateTimeFormat` for date formatting. See documentation for options here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+
+Here is an examples configuration used for english and norwegian:
+
+??? tip "english date formats"
+    ```json
+    "date": {
+      "simple_date": "{{value, datetime}}",
+      "simple_date_with_time": "{{value, datetime(year: 'numeric'; month: 'numeric'; day: 'numeric'; hour: 'numeric'; minute: 'numeric')}}"
+    }
+    ``` 
+
+Example of how `simple_date_with_time` for english is displayed in PxWeb2 UI:
+`2/21/2025, 8:00 AM`
+
+??? tip "norwegian date formats"
+    ```json
+    "date": {
+      "simple_date": "{{value, datetime(day: '2-digit'; month: '2-digit'; year: 'numeric')}}",
+      "simple_date_with_time": "{{value, datetime(year: 'numeric'; month: '2-digit'; day: '2-digit'; hour: 'numeric'; minute: 'numeric')}}"
+    }
+    ```
+
+Example of how `simple_date_with_time` for norwegian is displayed with two digit configuration in PxWeb2 UI:
+`21.02.2025, 08:00`
+
+### Override separators in number formatting per language
+Edit the relevant `locales/<lang>/translation.json` file.
+We have defined multiple number formatting rules under `number` in translation files. Here are some expamples of number formats that are used:
+
+??? tip "number formats"
+    ```json
+    "number": {
+        "simple_number": "{{value, pxNumber}}",
+        "simple_number_with_zero_decimal": "{{value, pxNumber(minimumFractionDigits: 0; maximumFractionDigits: 0;)}}",
+        "simple_number_with_one_decimal": "{{value, pxNumber(minimumFractionDigits: 1; maximumFractionDigits: 1;)}}",
+        "simple_number_with_two_decimals": "{{value, pxNumber(minimumFractionDigits: 2; maximumFractionDigits: 2;)}}",
+      }
+    ```
+
+- `simple_number`: Default number formatting.
+- `simple_number_with_zero_decimal`: Number formatting with no decimal places.
+- `simple_number_with_one_decimal`: Number formatting with one decimal place.
+- `simple_number_with_two_decimals`: Number formatting with two decimal places.
+
+The group and decimal separators are determined by the language locale. However, if you want to customize the number formatting further, you can add additional options to the `pxNumber` formatter.
+
+To override decimal add `decimalSeparator` to the `number_format` object. Likewise, to override group separator add `thousandSeparator` to the `number_format` object.
+
+If you need to add space as a group separator, you add the value `nbsp` for non-breaking space or `nnbsp` for narrow non-breaking space, e.g. `thousandSeparator: 'nbsp'`.
+
+Here is an example of how to override both decimal and group separators for simple_number_with_two_decimals. Use `,` as decimal separator and non-breaking space as group separator:
+```json
+"number": {
+    "simple_number_with_two_decimals": "{{value, pxNumber(minimumFractionDigits: 2; maximumFractionDigits: 2; decimalSeparator: ','; thousandSeparator: 'nbsp';)}}",
+  }
+```
+
 ### Hide or show the default language in the URL
 
 Toggle:
@@ -354,15 +425,50 @@ root/content
     "detailsSection": {
       "enabled": true,
       "detailHeader": "More about PxWeb",
-      "detailContent": []
+      "detailContent": [
+                {
+          "textBlock": {
+            "header": "When to use this section",
+            "text": "This is an optional section that can be used for content that may be useful for some users, but is not essential for everyone. Key information that all users need to see should always appear in the lead paragraph."
+          }
+        },
+        {
+          "links": {
+            "header": "Useful resources",
+            "items": [
+              {
+                "text": "Example link 1",
+                "url": "#"
+              },
+              {
+                "text": "Example link 2 (open in new tab)",
+                "url": "#",
+                "openInNewTab": true
+              }
+            ]
+          }
+        }
+      ]
     },
     "noResultSearchHelp": {
       "enabled": true,
       "helpText": []
     }
   },
   "footer": {
-    "columns": []
+    "columns": [
+      {
+        "header": "This is a header",
+          "links": [
+            {
+              "text": "Link text",
+              "url": "https://your.link.here",
+              "external": true
+            },
+            { "text": "Contact us", "url": "mailto:[email protected]" }
+          ]
+      }
+    ]
   }
 }
 ```
@@ -374,14 +480,16 @@ root/content
   `enabled` is `true`, the application renders the **`DetailsSection` component**.
   This section can contain multiple entries, and each entry may be either a
   `textBlock` (with `header` and `text`) or a `links` block (with `header` and a
-  list of `items`).
+  list of `items`). Links described in `items` have `text`, `url`, and an optional
+  `openInNewTab` boolean. If `openInNewTab` is `true`, the link opens in a new
+  browser tab.
 - **startPage.noResultSearchHelp** – Optional section displayed below
   the “no results” message when no tables match the search or filters.
   When `enabled` is `true`, each string in the `helpText` array is shown
   as a separate list item under a help heading.
 
 - **footer**
-  One or more footer columns with `header` and list of `links`.
+  One or more footer columns with `header` and list of `links`. If links have `external` set to `true`, they automatically will have the icon for external links and will open in a new tab. See example above.
 
   This setup allows administrators to adjust localized content (text and links)
   for each language without modifying the application code.

docs/PxWeb2/documentation/installation-on-iis.md

@@ -1,11 +1,12 @@
-# Install PxWebApi 2.0 on your IIS server
+# Install PxWeb 2 on your IIS server
 
-This instruction guides you in how to install PxWeb 2.0 on IIS.
+This instruction guides you in how to install PxWeb 2 on IIS.
 
 ## Prerequisites
 
 - A supported Windows server with IIS installed.
-- ApiUrl to your PxWebapi2 installation.
+- The [URL Rewrite module](https://www.iis.net/downloads/microsoft/url-rewrite) must be installed on your IIS.
+- ApiUrl to your PxWebApi 2 installation.
   If your tables endpoint is at `https://your.api.server/PxWeb/api/v2/tables`
   then your ApiUrl is `https://your.api.server/PxWeb/api/v2`  (omit a trailing slash, one is added automatically)
 
@@ -14,23 +15,53 @@ This instruction guides you in how to install PxWeb 2.0 on IIS.
 1. Download the [zip file for the latest release](https://github.com/pxtools/PxWeb2/releases/latest) from GitHub.
   It is found inside the Asserts heading.
   Make sure to _Unblock_ it if its block by right clicking on it in _File Explorer_ and check the `Unblock` checkbox.
-1. Put the contents of the zip file to the location of your choice. E.g `C:\inetpub\wwwroot\pxweb2`.
-1. Adjust `baseApplicationPath` and `apiUrl` in `config\config.js`:
+2. Put the contents of the zip file to the location of your choice. E.g `C:\inetpub\wwwroot\pxweb2`.
+3. Adjust `baseApplicationPath` and `apiUrl` in `config\config.js`:
 
     ```js
     baseApplicationPath: "/pxweb2/"
 
     apiUrl: "your api url"
     ```
 
-1. In `index.html`, adjust the `<base>` tag:
+4. In `index.html`, adjust the `<base>` tag:
 
     ```html
     <base href="/pxweb2/">
     ```
 
-1. I didnt need this: Ensure the web server rewrites (if needed) static file requests correctly to that subpath.
+5. In `web.config`, adjust the `Content-Security-Policy` to allow calls to your PxWebApi 2 installation. Within the `Content-Security-Policy` replace the text `https://enter-your-api-domain-here` with the domain of your PxWebApi (for example https://api.scb.se):
 
-1. In IIS find the folder and convert it to application. ( Concider using a separate Application pool for this :-) )
+    ```html
+    <add name="Content-Security-Policy" value="default-src 'self'; connect-src 'self' https://api.scb.se; script-src 'self'" />
+    ```
+
+1. In IIS find the folder and convert it to an application. (Consider using a separate Application pool for this)
 
 1. Open "http(s)://"server adress"/pxweb2 .
+
+## Troubleshooting
+
+### Problem running PxWeb on localhost
+
+If you are trying to run PxWeb directly on the server under localhost you might get an error looking like this in the console of your browser:
+
+  ```
+  Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".
+  ```
+
+#### Solution
+
+Change localhost in the URL to the computer name of the server.
+
+### PxWeb refuses to connect to PxWebApi
+
+If you get an error message looking like this in the console of your browser:
+
+  ```
+  Refused to connect to 'https://your-api-url' because it violates the following Content Security Policy directive: "connect-src 'self' https://enter-your-api-domain-here".
+  ```
+
+#### Solution
+
+You need to enter the domain of your PxWebApi in the Content Security Policy section in web.config, see step 5 of the installation steps above.

docs/PxWeb2/project/Solution.md

@@ -1,5 +1,5 @@
 # PxWeb solution
-In this project, we have made some choices about how we will work in the project across two countries, in order to create opportunities for other countries to contribute in the long term with both development and user testing of PxWeb 2.0. In addition, we have made some choices to find the best solution for installing PxWeb. All this to reach the main goal to create a user-friendly PxWeb.
+In the project, we have made some choices about how we will work in the project across two countries, in order to create opportunities for other countries to contribute in the long term with both development and user testing of PxWeb 2.0. In addition, we have made some choices to find the best solution for installing PxWeb. All this to reach the main goal to create a user-friendly PxWeb.
 ## WCAG and Search Engine Optimization (SEO)
 - The new interface will follow the rules for A and AA in [WCAG 2.1](https://www.w3.org/TR/WCAG21/)
 - SEO is the use of methods that achieve better visibility or "ranking" on search engines result page.
@@ -15,7 +15,7 @@ It will be possible to change
 - corner radius of the elements in the interface.
 ## Open source at GitHub
 The new interface will be able do install directly from GitHub. Also documentation will be found here. 
-[PxTools at GitHub](https://github.com/pxtools)
+[PxTools at GitHub](https://www.pxtools.net/documentation/overview/)
 ## Usertest
 We are following the UX design process in this project.
 ![The Ux design process](https://github.com/PxTools/PxWeb2/assets/81364833/8534bfdb-1d0c-49ef-8f2b-5b59357a37bf)

docs/PxWeb2/project/overview.md

@@ -1,45 +1,25 @@
-# Project overview
+# Introduction to PxWeb
 ## Background
-The user interface in PxWeb can no longer be further developed effectively due to technological limitations, while the users needs and expectations are constantly changing. Statistics Sweden and Statistics Norway will therefore together create a new user interface based on PxWebApi 2.0
-
-## New user interface for PxWeb
-- PxWebApi 2.0 Beta was released i March 
-- The API gives us the opportunity to make a new user interface for PxWeb on a new technical platform
-- The project is a cooperation between Statistics Sweden and Statistics Norway
-
-## Two project goals
-- The project will work on a new userfriendly interface based on PxWebApi 2.0 during 2024 - 2025 with the launch of the first test-version in mid-2024
-
-- The project will test and establish good and sustained collaboration processes between SCB and SSB at both operational level and management level in the further development of PX-tools
-
-
+PxWeb is an application for disseminating statistics in dynamic tables from an SQL or file-based database on the web. The user interface in the current version of PxWeb could no longer be effectively developed due to technological limitations, and users needs and expectations are constantly changing so Statistics Sweden and Statistics Norway jointly initiated a project in January 2024. The aim of the project was to create a new user interface based on PxWebApi 2 and was released in its first version in October 2025.
+## Two goals of the Project (January 2024 - October 2025)
+The project had two goals
+- A new user-friendly interface for PxWeb based on PxWebApi 2 
+- Test and establish effective and sustainable collaboration processes between Statistics Sweden, SCB and Statistics Norway, SSB at both operational level and management level in the further development of PX-tools
 ## Organization 
-
 ### Steering group
-The steering group consists of managers at Communication and IT in SCB and SSB. 
-
+The steering group consist of managers at Communication and IT in SCB and SSB. 
 ### Project team
-The team has participants from both Statistics Sweden and Statistics Norway.
+The team had participants from both Statistics Sweden and Statistics Norway.
 The team is set up with
 - Project leader
 - Scrum master
 - Architects
-- Designer (UX and UI)
+- UX/UI Designer
 - Developers
 - Specialists
-- Tech lead
+- Technical lead
 - Test leader 
 - Testers 
-  
-### Cooperation
-The other Nordic countries will be involved in tessting and participate at the demos.
-
-## Contact for questions and comments
-Project leader: Kristin Glomsås, Statistics Norway [[email protected]](mailto:[email protected])
-
-Scrum master: Åsa Arrhén, Statistics Sweden [[email protected]](mailto:[email protected])
-
-
-
-
-
+  ## Contact for questions and comments
+Kristin Glomsås, Statistics Norway [[email protected]](mailto:[email protected])
+Åsa Arrhén, Statistics Sweden [[email protected]](mailto:[email protected])

docs/PxWeb2/project/plans.md

@@ -1,30 +1,40 @@
 # Plans
 
-The project launched two test versions in June and December 2024 and from then and on the new interface of PxWeb 2.0 is updated every third Monday after the demo. 
-The goal is to deliver a version of PxWeb 2.0 based on PxWebApi 2.0 during September 2025.
-
-## PxWebApi 2.0 Release end of August 2025
-- Follows JSON-stat2 format
-- Save to file
-- Saved query
-- Pivot
+## Remaining to develop 2025 
+- Show PxWebApi 2 in PxWeb
+- Button to improve table layout
+- Freeze table head
+- Improve search at start page (search for content in tables)
+- Search in beginning of words in variable list
+- Hide empty rows from table
+- Chose to show code or text
+- Manual pivoting
+- Possibility for text and links in Help 
+- Possibility for own link in logo
+- WCAG-fixes
+- Saved query as alternative to the algorithm (documentation)
+
+## Remaining to develop after 2025 in PxWeb 2
+- Graph
+- Hierarchy
+- Sort order
+- Sum
+- more...
 
-## PxWeb 2.0 Release end of September 2025 
+## PxWeb 2 Release October 2025 
 - Startpage
 - Save to file
 - Saved query
 - URL and breadcrumb
-- Saved queary as alternative to the algorithm
 - Pivoting
 - Head and footer
-- Show PxWebApi 2.0
 
-## Remaining to develop after September 2025 in PxWeb 2.0
-- Graph
-- code/text
-- Hierarchy
-- Sort order
-- Sum
+## PxWebApi 2.0 Release September 2025
+- Follows JSON-stat2 format
+- Save to file
+- Saved query
+- Pivot
+
 ------------------------------------------------------------------------------------------- 
 ## PxWeb 2.0 testversion December 2024
 - Comprehensible table at first glance - Using an algorithm to show an understandable table the first time you look at it

docs/PxWeb2/project/process.md

@@ -1,4 +1,4 @@
-# Scrum process 
+# Process in the project (January 2024 - October 2025)
 - The project group work in sprints of three weeks.
 - The group follow the scrum rituals with sprintplanning, refinement, retro and daily stand-up.
 - The sprints end with a demo (sprint review) on Monday every third week at twelve o'clock.

docs/PxWeb2/project/try.md

@@ -1,11 +1,13 @@
-# Follow the development of PxWeb 2.0
-The new interface is updated every third Monday after the demo. Follow the development on these pages.
-## Tables from the Swedish database
-- [Table638](https://test.pxweb2.pages.dev/sv/table/tab638)
-- [Table5737](https://test.pxweb2.pages.dev/sv/table/TAB5737)
-- [Table4246](https://test.pxweb2.pages.dev/sv/table/TAB4246)
+# Follow the development of PxWeb 2
+
+## Tables from Statistics Sweden database
+- [Database from Statistics Sweden](https://test.pxweb2.pages.dev/sv/)
+  
+## Tables from Statistics Norway database
+- [Database from Statistics Norway](https://test-ssb.pxweb2.pages.dev/no/)
 
 ## Try it with your own data
-You are free to test the database with your own data. It works both with px-files and cnmm database
-[How to make a local installation](../documentation/docker.md)
+You are free to test PxWeb2 with your own data. It works both with px-files and cnmm database
+- [Read the documentation](https://www.pxtools.net/documentation/overview/)
+
 

docs/PxWebApi/documentation/configuration.md

@@ -1,4 +1,4 @@
-# Configuring PxWebApi 2.0
+# Configuring PxWebApi 2
 The configuration is split into several different files, each with a specific purpose. The main file you will need to modify is `appsettings.json`.
 
 ## appsettings.json