dunkirk.sh
pstream is dead; long live pstream
taciturnaxolotl.github.io/pstream-ng/
update about with faq
+261
-28
+123
-9
src/assets/locales/en.json
+123
-9
src/assets/locales/en.json
···
1
1
{
2
2
"about": {
3
-
"description": "P-Stream is a fork of movie-web that is ensured to stay up even after the shutdown of movie-web.app. P-Stream runs on a private, self-hosted VPS. I run this site at a loss; there are no ads due to my beliefs in free media.",
3
+
"description": "P-Stream is a fork of movie-web that is ensured to stay up even after the shutdown of movie-web.app. P-Stream runs on a private, self-hosted VPS. I run this site at a loss; there are very minimal ads due to my beliefs in free media.",
4
+
"help": "Can't find an answer? <0>Get support here.</0>",
4
5
"faqTitle": "Common questions",
6
+
"searchPlaceholder": "Search FAQ...",
7
+
"sections": {
8
+
"general": "General",
9
+
"search": "Search & Content Availability",
10
+
"playback": "Playback Issues",
11
+
"connections": "Connections",
12
+
"language": "Language & Subtitle Settings"
13
+
},
5
14
"q1": {
15
+
"title": "Where does the content come from?",
6
16
"body": "P-Stream does not host any content. When you click on something to watch, the internet is searched for the selected media (On the loading screen and in the 'video sources' tab you can see which source you're using). Media never gets uploaded by P-Stream, everything is through this searching mechanism.",
7
-
"title": "Where does the content come from?"
17
+
"section": "general"
8
18
},
9
19
"q2": {
20
+
"title": "Where can I request a show or movie?",
10
21
"body": "It's not possible to request a show or movie, P-Stream does not manage any content. All content is viewed through sources on the internet.",
11
-
"title": "Where can I request a show or movie?"
22
+
"section": "search"
12
23
},
13
24
"q3": {
25
+
"title": "The search results display the show or movie, why can't I play it?",
14
26
"body": "Our search results are powered by The Movie Database (TMDB) and display regardless of whether our sources actually have the content.",
15
-
"title": "The search results display the show or movie, why can't I play it?"
27
+
"section": "search"
16
28
},
17
29
"q4": {
30
+
"title": "What about my data and stuff?",
18
31
"body": "All data is synced to the community backend, anyone is free to use this as well.",
19
-
"title": "What about my data and stuff?"
32
+
"section": "general"
20
33
},
21
34
"q5": {
35
+
"title": "How can I find out more?",
22
36
"body": "P-Stream has a Discord server that can be found at the header of this page!",
23
-
"title": "How can I find out more?"
37
+
"section": "general"
24
38
},
25
-
"title": "About P-Stream (^▽^)"
39
+
"q6": {
40
+
"title": "Is there a P-Stream app?",
41
+
"body": "Not yet, but you can install it as a PWA (Progressive Web App). On iOS, use Safari → Share → Add to Home Screen. On Android, use Chrome → 3 dots → Add to Home Screen. An experimental APK is available via our Discord, but it's not recommended.",
42
+
"section": "general"
43
+
},
44
+
"q7": {
45
+
"title": "How do I make an account?",
46
+
"body": "Tap \"Sync to Cloud\" in the dropdown menu or go to Settings to create and sync a community account.",
47
+
"section": "general"
48
+
},
49
+
"q9": {
50
+
"title": "This media is missing / Can I request media?",
51
+
"body": "No—since we don't host content, we cannot add or change what's available. The content list is based on what's publicly accessible through the search mechanism.",
52
+
"section": "search"
53
+
},
54
+
"q10": {
55
+
"title": "I can't find the movie/show I'm searching for!",
56
+
"body": "TMDB powers our search. Try tapping the 🔎 icon for advanced search options if results aren't accurate.",
57
+
"section": "search"
58
+
},
59
+
"q11": {
60
+
"title": "Why am I seeing a black screen?",
61
+
"body": "Likely a corrupt or broken video file. Try switching sources.",
62
+
"section": "playback"
63
+
},
64
+
"q12": {
65
+
"title": "The episode I'm watching is incorrect.",
66
+
"body": "Switch to a different source. We don't control any content or episode accuracy.",
67
+
"section": "playback"
68
+
},
69
+
"q13": {
70
+
"title": "The video quality isn't what I expected.",
71
+
"body": "Try switching sources. Quality varies by provider; FED API often offers more options.",
72
+
"section": "playback"
73
+
},
74
+
"q14": {
75
+
"title": "4K isn't available.",
76
+
"body": "If 4K is not shown, it's likely unavailable from that source.",
77
+
"section": "playback"
78
+
},
79
+
"q15": {
80
+
"title": "Why is there no audio?",
81
+
"body": "Ensure your device isn't muted and try switching sources. Audio issues may be source-specific.",
82
+
"section": "playback"
83
+
},
84
+
"q16": {
85
+
"title": "The video is tinted or washed out.",
86
+
"body": "Could be a faulty file or an HDR video. Ensure your device supports HDR, or switch sources.",
87
+
"section": "playback"
88
+
},
89
+
"q17": {
90
+
"title": "I'm experiencing visual glitches.",
91
+
"body": "Visual bugs usually come from poor file uploads. Try switching sources.",
92
+
"section": "playback"
93
+
},
94
+
"q18": {
95
+
"title": "The source is loading slowly.",
96
+
"body": "Speed depends on the hosting site. Switch to another source for better performance.",
97
+
"section": "playback"
98
+
},
99
+
"q19": {
100
+
"title": "How do I switch sources?",
101
+
"body": "While playing, tap the ⚙️ icon, then choose another source under \"video sources\".",
102
+
"section": "playback"
103
+
},
104
+
"q20": {
105
+
"title": "What is FED API?",
106
+
"body": "FED API is our private scraper that pulls streams directly from Febbox. Each free Febbox account includes 100 GB/month of unlimited bandwidth, and we use your UI token to scrape content as if you're watching it yourself. Setup is easiest via desktop browser, but mobile instructions are available on our Discord.",
107
+
"section": "connections"
108
+
},
109
+
"q21": {
110
+
"title": "Does FED API work on all devices?",
111
+
"body": "Yes. Once set up, your token works across all logged-in devices.",
112
+
"section": "connections"
113
+
},
114
+
"q22": {
115
+
"title": "Why do I need the extension or custom proxy?",
116
+
"body": "Some sources block scrapers. The extension acts like a local proxy and bypasses such blocks using your IP, headers, and cookies.",
117
+
"section": "connections"
118
+
},
119
+
"q23": {
120
+
"title": "What is the extension? Is it safe?",
121
+
"body": "It's a local proxy tool used to access streams that restrict scrapers. It mimics your browsing session. It's also completly opensource and can be found on our github.",
122
+
"section": "connections"
123
+
},
124
+
"q24": {
125
+
"title": "My febbox token fails during setup. What should I do?",
126
+
"body": "Your ISP might be blocking FED API. Set a custom DNS like 1.1.1.1 or NextDNS. You can also change your region in the admin panel.",
127
+
"section": "connections"
128
+
},
129
+
"q25": {
130
+
"title": "How do I change languages?",
131
+
"body": "We prioritize English, but some sources offer other languages. Try switching sources. For FED API, only Safari supports audio switching in MP4 files.",
132
+
"section": "language"
133
+
},
134
+
"q26": {
135
+
"title": "My subtitles aren't in sync.",
136
+
"body": "Use the \"Customize\" option in subtitle settings or tap [ and ] on your keyboard to adjust. You can also upload your own subtitle file.",
137
+
"section": "language"
138
+
},
139
+
"title": "About P-Stream and FAQ (^▽^)"
26
140
},
27
141
"actions": {
28
142
"copied": "Copied",
···
104
218
"global": {
105
219
"name": "P-Stream",
106
220
"pages": {
107
-
"about": "About",
221
+
"about": "About and FAQ",
108
222
"dmca": "DMCA",
109
223
"discover": "Discover",
110
224
"support": "Support",
···
311
425
"offline": "Check your internet connection, silly goose! 🦢"
312
426
},
313
427
"menu": {
314
-
"about": "About us",
428
+
"about": "About and FAQ",
315
429
"logout": "Log out",
316
430
"register": "Sync to Cloud",
317
431
"settings": "Settings",
+2
-1
src/components/form/SearchBar.tsx
+2
-1
src/components/form/SearchBar.tsx
···
13
13
value: string;
14
14
isSticky?: boolean;
15
15
isInFeatured?: boolean;
16
+
hideTooltip?: boolean;
16
17
}
17
18
18
19
export const SearchBarInput = forwardRef<HTMLInputElement, SearchBarProps>(
···
101
102
placeholder={props.placeholder}
102
103
/>
103
104
104
-
{showTooltip && (
105
+
{showTooltip && !props.hideTooltip && (
105
106
<div className="py-4">
106
107
<p className="font-bold text-sm mb-1 text-search-text">
107
108
Advanced Search:
+136
-18
src/pages/About.tsx
+136
-18
src/pages/About.tsx
···
1
1
import classNames from "classnames";
2
-
import { useTranslation } from "react-i18next";
2
+
import { useRef, useState } from "react";
3
+
import { Trans, useTranslation } from "react-i18next";
3
4
import { useNavigate } from "react-router-dom";
4
5
6
+
import { SearchBarInput } from "@/components/form/SearchBar";
5
7
import { ThinContainer } from "@/components/layout/ThinContainer";
8
+
import { MwLink } from "@/components/text/Link";
6
9
import { Ol } from "@/components/utils/Ol";
7
10
import { Heading1, Heading2, Paragraph } from "@/components/utils/Text";
8
11
import { PageTitle } from "@/pages/parts/util/PageTitle";
···
39
42
);
40
43
}
41
44
45
+
function SectionHeading(props: { title: string }) {
46
+
return (
47
+
<h3 className="text-white font-medium text-lg my-8 pt-4">{props.title}</h3>
48
+
);
49
+
}
50
+
51
+
type SectionKey =
52
+
| "general"
53
+
| "search"
54
+
| "playback"
55
+
| "connections"
56
+
| "language";
57
+
58
+
interface Sections {
59
+
general: JSX.Element[];
60
+
search: JSX.Element[];
61
+
playback: JSX.Element[];
62
+
connections: JSX.Element[];
63
+
language: JSX.Element[];
64
+
}
65
+
42
66
export function AboutPage() {
43
67
const { t } = useTranslation();
44
68
const navigate = useNavigate();
69
+
const [searchQuery, setSearchQuery] = useState("");
70
+
const searchRef = useRef<HTMLInputElement>(null);
71
+
72
+
const questionKeys = Object.keys(t("about", { returnObjects: true }))
73
+
.filter((key) => key.startsWith("q"))
74
+
.sort((a, b) => parseInt(a.slice(1), 10) - parseInt(b.slice(1), 10));
75
+
76
+
const sections: Sections = {
77
+
general: [],
78
+
search: [],
79
+
playback: [],
80
+
connections: [],
81
+
language: [],
82
+
};
83
+
84
+
questionKeys.forEach((key) => {
85
+
const section = t(`about.${key}.section`) as SectionKey;
86
+
if (section && sections[section]) {
87
+
sections[section].push(
88
+
<Question title={t(`about.${key}.title`)}>
89
+
{t(`about.${key}.body`)}
90
+
</Question>,
91
+
);
92
+
}
93
+
});
94
+
95
+
const allFaqItems = [
96
+
...sections.general,
97
+
...sections.search,
98
+
...sections.playback,
99
+
...sections.connections,
100
+
...sections.language,
101
+
];
102
+
103
+
const filteredItems = allFaqItems.filter((item: JSX.Element) => {
104
+
try {
105
+
const title = item?.props?.title?.toLowerCase() || "";
106
+
const body = item?.props?.children?.toLowerCase() || "";
107
+
const query = searchQuery.toLowerCase();
108
+
return title.includes(query) || body.includes(query);
109
+
} catch (e) {
110
+
return false;
111
+
}
112
+
});
113
+
114
+
const showFilteredItems = searchQuery.length > 0;
45
115
46
116
return (
47
117
<SubPageLayout>
···
49
119
<ThinContainer>
50
120
<Heading1>{t("about.title")}</Heading1>
51
121
<Paragraph>{t("about.description")}</Paragraph>
52
-
<Heading2>{t("about.faqTitle")}</Heading2>
53
-
<Ol
54
-
items={[
55
-
<Question title={t("about.q1.title")}>
56
-
{t("about.q1.body")}
57
-
</Question>,
58
-
<Question title={t("about.q2.title")}>
59
-
{t("about.q2.body")}
60
-
</Question>,
61
-
<Question title={t("about.q3.title")}>
62
-
{t("about.q3.body")}
63
-
</Question>,
64
-
<Question title={t("about.q4.title")}>
65
-
{t("about.q4.body")}
66
-
</Question>,
67
-
]}
68
-
/>
122
+
123
+
<div>
124
+
<SearchBarInput
125
+
ref={searchRef}
126
+
value={searchQuery}
127
+
onChange={(value) => setSearchQuery(value)}
128
+
onUnFocus={() => {}}
129
+
placeholder={t("about.searchPlaceholder")}
130
+
hideTooltip
131
+
/>
132
+
</div>
133
+
<div className="pt-4">
134
+
<Trans i18nKey="about.help">
135
+
<MwLink url="/support" />
136
+
</Trans>
137
+
</div>
138
+
139
+
<Heading2 className="mt-10">{t("about.faqTitle")}</Heading2>
140
+
141
+
{showFilteredItems ? (
142
+
<Ol items={filteredItems} />
143
+
) : (
144
+
<>
145
+
{/* General Section */}
146
+
{sections.general.length > 0 && (
147
+
<>
148
+
<SectionHeading title={t("about.sections.general")} />
149
+
<Ol items={sections.general} />
150
+
</>
151
+
)}
152
+
153
+
{/* Search Section */}
154
+
{sections.search.length > 0 && (
155
+
<>
156
+
<SectionHeading title={t("about.sections.search")} />
157
+
<Ol items={sections.search} />
158
+
</>
159
+
)}
160
+
161
+
{/* Playback Section */}
162
+
{sections.playback.length > 0 && (
163
+
<>
164
+
<SectionHeading title={t("about.sections.playback")} />
165
+
<Ol items={sections.playback} />
166
+
</>
167
+
)}
168
+
169
+
{/* FED API Section */}
170
+
{sections.connections.length > 0 && (
171
+
<>
172
+
<SectionHeading title={t("about.sections.connections")} />
173
+
<Ol items={sections.connections} />
174
+
</>
175
+
)}
176
+
177
+
{/* Language Section */}
178
+
{sections.language.length > 0 && (
179
+
<>
180
+
<SectionHeading title={t("about.sections.language")} />
181
+
<Ol items={sections.language} />
182
+
</>
183
+
)}
184
+
</>
185
+
)}
186
+
69
187
<div
70
188
style={{ display: "flex", justifyContent: "space-between" }}
71
189
className="pt-2 w-full"