socialnetworknews-web

commit 077859daeb651bb3c7489a0447020e23a4d4e97a
parent d98faa63c3878ab215b6f0378c5236a77944f492
Author: MTRNord <mtrnord1@gmail.com>
Date:   Sun, 18 Mar 2018 17:03:40 +0100

Try to fix lightbox

Diffstat:
M
src/app/tweet-list/tweet-list.component.html
 | 
8
++++----
M
src/app/tweet-list/tweet-list.component.ts
 | 
11
+++++++++--

2 files changed, 13 insertions(+), 6 deletions(-)
diff --git a/src/app/tweet-list/tweet-list.component.html b/src/app/tweet-list/tweet-list.component.html
@@ -8,14 +8,14 @@
         </span>
       </div>
       <div style="z-index: 2;">
-        <a pageScroll href="#img{{i}}" >
+        <button (click)="goTo('#img'+i)" >
           <img *ngIf="item.image_urls && item.image_urls[0]" [src]="item.image_urls[0]" class="thumbnail">
-        </a>
+        </button>
 
         <!-- lightbox container hidden with CSS -->
-        <a pageScroll href="#_" class="lightbox" [id]="'#img'+i">
+        <button (click)="goTo('#_')" class="lightbox" [id]="'#img'+i">
           <img src="http://insomnia.rest/images/screens/main.png">
-        </a>
+        </button>
 
         <div class="text">
           <h3>{{item.display_name}}</h3>
diff --git a/src/app/tweet-list/tweet-list.component.ts b/src/app/tweet-list/tweet-list.component.ts
@@ -1,4 +1,4 @@
-import {Component, Input, OnInit} from '@angular/core';
+import {Component, ElementRef, Inject, Input, OnInit, ViewChild} from '@angular/core';
 import * as Raven from 'raven-js';
 import {ApiService, TweetsEntity} from '../api.service';
 import {Observable} from 'rxjs/Observable';
@@ -10,6 +10,8 @@ import 'rxjs/add/operator/take';
 import 'rxjs/add/operator/concat';
 import 'rxjs/add/observable/throw';
 import {ToastrService} from 'ngx-toastr';
+import {PageScrollInstance, PageScrollService} from 'ng2-page-scroll';
+import {DOCUMENT} from '@angular/common';
 
 
 @Component({
@@ -21,7 +23,7 @@ export class TweetListComponent implements OnInit {
   @Input() uuid;
   data: (TweetsEntity)[];
 
-  constructor(private apiService: ApiService, private toastr: ToastrService) {
+  constructor(private apiService: ApiService, private toastr: ToastrService, private pageScrollService: PageScrollService, @Inject(DOCUMENT) private document: any) {
     Raven.captureBreadcrumb({
       message: 'Showing Paper',
       category: 'paper',
@@ -31,6 +33,11 @@ export class TweetListComponent implements OnInit {
     });
   }
 
+  public goTo(anchor: string): void {
+    const pageScrollInstance: PageScrollInstance = PageScrollInstance.simpleInstance(this.document, anchor);
+    this.pageScrollService.start(pageScrollInstance);
+  }
+
   ngOnInit() {
     this.getYesterday();
   }