Skip to content

Commit

Permalink
Merge pull request #16 from chytanka/develop
Browse files Browse the repository at this point in the history
add hint-page
  • Loading branch information
rodzyk authored Jul 28, 2024
2 parents 67e9bd3 + 1d63cef commit 8ad749e
Show file tree
Hide file tree
Showing 33 changed files with 1,158 additions and 185 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
</div>

@if (historyItems() | async; as items) { @if (items.length > 0) {
<button [title]="lang.ph().clearHistory" class="button small" (click)="clearHistory()">
<button [title]="lang.ph().clearHistory" class="button delete small" (click)="clearHistory()">
🧹 {{lang.ph().clearHistory}}
</button>
} @else {}}
10 changes: 2 additions & 8 deletions src/app/link-parser/link-parser/link-parser.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,28 +4,22 @@
<h1 class="logo-text">@defer{ <app-text-embracer [text]="lang.ph().shortTitle" /> }</h1>
<div style="display: flex; gap: 1ch;">
<form (submit)="onSubmit()">

<input name="chtnk_url" type="url" required autofocus [placeholder]="lang.ph().enterLink"
(input)="inputLink($event)" [value]="link()">


</form>

</div>
</div>

<div class="slogan-wrapper">
<h2 class="slogan-header">{{lang.ph().slogan}}</h2>
@if (linkParams()) {
<a style="display: flex; gap: 1ch;" class="button primary" [routerLink]="['',linkParams()?.site, linkParams64()?.id]">
<a style="display: flex; gap: 1ch; align-items: center;" class="button primary" [routerLink]="['',linkParams()?.site, linkParams64()?.id]">
<span>{{lang.ph().letsgo}} </span>
<img class="favicon" [src]="favicons[linkParams()?.site]" [alt]="linkParams()?.site">
<!-- <span class="site-name">{{linkParams()?.site}}</span> -->
<span class="site-address" [title]="linkParams()?.id">{{'/'+linkParams()?.id | truncate}}</span>
<small class="site-address" [title]="linkParams()?.id">{{linkParams()?.id | truncate}}</small>
</a>
}
</div>

</div>

