From 6478b32d0ee2f5f0c6a3a47ca0e0a65fba11a93d Mon Sep 17 00:00:00 2001 From: psychobunny Date: Tue, 29 Sep 2020 07:49:21 -0400 Subject: [PATCH] feat: upload maskable icon for PWA --- .../en-GB/admin/settings/general.json | 5 +-- public/openapi/read.yaml | 35 ++++++++++++++++++- public/src/admin/settings/general.js | 3 ++ src/controllers/admin/uploads.js | 17 +++++++++ src/controllers/index.js | 16 +++++++++ src/routes/admin.js | 1 + src/views/admin/settings/general.tpl | 13 +++++++ 7 files changed, 87 insertions(+), 3 deletions(-) diff --git a/public/language/en-GB/admin/settings/general.json b/public/language/en-GB/admin/settings/general.json index 4c37897b61..b6fa3d6681 100644 --- a/public/language/en-GB/admin/settings/general.json +++ b/public/language/en-GB/admin/settings/general.json @@ -29,7 +29,8 @@ "favicon.upload": "Upload", "touch-icon": "Homescreen/Touch Icon", "touch-icon.upload": "Upload", - "touch-icon.help": "Recommended size and format: 192x192, PNG format only. If no touch icon is specified, NodeBB will fall back to using the favicon.", + "touch-icon.help": "Recommended size and format: 512x512, PNG format only. If no touch icon is specified, NodeBB will fall back to using the favicon.", + "maskable-icon.help": "Recommended size and format: 512x512, PNG format only. If no maskable icon is specified, NodeBB will fall back to the Touch Icon", "outgoing-links": "Outgoing Links", "outgoing-links.warning-page": "Use Outgoing Links Warning Page", "search-default-sort-by": "Search default sort by", @@ -38,4 +39,4 @@ "theme-color": "Theme Color", "background-color": "Background Color", "background-color-help": "Color used for splash screen background when website is installed as a PWA" -} +} \ No newline at end of file diff --git a/public/openapi/read.yaml b/public/openapi/read.yaml index 413bdb9337..69d9d7a3eb 100644 --- a/public/openapi/read.yaml +++ b/public/openapi/read.yaml @@ -2606,7 +2606,40 @@ paths: description: The filename url: type: string - description: URL of the uploaded image for use client-side + description: URL of the uploaded logo for the Homescreen/Touch Icon to enable PWA + /api/admin/uploadMaskableIcon: + post: + tags: + - admin + summary: Upload Maskable Icon + requestBody: + required: true + content: + multipart/form-data: + schema: + type: object + properties: + files: + type: array + items: + type: string + format: binary + required: + - files + responses: + "200": + description: "Image uploaded" + content: + application/json: + schema: + type: object + properties: + name: + type: string + description: The filename + url: + type: string + description: URL of the uploaded logo for the Maskable Icon entry for PWA / A2HS /api/admin/uploadlogo: post: tags: diff --git a/public/src/admin/settings/general.js b/public/src/admin/settings/general.js index af66449e02..bf88ded896 100644 --- a/public/src/admin/settings/general.js +++ b/public/src/admin/settings/general.js @@ -14,6 +14,9 @@ define('admin/settings/general', ['admin/settings'], function () { $('button[data-action="removeTouchIcon"]').on('click', function () { $('input[data-field="brand:touchIcon"]').val(''); }); + $('button[data-action="removeMaskableIcon"]').on('click', function () { + $('input[data-field="brand:maskableIcon"]').val(''); + }); $('button[data-action="removeOgImage"]').on('click', function () { $('input[data-field="removeOgImage"]').val(''); }); diff --git a/src/controllers/admin/uploads.js b/src/controllers/admin/uploads.js index 8c96071d0d..15f02e664c 100644 --- a/src/controllers/admin/uploads.js +++ b/src/controllers/admin/uploads.js @@ -166,6 +166,23 @@ uploadsController.uploadTouchIcon = async function (req, res, next) { } }; + +uploadsController.uploadMaskableIcon = async function (req, res, next) { + const uploadedFile = req.files.files[0]; + const allowedTypes = ['image/png']; + + if (validateUpload(res, uploadedFile, allowedTypes)) { + try { + const imageObj = await file.saveFileToLocal('maskableicon-orig.png', 'system', uploadedFile.path); + res.json([{ name: uploadedFile.name, url: imageObj.url }]); + } catch (err) { + next(err); + } finally { + file.delete(uploadedFile.path); + } + } +}; + uploadsController.uploadLogo = async function (req, res, next) { await upload('site-logo', req, res, next); }; diff --git a/src/controllers/index.js b/src/controllers/index.js index f2f58c6ad6..7d080b11b1 100644 --- a/src/controllers/index.js +++ b/src/controllers/index.js @@ -294,6 +294,22 @@ Controllers.manifest = function (req, res, next) { density: 10.0, }); } + + + if (meta.config['brand:maskableIcon']) { + manifest.icons.push({ + src: nconf.get('relative_path') + '/assets/uploads/system/maskableicon-orig.png', + type: 'image/png', + purpose: 'maskable', + }); + } else if (meta.config['brand:touchIcon']) { + manifest.icons.push({ + src: nconf.get('relative_path') + '/assets/uploads/system/touchicon-orig.png', + type: 'image/png', + purpose: 'maskable', + }); + } + plugins.fireHook('filter:manifest.build', { req: req, res: res, manifest: manifest }, function (err, data) { if (err) { return next(err); diff --git a/src/routes/admin.js b/src/routes/admin.js index b6f004fdf6..8eb379d127 100644 --- a/src/routes/admin.js +++ b/src/routes/admin.js @@ -79,6 +79,7 @@ function apiRoutes(router, middleware, controllers) { router.post('/api/admin/category/uploadpicture', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadCategoryPicture)); router.post('/api/admin/uploadfavicon', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadFavicon)); router.post('/api/admin/uploadTouchIcon', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadTouchIcon)); + router.post('/api/admin/uploadMaskableIcon', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadMaskableIcon)); router.post('/api/admin/uploadlogo', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadLogo)); router.post('/api/admin/uploadOgImage', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadOgImage)); router.post('/api/admin/upload/file', middlewares, helpers.tryRoute(controllers.admin.uploads.uploadFile)); diff --git a/src/views/admin/settings/general.tpl b/src/views/admin/settings/general.tpl index 5d111f7366..2feba327d9 100644 --- a/src/views/admin/settings/general.tpl +++ b/src/views/admin/settings/general.tpl @@ -117,6 +117,19 @@ [[admin/settings/general:touch-icon.help]]

+ +
+
+ + + + + +
+

+ [[admin/settings/general:maskable-icon.help]] +

+