Develop

src/app/@site-modules/imgur/imgur.service.ts

@@ -47,7 +47,9 @@ export class ImgurService {
       title: data.title,
       episode: 0,
       nsfw: (data.nsfw) as unknown as boolean,
-      images: data.images.map((i): CompositionImage => {
+      images: data.images
+      .filter(i => i.type.startsWith('image/'))
+      .map((i): CompositionImage => {
         return {
           src: i.link,
           width: i.width,

src/app/history/ui/history-list/history-list.component.html

@@ -1,5 +1,5 @@
 @let files = historyFiles();
-@let sites = historyItems();
+@let sites = historyItemsFiltered();
 
 @let sitesNotEmpty = sites.length > 0;
 @let filesNotEmpty = files.length > 0;
@@ -17,6 +17,18 @@
     </summary>
 
     <div class="wrap">
+
+        @if(historyItemsSites().length > 1) {
+        <ul>
+            <li role="button" [class]="{'active': historySitesFilter() === 'all'}" (click)="setHistorySitesFilter()">All
+            </li>
+            @for (tag of historyItemsSites(); track $index) {
+            <li role="button" [class]="{'active': historySitesFilter() === tag}" (click)="setHistorySitesFilter(tag)">
+                {{tag}}</li>
+            }
+        </ul>
+        }
+
         @for (item of sites; track $index) {
         <app-title-card [value]="item" (delete)="delById($event)" />
         }

src/app/history/ui/history-list/history-list.component.scss

@@ -20,4 +20,40 @@
     button {
         margin-left: auto;
     }
+}
+
+ul {
+    position: sticky;
+    top: -1ch;
+    background-color: var(--surface);
+    display: inline-flex;
+    // gap: 1ch;
+    list-style: none;
+    border-radius: .5ch;
+    padding: 0;
+    margin: 0;
+    overflow-x: auto;
+    scrollbar-width: none;
+    z-index: 1;
+    border-radius: .5ch;
+    box-shadow: var(--shadow-1);
+
+    li {
+        // border-radius: inherit;
+        padding: 1ch;
+        // border-bottom: 1px solid transparent;
+        cursor: pointer;
+
+        &.active, &:hover {
+            color: #caa902;
+            border-color: currentColor;
+        }
+
+        &:first-child {
+            position: sticky;
+            left: 0;
+            z-index: 1;
+            background-color: inherit;
+        }
+    }
 }

src/app/history/ui/history-list/history-list.component.ts

@@ -1,4 +1,4 @@
-import { Component, WritableSignal, inject, signal } from '@angular/core';
+import { Component, WritableSignal, computed, inject, signal } from '@angular/core';
 import { HistoryService } from '../../data-access/history.service';
 import { LangService } from '../../../shared/data-access/lang.service';
 import { FileHistoryService } from '../../../file/data-access/file-history.service';
@@ -17,6 +17,25 @@ export class HistoryListComponent {
   historyItems: WritableSignal<any[]> = signal([]);
   historyFiles: WritableSignal<any[]> = signal([]);
 
+  historyItemsSites = computed(() => {
+    const sites = this.historyItems().map(item => item.site);
+    const unique = [...new Set(sites.flat())];
+    return unique;
+  });
+  historySitesFilter = signal('all');
+
+  setHistorySitesFilter(site: string = 'all') {
+    this.historySitesFilter.set(site);
+  }
+
+  historyItemsFiltered = computed(() => {
+    const filter = this.historySitesFilter();
+    if (filter === 'all') {
+      return this.historyItems();
+    }
+    return this.historyItems().filter(item => item.site.includes(filter));
+  });
+
   async displayHistory() {
     const history = await this.history.getAllHistory();
 

src/app/link-parser/ui/parser-form/parser-form.component.ts

@@ -17,6 +17,7 @@ export class ParserFormComponent {
   protected linkInit = inject(LinkInitFacade);
 
   ngOnInit() {
+    this.linkFacade.setLink('');
     this.linkInit.init().then(source => {
       if (source === 'route') {
         this.navFacade.goToParsedLink();

src/app/playlist/data-access/playlist.service.ts

@@ -2,8 +2,6 @@ import { HttpClient } from '@angular/common/http';
 import { Injectable, WritableSignal, signal } from '@angular/core';
 import { Observable, catchError, tap, throwError } from 'rxjs';
 import { LinkParserService } from '../../link-parser/data-access/link-parser.service';
-import { BlankaryLinkParser, ImgurLinkParser, JsonLinkParser, MangadexLinkParser, NhentaiLinkParser, PixivLinkParser, RedditLinkParser, TelegraphLinkParser, YandereParser, ZenkoLinkParser } from '../../link-parser/utils';
-import { ComickLinkParser } from '../../link-parser/utils/comick-link-parser';
 
 export interface EpisodeOptionalField {
   episode?: number;
@@ -50,22 +48,6 @@ export class PlaylistService {
   playlist: WritableSignal<Playlist> = signal([])
 
   constructor(private http: HttpClient, public parser: LinkParserService) {
-    this.initParser();
-  }
-
-  initParser() {
-    this.parser.parsers = [];
-    this.parser.parsers.push(new ImgurLinkParser)
-    this.parser.parsers.push(new MangadexLinkParser)
-    this.parser.parsers.push(new TelegraphLinkParser)
-    this.parser.parsers.push(new RedditLinkParser)
-    this.parser.parsers.push(new ZenkoLinkParser)
-    this.parser.parsers.push(new NhentaiLinkParser)
-    // this.parser.parsers.push(new ComickLinkParser)
-    this.parser.parsers.push(new YandereParser)
-    this.parser.parsers.push(new PixivLinkParser)
-    // this.parser.parsers.push(new BlankaryLinkParser)
-    this.parser.parsers.push(new JsonLinkParser)
   }
 
   getPlaylist(url: string): Observable<EpisodePlaylist> {

src/app/shared/ui/chytanka-logo-with-tags/chytanka-logo-with-tags.component.scss

@@ -1,12 +1,10 @@
 :host {
     position: relative;
-    // overflow: hidden;
     min-height: 0;
     min-width: 0;
     display: grid;
-    // place-items: stretch;
-    align-items: anchor-center;
-
+    gap: 1ch;
+    align-content: center;
 }
 
 #logoPath {
@@ -44,9 +42,6 @@ img {
 }
 
 .version {
-    // position: absolute;
-    // top: 50%; left: 50%;
-    // transform: translate(-50%,-50%);
     font-weight: bold;
     text-align: center;
     opacity: .5;
@@ -67,8 +62,6 @@ img {
 }
 
 ul {
-    position: absolute;
-    bottom: 0;
     display: flex;
     flex-wrap: wrap;
     gap: 1ch;
@@ -98,12 +91,6 @@ ul {
     list-style: none;
     text-box: trim-both cap alphabetic;
 
-    // &:hover {
-    //     cursor: none;
-    //     scale: 1.5 !important;
-    //     z-index: 2;
-    // }
-
     &.reddit {
         --b: #FF4500;
         --f: white;
@@ -119,8 +106,6 @@ ul {
         --f: white;
     }
 
-    // &.comick {}
-
     &.imgur {
         --b: #1bb76e;
     }
@@ -129,7 +114,9 @@ ul {
         --b: #ff6740;
     }
 
-    // &.nhentai {}
+    &.nhentai {
+        --b: #ed2553;
+    }
 
     &.zenko {
         --b: #078DEE;

src/app/shared/utils/phrases.ts

@@ -67,6 +67,9 @@ export class Phrases {
     filesHistory = "Files history"
     noInternet = "No internet connection"
     readlist = "Readlist"
+    noPagesFound = "No pages found"
+    noPagesFoundDesc = "This episode might only have videos or text"
+    episodeEnd = "End of episode"
     getByKey = (key: string) => (Object.keys(this).includes(key)) ? this[key as keyof Phrases] : null;
 
     static getTemplate(phrase: string, value: string) {

src/app/viewer/viewer/components/thanks-page/thanks-page.component.html

@@ -6,7 +6,7 @@
     <div dir="ltr" frame="2"><img [imgMeta]="map"></div>
     <div dir="ltr" frame="5"><img [imgMeta]="logo" /></div>
     <div dir="ltr" frame="4">
-        <p class="text-center">Кінець епізоду</p>
+        <p class="text-center">{{lang.ph().episodeEnd}}</p>
         @if (getNextIndex() >=0 && playlist()[getNextIndex()]; as next) {
 
         <a dir="ltr" [routerLink]="['/', next.site, next.id]"

src/app/viewer/viewer/viewer.component.html

@@ -19,16 +19,20 @@
         [showNsfw]="nsfw.show()" [nsfw]="nsfwEpisode" [src]="img.src" [alt]="img.alt" [inputWidth]="img.width ?? 1000"
         [inputHeight]="img.height ?? 1000" [preload]="pageTracking.shouldPreload(i)" [index]="i" [class]="mode"
         [dir]="dir" [showLoading]="true" />
-    } @empty {
-    <chtnk-page [class]="mode" [dir]="dir">👀</chtnk-page>
     }
 
     <chtnk-page class="last-hint-page" (agree)="nsfw.agree()" (disagree)="nsfw.disagree()" [showNsfw]="nsfw.show()"
         [nsfw]="nsfwEpisode" [class]="mode" [dir]="dir">
         <app-thanks-page [playlist]="readlist.readlist()" [currentPlaylistItem]="currentPlaylistItem()"
             [episode]="episode()" [playlistLink]="playlistLink()">
+            @if(episode().images.length > 0) {
             <ng-content ngProjectAs="source-logo" select="source-logo" />
             <ng-content />
+            } @else {
+            <h1>😢 {{lang.ph().noPagesFound}}</h1>
+            <p>{{lang.ph().noPagesFoundDesc}}</p>
+            <a [vibrateHaptic]="10" class="button medium border" [routerLink]="['/']">🏠</a>
+            }
         </app-thanks-page>
     </chtnk-page>
 

src/assets/langs/uk.json

@@ -63,5 +63,8 @@
     "sitesHistory": "Історія сайтів",
     "filesHistory": "Історія файлів",
     "noInternet": "Немає підключення до інтернету",
-    "readlist": "Список для читання"
+    "readlist": "Список для читання",
+    "noPagesFound": "Сторінок не знайдено",
+    "noPagesFoundDesc": "Цей епізод певно містить лише відео або текст",
+    "episodeEnd": "Кінець епізоду"
 }