diff --git a/config.sample.federated.json b/config.sample.federated.json index 0fa0a63..7eb8009 100644 --- a/config.sample.federated.json +++ b/config.sample.federated.json @@ -1,6 +1,8 @@ { "xmpp": "https://jabber.happy-dev.fr/http-bind/", "authority": "http://localhost:8000/", + "clientName": "Hubl", + "clientLogo": "https://cdn.startinblox.com/logos/hubl-logo.png", "endpoints": { "get": { "skills": "http://localhost:8000/skills/", diff --git a/config.sample.json b/config.sample.json index 47b7bf1..0df2760 100644 --- a/config.sample.json +++ b/config.sample.json @@ -2,6 +2,8 @@ "xmpp": "https://jabber.happy-dev.fr/http-bind/", "authority": "http://localhost:8000/", "authorityName": "djangoldp-server-name", + "clientName": "Hubl", + "clientLogo": "https://cdn.startinblox.com/logos/hubl-logo.png", "endpoints": { "groups": "http://localhost:8000/groups/", "skills": "http://localhost:8000/skills/", diff --git a/make-webmanifest.mjs b/make-webmanifest.mjs new file mode 100644 index 0000000..097076b --- /dev/null +++ b/make-webmanifest.mjs @@ -0,0 +1,39 @@ +'use strict'; +import fs from 'fs'; + +if(!fs.existsSync("config.json")) throw "[Error] (Mandatory) Missing config.json file"; + +let config = JSON.parse(fs.readFileSync('config.json')); + +if(!config.clientName) throw "[Error] (Mandatory) Missing clientName on config.json"; +if(!config.clientLogo) throw "[Error] (Mandatory) Missing clientLogo on config.json"; + +let manifest = { + "lang": "fr", + "dir": "ltr", + "name": config.clientName, + "description": `Hubl of ${config.clientName}`, + "short_name": config.clientName, + "icons": [{ + "src": config.clientLogo, + "purpose": "any" + }, { + "src": "/images/hubl-icon-192.png", + "sizes": "192x192", + "type": "image/png" + }, { + "src": "/images/hubl-icon-512.png", + "sizes": "512x512", + "type": "image/png" + }], + "start_url": ".", + "display": "standalone", + "orientation": "portrait", + "background_color": "#fff", + 'theme_color': "white" +} + +fs.existsSync("dist") || fs.mkdirSync("dist"); +fs.writeFileSync('dist/manifest.webmanifest', JSON.stringify(manifest, null, 2)); + +console.log(`Created manifest for ${config.clientName}`); \ No newline at end of file diff --git a/package.json b/package.json index 3792914..0208a9e 100644 --- a/package.json +++ b/package.json @@ -9,13 +9,15 @@ "scripts": { "build": "run-p copy:* build:*", "build:css": "node-sass src/styles/index.scss -o dist/styles/", - "build:js": "babel 'src/scripts/*.js' -o dist/scripts/index.js", - "build:jscomponents": "babel 'src/components/*.js' --out-dir dist/components/", - "build:html": "pug src/index.pug -o dist/ --obj config.json", + "build:js": "babel \"src/scripts/*.js\" -o dist/scripts/index.js", + "build:jscomponents": "babel \"src/components/*.js\" --out-dir dist/components/", + "build:pug": "pug src/index.pug -o dist/ --obj config.json", + "build:manifest": "node --experimental-modules make-webmanifest.mjs", "copy:font": "copyfiles -f src/fonts/* dist/fonts", "copy:image": "copyfiles -f src/images/* dist/images", + "copy:sw": "copyfiles -f src/sw.js dist", "serve": "pushstate-server -d ./dist -p 3000", - "watch": "run-p copy:* watch:* serve", + "watch": "run-p copy:* build:manifest watch:* serve", "watch:css": "npm run build:css && npm run build:css -- -w", "watch:js": "babel --watch \"src/scripts/*.js\" -o dist/scripts/index.js", "watch:jscomponents": "babel --watch \"src/components/*.js\" --out-dir dist/components/", diff --git a/src/images/hubl-icon-192.png b/src/images/hubl-icon-192.png new file mode 100644 index 0000000..efe199b Binary files /dev/null and b/src/images/hubl-icon-192.png differ diff --git a/src/images/hubl-icon-512.png b/src/images/hubl-icon-512.png new file mode 100644 index 0000000..3b3e059 Binary files /dev/null and b/src/images/hubl-icon-512.png differ diff --git a/src/index.pug b/src/index.pug index 7f2880c..02aa810 100644 --- a/src/index.pug +++ b/src/index.pug @@ -13,6 +13,7 @@ html(lang="en") include dependencies.pug if clientCSS link(rel='stylesheet', href=`${clientCSS}`) + link(rel="manifest" href="/manifest.webmanifest") body .wrapper diff --git a/src/scripts/login-element-visibility.js b/src/scripts/login-element-visibility.js index cc0daf1..3210e53 100644 --- a/src/scripts/login-element-visibility.js +++ b/src/scripts/login-element-visibility.js @@ -1,4 +1,4 @@ -document.addEventListener("DOMContentLoaded", function (event) { +document.addEventListener("DOMContentLoaded", function () { document .querySelector("sib-auth") .getUser() diff --git a/src/scripts/navigate-event.js b/src/scripts/navigate-event.js index ba4eb0b..1ac1f3e 100644 --- a/src/scripts/navigate-event.js +++ b/src/scripts/navigate-event.js @@ -27,10 +27,10 @@ function closeUserControls() { ); } -document.addEventListener("DOMContentLoaded", function(event) { +document.addEventListener("DOMContentLoaded", function() { //- View change event - window.addEventListener("navigate", event => { + window.addEventListener("navigate", () => { closeLeftMenu(); closeUserControls(); }); @@ -63,7 +63,7 @@ document.addEventListener("DOMContentLoaded", function(event) { } }; - document.querySelector("#toggleMainMenu").addEventListener("click", event => { + document.querySelector("#toggleMainMenu").addEventListener("click", () => { let leftMenu = document.querySelector("#main__menu"); if (leftMenu.hasAttribute("open")) { closeLeftMenu(); @@ -75,7 +75,7 @@ document.addEventListener("DOMContentLoaded", function(event) { const rightMenus = Array.from(document.querySelectorAll("nav.jsRightMenu")); rightMenus.forEach(rightMenu => { const btnRightMenu = rightMenu.querySelector("li.jsOffsiteToggle"); - btnRightMenu.addEventListener("click", e => { + btnRightMenu.addEventListener("click", () => { if (rightMenu.hasAttribute("open")) { closeRightMenu(); } else { @@ -86,7 +86,7 @@ document.addEventListener("DOMContentLoaded", function(event) { Array.from(document.querySelectorAll(".jsMobileSidebarOpenButton")).forEach( el => { - el.addEventListener("click", event => { + el.addEventListener("click", () => { openRightMenu(); }); } diff --git a/src/scripts/register-sw.js b/src/scripts/register-sw.js new file mode 100644 index 0000000..0f10ec9 --- /dev/null +++ b/src/scripts/register-sw.js @@ -0,0 +1,5 @@ +document.addEventListener("DOMContentLoaded", function () { + if('serviceWorker' in navigator) { + navigator.serviceWorker.register('/sw.js'); + } +}); \ No newline at end of file diff --git a/src/scripts/unreads-menu.js b/src/scripts/unreads-menu.js index bd6abc7..f38ff3a 100644 --- a/src/scripts/unreads-menu.js +++ b/src/scripts/unreads-menu.js @@ -1,4 +1,4 @@ -document.addEventListener("DOMContentLoaded", function (event) { +document.addEventListener("DOMContentLoaded", function () { window.addEventListener('newMessage', event => { let jid = event.detail.jid; Array.from(document.querySelectorAll('[data-jabberID="'+jid+'"]')).forEach(el => { diff --git a/src/scripts/widget-extension.js b/src/scripts/widget-extension.js index 13c2295..0c0339f 100644 --- a/src/scripts/widget-extension.js +++ b/src/scripts/widget-extension.js @@ -44,7 +44,7 @@ function recursiveAdaptWidgets(prefix, element, user) { }); } -document.addEventListener("DOMContentLoaded", function (event) { +document.addEventListener("DOMContentLoaded", function () { document .querySelector("sib-auth") .getUser() diff --git a/src/sw.js b/src/sw.js new file mode 100644 index 0000000..f8ca55f --- /dev/null +++ b/src/sw.js @@ -0,0 +1,66 @@ +self.addEventListener('install', function (e) { + e.waitUntil( + caches.open('hubl-store').then(function (cache) { + return cache.addAll([ + '/components/hubl-reactivity.js', + '/components/hubl-search-users.js', + '/components/hubl-status.js', + '/fonts/custom-icons.eot', + '/fonts/custom-icons.svg', + '/fonts/custom-icons.ttf', + '/fonts/custom-icons.woff', + '/fonts/FacitBold.eot', + '/fonts/FacitBold.svg', + '/fonts/FacitBold.ttf', + '/fonts/FacitBold.woff', + '/fonts/FacitRegular.eot', + '/fonts/FacitRegular.svg', + '/fonts/FacitRegular.ttf', + '/fonts/FacitRegular.woff', + '/fonts/material-design-icons.eot', + '/fonts/material-design-icons.svg', + '/fonts/material-design-icons.ttf', + '/fonts/material-design-icons.woff', + '/fonts/material-design-icons.woff2', + '/fonts/RefrigeratorDelxW01Bold.eot', + '/fonts/RefrigeratorDelxW01Bold.svg', + '/fonts/RefrigeratorDelxW01Bold.ttf', + '/fonts/RefrigeratorDelxW01Bold.woff', + '/fonts/simple-line-icons.eot', + '/fonts/simple-line-icons.svg', + '/fonts/simple-line-icons.ttf', + '/fonts/simple-line-icons.woff', + '/fonts/simple-line-icons.woff2', + '/images/add-user.svg', + '/images/alien.svg', + '/images/arrow-down.svg', + '/images/calendar.svg', + '/images/chevron-down.png', + '/images/favicon.png', + '/images/hubl-icon-192.png', + '/images/hubl-icon-512.png', + '/images/logo.png', + '/scripts/index.js', + '/syles/index.css', + '/index.html', + '/' + ]); + }) + ); +}); + +//TODO: Can't use fetch because of unpkg, e.request is missing a part of the package name "@startinblox/core" become "@startinblox" +// self.addEventListener('fetch', function (e) { + // Handle direct loading /xyz/ when server is unjoinable + // if (e.request.mode === 'navigate') { + // e.respondWith(caches.match('/')); + // return; + // } + // e.respondWith( + // fetch(e.request, { + // credentials: 'include' + // }).catch(function() { + // return caches.match(e.request); + // }) + // ); +// }); \ No newline at end of file