From d1e60babf49b4ab36df38c440f7f70cb4dff3305 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tomek=20W=C3=B3jcik?= Date: Mon, 15 Sep 2025 06:28:38 +0000 Subject: [PATCH] =?UTF-8?q?BTHLABS-56:=20=5FCopy=20share=20link=5F=20butto?= =?UTF-8?q?n=20in=20view=20association=20page=20Co-authored-by:=20Tomek=20?= =?UTF-8?q?W=C3=B3jcik=20=20Co-committed-by:=20Tomek?= =?UTF-8?q?=20W=C3=B3jcik=20?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../js/hotpocket-backend.ui.PasteboardLink.js | 58 +++++++++++++++++++ ...otpocket-backend.ui.ViewAssociationView.js | 20 +++++-- .../ui/static/ui/js/hotpocket-backend.ui.js | 1 + .../ui/templates/ui/associations/view.html | 27 +++++++-- .../apps/ui/templates/ui/page.html | 1 + .../apps/ui/views/associations.py | 9 +++ .../tests/ui/views/associations/test_view.py | 8 +++ 7 files changed, 113 insertions(+), 11 deletions(-) create mode 100644 services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.PasteboardLink.js diff --git a/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.PasteboardLink.js b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.PasteboardLink.js new file mode 100644 index 0000000..397189c --- /dev/null +++ b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.PasteboardLink.js @@ -0,0 +1,58 @@ +/*! + * HotPocket by BTHLabs (https://hotpocket.app/) + * Copyright 2025-present BTHLabs (https://bthlabs.pl/) + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +((HotPocket) => { + class HotPocketUIPasteboardLinkPlugin { + constructor (app) { + } + onLoad (event) { + let canCopy = false; + if (navigator.clipboard && navigator.clipboard.writeText) { + canCopy = true; + } + + for (let pasteboardLink of document.querySelectorAll('.ui-pasteboard-link')) { + if (canCopy === false) { + pasteboardLink.classList.add('d-none'); + } else { + pasteboardLink.addEventListener('click', this.onClick); + } + } + } + onClick = (event) => { + event.stopPropagation(); + event.preventDefault(); + + const icon = event.target.querySelector('i.bi'); + icon.classList.replace('bi-clipboard-fill', 'bi-clipboard'); + + navigator.clipboard.writeText(event.target.href). + then(() => { + icon.classList.replace('bi-clipboard', 'bi-clipboard-fill'); + }). + catch((reason) => { + console.error('HotPocket.UI.PasteboardLink.onClick()', reason); + window.alert('Could not copy the link :('); + }); + + return false; + }; + } + + HotPocket.addPlugin('UI.PasteboardLink', (app) => { + return new HotPocketUIPasteboardLinkPlugin(app); + }); +})(window.HotPocket); diff --git a/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.ViewAssociationView.js b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.ViewAssociationView.js index d719747..d7e3d5e 100644 --- a/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.ViewAssociationView.js +++ b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.ViewAssociationView.js @@ -41,7 +41,20 @@ if (navigator.share) { shareButton.addEventListener('click', this.onShareButtonClick); } else { - shareButton.addClass('d-none'); + shareButton.remove(); + } + } + + const uiPlugin = this.app.plugin('UI'); + for (let controlButton of document.querySelectorAll('#ViewAssociationView .ui-controls > a.btn')) { + if (uiPlugin.jsEnabled === true) { + if (controlButton.classList.contains('ui-noscript-show')) { + controlButton.remove(); + } + } else { + if (controlButton.classList.contains('ui-noscript-hide')) { + controlButton.remove(); + } } } }; @@ -59,12 +72,9 @@ onShareButtonClick = (event) => { event.preventDefault(); - const shareUrl = new URL(window.location.href); - shareUrl.searchParams.set('share', 'true'); - navigator.share({ title: document.title, - url: shareUrl.toString(), + url: event.target.href, }); return false; diff --git a/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.js b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.js index 1a049f8..fb646f9 100644 --- a/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.js +++ b/services/backend/hotpocket_backend/apps/ui/static/ui/js/hotpocket-backend.ui.js @@ -18,6 +18,7 @@ class HotPocketUIPlugin { constructor (app) { document.body.classList.add('ui-js-enabled'); + this.jsEnabled = document.body.classList.contains('ui-js-enabled'); if (window.navigator.standalone === true) { document.querySelector('body').classList.add('ui-mode-standalone'); diff --git a/services/backend/hotpocket_backend/apps/ui/templates/ui/associations/view.html b/services/backend/hotpocket_backend/apps/ui/templates/ui/associations/view.html index a0e7dc9..9affd49 100644 --- a/services/backend/hotpocket_backend/apps/ui/templates/ui/associations/view.html +++ b/services/backend/hotpocket_backend/apps/ui/templates/ui/associations/view.html @@ -25,8 +25,8 @@

{% if show_controls %} -

- {% spaceless %} +

+
{% translate 'Edit' %} {% translate 'Share' %} - {% endspaceless %} -

+ + {% translate 'Copy share link' %} + + + {% translate 'Share link' %} + +
+
{% endif %} {% if association.description %}
diff --git a/services/backend/hotpocket_backend/apps/ui/templates/ui/page.html b/services/backend/hotpocket_backend/apps/ui/templates/ui/page.html index 0706850..72231b9 100644 --- a/services/backend/hotpocket_backend/apps/ui/templates/ui/page.html +++ b/services/backend/hotpocket_backend/apps/ui/templates/ui/page.html @@ -152,6 +152,7 @@ + {% block page_scripts %}{% endblock %}