OpenSlides/client/src/app/site/motions/components/motion-detail/motion-detail.component.html

689 lines
27 KiB
HTML
Raw Normal View History

2018-11-04 11:11:48 +01:00
<os-head-bar
[mainButton]="opCanEdit()"
mainButtonIcon="edit"
[nav]="false"
[editMode]="editMotion"
(mainEvent)="setEditMode(!editMotion)"
(saveEvent)="saveMotion()"
>
<!-- Title -->
<div class="title-slot">
<h2 *ngIf="motion && !newMotion">
<span translate>Motion</span>
<!-- Whitespace between "Motion" and identifier -->
2018-11-04 11:11:48 +01:00
<span>&nbsp;</span> <span *ngIf="!editMotion">{{ motion.identifier }}</span>
2018-12-10 17:54:48 +01:00
<span *ngIf="editMotion">{{ contentForm.get('identifier').value }}</span>
</h2>
2018-11-04 11:11:48 +01:00
<h2 *ngIf="newMotion" translate>New motion</h2>
</div>
2018-08-22 16:03:49 +02:00
2018-11-04 11:11:48 +01:00
<!-- Back and forth buttons -->
<div *ngIf="!editMotion" class="extra-controls-slot on-transition-fade">
<div *ngIf="previousMotion">
<button mat-button (click)="navigateToMotion(previousMotion)">
2018-12-10 17:54:48 +01:00
<!-- possible icons:
arrow_left
chevron_left
first_page
arrow_back
arrow_back_ios
navigate_before
fast_rewind
-->
<mat-icon>chevron_left</mat-icon>
<span>{{ previousMotion.identifier }}</span>
</button>
</div>
<div *ngIf="nextMotion">
<button mat-button (click)="navigateToMotion(nextMotion)">
<span>{{ nextMotion.identifier }}</span>
2018-12-10 17:54:48 +01:00
<!-- possible icons:
arrow_right
chevron_right
last_page
arrow_forward
arrow_forward_ios
navigate_next
fast_forward
-->
<mat-icon>chevron_right</mat-icon>
</button>
</div>
</div>
<!-- Menu -->
<div class="menu-slot">
<button type="button" mat-icon-button [matMenuTriggerFor]="motionExtraMenu">
<mat-icon>more_vert</mat-icon>
</button>
</div>
2018-08-22 16:03:49 +02:00
<mat-menu #motionExtraMenu="matMenu">
<div *ngIf="motion">
<!-- PDF -->
<button mat-menu-item
(click)="onDownloadPdf()">
<mat-icon>picture_as_pdf</mat-icon>
<span translate>PDF</span>
</button>
<!-- List of speakers -->
<button mat-menu-item [routerLink]="getSpeakerLink()">
<mat-icon>mic</mat-icon>
<span translate>List of speakers</span>
</button>
<!-- Project -->
<button mat-menu-item>
<mat-icon>videocam</mat-icon>
<span translate>Project</span>
</button>
<!-- New amendment -->
2018-11-04 11:11:48 +01:00
<button
mat-menu-item
(click)="createAmendment()"
*ngIf="amendmentsEnabled && motion && !motion.isParagraphBasedAmendment()"
>
<mat-icon>add</mat-icon>
2018-11-30 10:23:09 +01:00
<span translate>New amendment</span>
2018-11-04 11:11:48 +01:00
</button>
<!-- Show entire motion text -->
2018-11-04 11:11:48 +01:00
<button
mat-menu-item
(click)="showAmendmentContext = !showAmendmentContext"
*ngIf="motion && motion.isParagraphBasedAmendment()"
>
<mat-icon>{{ !showAmendmentContext ? 'check_box_outline_blank' : 'check_box' }}</mat-icon>
2018-11-30 10:23:09 +01:00
<span translate>Show entire motion text</span>
2018-11-04 11:11:48 +01:00
</button>
<mat-divider></mat-divider>
<!-- Delete -->
2018-11-04 11:11:48 +01:00
<button mat-menu-item class="red-warning-text" (click)="deleteMotionButton()">
<mat-icon>delete</mat-icon>
<span translate>Delete</span>
</button>
</div>
2018-08-22 16:03:49 +02:00
</mat-menu>
</os-head-bar>
<div class="content-container">
<!-- Title -->
<div class="title on-transition-fade" *ngIf="motion && !editMotion">
<div class="title-line">
<h1>
{{ motion.title }}
</h1>
<button mat-icon-button color="primary" (click)="toggleFavorite()">
<mat-icon>{{ motion.star ? 'star' : 'star_border' }}</mat-icon>
</button>
</div>
<span class="main-nav-color title-font"><span translate>Sequential number</span>&nbsp;{{ motion.id }}</span>
2019-01-17 10:53:16 +01:00
</div>
<ng-container *ngIf="vp.isMobile; then mobileView; else desktopView"></ng-container>
</div>
2018-09-03 14:23:54 +02:00
<ng-template #mobileView>
<!-- Meta info -->
<div class="hspacing">
<ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container>
</div>
2018-08-16 17:03:39 +02:00
<mat-divider class="spacer-top-10 spacer-bottom-20"></mat-divider>
2018-09-03 14:23:54 +02:00
<!-- Content -->
<div class="hspacing">
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
</div>
<mat-divider class="spacer-top-10 spacer-bottom-20"></mat-divider>
<!-- Comments -->
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
<!-- Personal note -->
<os-personal-note *ngIf="!editMotion" [motion]="motion"></os-personal-note>
<!-- Motoin log -->
<button mat-button *ngIf="canShowLog" (click)="motionLogExpanded =!motionLogExpanded">
<span translate>Show motion log</span>
</button>
<os-motion-log *ngIf="motionLogExpanded" [motion]="motion"></os-motion-log>
2018-09-03 14:23:54 +02:00
</ng-template>
<ng-template #desktopView>
<div class="desktop-view">
<div class="desktop-left on-transition-fade">
<!-- Meta Info -->
<div class="meta-info-block meta-info-desktop">
<ng-container *ngTemplateOutlet="metaInfoTemplate"></ng-container>
</div>
2018-08-13 13:49:38 +02:00
2018-12-10 17:54:48 +01:00
<os-motion-comments *ngIf="!editMotion" [motion]="motion"></os-motion-comments>
<os-personal-note *ngIf="!editMotion" [motion]="motion"></os-personal-note>
2019-01-17 10:53:16 +01:00
<button mat-button *ngIf="canShowLog" (click)="motionLogExpanded =!motionLogExpanded">
<span translate>Show motion log</span>
</button>
<os-motion-log *ngIf="motionLogExpanded" [motion]="motion"></os-motion-log>
2018-09-03 14:23:54 +02:00
</div>
<div class="desktop-right ">
<!-- Content -->
2019-01-09 08:31:13 +01:00
<mat-card [ngClass]="editMotion ? 'os-form-card' : 'os-card'">
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
</mat-card>
2018-09-03 14:23:54 +02:00
</div>
</div>
</ng-template>
<ng-template #metaInfoTemplate>
2018-12-10 17:54:48 +01:00
<div *ngIf="motion">
<!-- Submitters -->
2018-12-10 17:54:48 +01:00
<div *ngIf="motion.submitters || newMotion">
<div *ngIf="!editMotion"><os-manage-submitters [motion]="motion"></os-manage-submitters></div>
2018-09-03 14:23:54 +02:00
</div>
2018-12-10 17:54:48 +01:00
<!-- do Support -->
<div *ngIf="minSupporters && !editMotion">
<h4 *ngIf="perms.isAllowed('support', motion) || motion.hasSupporters()" translate>Supporters</h4>
<!-- support button -->
<button
type="button"
mat-raised-button
color="primary"
(click)="support()"
*ngIf="perms.isAllowed('support', motion)"
>
<mat-icon>thumb_up</mat-icon>
{{ 'Support' | translate }}
</button>
2018-12-10 17:54:48 +01:00
<!-- unsupport button -->
<button
type="button"
*ngIf="perms.isAllowed('unsupport', motion)"
(click)="unsupport()"
mat-raised-button
color="primary"
>
<mat-icon>thumb_down</mat-icon>
{{ 'Unsupport' | translate }}
</button>
<!-- show supporters (TODO: open in dialog) -->
<button type="button" *ngIf="motion.hasSupporters()" (click)="openSupportersDialog()" mat-button>
{{ motion.supporters.length }} {{ 'supporters' | translate }}
</button>
<p *ngIf="showSupporters">
<mat-chip-list *ngFor="let supporter of motion.supporters">
<mat-chip>{{ supporter.full_name }}</mat-chip>
</mat-chip-list>
</p>
2018-09-03 14:23:54 +02:00
</div>
2018-08-13 13:49:38 +02:00
2018-12-10 17:54:48 +01:00
<!-- Set State -->
<div *ngIf="!editMotion">
<h4 translate>State</h4>
2018-12-10 17:54:48 +01:00
<mat-menu #stateMenu="matMenu">
<button *ngFor="let state of motion.nextStates" mat-menu-item (click)="setState(state.id)">
{{ state.name | translate }}
</button>
<mat-divider></mat-divider>
2018-12-10 17:54:48 +01:00
<button mat-menu-item (click)="setState(null)">
<mat-icon>replay</mat-icon> {{ 'Reset state' | translate }}
</button>
</mat-menu>
2018-12-10 17:54:48 +01:00
<mat-basic-chip
*ngIf="motion.state"
[matMenuTriggerFor]="stateMenu"
[ngClass]="{
green: motion.state.css_class === 'success',
red: motion.state.css_class === 'danger',
grey: motion.state.css_class === 'default',
lightblue: motion.state.css_class === 'primary'
}"
>
{{ motion.state.name | translate }}
</mat-basic-chip>
<!--*osPerms="['motions.can_manage', 'motions.can_manage_metadata']; -->
2018-09-03 14:23:54 +02:00
</div>
2018-08-13 13:49:38 +02:00
2018-09-03 14:23:54 +02:00
<!-- Recommendation -->
2018-12-10 17:54:48 +01:00
<div *ngIf="recommender && !editMotion">
2018-11-30 10:23:09 +01:00
<h4>{{ recommender }}</h4>
2018-12-10 17:54:48 +01:00
<mat-menu #recommendationMenu="matMenu">
<button
*ngFor="let recommendation of motion.possibleRecommendations"
mat-menu-item
(click)="setRecommendation(recommendation.id)"
>
{{ recommendation.recommendation_label | translate }}
</button>
<mat-divider></mat-divider>
2018-12-10 17:54:48 +01:00
<button mat-menu-item (click)="setRecommendation(null)">
<mat-icon>replay</mat-icon> {{ 'Reset recommendation' | translate }}
</button>
</mat-menu>
2018-12-10 17:54:48 +01:00
<mat-basic-chip [matMenuTriggerFor]="recommendationMenu" class="bluegrey">
{{
motion.recommendation
? (motion.recommendation.recommendation_label | translate)
: ('not set' | translate)
}}
</mat-basic-chip>
2019-01-17 10:53:16 +01:00
<button mat-button *ngIf="canFollowRecommendation()" (click)="onFollowRecButton()">
<span translate>Follow recommendation</span>
</button>
2018-09-03 14:23:54 +02:00
</div>
<!-- Category -->
<!-- Disabled during "new motion" since changing has no effect -->
<div *ngIf="!editMotion && categoryObserver.value.length > 0">
<h4 translate>Category</h4>
2018-12-10 17:54:48 +01:00
<mat-menu #categoryMenu="matMenu">
2018-12-06 12:28:05 +01:00
<button
mat-menu-item
*ngFor="let category of categoryObserver.value"
(click)="setCategory(category.id)"
>
<mat-icon *ngIf="motion.category_id === category.id">check</mat-icon>
2018-12-06 12:28:05 +01:00
{{ category }}
</button>
</mat-menu>
2018-12-10 17:54:48 +01:00
<mat-basic-chip [matMenuTriggerFor]="categoryMenu" class="grey">
{{ motion.category ? motion.category : '' }}
</mat-basic-chip>
</div>
2018-12-06 12:28:05 +01:00
<!-- Block -->
<div *ngIf="!editMotion && blockObserver.value.length > 0">
2018-12-06 12:28:05 +01:00
<h4 translate>Motion block</h4>
2018-12-10 17:54:48 +01:00
<mat-menu #blockMenu="matMenu">
<button mat-menu-item *ngFor="let block of blockObserver.value" (click)="setBlock(block.id)">
<mat-icon *ngIf="motion.motion_block_id === block.id">check</mat-icon>
2018-12-06 12:28:05 +01:00
{{ block }}
</button>
</mat-menu>
2018-12-10 17:54:48 +01:00
<mat-basic-chip [matMenuTriggerFor]="blockMenu" class="grey">
{{ motion.motion_block ? motion.motion_block : '' }}
2018-12-06 12:28:05 +01:00
</mat-basic-chip>
</div>
2018-12-10 17:54:48 +01:00
<!-- Origin - display only -->
<div *ngIf="!editMotion && motion.origin">
<h4 translate>Origin</h4>
{{ motion.origin }}
2018-09-03 14:23:54 +02:00
</div>
2018-12-21 15:05:11 +01:00
<!-- motion polls -->
<div *ngIf="!editMotion" class="spacer-top-20 spacer-bottom-20">
2018-12-21 15:05:11 +01:00
<os-motion-poll *ngFor="let poll of motion.motion.polls; let i = index" [rawPoll]="poll" [pollIndex]="i">
</os-motion-poll>
2019-01-17 10:53:16 +01:00
<div class="create-poll-button" *ngIf="perms.isAllowed('createpoll', motion)">
<button mat-button (click)="createPoll()">
<mat-icon class="main-nav-color">poll</mat-icon>
<span translate>Create poll</span>
</button>
</div>
2018-12-21 15:05:11 +01:00
</div>
2018-12-10 17:54:48 +01:00
</div>
2018-09-03 14:23:54 +02:00
</ng-template>
<ng-template #contentTemplate>
2018-11-04 11:11:48 +01:00
<form
class="motion-content"
[formGroup]="contentForm"
(keydown)="onKeyDown($event)"
(ngSubmit)="saveMotion()"
2018-12-10 17:54:48 +01:00
*ngIf="motion"
2018-11-04 11:11:48 +01:00
>
<!-- Line Number and Diff buttons -->
2018-12-10 17:54:48 +01:00
<div *ngIf="!editMotion && !motion.isStatuteAmendment()" class="motion-text-controls">
2018-11-04 11:11:48 +01:00
<button
type="button"
mat-icon-button
[matMenuTriggerFor]="lineNumberingMenu"
matTooltip="{{ 'Line numbering' | translate }}"
>
<mat-icon>format_list_numbered</mat-icon>
2018-09-28 15:10:48 +02:00
</button>
2018-11-04 11:11:48 +01:00
<button
type="button"
mat-icon-button
[matMenuTriggerFor]="changeRecoMenu"
matTooltip="{{ 'Change recommendations' | translate }}"
*ngIf="motion && !motion.isParagraphBasedAmendment() && allChangingObjects.length > 0"
>
<mat-icon>rate_review</mat-icon>
2018-09-28 15:10:48 +02:00
</button>
</div>
2018-08-16 17:03:39 +02:00
<!-- Selecting statute paragraphs for amendment -->
<div class="statute-amendment-selector" *ngIf="editMotion && statuteParagraphs.length > 0 && statutesEnabled">
2018-11-30 10:23:09 +01:00
<mat-checkbox formControlName="statute_amendment" (change)="onStatuteAmendmentChange($event)">
{{ 'Statute amendment' | translate }}
</mat-checkbox>
<mat-form-field *ngIf="contentForm.value.statute_amendment">
2018-11-04 11:11:48 +01:00
<mat-select
2018-11-30 10:23:09 +01:00
[placeholder]="'Statute paragraph' | translate"
2018-11-04 11:11:48 +01:00
formControlName="statute_paragraph_id"
(valueChange)="onStatuteParagraphChange($event)"
>
<mat-option *ngFor="let paragraph of statuteParagraphs" [value]="paragraph.id">
{{ paragraph.title }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
2018-12-10 17:54:48 +01:00
<!-- Submitter -->
2019-01-09 08:31:13 +01:00
<div *ngIf="newMotion" class="content-field">
2018-12-10 17:54:48 +01:00
<div *osPerms="['motions.can_manage', 'motions.can_manage_metadata']">
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('submitters_id')"
[multiple]="true"
listname="{{ 'Submitters' | translate }}"
[InputListValues]="submitterObserver"
></os-search-value-selector>
</div>
</div>
<div class="form-id-title">
<!-- Identifier -->
<div *ngIf="editMotion && !newMotion" class="content-field form-identifier">
<mat-form-field *ngIf="editMotion">
<input
matInput
placeholder="{{ 'Identifier' | translate }}"
formControlName="identifier"
[value]="motionCopy.identifier"
/>
</mat-form-field>
2018-11-04 11:11:48 +01:00
</div>
2018-12-10 17:54:48 +01:00
<!-- Title -->
<div *ngIf="editMotion" class="content-field form-title">
<mat-form-field *ngIf="editMotion">
<input
matInput
osAutofocus
placeholder="{{ 'Title' | translate }}"
formControlName="title"
[value]="motionCopy.title"
required
/>
</mat-form-field>
</div>
2018-09-03 14:23:54 +02:00
</div>
<!-- Text -->
<span class="text-prefix-label">{{ preamble | translate }}</span>
2018-11-04 11:11:48 +01:00
<!-- Regular motions or traditional amendments -->
2018-12-10 17:54:48 +01:00
<ng-container *ngIf="!editMotion && !motion.isStatuteAmendment() && !motion.isParagraphBasedAmendment()">
2018-11-04 11:11:48 +01:00
<div
*ngIf="!isRecoModeDiff()"
class="motion-text"
[class.line-numbers-none]="isLineNumberingNone()"
[class.line-numbers-inline]="isLineNumberingInline()"
[class.line-numbers-outside]="isLineNumberingOutside()"
>
<os-motion-detail-original-change-recommendations
*ngIf="isLineNumberingOutside() && isRecoModeOriginal()"
[html]="getFormattedTextPlain()"
[changeRecommendations]="changeRecommendations"
(createChangeRecommendation)="createChangeRecommendation($event)"
(gotoChangeRecommendation)="gotoChangeRecommendation($event)"
></os-motion-detail-original-change-recommendations>
<div
*ngIf="!isLineNumberingOutside() || !isRecoModeOriginal()"
[innerHTML]="sanitizedText(getFormattedTextPlain())"
></div>
2018-09-30 18:43:20 +02:00
</div>
2018-11-04 11:11:48 +01:00
<os-motion-detail-diff
*ngIf="isRecoModeDiff()"
[motion]="motion"
[changes]="allChangingObjects"
[scrollToChange]="scrollToChange"
(createChangeRecommendation)="createChangeRecommendation($event)"
></os-motion-detail-diff>
2018-09-30 18:43:20 +02:00
</ng-container>
2018-11-04 11:11:48 +01:00
<div
class="motion-text line-numbers-none"
2018-12-10 17:54:48 +01:00
*ngIf="!editMotion && motion.isStatuteAmendment()"
2018-11-04 11:11:48 +01:00
[innerHTML]="getFormattedStatuteAmendment()"
></div>
2018-11-20 13:31:56 +01:00
<!-- The HTML Editor -->
2018-11-04 11:11:48 +01:00
<editor formControlName="text" [init]="tinyMceSettings" *ngIf="motion && editMotion"></editor>
<!-- Paragraph-based amendments -->
2018-12-10 17:54:48 +01:00
<ng-container *ngIf="!editMotion && motion.isParagraphBasedAmendment()">
2018-11-04 11:11:48 +01:00
<ng-container *ngTemplateOutlet="paragraphBasedAmendment"></ng-container>
</ng-container>
2018-09-03 14:23:54 +02:00
<!-- Reason -->
2018-12-10 17:54:48 +01:00
<div *ngIf="motion.reason || editMotion">
<h3 translate>Reason</h3>
2018-11-04 11:11:48 +01:00
<div class="motion-text" *ngIf="!editMotion"><div [innerHtml]="motion.reason"></div></div>
2018-11-20 13:31:56 +01:00
<!-- The HTML Editor -->
2018-12-10 17:54:48 +01:00
<editor formControlName="reason" [init]="tinyMceSettings" *ngIf="editMotion"></editor>
</div>
<div class="extra-data">
<!-- Attachments -->
2019-01-09 08:31:13 +01:00
<div *ngIf="motion.hasAttachments() || editMotion" class="content-field">
2018-12-10 17:54:48 +01:00
<div *ngIf="!editMotion">
2019-01-17 10:53:16 +01:00
<h3>{{ 'Attachments' | translate }}<mat-icon>attach_file</mat-icon></h3>
2018-12-10 17:54:48 +01:00
<mat-list dense>
<mat-list-item *ngFor="let file of motion.attachments">
<a [routerLink]="" (click)="onClickAttacment(file)">{{ file.title }}</a>
</mat-list-item>
</mat-list>
</div>
<div *ngIf="editMotion">
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('attachments_id')"
[multiple]="true"
listname="{{ 'Attachments' | translate }}"
[InputListValues]="mediafilesObserver"
></os-search-value-selector>
</div>
</div>
<!-- Category form -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="newMotion && categoryObserver.value.length > 0">
2018-12-10 17:54:48 +01:00
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('category_id')"
[multiple]="false"
[includeNone]="true"
listname="{{ 'Category' | translate }}"
[InputListValues]="categoryObserver"
></os-search-value-selector>
</div>
<!-- Parent item -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="newMotion && agendaItemObserver.value.length > 0">
2018-12-10 17:54:48 +01:00
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('agenda_parent_id')"
2018-12-10 17:54:48 +01:00
[multiple]="false"
[includeNone]="true"
listname="{{ 'Parent Item' | translate }}"
[InputListValues]="agendaItemObserver"
></os-search-value-selector>
</div>
<!-- Visibility -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="newMotion">
2018-12-10 17:54:48 +01:00
<mat-form-field>
<mat-select formControlName="agenda_type" placeholder="{{ 'Agenda visibility' | translate }}">
<mat-option *ngFor="let type of itemVisibility" [value]="type.key">
<span>{{ type.name | translate }}</span>
</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- Supporter form -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="editMotion && minSupporters">
2018-12-10 17:54:48 +01:00
<div *osPerms="['motions.can_manage', 'motions.can_manage_metadata']">
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('supporters_id')"
[multiple]="true"
listname="{{ 'Supporters' | translate }}"
[InputListValues]="supporterObserver"
></os-search-value-selector>
</div>
</div>
<!-- Workflow -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="editMotion && workflowObserver.value.length > 1">
2018-12-10 17:54:48 +01:00
<div *osPerms="['motions.can_manage', 'motions.can_manage_metadata']">
<os-search-value-selector
ngDefaultControl
[form]="contentForm"
[formControl]="contentForm.get('workflow_id')"
[multiple]="false"
listname="{{ 'Workflow' | translate }}"
[InputListValues]="workflowObserver"
></os-search-value-selector>
</div>
</div>
<!-- Origin form -->
2019-01-09 08:31:13 +01:00
<div class="content-field" *ngIf="editMotion">
2018-12-10 17:54:48 +01:00
<div *osPerms="['motions.can_manage', 'motions.can_manage_metadata']">
<mat-form-field>
<input
matInput
placeholder="{{ 'Origin' | translate }}"
formControlName="origin"
[value]="motionCopy.origin"
/>
</mat-form-field>
</div>
</div>
2018-09-03 14:23:54 +02:00
</div>
</form>
</ng-template>
2018-09-28 15:10:48 +02:00
2018-11-04 11:11:48 +01:00
<ng-template #paragraphBasedAmendment>
<section class="text-holder">
<div class="alert alert-info" *ngIf="this.getAmendedParagraphs().length === 0">
<span translate>No changes at the text.</span>
</div>
<div
*ngFor="let paragraph of this.getAmendedParagraphs()"
class="motion-text motion-text-diff amendment-view"
[class.line-numbers-none]="isLineNumberingNone()"
[class.line-numbers-inline]="isLineNumberingInline()"
[class.line-numbers-outside]="isLineNumberingOutside()"
[class.amendment-context]="showAmendmentContext"
>
<div class="amendment-context" *ngIf="showAmendmentContext">
<div [innerHTML]="getParentMotionRange(1, paragraph.paragraphLineFrom)" class="context"></div>
</div>
<h3
*ngIf="paragraph.diffLineTo === paragraph.diffLineFrom + 1 && !showAmendmentContext"
class="amendment-line-header"
>
<span translate>Line</span> {{ paragraph.diffLineFrom }}:
</h3>
<h3
*ngIf="paragraph.diffLineTo !== paragraph.diffLineFrom + 1 && !showAmendmentContext"
class="amendment-line-header"
>
<span translate>Line</span> {{ paragraph.diffLineFrom }} - {{ paragraph.diffLineTo - 1 }}:
</h3>
<div class="paragraph-context" [innerHtml]="sanitizedText(paragraph.textPre)"></div>
<div [innerHtml]="sanitizedText(paragraph.text)"></div>
<div class="paragraph-context" [innerHtml]="sanitizedText(paragraph.textPost)"></div>
<div class="amendment-context" *ngIf="showAmendmentContext">
<div [innerHtml]="getParentMotionRange(paragraph.paragraphLineTo, null)"></div>
</div>
</div>
</section>
</ng-template>
2018-09-28 15:10:48 +02:00
<!-- Line number Menu -->
<mat-menu #lineNumberingMenu="matMenu">
<div *ngIf="motion">
2018-12-21 15:05:11 +01:00
<button
mat-menu-item
translate
(click)="setLineNumberingMode(LineNumberingMode.None)"
[ngClass]="{ selected: lnMode === LineNumberingMode.None }"
2018-12-21 15:05:11 +01:00
>
2018-12-10 17:54:48 +01:00
none
</button>
2018-12-21 15:05:11 +01:00
<button
mat-menu-item
translate
(click)="setLineNumberingMode(LineNumberingMode.Inside)"
[ngClass]="{ selected: lnMode === LineNumberingMode.Inside }"
2018-12-21 15:05:11 +01:00
>
2018-12-10 17:54:48 +01:00
inline
</button>
2018-12-21 15:05:11 +01:00
<button
mat-menu-item
translate
(click)="setLineNumberingMode(LineNumberingMode.Outside)"
[ngClass]="{ selected: lnMode === LineNumberingMode.Outside }"
2018-12-21 15:05:11 +01:00
>
2018-12-10 17:54:48 +01:00
outside
</button>
</div>
2018-09-28 15:10:48 +02:00
</mat-menu>
<!-- Diff View Menu -->
<mat-menu #changeRecoMenu="matMenu">
2018-12-21 15:05:11 +01:00
<button
mat-menu-item
translate
(click)="setChangeRecoMode(ChangeRecoMode.Original)"
[ngClass]="{ selected: crMode === ChangeRecoMode.Original }"
2018-12-21 15:05:11 +01:00
>
Original version
</button>
<button
mat-menu-item
translate
(click)="setChangeRecoMode(ChangeRecoMode.Changed)"
[ngClass]="{ selected: crMode === ChangeRecoMode.Changed }"
2018-12-21 15:05:11 +01:00
>
Changed version
</button>
<button
mat-menu-item
translate
(click)="setChangeRecoMode(ChangeRecoMode.Diff)"
[ngClass]="{ selected: crMode === ChangeRecoMode.Diff }"
2018-12-21 15:05:11 +01:00
>
Diff version
</button>
<button
mat-menu-item
translate
(click)="setChangeRecoMode(ChangeRecoMode.Final)"
[ngClass]="{ selected: crMode === ChangeRecoMode.Final }"
2018-12-21 15:05:11 +01:00
>
Final version
</button>
2018-09-28 15:10:48 +02:00
</mat-menu>