diff --git a/src/app/app.module.ts b/src/app/app.module.ts index c3227cbe..495660e2 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -34,6 +34,7 @@ import { AddNewStatusComponent } from "./components/floating-column/add-new-stat import { ManageAccountComponent } from "./components/floating-column/manage-account/manage-account.component"; import { ActionBarComponent } from './components/stream/status/action-bar/action-bar.component'; import { WaitingAnimationComponent } from './components/waiting-animation/waiting-animation.component'; +import { ReplyToStatusComponent } from './components/stream/status/reply-to-status/reply-to-status.component'; const routes: Routes = [ { path: "", redirectTo: "home", pathMatch: "full" }, @@ -60,7 +61,8 @@ const routes: Routes = [ AddNewAccountComponent, SearchComponent, ActionBarComponent, - WaitingAnimationComponent + WaitingAnimationComponent, + ReplyToStatusComponent ], imports: [ BrowserModule, diff --git a/src/app/components/stream/status/action-bar/action-bar.component.ts b/src/app/components/stream/status/action-bar/action-bar.component.ts index f0fe0602..84828ec6 100644 --- a/src/app/components/stream/status/action-bar/action-bar.component.ts +++ b/src/app/components/stream/status/action-bar/action-bar.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, OnDestroy, Input } from '@angular/core'; +import { Component, OnInit, OnDestroy, Input, Output, EventEmitter } from '@angular/core'; import { Store } from '@ngxs/store'; import { StatusWrapper } from '../../stream.component'; @@ -16,6 +16,7 @@ import { Status, Results } from '../../../../services/models/mastodon.interfaces export class ActionBarComponent implements OnInit, OnDestroy { @Input() statusWrapper: StatusWrapper; + @Output() replyEvent = new EventEmitter(); isFavorited: boolean; isBoosted: boolean; @@ -80,7 +81,7 @@ export class ActionBarComponent implements OnInit, OnDestroy { } reply(): boolean { - console.warn('reply'); + this.replyEvent.emit(); return false; } diff --git a/src/app/components/stream/status/reply-to-status/reply-to-status.component.html b/src/app/components/stream/status/reply-to-status/reply-to-status.component.html new file mode 100644 index 00000000..c3250f9d --- /dev/null +++ b/src/app/components/stream/status/reply-to-status/reply-to-status.component.html @@ -0,0 +1,8 @@ +
+ + + + +
\ No newline at end of file diff --git a/src/app/components/stream/status/reply-to-status/reply-to-status.component.scss b/src/app/components/stream/status/reply-to-status/reply-to-status.component.scss new file mode 100644 index 00000000..a5fd3b41 --- /dev/null +++ b/src/app/components/stream/status/reply-to-status/reply-to-status.component.scss @@ -0,0 +1,36 @@ +@import "variables"; +@import "panel"; +@import "buttons"; + + +$btn-send-status-width: 60px; + +.form-control { + margin-bottom: 5px; + + &--privacy{ + display: inline-block; + width: calc(100% - 5px - #{$btn-send-status-width}); + } +} + +.btn-custom-primary { + display: inline-block; + width: $btn-send-status-width; + position: relative; + top: -1px; + left: 5px; + // background-color: orange; + // border-color: orange; + // color: black; + font-weight: 500; + + // &:hover { + + // } + + // &:focus { + // border-color: darkblue; + // } +} + diff --git a/src/app/components/stream/status/reply-to-status/reply-to-status.component.spec.ts b/src/app/components/stream/status/reply-to-status/reply-to-status.component.spec.ts new file mode 100644 index 00000000..53e0c519 --- /dev/null +++ b/src/app/components/stream/status/reply-to-status/reply-to-status.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ReplyToStatusComponent } from './reply-to-status.component'; + +describe('ReplyToStatusComponent', () => { + let component: ReplyToStatusComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ReplyToStatusComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ReplyToStatusComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/stream/status/reply-to-status/reply-to-status.component.ts b/src/app/components/stream/status/reply-to-status/reply-to-status.component.ts new file mode 100644 index 00000000..1224c936 --- /dev/null +++ b/src/app/components/stream/status/reply-to-status/reply-to-status.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-reply-to-status', + templateUrl: './reply-to-status.component.html', + styleUrls: ['./reply-to-status.component.scss'] +}) +export class ReplyToStatusComponent implements OnInit { + + + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/components/stream/status/status.component.html b/src/app/components/stream/status/status.component.html index ce7f40d0..005bba5f 100644 --- a/src/app/components/stream/status/status.component.html +++ b/src/app/components/stream/status/status.component.html @@ -18,5 +18,7 @@ - + + + \ No newline at end of file diff --git a/src/app/components/stream/status/status.component.ts b/src/app/components/stream/status/status.component.ts index ca495536..0f62c46a 100644 --- a/src/app/components/stream/status/status.component.ts +++ b/src/app/components/stream/status/status.component.ts @@ -14,6 +14,7 @@ export class StatusComponent implements OnInit { displayedStatus: Status; reblog: boolean; hasAttachments: boolean; + replyingToStatus: boolean; private _statusWrapper: StatusWrapper; status: Status; @@ -66,4 +67,9 @@ export class StatusComponent implements OnInit { return formatDate(date, 'MM/dd', this.locale); } + + openReply(): boolean{ + this.replyingToStatus = !this.replyingToStatus; + return false; + } }