Merge branch 'master' into nymkappa/bugfix/price

frontend/src/app/components/block-overview-tooltip/block-overview-tooltip.component.html

@@ -16,7 +16,7 @@
       </tr>
       <tr>
         <td class="td-width" i18n="dashboard.latest-transactions.amount">Amount</td>
-        <td><app-amount [blockConversion]="blockConversion" [satoshis]="value"></app-amount></td>
+        <td><app-amount [blockConversion]="blockConversion" [satoshis]="value" [noFiat]="true"></app-amount></td>
       </tr>
       <tr>
         <td class="td-width" i18n="transaction.fee|Transaction fee">Fee</td>

frontend/src/app/components/search-form/search-form.component.ts

@@ -107,7 +107,13 @@ export class SearchFormComponent implements OnInit {
           }))),
         );
       }),
-      tap((result: any[]) => {
+      map((result: any[]) => {
+        if (this.network === 'bisq') {
+          result[0] = result[0].map((address: string) => 'B' + address);
+        }
+        return result;
+      }),
+      tap(() => {
         this.isTypeaheading$.next(false);
       })
     );
@@ -126,7 +132,7 @@ export class SearchFormComponent implements OnInit {
       ]
       ).pipe(
         map((latestData) => {
-          const searchText = latestData[0];
+          let searchText = latestData[0];
           if (!searchText.length) {
             return {
               searchText: '',
@@ -144,15 +150,15 @@ export class SearchFormComponent implements OnInit {
           const addressPrefixSearchResults = result[0];
           const lightningResults = result[1];
 
-          if (this.network === 'bisq') {
-            return searchText.map((address: string) => 'B' + address);
-          }
-
           const matchesBlockHeight = this.regexBlockheight.test(searchText);
           const matchesTxId = this.regexTransaction.test(searchText) && !this.regexBlockhash.test(searchText);
           const matchesBlockHash = this.regexBlockhash.test(searchText);
           const matchesAddress = this.regexAddress.test(searchText);
 
+          if (matchesAddress && this.network === 'bisq') {
+            searchText = 'B' + searchText;
+          }
+
           return {
             searchText: searchText,
             hashQuickMatch: +(matchesBlockHeight || matchesBlockHash || matchesTxId || matchesAddress),

frontend/src/app/components/start/start.component.ts

@@ -38,6 +38,9 @@ export class StartComponent implements OnInit, OnDestroy {
   pageIndex: number = 0;
   pages: any[] = [];
   pendingMark: number | void = null;
+  lastUpdate: number = 0;
+  lastMouseX: number;
+  velocity: number = 0;
 
   constructor(
     private stateService: StateService,
@@ -136,6 +139,7 @@ export class StartComponent implements OnInit, OnDestroy {
 
   onMouseDown(event: MouseEvent) {
     this.mouseDragStartX = event.clientX;
+    this.resetMomentum(event.clientX);
     this.blockchainScrollLeftInit = this.blockchainContainer.nativeElement.scrollLeft;
   }
   onPointerDown(event: PointerEvent) {
@@ -159,6 +163,7 @@ export class StartComponent implements OnInit, OnDestroy {
   @HostListener('document:mousemove', ['$event'])
   onMouseMove(event: MouseEvent): void {
     if (this.mouseDragStartX != null) {
+      this.updateVelocity(event.clientX);
       this.stateService.setBlockScrollingInProgress(true);
       this.blockchainContainer.nativeElement.scrollLeft =
         this.blockchainScrollLeftInit + this.mouseDragStartX - event.clientX;
@@ -167,7 +172,7 @@ export class StartComponent implements OnInit, OnDestroy {
   @HostListener('document:mouseup', [])
   onMouseUp() {
     this.mouseDragStartX = null;
-    this.stateService.setBlockScrollingInProgress(false);
+    this.animateMomentum();
   }
   @HostListener('document:pointermove', ['$event'])
   onPointerMove(event: PointerEvent): void {
@@ -183,6 +188,45 @@ export class StartComponent implements OnInit, OnDestroy {
     }
   }
 
+  resetMomentum(x: number) {
+    this.lastUpdate = performance.now();
+    this.lastMouseX = x;
+    this.velocity = 0;
+  }
+
+  updateVelocity(x: number) {
+    const now = performance.now();
+    let dt = now - this.lastUpdate;
+    if (dt > 0) {
+      this.lastUpdate = now;
+      const velocity = (x - this.lastMouseX) / dt;
+      this.velocity = (0.8 * this.velocity) + (0.2 * velocity);
+      this.lastMouseX = x;
+    }
+  }
+
+  animateMomentum() {
+    this.lastUpdate = performance.now();
+    requestAnimationFrame(() => {
+      const now = performance.now();
+      const dt = now - this.lastUpdate;
+      this.lastUpdate = now;
+      if (Math.abs(this.velocity) < 0.005) {
+        this.stateService.setBlockScrollingInProgress(false);
+      } else {
+        const deceleration = Math.max(0.0025, 0.001 * this.velocity * this.velocity) * (this.velocity > 0 ? -1 : 1);
+        const displacement = (this.velocity * dt) - (0.5 * (deceleration * dt * dt));
+        const dv = (deceleration * dt);
+        if ((this.velocity < 0 && dv + this.velocity > 0) || (this.velocity > 0 && dv + this.velocity < 0)) {
+          this.velocity = 0;
+        } else {
+          this.velocity += dv;
+        }
+        this.blockchainContainer.nativeElement.scrollLeft -= displacement;
+        this.animateMomentum();
+      }
+    });
+  }
 
   onScroll(e) {
     const middlePage = this.pageIndex === 0 ? this.pages[0] : this.pages[1];

frontend/src/app/components/transaction/transaction.component.scss

@@ -204,6 +204,12 @@
   .txids {
     width: 60%;
   }
+
+  @media (max-width: 500px) {
+    .txids {
+      width: 40%;
+    }
+  }
 }
 
 .tx-list {