chg: [ui:keycloak] Nice login and logged-in UI
parent
04a0b7ef2a
commit
07a4ebfc92
|
@ -0,0 +1,38 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\View\Helper;
|
||||||
|
|
||||||
|
use Cake\View\Helper;
|
||||||
|
use Cake\Utility\Hash;
|
||||||
|
|
||||||
|
class SocialProviderHelper extends Helper
|
||||||
|
{
|
||||||
|
public $helpers = ['Bootstrap'];
|
||||||
|
|
||||||
|
private $providerImageMapping = [
|
||||||
|
'keycloak' => '/img/keycloak_logo.png',
|
||||||
|
];
|
||||||
|
|
||||||
|
public function getIcon($identity)
|
||||||
|
{
|
||||||
|
if (!empty($identity['social_profile'])) {
|
||||||
|
$provider = $identity['social_profile']['provider'];
|
||||||
|
if (!empty($this->providerImageMapping[$provider])) {
|
||||||
|
return $this->genImage($this->providerImageMapping[$provider], h($provider));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
private function genImage($url, $alt)
|
||||||
|
{
|
||||||
|
return $this->Bootstrap->genNode('img', [
|
||||||
|
'src' => $url,
|
||||||
|
'class' => ['img-fluid'],
|
||||||
|
'width' => '16',
|
||||||
|
'height' => '16',
|
||||||
|
'alt' => $alt,
|
||||||
|
'title' => __('Authentication provided by {0}', $alt),
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,4 +1,6 @@
|
||||||
<?php
|
<?php
|
||||||
|
use Cake\Core\Configure;
|
||||||
|
|
||||||
echo $this->Html->image('logo-purple.png', ['alt' => 'CakePHP', 'class="form-signin"']);
|
echo $this->Html->image('logo-purple.png', ['alt' => 'CakePHP', 'class="form-signin"']);
|
||||||
echo '<div class="form-signin">';
|
echo '<div class="form-signin">';
|
||||||
$template = [
|
$template = [
|
||||||
|
@ -13,16 +15,31 @@
|
||||||
echo $this->Form->control(__('Submit'), ['type' => 'submit', 'class' => 'btn btn-primary']);
|
echo $this->Form->control(__('Submit'), ['type' => 'submit', 'class' => 'btn btn-primary']);
|
||||||
echo $this->Form->end();
|
echo $this->Form->end();
|
||||||
echo '</div>';
|
echo '</div>';
|
||||||
echo $this->Form->postLink(
|
|
||||||
'Login with Keycloak',
|
if (!empty(Configure::read('keycloak'))) {
|
||||||
[
|
echo '<div class="form-signin pt-0">';
|
||||||
'prefix' => false,
|
echo $this->Form->create(null, [
|
||||||
'plugin' => 'ADmad/SocialAuth',
|
'url' => Cake\Routing\Router::url([
|
||||||
'controller' => 'Auth',
|
'prefix' => false,
|
||||||
'action' => 'login',
|
'plugin' => 'ADmad/SocialAuth',
|
||||||
'provider' => 'keycloak',
|
'controller' => 'Auth',
|
||||||
'?' => ['redirect' => $this->request->getQuery('redirect')]
|
'action' => 'login',
|
||||||
]
|
'provider' => 'keycloak',
|
||||||
);
|
'?' => ['redirect' => $this->request->getQuery('redirect')]
|
||||||
|
]),
|
||||||
|
]);
|
||||||
|
echo $this->Bootstrap->button([
|
||||||
|
'type' => 'submit',
|
||||||
|
'text' => __('Login with Keycloak'),
|
||||||
|
'variant' => 'secondary',
|
||||||
|
'class' => ['d-block', 'w-100'],
|
||||||
|
'image' => [
|
||||||
|
'path' => '/img/keycloak_logo.png',
|
||||||
|
'alt' => 'Keycloak'
|
||||||
|
]
|
||||||
|
]);
|
||||||
|
echo $this->Form->end();
|
||||||
|
echo '</div>';
|
||||||
|
}
|
||||||
?>
|
?>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
use Cake\Routing\Router;
|
use Cake\Routing\Router;
|
||||||
?>
|
?>
|
||||||
<div class="btn-group">
|
<div class="btn-group">
|
||||||
|
@ -6,7 +7,14 @@ use Cake\Routing\Router;
|
||||||
<i class="<?= $this->FontAwesome->getClass('user-circle') ?> fa-lg"></i>
|
<i class="<?= $this->FontAwesome->getClass('user-circle') ?> fa-lg"></i>
|
||||||
</a>
|
</a>
|
||||||
<div class="dropdown-menu dropdown-menu-end">
|
<div class="dropdown-menu dropdown-menu-end">
|
||||||
<h6 class="dropdown-header"><?= h($this->request->getAttribute('identity')['username']) ?></h6>
|
<h6 class="dropdown-header">
|
||||||
|
<div class="fw-light"><?= __('Loggin in as') ?></div>
|
||||||
|
<div>
|
||||||
|
<?= $this->SocialProvider->getIcon($this->request->getAttribute('identity')) ?>
|
||||||
|
<strong><?= h($this->request->getAttribute('identity')['username']) ?></strong>
|
||||||
|
</div>
|
||||||
|
</h6>
|
||||||
|
<div class="dropdown-divider"></div>
|
||||||
<a class="dropdown-item" href="<?= Router::url(['controller' => 'users', 'action' => 'view', 'plugin' => null]) ?>">
|
<a class="dropdown-item" href="<?= Router::url(['controller' => 'users', 'action' => 'view', 'plugin' => null]) ?>">
|
||||||
<i class="me-1 <?= $this->FontAwesome->getClass('user-circle') ?>"></i>
|
<i class="me-1 <?= $this->FontAwesome->getClass('user-circle') ?>"></i>
|
||||||
<?= __('My Account') ?>
|
<?= __('My Account') ?>
|
||||||
|
@ -16,7 +24,7 @@ use Cake\Routing\Router;
|
||||||
<?= __('Settings') ?>
|
<?= __('Settings') ?>
|
||||||
</a>
|
</a>
|
||||||
<div class="dropdown-divider"></div>
|
<div class="dropdown-divider"></div>
|
||||||
<a class="dropdown-item" href="<?= Router::url(['controller' => 'users', 'action' => 'logout', 'plugin' => null]) ?>">
|
<a class="dropdown-item dropdown-item-outline-danger" href="<?= Router::url(['controller' => 'users', 'action' => 'logout', 'plugin' => null]) ?>">
|
||||||
<i class="me-1 <?= $this->FontAwesome->getClass('sign-out-alt') ?>"></i>
|
<i class="me-1 <?= $this->FontAwesome->getClass('sign-out-alt') ?>"></i>
|
||||||
<?= __('Logout') ?>
|
<?= __('Logout') ?>
|
||||||
</a>
|
</a>
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 10 KiB |
Loading…
Reference in New Issue