Merge pull request #3 from Dataport/github-pages

add github pages workflow and scripts
Dataport · Nov 8, 2023 · 5e958df · 5e958df
2 parents 5ef9026 + 600483e
commit 5e958df
Show file tree

Hide file tree

Showing 9 changed files with 178 additions and 3 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -6,4 +6,5 @@
 **/docs
 **/node_modules
 **/tests_output
+pages_output
 *.d.ts
diff --git a/.github/workflows/publish-pages.yml b/.github/workflows/publish-pages.yml
@@ -0,0 +1,23 @@
+name: Publish pages folder to gh-pages
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18.13.0
+          registry-url: https://registry.npmjs.org/
+      - run: npm i --ci
+      - run: npm run buildPages
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./pages_output
diff --git a/.gitignore b/.gitignore
@@ -7,6 +7,7 @@
 **/docs
 **/node_modules
 /public
+/pages_output
 **/tests_output
 /*.log
 logs/*.log

diff --git a/package.json b/package.json
@@ -9,6 +9,7 @@
     "npm": "^8.19.3"
   },
   "scripts": {
+    "buildPages": "rimraf ./pages_output && bash ./scripts/buildPages.sh",
     "clean": "lerna clean && rimraf packages/**/.cache && rimraf packages/**/dist  && rimraf dist && rimraf .cache && node ./scripts/clean",
     "snowbox": "cd packages/clients/snowbox/ && vite",
     "snowbox:build": "lerna run build --scope @polar/client-snowbox --stream",

diff --git a/packages/clients/snowbox/src/index.html b/packages/clients/snowbox/src/index.html
@@ -93,8 +93,8 @@ <h2>🗺️ Map</h2>
     <label id="language-switcher-label">
       Language in map client:
       <select id="language-switcher">
-        <option value="de">Deutsch</option>
-        <option value="en">Englisch</option>
+        <option value="en">English</option>
+        <option value="de">German</option>
       </select>
     </label>
     <div id="polarstern" class="polarstern"></div>

diff --git a/packages/clients/snowbox/src/mapConfiguration.ts b/packages/clients/snowbox/src/mapConfiguration.ts
@@ -13,7 +13,7 @@ const uBahn = '23053'
  * they could be overwritten in this object
  */
 export const mapConfiguration = {
-  language: 'de',
+  language: 'en',
   epsg: 'EPSG:25832',
   vuetify: {
     theme: {

diff --git a/pages/index.html b/pages/index.html
@@ -0,0 +1,128 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>📚POLAR Docs</title>
+    <meta charset="utf-8" />
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+    />
+    <meta
+      http-equiv="Cache-Control"
+      content="no-cache, no-store, must-revalidate, max-age=0"
+    />
+    <style>
+      /* example page style; not directly related to map client */
+      :root {
+        --not-quite-white: #f2f3f4;
+        --eigengrau: #16161d;
+      }
+
+      * {
+        margin: 0;
+        padding: 0;
+        box-sizing: border-box;
+      }
+
+      html,
+      body {
+        min-height: 100%;
+        width: 100%;
+      }
+
+      body {
+        font-family: sans-serif;
+        padding: 2em;
+        background: var(--not-quite-white);
+        color: var(--eigengrau);
+      }
+
+      h1 {
+        margin-bottom: 0.5em;
+      }
+
+      h2 {
+        margin: 0.5em 0;
+      }
+
+      p {
+        margin: 0.2em 0;
+      }
+
+      /* directly related to POLAR - something like this must be
+       * available for map client to render in (see core docs for
+       * more details on requirements) */
+      .polarstern {
+        width: 800px;
+        height: 600px;
+        position: relative;
+        margin: 5px 0;
+        outline: solid var(--eigengrau);
+      }
+    </style>
+  </head>
+  <body>
+    <h1>🧊POLAR</h1>
+    <p>Welcome to our example and documentation hub.</p>
+    <h2>📚 Documentation</h2>
+    <ul>
+      <li>
+        <a href="/docs/afm/client-afm.html"> AfM Client Documentation </a>
+      </li>
+      <li>
+        <a href="/docs/snowbox/client-snowbox.html">
+          Snowbox Client Documentation
+        </a>
+      </li>
+    </ul>
+    <p>
+      The documentation above contains the clients' respective API description
+      with the plugin documentation of the currently installed plugins. The
+      current client version is documented – for older documentation or a
+      package-wise documentation, please check the NPM packages, which always
+      come with their full description included.
+    </p>
+    <h2>🗺️ Map</h2>
+    <p>In this example, the map client is used as an element on a website.</p>
+    <p>
+      When clicking on a feature, the GetFeatureInformation window for
+      developers is shown. Should feature information be offered to users
+      in-client, you may override the shown window with your own component,
+      since requirements for proper display will vary wildly across projects. To
+      show the information in separate fields (e.g. a pre-filled form after the
+      client), see the programmatic information binding example below.
+    </p>
+    <label id="language-switcher-label">
+      Language in map client:
+      <select
+        id="language-switcher"
+        style="border-style: solid; background: white"
+      >
+        <option value="en">English</option>
+        <option value="de">German</option>
+      </select>
+    </label>
+    <div id="polarstern" class="polarstern"></div>
+    <h2>Example for programmatic information binding</h2>
+    <p>
+      This illustrates which kind of data can be retrieved from the map client.
+      For a full overview, please check the full documentation per plugin.
+    </p>
+    <p>Current zoom level: <span id="vuex-target-zoom" /></p>
+    <p>GFI information: <span id="vuex-target-gfi" /></p>
+    <p>Pin coordinates: <span id="vuex-target-pin-coordinate" /></p>
+    <p>
+      Address search result:
+      <span id="vuex-target-address-search-result" />
+    </p>
+    <p>
+      Map export:
+      <image id="vuex-target-export-result"></image>
+    </p>
+    <script
+      type="module"
+      src="../packages/clients/snowbox/src/polar-client.ts"
+    ></script>
+  </body>
+</html>
diff --git a/pages/vite.config.js b/pages/vite.config.js
@@ -0,0 +1,8 @@
+import { getClientConfig } from '../viteConfigs'
+
+export default getClientConfig({
+  root: '.',
+  build: {
+    outDir: '../pages_output',
+  },
+})
diff --git a/scripts/buildPages.sh b/scripts/buildPages.sh
@@ -0,0 +1,13 @@
+array=( afm snowbox )
+for i in "${array[@]}"
+do
+  echo "Building $i docs ..."
+	npm run docs:$i
+  mkdir --parents ./pages_output/docs/$i
+  mv ./packages/clients/$i/docs/* ./pages_output/docs/$i
+done
+echo "All docs built."
+cd ./pages
+npx vite build
+sed -i 's/<link/<link data-polar="true"/g' ../pages_output/index.html
+echo "GitHub page built."