From 6074d5ccfb00cdb8f5cec89883a9e9d435ac8b57 Mon Sep 17 00:00:00 2001
From: Raynald Mirville <raynaldm@pm.me>
Date: Mon, 7 Dec 2020 14:14:44 -0500
Subject: [PATCH] fix(temperature-dragger): update getUrlPath to return
 fragment instead of path

motivation: fix clip path and blur filter failing to render under useHash: true routing option

close issue #5758
---
 .../temperature-dragger/temperature-dragger.component.html | 4 ++--
 .../temperature-dragger/temperature-dragger.component.ts   | 7 ++-----
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
index 7f46e332..5dc191b5 100644
--- a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
+++ b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
@@ -19,8 +19,8 @@
     </defs>
     <g [attr.transform]="styles.arcTranslateStr">
 
-      <g class="toClip" [attr.clip-path]="getUrlPath('#sliderClip')">
-        <g class="toFilter" [attr.filter]="getUrlPath('#blurFilter')">
+      <g class="toClip" [attr.clip-path]="getUrlFragment('#sliderClip')">
+        <g class="toFilter" [attr.filter]="getUrlFragment('#blurFilter')">
           <path [attr.d]="arc.d" [attr.fill]="off ? styles.nonSelectedArc.color : arc.color" *ngFor="let arc of styles.gradArcs"></path>
         </g>
         <!-- ngFor is a quirk fix for webkit rendering issues -->
diff --git a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
index a5853019..c3215a31 100644
--- a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
+++ b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
@@ -129,11 +129,8 @@ export class TemperatureDraggerComponent implements AfterViewInit, OnChanges {
     this.invalidatePinPosition();
   }
 
-  getUrlPath(id: string) {
-    const baseHref = this.locationStrategy.getBaseHref().replace(/\/$/, '');
-    const path = this.location.path().replace(/\/$/, '');
-
-    return `url(${baseHref}${path}${id}${this.svgControlId})`;
+  getUrlFragment(id: string) {
+    return `url(${id}${this.svgControlId})`;
   }
 
   private invalidate(): void {