colin
/
bookstack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'basic-pwa-support' into development

This commit is contained in:
Dan Brown 2023-10-02 15:58:07 +01:00
parent 8bba5dd5a0 1d91b4d8a6
commit d1f28ed245
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
5 changed files with 145 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/App/HomeController.php
View File

@ -140,4 +140,12 @@ class HomeController extends Controller
$exists = $favicons->restoreOriginalIfNotExists();
return response()->file($exists ? $favicons->getPath() : $favicons->getOriginalPath());
}
/**
* Serve a PWA application manifest.
*/
public function pwaManifest(PwaManifestBuilder $manifestBuilder)
{
return response()->json($manifestBuilder->build());
}
}

59
app/App/PwaManifestBuilder.php Normal file
View File

@ -0,0 +1,59 @@
<?php
namespace BookStack\App;
class PwaManifestBuilder
{
public function build(): array
{
$darkMode = (bool) setting()->getForCurrentUser('dark-mode-enabled');
$appName = setting('app-name');
return [
"name" => $appName,
"short_name" => $appName,
"start_url" => "./",
"scope" => "/",
"display" => "standalone",
"background_color" => $darkMode ? '#111111' : '#F2F2F2',
"description" => $appName,
"theme_color" => ($darkMode ? setting('app-color-dark') : setting('app-color')),
"launch_handler" => [
"client_mode" => "focus-existing"
],
"orientation" => "portrait",
"icons" => [
[
"src" => setting('app-icon-32') ?: url('/icon-32.png'),
"sizes" => "32x32",
"type" => "image/png"
],
[
"src" => setting('app-icon-64') ?: url('/icon-64.png'),
"sizes" => "64x64",
"type" => "image/png"
],
[
"src" => setting('app-icon-128') ?: url('/icon-128.png'),
"sizes" => "128x128",
"type" => "image/png"
],
[
"src" => setting('app-icon-180') ?: url('/icon-180.png'),
"sizes" => "180x180",
"type" => "image/png"
],
[
"src" => setting('app-icon') ?: url('/icon.png'),
"sizes" => "256x256",
"type" => "image/png"
],
[
"src" => url('favicon.ico'),
"sizes" => "48x48",
"type" => "image/vnd.microsoft.icon"
],
],
];
}
}

6
resources/views/layouts/base.blade.php
View File

@ -10,7 +10,7 @@
<meta name="viewport" content="width=device-width">
<meta name="token" content="{{ csrf_token() }}">
<meta name="base-url" content="{{ url('/') }}">
<meta name="theme-color" content="{{ setting('app-color') }}"/>
<meta name="theme-color" content="{{(setting()->getForCurrentUser('dark-mode-enabled') ? setting('app-color-dark') : setting('app-color'))}}"/>
<!-- Social Cards Meta -->
<meta property="og:title" content="{{ isset($pageTitle) ? $pageTitle . ' | ' : '' }}{{ setting('app-name') }}">
@ -29,6 +29,10 @@
<link rel="icon" type="image/png" sizes="64x64" href="{{ setting('app-icon-64') ?: url('/icon-64.png') }}">
<link rel="icon" type="image/png" sizes="32x32" href="{{ setting('app-icon-32') ?: url('/icon-32.png') }}">
<!-- PWA -->
<link rel="manifest" href="{{ url('/manifest.json') }}" crossorigin="use-credentials">
<meta name="mobile-web-app-capable" content="yes">
@yield('head')
<!-- Custom Styles & Head Content -->

1
routes/web.php
View File

@ -20,6 +20,7 @@ use Illuminate\View\Middleware\ShareErrorsFromSession;
Route::get('/status', [SettingControllers\StatusController::class, 'show']);
Route::get('/robots.txt', [HomeController::class, 'robots']);
Route::get('/favicon.ico', [HomeController::class, 'favicon']);
Route::get('/manifest.json', [HomeController::class, 'pwaManifest']);
// Authenticated routes...
Route::middleware('auth')->group(function () {

72
tests/PwaManifestTest.php Normal file
View File

@ -0,0 +1,72 @@
<?php
namespace Tests;
class PwaManifestTest extends TestCase
{
public function test_manifest_access_and_format()
{
$this->setSettings(['app-color' => '#00ACED']);
$resp = $this->get('/manifest.json');
$resp->assertOk();
$resp->assertJson([
'name' => setting('app-name'),
'launch_handler' => [
'client_mode' => 'focus-existing'
],
'theme_color' => '#00ACED',
]);
}
public function test_pwa_meta_tags_in_head()
{
$html = $this->asViewer()->withHtml($this->get('/'));
// crossorigin attribute is required to send cookies with the manifest,
// so it can react correctly to user preferences (dark/light mode).
$html->assertElementExists('head link[rel="manifest"][href$="manifest.json"][crossorigin="use-credentials"]');
$html->assertElementExists('head meta[name="mobile-web-app-capable"][content="yes"]');
}
public function test_manifest_uses_configured_icons_if_existing()
{
$resp = $this->get('/manifest.json');
$resp->assertJson([
'icons' => [[
"src" => 'http://localhost/icon-32.png',
"sizes" => "32x32",
"type" => "image/png"
]]
]);
$galleryFile = $this->files->uploadedImage('my-app-icon.png');
$this->asAdmin()->call('POST', '/settings/customization', [], [], ['app_icon' => $galleryFile], []);
$customIconUrl = setting()->get('app-icon-32');
$this->assertStringContainsString('my-app-icon', $customIconUrl);
$resp = $this->get('/manifest.json');
$resp->assertJson([
'icons' => [[
"src" => $customIconUrl,
"sizes" => "32x32",
"type" => "image/png"
]]
]);
}
public function test_manifest_changes_to_user_preferences()
{
$lightUser = $this->users->viewer();
$darkUser = $this->users->editor();
setting()->putUser($darkUser, 'dark-mode-enabled', 'true');
$resp = $this->actingAs($lightUser)->get('/manifest.json');
$resp->assertJson(['background_color' => '#F2F2F2']);
$resp = $this->actingAs($darkUser)->get('/manifest.json');
$resp->assertJson(['background_color' => '#111111']);
}
}