<section style="text-align: center;">
Expand Down
6 changes: 3 additions & 3 deletions src/app/link-parser/link-parser/link-parser.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -111,9 +111,9 @@ export class LinkParserComponent {

favicons: any = {
reddit: '//reddit.com/favicon.ico',
imgur: 'imgur.com/favicon.ico',
mangadex: 'mangadex.org/favicon.ico',
telegraph: 'telegra.ph/favicon.ico',
imgur: '//imgur.com/favicon.ico',
mangadex: '//mangadex.org/favicon.ico',
telegraph: '//telegra.ph/favicon.ico',
read: 'data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🗯️</text></svg>'
}

Expand Down
89 changes: 89 additions & 0 deletions src/app/shared/data-access/download.service.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
import { Injectable } from '@angular/core';
import { CompositionEpisode, CompositionImage } from '../../common/common-read';

enum DownloadStatus {
Downloading = "downloading",
Paused = "paused",
Error = "error",
Done = "done",
Queued = "queued"
}

type DownloadQueue<T> = {
id: string;
status: DownloadStatus;
object: T;
dateAdded: Date;
dateDownloaded: Date | undefined;
}

interface DownloadCompositionImage extends CompositionImage {
image: number[]
status: DownloadStatus;
}
interface DowloadCompositionEpisode extends CompositionEpisode {
images: DownloadCompositionImage[]
}


@Injectable({
providedIn: 'root'
})
export class DownloadService {
/**
* -[ ] add to queue
* -[ ] dowload queue
* -[ ] save to db
* -[ ]
*/

queue: DownloadQueue<CompositionEpisode>[] = []

constructor() { }

map(ep: CompositionEpisode): DowloadCompositionEpisode {
return {
title: ep.title,
chapter: ep.chapter,
episode: ep.episode,
extra: ep.extra,
mangaId: ep.mangaId,
nsfw: ep.nsfw,
part: ep.part,
volume: ep.volume,
images: ep.images.map(img => {
return {
image: [],
status: DownloadStatus.Queued,
src: img.src,
alt: img.alt,
height: img.height,
nsfw: img.nsfw,
size: img.size,
type: img.type,
width: img.width
}

})
}
}

addToQueue(episode: CompositionEpisode, id: string) {
const qi = this.getFromQueue(id)
if (qi) return;
this.queue.push(
{
id,
object: this.map(episode),
status: DownloadStatus.Queued,
dateAdded: new Date(),
dateDownloaded: undefined
})
}

getFromQueue(id: string) {
const result = this.queue.filter(e => e.id == id)

return result[0] ?? undefined;
}
}
12 changes: 11 additions & 1 deletion src/app/shared/shared.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,11 @@ import { LangToggleComponent } from './ui/lang-toggle/lang-toggle.component';
import { TitleCardComponent } from './ui/title-card/title-card.component';
import { LoadingComponent } from './ui/loading/loading.component';
import { SeparatorComponent } from './ui/separator/separator.component';
import { MangaPageComponent } from './ui/manga-page/manga-page.component';
import { HintPageComponent } from './ui/viewer/components/hint-page/hint-page.component';
import { ViewerFooterComponent } from './ui/viewer/components/viewer-footer/viewer-footer.component';
import { ViewerHeaderComponent } from './ui/viewer/components/viewer-header/viewer-header.component';
import { MangaPageEvenComponent } from './ui/manga-page/manga-page-even.component';



Expand All @@ -36,7 +41,12 @@ import { SeparatorComponent } from './ui/separator/separator.component';
LangToggleComponent,
TitleCardComponent,
LoadingComponent,
SeparatorComponent
SeparatorComponent,
MangaPageComponent,
HintPageComponent,
ViewerFooterComponent,
ViewerHeaderComponent,
MangaPageEvenComponent
],
imports: [
CommonModule,
Expand Down
15 changes: 15 additions & 0 deletions src/app/shared/ui/manga-page/manga-page-even.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<section>
<ng-content select="[frame=1]"></ng-content>
</section>
<section>
<ng-content select="[frame=2]"></ng-content>
</section>
<section>
<ng-content select="[frame=3]"></ng-content>
</section>
<section>
<ng-content select="[frame=4]"></ng-content>
</section>
<section>
<ng-content select="[frame=5]"></ng-content>
</section>
89 changes: 89 additions & 0 deletions src/app/shared/ui/manga-page/manga-page-even.component.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
:host {
display: grid;
max-height: 100vh;
aspect-ratio: 2/3;
--side-gap: 2rem;

background-color: #fff;
color: #000;

gap: 2ch 1ch;
position: relative;

grid-template-columns: var(--side-gap) repeat(4, 1fr);
grid-template-rows: 1fr 2fr 1fr var(--side-gap);

counter-reset: read-order;
font-family: 'Troubleside';
}

section {
opacity: .8;
border: .4ch solid;
border-radius: .4ch;
position: relative;
display: grid;
place-items: center;
overflow: hidden;

counter-increment: read-order;

&:nth-child(1),
&:nth-child(2) {
border-top: 0;
border-top-left-radius: unset;
border-top-right-radius: unset;
}

&:nth-child(1) {
grid-column: 2/span 2;
}

&:nth-child(2) {
grid-column: 4/span 2;
grid-row: 1;
}

&:nth-child(3) {
grid-column: 2/span 4
}

&:nth-child(4) {
grid-column: 2/span 3;
}

&:nth-child(5) {
grid-column: 5;
}
}


:host[dir=rtl] {
section {

&:nth-child(2),
&:nth-child(3),
&:nth-child(5) {
border-left: 0;
border-bottom-left-radius: unset;
border-top-left-radius: unset;
}
}
}

:host[dir=ltr] {
section {
&::after {
right: unset;
left: 1ch;
}

&:nth-child(2),
&:nth-child(3),
&:nth-child(5) {
border-right: 0;
border-top-right-radius: unset;
border-bottom-right-radius: unset;
}
}
}
10 changes: 10 additions & 0 deletions src/app/shared/ui/manga-page/manga-page-even.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { Component } from '@angular/core';

@Component({
selector: 'app-manga-page-even',
templateUrl: './manga-page-even.component.html',
styleUrl: './manga-page-even.component.scss'
})
export class MangaPageEvenComponent {

}
18 changes: 18 additions & 0 deletions src/app/shared/ui/manga-page/manga-page.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<section>
<ng-content select="[frame=1]"></ng-content>
</section>
<section>
<ng-content select="[frame=2]"></ng-content>
</section>
<section>
<ng-content select="[frame=3]"></ng-content>
</section>
<section>
<ng-content select="[frame=4]"></ng-content>
</section>
<section>
<ng-content select="[frame=5]"></ng-content>
</section>
<!-- <section>
<ng-content select="[frame=6]"></ng-content>
</section> -->
Loading

0 comments on commit 8ad749e

Please sign in to comment.