room and group admin UI

build.gradle

@@ -39,8 +39,8 @@ sourceSets {
 }
 
 dependencies {
-    // providedCompile 'org.apache.tomcat:tomcat-servlet-api:10.1.31'
-    implementation 'org.apache.tomcat:tomcat-servlet-api:10.1.31'
+    // providedCompile 'org.apache.tomcat:tomcat-servlet-api:10.1.33'
+    implementation 'org.apache.tomcat:tomcat-servlet-api:10.1.33'
     implementation 'org.apache.commons:commons-lang3:3.17.0'
     implementation 'org.apache.velocity:velocity-engine-core:2.4.1'
     implementation 'org.apache.commons:commons-text:1.12.0'
@@ -57,7 +57,7 @@ dependencies {
     implementation 'commons-codec:commons-codec:1.17.1'
 
     // embed tomcat 10.1
-    implementation 'org.apache.tomcat.embed:tomcat-embed-core:10.1.31'
+    implementation 'org.apache.tomcat.embed:tomcat-embed-core:10.1.33'
 
     implementation 'co.elastic.logging:jul-ecs-formatter:1.6.0'
     implementation 'co.elastic.logging:ecs-logging-core:1.6.0'
@@ -95,3 +95,25 @@ jar {
 task runExecutableJar(type: JavaExec) {
     classpath = files(tasks.jar)
 }
+
+task downloadJavascriptDependencies() {
+    ext.downloadFile = { localPath, remoteURL ->
+        def f = new File(localPath)
+        if (!f.exists()) {
+            new URL(remoteURL).withInputStream{ i -> f.withOutputStream{ it << i }}
+        }
+    }
+
+    doLast {
+        // https://github.com/vuejs/
+        downloadFile('./src/html/common/vue/vue.global.prod.js', 'https://unpkg.com/[email protected]/dist/vue.global.prod.js')
+
+        // https://github.com/intlify/vue-i18n
+        downloadFile('./src/html/common/vue/vue-i18n.global.prod.js', 'https://unpkg.com/[email protected]/dist/vue-i18n.global.prod.js')
+
+        // https://github.com/axios/axios
+        downloadFile('./src/html/common/vue/axios.min.js', 'https://unpkg.com/[email protected]/dist/axios.min.js')
+    }
+}
+
+jar.dependsOn(downloadJavascriptDependencies)

doc/config-template.yaml

@@ -41,6 +41,16 @@ sepa:
   subject_prefix: 'AWECON'
   success_redirect: 'http://localhost:10000/app/register'
   failure_redirect: 'http://localhost:10000/app/register'
+groups:
+  enable: false # enable roomshare group management
+  max_size: 6
+  flags:
+    - public
+rooms:
+  enable: false # enable room assignments and room management
+  flags:
+    - handicapped
+    - final
 choices:
   flags:
     hc:

src/html/common/style.css

@@ -390,6 +390,19 @@ input
     background-color: #ffffff;
 }
 
+input.error
+{
+    width: 300px;
+    margin: 0px 0px 0px 4px;
+    font-family: Arial;
+    font-size: 10pt;
+    border-width: 1px;
+    border-style: solid;
+    border-color: #ff0000;
+    padding-left: 3px;
+    background-color: #ffffff;
+}
+
 input.tiny
 {
         width: 32px;

src/html/common/vue/.gitignore

@@ -0,0 +1,4 @@
+axios.min.js
+vue.global.prod.js
+vue-i18n.global.prod.js
+

src/html/common/vue/README.md

@@ -0,0 +1,29 @@
+# Vue.js v3
+
+[Github](https://github.com/vuejs/)
+
+[Documentation](https://vuejs.org/guide/introduction.html)
+
+Current stable version is v3.5.12
+
+CDN link: https://unpkg.com/vue@3/dist/vue.global.prod.js -> vue.global.prod.js
+
+# Vue-i18n v9
+
+[Github](https://github.com/intlify/vue-i18n)
+
+[Documentation](https://vue-i18n.intlify.dev/guide/installation.html)
+
+Current stable version for Vue v3 is v9.14.1
+
+CDN link: https://unpkg.com/vue-i18n@9/dist/vue-i18n.global.prod.js -> vue-i18n.global.prod.js
+
+# Axios API client
+
+[Github](https://github.com/axios/axios)
+
+[Documentation](https://axios-http.com/docs/intro)
+
+Current stable version is v1.7.7
+
+CDN link: https://unpkg.com/axios/dist/axios.min.js -> axios.min.js

src/html/common/vue/apis/roomsrv.js

@@ -0,0 +1,70 @@
+import { debug } from '../shared/debug.js'
+
+const apiCall = ( method, path, params, body, success2xxHandler, apiErrorHandler ) => {
+    debug('apiCall', method, path, params, body)
+    axios({
+        url: path,
+        method: method,
+        baseURL: 'http://localhost:10000/roomsrv/api/rest/v1',
+        params: params,
+        data: body,
+        timeout: 30000,
+        withCredentials: true,
+    }).then(function (response) {
+        debug('apiCall success (2xx)', response)
+        success2xxHandler(response)
+    }).catch(function (error) {
+        debug('apiCall error', error)
+        if (error.response) {
+            // request was made with response status non-2xx
+            apiErrorHandler(error.response.status, error.response.data)
+        } else if (error.request) {
+            // request was made but no response was received
+            apiErrorHandler(0, {
+                message: 'request.unanswered',
+                details: {
+                    details: ['failed to receive a response', error.message],
+                }
+            })
+        } else {
+            apiErrorHandler(0, {
+                message: 'request.setup',
+                details: {
+                    details: ['failed to set up request', error.message],
+                }
+            })
+        }
+    })
+}
+
+export const ListAllRooms = ( setRooms, apiErrorHandler ) => {
+    debug('ListAllRooms')
+    apiCall('get', '/rooms', null, null, (response) => {
+        if (response?.data?.rooms) {
+            setRooms(response.data.rooms)
+        }
+    }, apiErrorHandler )
+}
+
+export const CreateRoom = ( room, successHandler, apiErrorHandler ) => {
+    debug('CreateRoom', room)
+    apiCall('post', '/rooms', null, room, (response) => {
+        // TODO get id of new room from location and place into room, so handler knows which room to update
+        room.id = ''
+        successHandler(room)
+    }, apiErrorHandler )
+}
+
+export const UpdateRoom = ( room, successHandler, apiErrorHandler ) => {
+    debug('UpdateRoom', room)
+    apiCall('put', '/rooms/' + room.id, null, room, (response) => {
+        successHandler(room)
+    }, apiErrorHandler )
+}
+
+export const GetRoomByID = ( id, successHandler, apiErrorHandler ) => {
+    debug('GetRoomByID', id)
+    apiCall('get', '/rooms/' + id, null, null,(response) => {
+        successHandler(response.data)
+    }, apiErrorHandler )
+}

src/html/common/vue/groups/app.js

@@ -0,0 +1,22 @@
+import { ErrorList } from '../shared/errorlist.js'
+import { StoredErrorList } from '../stores/errorlist.js'
+import { debug } from '../shared/debug.js'
+
+export const App = {
+    setup() {
+        debug('App.setup')
+
+        // set up an error so at least something shows up
+        StoredErrorList.addError({
+            details: {details: ['page not yet implemented']},
+        })
+
+        return {}
+    },
+    components: {
+        ErrorList,
+    },
+    template: `
+        <ErrorList />
+   `
+}

src/html/common/vue/groups/index.js

@@ -0,0 +1,42 @@
+// main entry point of the roomshare group application, for use in a script tag of type module
+//
+// see templates groups_js.vm and groups.vm
+
+import { de_DE } from '../localizations/de-DE.js'
+import { en_US } from '../localizations/en-US.js'
+import { App } from './app.js'
+import { StoredErrorList } from '../stores/errorlist.js';
+import { debug } from '../shared/debug.js'
+
+const { createApp } = Vue
+const { createI18n } = VueI18n
+
+const params = new URL(document.location.toString()).searchParams;
+const locale = params.get('lang') ?? 'en-US'
+debug('index.js locale=', locale)
+
+const i18n = createI18n({
+    legacy: false,
+    locale: locale,
+    fallbackLocale: 'en-US',
+    messages: {
+        'en-US': en_US,
+        'de-DE': de_DE,
+    },
+})
+
+const app = createApp(App).use(i18n)
+debug('index.js app created')
+
+app.config.errorHandler = (err) => {
+    StoredErrorList.addError({
+        message: "script",
+        details: {
+            message: [ err.message ],
+        },
+    })
+}
+debug('index.js error handler added')
+
+app.mount('#app')
+debug('index.js app mounted')

src/html/common/vue/localizations/de-DE.js

@@ -0,0 +1,62 @@
+export const de_DE = {
+    rooms: {
+        list: {
+            title: 'Zimmerliste',
+            empty: 'Aktuell sind keine Zimmer definiert. Du solltest welche anlegen.',
+            header: {
+                no: "Nr.",
+                name: "Name",
+                size: "Größe",
+                final: "Final?",
+                comments: "Kommentar",
+            },
+            click: 'Zimmer anklicken, um zu editieren',
+        },
+        create: {
+            title: 'Neues Zimmer',
+            name: 'Name',
+            namehint: 'bitte Namen eingeben',
+            size: 'Bettenzahl',
+            comments: 'Kommentar',
+            save: 'Neues Zimmer speichern!',
+            cancel: 'Abbrechen',
+        },
+        edit: {
+            title: 'Zimmer bearbeiten',
+            name: 'Name',
+            namehint: 'bitte Namen eingeben',
+            size: 'Bettenzahl',
+            comments: 'Kommentar',
+            save: 'Änderungen Speichern!',
+            cancel: 'Abbrechen',
+        },
+    },
+    errors: {
+        heading: {
+            single: 'Der folgende Fehler trat bei der Verarbeitung auf:',
+            multiple: 'Die folgenden {count} Fehler traten bei der Verarbeitung auf:',
+        },
+        message: {
+            auth: {
+                forbidden: 'kein Zugriff',
+                unauthorized: 'nicht eingeloggt',
+            },
+            request: {
+                unanswered: 'no response from server',
+                setup: 'failed to set up request to server',
+            },
+            room: {
+                data: {
+                    duplicate: 'Doppelter Zimmername',
+                    invalid: 'Ungültige Zimmerdaten',
+                },
+            },
+            unknown: 'unbekannter Fehler',
+            script: 'unerwarteter Javascript-Fehler',
+        }
+    },
+    count: {
+        heading: 'Anzahl ist',
+        errors: 'Fehlerzahl',
+    }
+}

src/html/common/vue/localizations/en-US.js

@@ -0,0 +1,62 @@
+export const en_US = {
+    rooms: {
+        list: {
+            title: 'Current Rooms',
+            empty: 'There are currently no rooms. You should create one.',
+            header: {
+                no: "No.",
+                name: "Name",
+                size: "Size",
+                final: "Final?",
+                comments: "Comment",
+            },
+            click: 'Click on a room to edit it',
+        },
+        create: {
+            title: 'Create Room',
+            name: 'Name',
+            namehint: 'please enter a name',
+            size: 'Beds',
+            comments: 'Comments',
+            save: 'Save new room!',
+            cancel: 'Cancel!',
+        },
+        edit: {
+            title: 'Edit Room',
+            name: 'Name',
+            namehint: 'please enter a name',
+            size: 'Beds',
+            comments: 'Comments',
+            save: 'Save changes!',
+            cancel: 'Cancel!',
+        },
+    },
+    errors: {
+        heading: {
+            single: 'The following error has occured processing your last request:',
+            multiple: 'The following {count} errors have occured processing your last request:',
+        },
+        message: {
+            auth: {
+                forbidden: 'access denied',
+                unauthorized: 'not logged in',
+            },
+            request: {
+                unanswered: 'no response from server',
+                setup: 'failed to set up request to server',
+            },
+            room: {
+                data: {
+                    duplicate: 'duplicate room name',
+                    invalid: 'room data invalid',
+                },
+            },
+            unknown: 'unknown error',
+            script: 'unexpected javascript error',
+        }
+    },
+    count: {
+        heading: 'Count is',
+        errors: 'Error count',
+    }
+}