Release 2.1.0

.gitignore

@@ -91,5 +91,4 @@ sw.*
 
 # Cypress generated screen and videos files
 cypress/screenshot/
-cypress/videos/
-*.cy.ts.mp4
+cypress/videos/

CHANGELOG.md

@@ -2,37 +2,22 @@
 
 All notable changes to this project will be documented in this file.
 
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-Before _0.1.0_, website development was on rolling release, meaning there are no version tags.
-
-## [Unreleased]
-
-### Changed
-- GeoVisio web viewer upgraded to 2.1.3, [with alls its changes embedded](https://gitlab.com/geovisio/web-viewer/-/blob/develop/CHANGELOG.md?ref_type=heads#213-2023-08-30).
-- Dockerfile creates smaller and faster containers, using pre-built website and Nginx for HTTP serving.
-
+Before _0.1.0_ Changelog didn't exist.
 
 ## [2.1.0] - 2023-08-29
 
 ### Added
 
-- A new page `/envoyer` to upload picture with an interface ([#13](https://gitlab.com/geovisio/website/-/issues/13)) :
+- A new page `/telecharger` to upload picture with an interface ([#13](https://gitlab.com/geovisio/website/-/issues/13)) :
   - the user can upload multiples pictures with the interface
   - the pictures are sorted by name
   - the user can see all the pictures uploaded and all the errors
 
-### Changed
-
-- Website releases now follow the synced `MAJOR.MINOR` API version rule, meaning that any version >= 2.1 of the website will be compatible with corresponding [GeoVisio API](https://gitlab.com/geovisio/api) version.
-
 ### Fixed
 
 - fix a bug in the header hidden sub menu when authentication is not with keycloak
 
-
-## [0.1.0] - 2023-07-04
+## [0.1.0] -
 
 ### Added
 
@@ -52,7 +37,4 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 - Header have now a new entry `Mes photos` when the user is logged to access to the sequence list
 - The router guard for logged pages has been changed to not call the api to check the token
 
-
-[Unreleased]: https://gitlab.com/geovisio/website/-/compare/2.1.0...develop
-[2.1.0]: https://gitlab.com/geovisio/website/-/compare/0.1.0...2.1.0
-[0.1.0]: https://gitlab.com/geovisio/website/-/commits/0.1.0
+### Fixed

Dockerfile

@@ -1,8 +1,4 @@
-#--------------------------------------------------------------
-#- Build image
-#-
-
-FROM node:18.16.0-alpine AS build
+FROM node:18.16.0-alpine
 
 WORKDIR /opt/geovisio
 
@@ -10,44 +6,21 @@ WORKDIR /opt/geovisio
 COPY package.json yarn.lock ./
 
 # Install NodeJS dependencies
-RUN yarn install --frozen-lockfile
+RUN yarn install
 
 # Import source code
 COPY static ./static
 COPY src ./src
 COPY *.json *.js *.ts *.html ./
 
-# Replace env variables by placeholder for dynamic change on container start
-ENV VITE_INSTANCE_NAME=DOCKER_VITE_INSTANCE_NAME
-ENV VITE_API_URL=DOCKER_VITE_API_URL
-ENV VITE_TILES=DOCKER_VITE_TILES
-
 # Build code
+RUN yarn build
+
+# Environment variables
 ENV PORT=3000
-RUN yarn deploy
-
-
-#--------------------------------------------------------------
-#- Final image
-#-
-
-FROM nginx:1-alpine
-RUN apk add bash
-
-# Retrieve files from build
-COPY --from=build /opt/geovisio/dist /usr/share/nginx/html
-
-# Add Docker scripts and Nginx conf
-COPY docker/nginx.conf /etc/nginx/nginx.conf
-COPY docker/docker-entrypoint.sh /etc/nginx/docker-entrypoint.sh
-RUN chmod +x /etc/nginx/docker-entrypoint.sh
-
-# Define env variables defaults
 ENV VITE_INSTANCE_NAME="GeoVisio/Docker"
-ENV VITE_API_URL="https://panoramax.openstreetmap.fr"
-ENV VITE_TILES="https://tile-vect.openstreetmap.fr/styles/basic/style.json"
+ENV VITE_API_URL="https://panoramax.ign.fr/"
 
-# Start Nginx
+# Expose
 EXPOSE 3000
-ENTRYPOINT ["/etc/nginx/docker-entrypoint.sh"]
-CMD ["nginx", "-g", "daemon off;"]
+CMD ["yarn", "start"]

docker/docker-entrypoint.sh

@@ -1,16 +0,0 @@
-#!/bin/bash
-
-ROOT_DIR=/usr/share/nginx/html
-DOCKER_VARS=(VITE_INSTANCE_NAME VITE_API_URL VITE_TILES)
-
-echo "Setting env variables in web files"
-for file in $ROOT_DIR/assets/*.js $ROOT_DIR/index.html; do
-	echo "Processing $file...";
-
-	for i in ${!DOCKER_VARS[@]}; do
-		sed -i "s|DOCKER_${DOCKER_VARS[i]}|${!DOCKER_VARS[i]}|g" $file
-	done
-done
-
-echo "GeoVisio website is now ready !"
-exec "$@"

docker/nginx.conf

@@ -1,22 +0,0 @@
-events {
-    worker_connections 1024;
-}
-
-http {
-    include mime.types;
-    sendfile on;
-
-    server {
-        listen 3000;
-        listen [::]:3000;
-
-        resolver 127.0.0.11;
-        autoindex off;
-
-        server_name _;
-        server_tokens off;
-
-        root /usr/share/nginx/html;
-        gzip_static on;
-    }
-}

docs/02_Setup.md

@@ -60,8 +60,6 @@ You can use the provided __Docker Hub__ `geovisio/website:latest` image directly
 ```bash
 docker run \
 	-e VITE_API_URL="https://your.geovisio.api/" \
-	-e VITE_INSTANCE_NAME="My Own GeoVisio" \
-	-e VITE_TILES="https://your.geovisio.api/vector/tiles/style.json" \
 	-p 3000:3000 \
 	--name geovisio-website \
 	-d \

docs/90_Releases.md

@@ -12,7 +12,7 @@ git checkout develop
 vim package.json	# Change version
 npm run doc
 
-vim CHANGELOG.md	# Replace unreleased to version number and update versions links (at bottom)
+vim CHANGELOG.md	# Replace unreleased to version number
 
 git add *
 git commit -m "Release x.x.x"

package.json

@@ -25,7 +25,7 @@
     "axios": "^1.2.3",
     "bootstrap": "^5.2.3",
     "bootstrap-icons": "^1.10.3",
-    "geovisio": "2.1.3",
+    "geovisio": "2.1.2",
     "moment": "^2.29.4",
     "pinia": "^2.1.4",
     "vue": "^3.2.45",

src/components/Button.vue

@@ -69,14 +69,14 @@ defineProps({
 }
 
 .button--transparent {
-  border: toRem(0.1) solid var(--white);
+  border: toRem(1) solid var(--white);
   background-color: var(--black);
   color: var(--white);
 }
 .button--red {
   color: var(--red);
   background-color: var(--white);
-  border: toRem(0.1) solid var(--red);
+  border: toRem(1) solid var(--red);
   .icon {
     margin-right: 0;
     font-size: toRem(1.4);
@@ -89,7 +89,7 @@ defineProps({
 .button--white {
   color: var(--black);
   background-color: var(--white);
-  border: toRem(0.1) solid var(--black);
+  border: toRem(1) solid var(--black);
   .icon {
     font-size: toRem(1.4);
     color: var(--black);

src/components/ImageItem.vue

@@ -163,7 +163,6 @@ defineProps({
 }
 
 .info {
-  @include text(xs-r-regular);
   padding: toRem(0.5) toRem(0.8);
   background-color: var(--white);
   border-radius: toRem(0.5);

src/components/InputCheckbox.vue

@@ -77,5 +77,6 @@ function updateValue(value: boolean): void {
 .label {
   cursor: pointer;
   margin-left: toRem(0.5);
+  @include text(s-regular);
 }
 </style>

src/components/upload/PictureItem.vue

@@ -43,7 +43,7 @@ const itemUploadedText = computed<string | null>(
 }
 .error {
   background-color: var(--white);
-  border: toRem(0.1) solid var(--red-pale);
+  border: toRem(1) solid var(--red-pale);
   color: var(--red);
 }
 .uploaded-information {

src/locales/fr.json

@@ -33,9 +33,9 @@
       "setting_tooltip": "Afficher ou masquer le token"
     },
     "sequence": {
-      "sequence_published": "Publiée",
+      "sequence_published": "Séquence publiée",
       "sequence_waiting": "En cours de publication",
-      "sequence_hidden": "Masquée",
+      "sequence_hidden": "Séquence masquée",
       "hide_sequence_tooltip": "Masque la séquence sur la carte",
       "delete_sequence_tooltip": "Supprime définitivement la séquence",
       "hide_photo_tooltip": "Masque les photos sur la carte",

src/router/index.ts

@@ -43,7 +43,7 @@ const routes: Array<RouteRecordRaw> = [
     component: SharePicturesView
   },
   {
-    path: '/envoyer',
+    path: '/telecharger',
     name: 'upload-pictures',
     component: UploadPicturesView
   }

src/utils/mapAndViewer.ts

@@ -10,6 +10,7 @@ async function fetchMapAndViewer(params?: OptionalViewerMapInterface) {
   let paramsGeovisio: ViewerMapInterface = {
     map: {
       startWide: true,
+      maxZoom: 19
     }
   }
   if (tiles) {

src/views/MySequenceView.vue

@@ -17,42 +17,38 @@
             class="button-collapse"
             @click="toggleMenu"
           >
-            <div class="wrapper-title">
-              <span :class="[sequence.status, 'sequence-status']">{{
-                sequenceStatus
-              }}</span>
-              <h1 class="title desktop">
-                {{ sequence.title }}
-              </h1>
-            </div>
+            <span :class="[sequence.status, 'sequence-status']">{{
+              sequenceStatus
+            }}</span>
+            <h1 class="title">
+              {{ sequence.title }}
+            </h1>
             <i :class="headerPanelIsOpen ? 'bi bi-dash' : 'bi bi-plus'"></i>
           </button>
-          <h1 class="title responsive">
-            {{ sequence.title }}
-          </h1>
-        </div>
-        <div class="wrapper-button">
-          <Button
-            :tooltip="$t('pages.sequence.hide_sequence_tooltip')"
-            :text="
-              sequence.status === 'ready'
-                ? $t('pages.sequence.button_disable')
-                : $t('pages.sequence.button_enable')
-            "
-            look="button--white"
-            :icon="
-              sequence.status === 'ready' ? 'bi bi-eye-slash' : 'bi bi-eye'
-            "
-            class="disable-button"
-            @trigger="patchCollection"
-          />
-          <Button
-            :tooltip="$t('pages.sequence.delete_sequence_tooltip')"
-            :text="$t('pages.sequence.button_delete')"
-            look="button--red"
-            icon="bi bi-trash"
-            @trigger="deleteCollection"
-          />
+          <div class="wrapper-button">
+            <div class="disable-button">
+              <Button
+                :tooltip="$t('pages.sequence.hide_sequence_tooltip')"
+                :text="
+                  sequence.status === 'ready'
+                    ? $t('pages.sequence.button_disable')
+                    : $t('pages.sequence.button_enable')
+                "
+                look="button--white"
+                :icon="
+                  sequence.status === 'ready' ? 'bi bi-eye-slash' : 'bi bi-eye'
+                "
+                @trigger="patchCollection"
+              />
+            </div>
+            <Button
+              :tooltip="$t('pages.sequence.delete_sequence_tooltip')"
+              :text="$t('pages.sequence.button_delete')"
+              look="button--red"
+              icon="bi bi-trash"
+              @trigger="deleteCollection"
+            />
+          </div>
         </div>
         <div
           :class="[sequence.status, 'collapse py-2 show']"
@@ -548,9 +544,6 @@ async function patchOrDeleteCollectionItems(
 </script>
 
 <style lang="scss" scoped>
-.responsive {
-  display: none;
-}
 .entry-page {
   display: flex;
 }
@@ -571,10 +564,6 @@ async function patchOrDeleteCollectionItems(
   justify-content: center;
   align-items: center;
 }
-.wrapper-title {
-  display: flex;
-  align-items: center;
-}
 .wrapper-button {
   display: flex;
   align-items: center;
@@ -612,10 +601,9 @@ async function patchOrDeleteCollectionItems(
   }
 }
 .title {
-  @include text(h4);
+  @include text(h2);
   color: var(--grey-dark);
   margin-right: toRem(1);
-  margin-bottom: 0;
 }
 .button-close {
   display: none;
@@ -632,10 +620,9 @@ async function patchOrDeleteCollectionItems(
   justify-content: space-between;
 }
 .sequence-status {
-  @include text(xs-r-regular);
   border-radius: toRem(3);
   padding: toRem(0.5) toRem(1);
-  margin-right: toRem(1);
+  margin-right: toRem(2);
   color: var(--white);
   &.ready {
     background-color: var(--orange);
@@ -656,9 +643,6 @@ async function patchOrDeleteCollectionItems(
   padding: 0;
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  width: 100%;
-  margin-bottom: toRem(1);
 }
 .bi-plus,
 .bi-dash {
@@ -667,7 +651,7 @@ async function patchOrDeleteCollectionItems(
 }
 
 .photos-wrapper {
-  padding: toRem(1) 0 toRem(2) toRem(1);
+  padding: toRem(1) 0rem toRem(2) toRem(1);
   height: calc(100vh - v-bind(menuHeight));
 }
 .delete-all {
@@ -677,7 +661,6 @@ async function patchOrDeleteCollectionItems(
   margin-left: toRem(1);
   margin-right: toRem(2);
   margin-bottom: toRem(1);
-  @include text(xs-r-regular);
 }
 .wrapper-select {
   display: flex;
@@ -694,6 +677,9 @@ async function patchOrDeleteCollectionItems(
   margin-right: toRem(1);
   margin-left: toRem(1);
 }
+.delete-all-text {
+  @include text(xs-r-regular);
+}
 .action-buttons {
   display: flex;
   align-items: center;
@@ -729,6 +715,7 @@ async function patchOrDeleteCollectionItems(
   .header-menu {
     flex-direction: column;
     align-items: flex-start;
+    margin-bottom: toRem(1);
   }
   .block-collapse {
     flex-direction: column;
@@ -749,29 +736,6 @@ async function patchOrDeleteCollectionItems(
   }
 }
 @media (max-width: toRem(76.8)) {
-  .desktop {
-    display: none;
-  }
-  .responsive {
-    display: initial;
-  }
-  .title {
-    margin-right: 0;
-    margin-bottom: toRem(1);
-  }
-  .wrapper-button {
-    flex-direction: column;
-    align-items: initial;
-  }
-  .disable-button {
-    margin-right: 0;
-    margin-bottom: toRem(1);
-  }
-  .button-collapse {
-    width: 100%;
-    justify-content: space-between;
-    margin-bottom: 0;
-  }
   .photo-item {
     width: 100%;
     margin-right: 0;
@@ -829,17 +793,13 @@ async function patchOrDeleteCollectionItems(
     right: 0;
     top: toRem(22);
     z-index: 3;
+    background-color: var(--black);
     height: toRem(5);
     display: flex;
     align-items: center;
     justify-content: center;
     border-top-left-radius: toRem(0.5);
     border-bottom-left-radius: toRem(0.5);
-    background-color: var(--white);
-    border: toRem(0.1) solid var(--black);
-  }
-  .menu-top {
-    padding: toRem(1);
   }
   .menu-is-open {
     .menu-right {

yarn.lock

@@ -3148,10 +3148,10 @@ geojson-vt@^3.2.1:
   resolved "https://registry.yarnpkg.com/geojson-vt/-/geojson-vt-3.2.1.tgz#f8adb614d2c1d3f6ee7c4265cad4bbf3ad60c8b7"
   integrity sha512-EvGQQi/zPrDA6zr6BnJD/YhwAkBP8nnJ9emh3EnHQKVMfg/MRVtPbMYdgVy/IaEmn4UfagD2a6fafPDL5hbtwg==
 
-geovisio@2.1.3:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/geovisio/-/geovisio-2.1.3.tgz#60bb05bb850a7c37cf9082bf43ca9cde3bcaab67"
-  integrity sha512-6OEWCoors2UYYnh6R4ImSgQ0TAgOQshIJEFnwxIXshrkdn4s0NXusuEA8RVFhueV4VThSmbZR53KKVgWJXT9wA==
+geovisio@2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/geovisio/-/geovisio-2.1.2.tgz#558675ffb6a7e337620f1b885ea30d373d3a7551"
+  integrity sha512-uYJeqyrEMG2iiluf6IDADdJL4GlUOIirp9TgQa1WWXPwvjO22D2dNx0rkgPsYMJXuum7Cx/BzWma4UkCuA2+Iw==
   dependencies:
     "@fortawesome/fontawesome-svg-core" "^6.4.0"
     "@fortawesome/free-solid-svg-icons" "^6.4.0"