Merge pull request #4406 from FinnStutzenstein/closSlide
clos slide content
This commit is contained in:
commit
4186d21deb
@ -1,8 +1,6 @@
|
||||
#countdown {
|
||||
font-weight: bold;
|
||||
padding: 10px;
|
||||
display: inline-block;
|
||||
min-width: 75px;
|
||||
text-align: right;
|
||||
|
||||
&.warning_time {
|
||||
|
@ -4,10 +4,10 @@ interface SlideSpeaker {
|
||||
}
|
||||
|
||||
export interface CommonListOfSpeakersSlideData {
|
||||
waiting: SlideSpeaker[];
|
||||
current: SlideSpeaker;
|
||||
finished: SlideSpeaker[];
|
||||
title_information: object;
|
||||
content_object_collection: string;
|
||||
item_number: string;
|
||||
waiting?: SlideSpeaker[];
|
||||
current?: SlideSpeaker;
|
||||
finished?: SlideSpeaker[];
|
||||
title_information?: object;
|
||||
content_object_collection?: string;
|
||||
item_number?: string;
|
||||
}
|
||||
|
@ -1,11 +1,11 @@
|
||||
<div *ngIf="data">
|
||||
<div class="slidetitle">
|
||||
<h1 translate>List of speakers</h1>
|
||||
<h2> {{ getTitle() }}</h2>
|
||||
<h2>{{ getTitle() }}</h2>
|
||||
</div>
|
||||
|
||||
<!-- Last speakers -->
|
||||
<div *ngIf="data.data.finished.length">
|
||||
<div *ngIf="data.data.finished && data.data.finished.length">
|
||||
<div *ngFor="let speaker of data.data.finished" class="lastSpeakers">
|
||||
{{ speaker.user }}
|
||||
<mat-icon *ngIf="speaker.marked">star</mat-icon>
|
||||
@ -14,11 +14,12 @@
|
||||
|
||||
<!-- Current speaker -->
|
||||
<div *ngIf="data.data.current" class="currentSpeaker">
|
||||
<mat-icon>mic</mat-icon> {{ data.data.current.user }}
|
||||
<mat-icon>mic</mat-icon>
|
||||
<span>{{ data.data.current.user }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Next speakers -->
|
||||
<div *ngIf="data.data.waiting.length">
|
||||
<div *ngIf="data.data.waiting && data.data.waiting.length">
|
||||
<ol class="nextSpeakers">
|
||||
<li *ngFor="let speaker of data.data.waiting">
|
||||
{{ speaker.user }}
|
||||
|
@ -1,14 +1,24 @@
|
||||
.lastSpeakers {
|
||||
color: #9a9898;
|
||||
margin-left: 30px;
|
||||
margin-left: 33px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.currentSpeaker {
|
||||
font-weight: bold;
|
||||
|
||||
.mat-icon,
|
||||
span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
span {
|
||||
padding-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.nextSpeakers {
|
||||
margin-left: 13px !important;
|
||||
margin-top: 10px !important;
|
||||
|
||||
li {
|
||||
line-height: 150%;
|
||||
|
@ -16,13 +16,17 @@ export class CommonListOfSpeakersSlideComponent extends BaseSlideComponent<Commo
|
||||
}
|
||||
|
||||
public getTitle(): string {
|
||||
if (!this.data.data.content_object_collection || !this.data.data.title_information) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const numberPrefix = this.data.data.item_number ? `${this.data.data.item_number} · ` : '';
|
||||
const repo = this.collectionStringMapperService.getRepository(this.data.data.content_object_collection);
|
||||
|
||||
if (isBaseAgendaContentObjectRepository(repo)) {
|
||||
return numberPrefix + repo.getAgendaTitle(this.data.data.title_information);
|
||||
} else {
|
||||
throw new Error('The content object has no agenda based repository!');
|
||||
throw new Error('The content object has no agenda base repository!');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,3 +1,27 @@
|
||||
<div id="overlay" *ngIf="data">
|
||||
TODO
|
||||
<h3 translate>List of speakers</h3>
|
||||
|
||||
<!-- Last speakers -->
|
||||
<div *ngIf="data.data.finished && data.data.finished.length">
|
||||
<div *ngFor="let speaker of data.data.finished" class="lastSpeakers">
|
||||
{{ speaker.user }}
|
||||
<mat-icon *ngIf="speaker.marked">star</mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Current speaker -->
|
||||
<div *ngIf="data.data.current" class="currentSpeaker">
|
||||
<mat-icon>mic</mat-icon>
|
||||
<span>{{ data.data.current.user }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Next speakers -->
|
||||
<div *ngIf="data.data.waiting && data.data.waiting.length">
|
||||
<ol class="nextSpeakers">
|
||||
<li *ngFor="let speaker of data.data.waiting">
|
||||
{{ speaker.user }}
|
||||
<mat-icon *ngIf="speaker.marked">star</mat-icon>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,9 +1,17 @@
|
||||
@import '../common/common-list-of-speakers-slide.component.scss';
|
||||
|
||||
#overlay {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: green;
|
||||
height: 30px;
|
||||
background-color: #d3d3d3;
|
||||
width: 40%;
|
||||
height: 200px;
|
||||
margin: 10px;
|
||||
z-index: 2;
|
||||
z-index: 20;
|
||||
border-radius: 7px;
|
||||
border: 1px solid #999;
|
||||
padding: 0px 7px 10px 19px;
|
||||
box-shadow: 3px 3px 10px 1px rgba(0, 0, 0, 0.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
@ -2,6 +2,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CurrentListOfSpeakersOverlaySlideComponent } from './current-list-of-speakers-overlay-slide.component';
|
||||
import { E2EImportsModule } from '../../../../e2e-imports.module';
|
||||
import { CommonListOfSpeakersSlideModule } from '../common/common-list-of-speakers-slide.module';
|
||||
|
||||
describe('CurrentListOfSpeakersOverlaySlideComponent', () => {
|
||||
let component: CurrentListOfSpeakersOverlaySlideComponent;
|
||||
@ -9,7 +10,7 @@ describe('CurrentListOfSpeakersOverlaySlideComponent', () => {
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
imports: [E2EImportsModule],
|
||||
imports: [E2EImportsModule, CommonListOfSpeakersSlideModule],
|
||||
declarations: [CurrentListOfSpeakersOverlaySlideComponent]
|
||||
}).compileComponents();
|
||||
}));
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
import { BaseSlideComponent } from 'app/slides/base-slide-component';
|
||||
import { CommonListOfSpeakersSlideData } from '../common/common-list-of-speakers-slide-data';
|
||||
@ -9,12 +9,6 @@ import { CommonListOfSpeakersSlideData } from '../common/common-list-of-speakers
|
||||
styleUrls: ['./current-list-of-speakers-overlay-slide.component.scss']
|
||||
})
|
||||
export class CurrentListOfSpeakersOverlaySlideComponent extends BaseSlideComponent<CommonListOfSpeakersSlideData> {
|
||||
// TODO: remove to access data in the template
|
||||
@Input()
|
||||
public set data(value: any) {
|
||||
console.log(value.data);
|
||||
}
|
||||
|
||||
public constructor() {
|
||||
super();
|
||||
}
|
||||
|
@ -1,7 +1,15 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { makeSlideModule } from 'app/slides/base-slide-module';
|
||||
import { CurrentListOfSpeakersOverlaySlideComponent } from './current-list-of-speakers-overlay-slide.component';
|
||||
import { CommonListOfSpeakersSlideModule } from '../common/common-list-of-speakers-slide.module';
|
||||
import { SharedModule } from 'app/shared/shared.module';
|
||||
import { SLIDE } from 'app/slides/slide-token';
|
||||
|
||||
@NgModule(makeSlideModule(CurrentListOfSpeakersOverlaySlideComponent))
|
||||
@NgModule({
|
||||
imports: [CommonModule, SharedModule, CommonListOfSpeakersSlideModule],
|
||||
declarations: [CurrentListOfSpeakersOverlaySlideComponent],
|
||||
providers: [{ provide: SLIDE, useValue: CurrentListOfSpeakersOverlaySlideComponent }],
|
||||
entryComponents: [CurrentListOfSpeakersOverlaySlideComponent]
|
||||
})
|
||||
export class CurrentListOfSpeakersOverlaySlideModule {}
|
||||
|
@ -1,21 +1,19 @@
|
||||
#clock {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
color: white;
|
||||
right: 38px;
|
||||
top: 23px;
|
||||
height: 30px;
|
||||
margin: 12px;
|
||||
z-index: 2;
|
||||
padding-right: 50px;
|
||||
padding-top: 5px;
|
||||
z-index: 10;
|
||||
padding-left: 30px;
|
||||
text-align: right;
|
||||
|
||||
mat-icon {
|
||||
padding-top: 5px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
span {
|
||||
padding-left: 5px;
|
||||
font-size: 24px;
|
||||
float: right;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
@ -21,10 +21,10 @@
|
||||
&.overlay {
|
||||
position: relative;
|
||||
float: right;
|
||||
margin: 100px 10px 10px 10px;
|
||||
padding: 10px 40px 7px 10px;
|
||||
min-height: 72px;
|
||||
min-width: 180px;
|
||||
margin: 80px 0px 10px 10px;
|
||||
padding: 35px 35px 0px 10px;
|
||||
min-height: 60px;
|
||||
min-width: 230px;
|
||||
font-size: 3.7em;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
@ -37,6 +37,7 @@
|
||||
font-weight: normal;
|
||||
font-size: 18px;
|
||||
padding-right: 6px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -3,7 +3,7 @@
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: rgba($color: #000000, $alpha: 0.5);
|
||||
z-index: 10;
|
||||
z-index: 100;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
@ -17,10 +17,11 @@
|
||||
justify-self: center;
|
||||
border-radius: 0.2em;
|
||||
background: #ffffff;
|
||||
font-size: 2.75em;
|
||||
padding: 0.2em 0;
|
||||
font-size: 2.3em;
|
||||
padding: 0.5em 0.25em;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
min-height: 20px;
|
||||
line-height: normal;
|
||||
|
||||
::ng-deep p {
|
||||
margin: 0 0 10px;
|
||||
|
@ -7,7 +7,7 @@
|
||||
#sidebox {
|
||||
width: 260px;
|
||||
right: 0;
|
||||
margin-top: 50px;
|
||||
margin-top: 95px;
|
||||
background: #d3d3d3;
|
||||
border-radius: 7px 0 0 7px;
|
||||
padding: 3px 7px 10px 10px;
|
||||
|
Loading…
Reference in New Issue
Block a user