mirror of
https://github.com/xuthus83/pigallery2.git
synced 2025-01-14 14:43:17 +08:00
improving frame
This commit is contained in:
parent
ac9b67e544
commit
e1a7fda3ea
@ -22,7 +22,7 @@ export class AuthenticationService {
|
|||||||
constructor(private _userService: UserService,
|
constructor(private _userService: UserService,
|
||||||
private _networkService: NetworkService,
|
private _networkService: NetworkService,
|
||||||
private shareService: ShareService) {
|
private shareService: ShareService) {
|
||||||
this.user = new BehaviorSubject(JSON.parse(localStorage.getItem('currentUser')));
|
this.user = new BehaviorSubject(null);
|
||||||
|
|
||||||
// picking up session..
|
// picking up session..
|
||||||
if (this.isAuthenticated() === false && Cookie.get(CookieNames.session) != null) {
|
if (this.isAuthenticated() === false && Cookie.get(CookieNames.session) != null) {
|
||||||
@ -52,11 +52,6 @@ export class AuthenticationService {
|
|||||||
window.setTimeout(() => {
|
window.setTimeout(() => {
|
||||||
this.user.subscribe((u) => {
|
this.user.subscribe((u) => {
|
||||||
this.shareService.onNewUser(u);
|
this.shareService.onNewUser(u);
|
||||||
if (u !== null) {
|
|
||||||
localStorage.setItem('currentUser', JSON.stringify(u));
|
|
||||||
} else {
|
|
||||||
localStorage.removeItem('currentUser');
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}, 0);
|
}, 0);
|
||||||
}
|
}
|
||||||
|
@ -70,16 +70,16 @@ app-language {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
a.dropdown-item {
|
a.dropdown-item, button.dropdown-item {
|
||||||
padding: 0.3rem 1.0rem 0.3rem 0.8rem;
|
padding: 0.3rem 1.0rem 0.3rem 0.8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.dropdown-item span {
|
a.dropdown-item span, button.dropdown-item span {
|
||||||
padding-right: 0.8rem;
|
padding-right: 0.8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
a.dropdown-item span.badge {
|
a.dropdown-item span.badge, button.dropdown-item span.badge {
|
||||||
padding: 0.25em 0.4em 0.25rem 0;
|
padding: 0.25em 0.4em 0.25rem 0;
|
||||||
margin-left: -0.8rem;
|
margin-left: -0.8rem;
|
||||||
}
|
}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<ng2-slim-loading-bar [color]="'#337ab7'" [height]="'3px'"></ng2-slim-loading-bar>
|
<ng2-slim-loading-bar color="#337ab7" height="3px"></ng2-slim-loading-bar>
|
||||||
<nav class="navbar navbar-dark bg-dark navbar-expand-md">
|
<nav class="navbar navbar-dark bg-dark navbar-expand-md">
|
||||||
<a class="navbar-brand" [routerLink]="['/gallery','/']"
|
<a class="navbar-brand" [routerLink]="['/gallery','/']"
|
||||||
[queryParams]="queryService.getParams()">
|
[queryParams]="queryService.getParams()">
|
||||||
@ -6,7 +6,7 @@
|
|||||||
<strong>{{title}}</strong>
|
<strong>{{title}}</strong>
|
||||||
</a>
|
</a>
|
||||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav"
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav"
|
||||||
aria-expanded="false" aria-label="Toggle navigation" (click)="toggleState()">
|
aria-expanded="false" aria-label="Toggle navigation" (click)="collapsed = !collapsed">
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
@ -32,7 +32,7 @@
|
|||||||
<li class="nav-item ml-2">
|
<li class="nav-item ml-2">
|
||||||
<app-language class="navbar-btn" isDark="true"></app-language>
|
<app-language class="navbar-btn" isDark="true"></app-language>
|
||||||
</li>
|
</li>
|
||||||
<div class="btn-group" dropdown placement="bottom"
|
<div class="btn-group" dropdown placement="bottom"
|
||||||
*ngIf="isAdmin() || authenticationRequired">
|
*ngIf="isAdmin() || authenticationRequired">
|
||||||
<button id="button-alignment" dropdownToggle
|
<button id="button-alignment" dropdownToggle
|
||||||
type="button" class="btn btn-dark dropdown-toggle"
|
type="button" class="btn btn-dark dropdown-toggle"
|
||||||
@ -46,13 +46,13 @@
|
|||||||
role="menu" aria-labelledby="button-alignment">
|
role="menu" aria-labelledby="button-alignment">
|
||||||
<ng-content select="[navbar-menu]"></ng-content>
|
<ng-content select="[navbar-menu]"></ng-content>
|
||||||
<li role="menuitem" *ngIf="isAdmin()">
|
<li role="menuitem" *ngIf="isAdmin()">
|
||||||
<a class="dropdown-item" href="#" [routerLink]="['/duplicates']">
|
<a class="dropdown-item" [routerLink]="['/duplicates']">
|
||||||
<span class="oi oi-layers"></span>
|
<span class="oi oi-layers"></span>
|
||||||
<ng-container i18n>duplicates</ng-container>
|
<ng-container i18n>duplicates</ng-container>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li role="menuitem" *ngIf="isAdmin()">
|
<li role="menuitem" *ngIf="isAdmin()">
|
||||||
<a class="dropdown-item" href="#" [routerLink]="['/admin']">
|
<a class="dropdown-item" [routerLink]="['/admin']">
|
||||||
<span class="oi oi-wrench"></span>
|
<span class="oi oi-wrench"></span>
|
||||||
<span *ngIf="notificationService.notifications.length>0"
|
<span *ngIf="notificationService.notifications.length>0"
|
||||||
class="badge">{{notificationService.notifications.length}}</span>
|
class="badge">{{notificationService.notifications.length}}</span>
|
||||||
@ -60,10 +60,10 @@
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li role="menuitem" *ngIf="authenticationRequired">
|
<li role="menuitem" *ngIf="authenticationRequired">
|
||||||
<a class="dropdown-item" (click)="logout()">
|
<button class="dropdown-item btn btn-link" (click)="logout()">
|
||||||
<span class="oi oi-account-logout"></span>
|
<span class="oi oi-account-logout"></span>
|
||||||
<ng-container i18n>Logout</ng-container>
|
<ng-container i18n>Logout</ng-container>
|
||||||
</a>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
@ -17,8 +17,8 @@ import {QueryService} from '../../model/query.service';
|
|||||||
export class FrameComponent {
|
export class FrameComponent {
|
||||||
|
|
||||||
user: BehaviorSubject<UserDTO>;
|
user: BehaviorSubject<UserDTO>;
|
||||||
authenticationRequired = false;
|
public readonly authenticationRequired = Config.Client.authenticationRequired;
|
||||||
public title: string;
|
public readonly title = Config.Client.applicationTitle;
|
||||||
collapsed = true;
|
collapsed = true;
|
||||||
facesEnabled = Config.Client.Faces.enabled;
|
facesEnabled = Config.Client.Faces.enabled;
|
||||||
|
|
||||||
@ -26,13 +26,8 @@ export class FrameComponent {
|
|||||||
public notificationService: NotificationService,
|
public notificationService: NotificationService,
|
||||||
public queryService: QueryService) {
|
public queryService: QueryService) {
|
||||||
this.user = this._authService.user;
|
this.user = this._authService.user;
|
||||||
this.authenticationRequired = Config.Client.authenticationRequired;
|
|
||||||
this.title = Config.Client.applicationTitle;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleState() { // click handler
|
|
||||||
this.collapsed = !this.collapsed;
|
|
||||||
}
|
|
||||||
|
|
||||||
isAdmin() {
|
isAdmin() {
|
||||||
return this.user.value && this.user.value.role >= UserRoles.Admin;
|
return this.user.value && this.user.value.role >= UserRoles.Admin;
|
||||||
|
@ -11,17 +11,17 @@
|
|||||||
padding-bottom: 1px;
|
padding-bottom: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.disabled {
|
button.disabled {
|
||||||
/* Make the disabled links grayish*/
|
/* Make the disabled links grayish*/
|
||||||
color: gray;
|
color: gray;
|
||||||
/* And disable the pointer events */
|
/* And disable the pointer events */
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.dropdown-item {
|
button.dropdown-item {
|
||||||
padding:0.3rem 1.0rem 0.3rem 0.8rem;
|
padding:0.3rem 1.0rem 0.3rem 0.8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.dropdown-item span{
|
button.dropdown-item span{
|
||||||
padding-right: 0.8rem;
|
padding-right: 0.8rem;
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<a class="dropdown-item {{enabled? '' : 'disabled'}}" href="#" (click)="openModal(randomModal)">
|
<button class="dropdown-item {{enabled? '' : 'disabled'}}" (click)="openModal(randomModal)">
|
||||||
<span class="oi oi-random"></span>
|
<span class="oi oi-random"></span>
|
||||||
<ng-container i18n>Random link</ng-container>
|
<ng-container i18n>Random link</ng-container>
|
||||||
</a>
|
</button>
|
||||||
|
|
||||||
<ng-template #randomModal>
|
<ng-template #randomModal>
|
||||||
<!-- sharing Modal-->
|
<!-- sharing Modal-->
|
||||||
|
Loading…
x
Reference in New Issue
Block a user