Prechádzať zdrojové kódy

show profile img in high resolution

Carsten Porth 5 rokov pred
rodič
commit
c2850aca7f

+ 1 - 1
app/src/components/profile-header/profile-header.html

@@ -5,7 +5,7 @@
       viewBox="0 0 300 100" xml:space="preserve" width="100%" class="svg-triangle">
       <polygon points="0,75  0,100 300,100 300,99" fill="#FFFFFF" />
     </svg>
-    <img src="{{ user.profile_image_url_https }}" alt="{{ user.name }}" class="avatar">
+    <img src="{{ user.profile_image_url_https | highResolution }}" alt="{{ user.name }}" class="avatar">
     <button ion-button color="primary" *ngIf="!user.following" (click)="follow(user.id_str)" class="follow-button">Follow</button>
     <button ion-button color="danger" *ngIf="user.following" (click)="unfollow(user.id_str)" class="follow-button">Unfollow</button>
   </div>

+ 2 - 1
app/src/components/profile-header/profile-header.scss

@@ -13,8 +13,9 @@ profile-header {
     border-radius: 50%;
     box-shadow: 0px 0px 4px 0px #777;
     position: absolute;
-    bottom: -10px;
+    bottom: -15px;
     left: 15px;
+    width: 90px;
   }
   .follow-button {
     position: absolute;

+ 20 - 0
app/src/pipes/high-resolution/high-resolution.ts

@@ -0,0 +1,20 @@
+import { Pipe, PipeTransform } from "@angular/core";
+
+/**
+ * Generated class for the HighResolutionPipe pipe.
+ *
+ * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
+ */
+@Pipe({
+  name: "highResolution"
+})
+export class HighResolutionPipe implements PipeTransform {
+  /**
+   * Takes a profile img URL string and removes "normal" from the URL to receive a high resolution image
+   */
+  transform(value: string, ...args) {
+    if (value) {
+      return value.replace("_normal", "");
+    }
+  }
+}

+ 5 - 2
app/src/pipes/pipes.module.ts

@@ -3,19 +3,22 @@ import { FriendlyNumberPipe } from "./friendly-number/friendly-number";
 import { DiffForHumansPipe } from "./diff-for-humans/diff-for-humans";
 import { ReplaceUrlsPipe } from "./replace-urls/replace-urls";
 import { ReplaceHashtagsPipe } from "./replace-hashtags/replace-hashtags";
+import { HighResolutionPipe } from './high-resolution/high-resolution';
 @NgModule({
   declarations: [
     FriendlyNumberPipe,
     DiffForHumansPipe,
     ReplaceUrlsPipe,
-    ReplaceHashtagsPipe
+    ReplaceHashtagsPipe,
+    HighResolutionPipe
   ],
   imports: [],
   exports: [
     FriendlyNumberPipe,
     DiffForHumansPipe,
     ReplaceUrlsPipe,
-    ReplaceHashtagsPipe
+    ReplaceHashtagsPipe,
+    HighResolutionPipe
   ]
 })
 export class PipesModule {}