diff --git a/web/src/app/css/app.css b/web/src/app/css/app.css index b85b3a3..9b348ee 100644 --- a/web/src/app/css/app.css +++ b/web/src/app/css/app.css @@ -23,6 +23,7 @@ img.avatar { a.button { text-decoration: none; + user-select: none; color: initial; } header .component.button .fa { @@ -80,6 +81,27 @@ main { background: #000; } +#page-meet #empty { + color: #fff; + text-align: center; + font-size: 1.3em; +} +#page-meet #empty > .center { + max-width: 30em; + padding: 2em; +} +#page-meet #empty .fa.fa-times { + font-size: 2em; +} +#page-meet #empty #be-first { + text-decoration: none; + padding: .5em 1em; + background: #893ad9; + color: #fff; + border-radius: 8px; + border: 1px solid #ffffff1c; +} + #page-meet #actions { height: var(--meet_actions_height); max-width: var(--meet_max_width); diff --git a/web/src/app/js/pages/meet.js b/web/src/app/js/pages/meet.js index 140e9c9..32b7e36 100644 --- a/web/src/app/js/pages/meet.js +++ b/web/src/app/js/pages/meet.js @@ -12,13 +12,19 @@ app.pages.meet = { http.get('/api/v1/feed/meet', {}, function(json) { if (json === undefined) return; app.pages.meet.data = json; - app.template.loadMany(['meet.item','meet.actions'], async function(_) { - await waitUntil(function() { - return http.cache.get('instance_emojis') !== undefined; - }, 3); - app.pages.meet.paint(json); - app.pages.meet.paintInterval(); - }); + if (json.length > 0) { + app.template.loadMany(['meet.item','meet.actions'], async function(_) { + await waitUntil(function() { + return http.cache.get('instance_emojis') !== undefined; + }, 3); + app.pages.meet.paint(json); + app.pages.meet.paintInterval(); + }); + } else { + app.template.load('meet.empty', function(tpl) { + dom.innerHTML = app.template.fill({}, tpl); + }); + } }); }, loadMore: function() { @@ -155,8 +161,8 @@ app.pages.meet = { crush: function() { document.activeElement.blur(); const current = app.pages.meet.dataCurrent(); - if (current === null) - return app.toast.error(s('error.unknown_error')); + if (current === undefined || current === null) + return app.toast.error(s('app.error.unknown_error')); http.post(`/api/v1/accounts/follow?url=${current.account.url}`, {}, function(json) { if (json === undefined) return; if (json.error !== undefined) @@ -170,8 +176,8 @@ app.pages.meet = { discard: function() { document.activeElement.blur(); const current = app.pages.meet.dataCurrent(); - if (current === null) - return app.toast.error(s('error.unknown_error')); + if (current === undefined || current === null) + return app.toast.error(s('app.error.unknown_error')); http.post(`/api/v1/accounts/block?url=${current.account.url}`, {}, function(json) { if (json === undefined) return; if (json.error !== undefined) diff --git a/web/src/app/js/templates/meet/empty.html b/web/src/app/js/templates/meet/empty.html new file mode 100644 index 0000000..cf7bb9b --- /dev/null +++ b/web/src/app/js/templates/meet/empty.html @@ -0,0 +1,11 @@ +
+
+ +

{s:app.meet_empty_p}

+
+ {s:app.be_the_first} +
+
diff --git a/web/src/config/lang/en.php b/web/src/config/lang/en.php index f5a3b51..7ad621d 100644 --- a/web/src/config/lang/en.php +++ b/web/src/config/lang/en.php @@ -15,6 +15,8 @@ $strings = [ 'the_fediverse' => 'The Fediverse', 'yes' => 'Yes', 'no' => 'No', + 'meet_empty_p' => 'We are sorry, this FediLove ❤️ instance doesn\'t have enough network and there is noone to meet yet.', + 'be_the_first' => 'Be the first one!', 'ok' => [ 'crush_success_0' => 'Your new Crush!', 'crush_success_1' => 'Love is in the air!', diff --git a/web/src/config/lang/es.php b/web/src/config/lang/es.php index 314a788..1a8df95 100644 --- a/web/src/config/lang/es.php +++ b/web/src/config/lang/es.php @@ -15,6 +15,8 @@ $strings = [ 'the_fediverse' => 'El Fediverso', 'yes' => 'Sí', 'no' => 'No', + 'meet_empty_p' => 'Lo sentimos, esta instancia de FediLove ❤️ no tiene suficiente red y todavía no hay nadie para conocer.', + 'be_the_first' => '¡Se la primera persona!', 'ok' => [ 'crush_success_0' => '¡Tu nuevo Crush!', 'crush_success_1' => '¡El amor está en el aire!',