Add Docs

Co-authored-by: mrjvs <jellevs@gmail.com>

.eslintignore

@@ -0,0 +1,4 @@
+dist
+node_modules
+.output
+.nuxt

.eslintrc.cjs

@@ -0,0 +1,8 @@
+module.exports = {
+  root: true,
+  extends: '@nuxt/eslint-config',
+  rules: {
+    'vue/max-attributes-per-line': 'off',
+    'vue/multi-word-component-names': 'off'
+  }
+}

.gitignore

@@ -0,0 +1,12 @@
+node_modules
+*.iml
+.idea
+*.log*
+.nuxt
+.vscode
+.DS_Store
+coverage
+dist
+sw.*
+.env
+.output

.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

README.md

@@ -0,0 +1,57 @@
+# Docus Starter
+
+Starter template for [Docus](https://docus.dev).
+
+## Clone
+
+Clone the repository (using `nuxi`):
+
+```bash
+npx nuxi init -t themes/docus
+```
+
+## Setup
+
+Install dependencies:
+
+```bash
+yarn install
+```
+
+## Development
+
+```bash
+yarn dev
+```
+
+## Edge Side Rendering
+
+Can be deployed to Vercel Functions, Netlify Functions, AWS, and most Node-compatible environments.
+
+Look at all the available presets [here](https://v3.nuxtjs.org/guide/deploy/presets).
+
+```bash
+yarn build
+```
+
+## Static Generation
+
+Use the `generate` command to build your application.
+
+The HTML files will be generated in the .output/public directory and ready to be deployed to any static compatible hosting.
+
+```bash
+yarn generate
+```
+
+## Preview build
+
+You might want to preview the result of your build locally, to do so, run the following command:
+
+```bash
+yarn preview
+```
+
+---
+
+For a detailed explanation of how things work, check out [Docus](https://docus.dev).

app.config.ts

@@ -0,0 +1,18 @@
+export default defineAppConfig({
+  docus: {
+    title: 'movie-web',
+    description: 'For all your media scraping needs',
+    socials: {
+      github: 'movie-web/providers',
+    },
+    image: '',
+    aside: {
+      level: 0,
+      exclude: [],
+    },
+    header: {
+      logo: false,
+      title: "movie-web"
+    },
+  },
+});

content/0.index.md

@@ -0,0 +1,50 @@
+---
+title: "movie-web | For all your movie and TV show needs"
+navigation: false
+layout: page
+---
+
+::block-hero
+---
+cta:
+  - Get Started
+  - /introduction/getting-started
+secondary:
+  - Open on GitHub →
+  - https://github.com/movie-web/movie-web
+---
+
+#title
+movie-web
+
+#description
+A simple and no-BS app for watching movies and TV shows
+::
+
+::card-grid
+#title
+What's all the fuss?
+
+#root
+:ellipsis
+
+#default
+  ::card{icon="mdi:server-network"} 
+  #title
+  Easy to host
+  #description
+  movie-web can be easily hosted on any static website host.
+  ::
+  ::card{icon="material-symbols:hangout-video-off"}
+  #title
+  No ADs
+  #description
+  movie-web will never show ADs, enjoy watching without interruptions.
+  ::
+  ::card{icon="ic:baseline-ondemand-video"}
+  #title
+  Custom Player
+  #description
+  Enjoy a fully custom video player including streaming integration, subtitle customisation and easy TV season navigation.
+  ::
+::

content/1.introduction/1.getting-started.md

@@ -0,0 +1,2 @@
+# Getting Started
+

content/1.introduction/_dir.yml

@@ -0,0 +1,2 @@
+icon: ph:star-duotone
+navigation.redirect: /introduction/getting-started

content/2.self-hosting/1.self-hosting.md

@@ -0,0 +1,9 @@
+# How to self host
+
+::alert{type="info"}
+We **do not** provide support on how to self-host. If you can't figure it out then tough luck. Please do not make GitHub issues or ask in our Discord server for support on how to self-host.
+::
+
+The movie-web application is made of two parts: the proxy and the client. Click the following links to find out more:
+- [Setup the Proxy](2.proxy.md)
+- [Setup the Client](3.client.md)

content/2.self-hosting/2.proxy.md

@@ -0,0 +1,37 @@
+# Setting up the proxy
+
+Our proxy is used to bypass CORS-protected URLs on the client side, allowing users to make requests to protected endpoints without a backend server.
+
+The proxy is made using [Nitro by UnJS](https://nitro.unjs.io/) which supports building the proxy to work on multiple providers including Cloudflare Workers, AWS Lambda and [more...](https://nitro.unjs.io/deploy)
+
+Our recommended provider is Cloudflare due to its [generous free plan](https://www.cloudflare.com/en-gb/plans/developer-platform/).
+
+## Cloudflare Workers
+
+The proxy is made as a Cloudflare worker. Cloudflare has a generous free plan, so you don't need to pay anything unless you get hundreds of users.
+
+[![Deploy to Cloudflare Workers](https://deploy.workers.cloudflare.com/button)](https://deploy.workers.cloudflare.com/?url=https://github.com/movie-web/simple-proxy)
+
+1. Create a GitHub account at https://github.com if you don't have one.
+1. Click the "Deploy with workers" button above.
+1. Click the "Authorize Workers" button to authorise Cloudflare to talk to GitHub.
+1. Authorize Cloudflare Workers in the GitHub page that pops up.
+1. Follow the instructions to configure your Cloudflare account. Select "I have an account" if you have a Cloudflare account already, otherwise follow the link to create one.
+1. Click the link to "Workers Dashboard" to find your account ID.
+    1. If you have used workers in the past, there will be a place on the right hand side to copy your account ID.
+    1. If you haven't used workers before, you can copy your account ID from the URL e.g. https://dash.cloudflare.com/ab7cb454c93987b6343350d4e84c16c7/workers-and-pages/create where `ab7cb454c93987b6343350d4e84c16c7` is the account ID.
+    1. Paste the account ID into the text box on the original Cloudflare workers page.
+1. Click the link to "My Profile" to create an API token. 
+    1. Click "Create Token".
+    1. Select "Use template" next to "Edit Cloudflare Workers".
+    1. Under "Account Resources", select "Include" and your account under the dropdown.
+    1. Under "Zone Resources", select "All zones" (You can select a more specific zone if you have the zones available).
+    1. At the bottom of the page, click "Continue to summary".
+    1. On the next screen, click "Create token".
+    1. Copy the API token and **save it in a safe place, it won't be shown again**.
+    1. Paste the API token into the Cloudflare Workers API Token text box.
+1. Click "Fork the Repository" and follow the instructions to enable workflows.
+1. Click "Deploy" to deploy to Cloudflare Workers.
+1. Congratulations! Your worker is now deploying. Please wait for the GitHub Action to build and publish your worker. 
+1. You can click the "Worker dash" and "GitHub repo" buttons to see the status of the deploy.
+1. When the worker has deployed, you will need to take note of the URL. This can be found on Cloudflare under Workers and Pages -> Overview -> proxy.

content/2.self-hosting/3.client.md

@@ -0,0 +1,49 @@
+# Setting up the client
+
+## Vercel - Recommended
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fmovie-web%2Fmovie-web%2Ftree%2Fmaster&env=VITE_CORS_PROXY_URL,VITE_TMDB_READ_API_KEY)
+1. Click the Deploy button.
+1. Sign in using either a GitHub, GitLab, or Bitbucket.
+1. Follow the instructions to create a repository for movie-web.
+1. Configure the environment variables:
+   - `VITE_CORS_PROXY_URL`: Enter your proxy URL here. Make sure to not have a slash at the end of your URL.
+     
+     Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `https://test-proxy.test.workers.dev`
+   - `VITE_TMDB_READ_API_KEY`: Enter your TMDB Read Access Token here. Please read [below](#tmdb-api-key) on how to get an API key.
+1. Click "Deploy"
+1. Congrats! You have your own version of movie-web hosted.
+1. You may wish to configure a custom domain - Please consult [the Vercel docs for how to do this](https://vercel.com/docs/getting-started-with-vercel/domains).
+
+
+## Any Static Web Host
+1. Download the file `movie-web.zip` from the latest release: https://github.com/movie-web/movie-web/releases/latest.
+2. Extract the ZIP file so you can edit the files.
+3. Open `config.js` in an editor such as Notepad, Visual Studio Code or similar.
+4. Put your proxy URL in-between the double quotes of `VITE_CORS_PROXY_URL: ""`. Make sure to not have a slash at the end of your URL.
+
+   Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `VITE_CORS_PROXY_URL: "https://test-proxy.test.workers.dev"`
+5. Put your TMDB Read Access Token inside the quotes of `VITE_TMDB_READ_API_KEY: ""`. Please read [below](#tmdb-api-key) on how to get an API key.
+6. Save the file.
+7. Upload **all** of the files to a static website hosting such as:
+   - GitHub Pages
+   - Netlify
+   - Vercel
+   - Etc, there are lots - Google it if the ones above don't work for you.
+1. Congrats! You have your own version of movie-web hosted.
+
+
+## TMDB API Key
+In order to search for movies and TV shows, we use an API called "The Movie Database" (TMDB). In order for your client to be able to search, you need to generate an API key.
+
+::alert{type="info"}
+The API key is **free**, you just need to create an account.
+::
+
+1. Create an account at https://www.themoviedb.org/signup
+1. You will be required to verify your email; click the link that you get sent to verify your account.
+1. Go to https://www.themoviedb.org/settings/api/request to create a developer account.
+1. Read the terms and conditions and accept them.
+1. Fill out your details:
+    - Select "Website" as type of use.
+    - For the other details can put any values; they are not important. 
+1. Copy the "API Read Access Token" - **DO NOT COPY THE API Key - IT WILL NOT WORK**

content/2.self-hosting/4.client-config.md

@@ -0,0 +1,122 @@
+# Client Config Reference
+
+The config for the movie-web can be provided in 2 different ways, depending on how you are hosting movie-web:
+- If you are using a static web hoster (Such as Vercel, Netlify or Cloudflare pages), you can use [environment variables](#method-1-environment-variables).
+- If you are hosting movie-web using shared hosting (Such as cPanel or FTP), please use [the config file](#method-2-config-file).
+
+Both methods can specify any of the keys listed in the [Shared Config](#config-reference-shared-config) section.
+
+## Method 1 - Environment Variables
+The movie-web client can be configured using environment variables **at build time**. You cannot use this method if hosting the pre-built `movie-web.zip` files!
+
+Using environment variables to configure movie-web also allows configuration of some [environment variable specific keys](#config-reference-environment-variables-only).
+
+## Method 2 - Config File
+When using the pre-built `movie-web.zip`, you can set the configuration in the `config.js` file. 
+
+The `config.js` file contains a JavaScript object which must be set to the correct values:
+```js
+window.__CONFIG__ = {
+  // ... Config variables go here ...
+};
+```
+
+## Config Reference - Shared Config
+
+### `VITE_TMDB_READ_API_KEY` - REQUIRED
+
+This is the **read** API key from TMDB to allow movie-web to search for media. [Get one by following our guide](/self-hosting/client#tmdb-api-key).
+
+::alert{type="warning"}
+:icon{name="material-symbols:warning-rounded"} The example will not work for you, get your own
+::
+Example: <code style="overflow-wrap: anywhere">VITE_TMDB_READ_API_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c</code>
+
+### `VITE_CORS_PROXY_URL` - REQUIRED
+
+This is where you put proxy URLS, you must have at least one. [Get one by following our guide](/self-hosting/proxy#cloudflare-workers).
+
+You can add multiple workers by separating them by a comma, they will be load balanced using round robin method on the client.
+
+Worker url entries must **not** end with a slash.
+
+::alert{type="warning"}
+:icon{name="material-symbols:warning-rounded"} The example will not work for you, get your own
+::
+Example: `VITE_CORS_PROXY_URL=https://worker1.workers.dev,https://worker2.workers.dev`
+
+### `VITE_DMCA_EMAIL`
+
+This is the DMCA email for on the DMCA page. If this config value is present, a new page will be made and linked in the footer, where it will mention how to handle dmca take-down requests. If the configuration value left empty, the page will not exist.
+
+Example: `VITE_DMCA_EMAIL=dmca@example.com`
+
+Default: `""`
+
+### `VITE_NORMAL_ROUTER`
+
+The application has two routing modes: hash-router and history-router.
+Hash router is that every page is linked in the hash like so: `https://example.com/#/browse`.
+
+History router does routing without a hash like so: `https://example.com/browse`, this looks a lot nicer, but it requires that your hosting environment supports Single-Page-Application (SPA) redirects. If you don't know what that means, don't enable this.
+
+Setting this configuration value to `true` will enable the history-router.
+
+Example: `VITE_NORMAL_ROUTER=true`
+
+Default: `false`
+
+### `VITE_BACKEND_URL`
+This is the URL for the movie-web backend server which handles cross-device syncing.
+
+The backend server can be found at https://github.com/movie-web/backend and is offered as a [Docker](https://docs.docker.com/get-started/overview/) image for deployment.
+
+Example: `VITE_BACKEND_URL=https://backend.example.com`
+
+Default: `https://backend.movie-web.app`
+
+### `VITE_DISALLOWED_IDS`
+
+In the unfortunate event that you're been sent a DMCA take down notice. You will need to somehow disable some pages. This configuration key will allow you to disable specific ids.
+
+For shows, it needs to be in this format: `series-<TMDB_ID>`. For movies the format is this: `movie-<TMDB_ID>`.
+
+The list is comma separated, you can add as many as needed.
+
+Example: `VITE_DISALLOWED_IDS=series-123,movie-456`
+
+Default: `""`
+
+## Config reference - Environment Variables Only
+::alert{type="danger"}
+:icon{name="material-symbols:warning-rounded"} These configuration keys are specific to environment variables, they **only** work as environment variables **set at build time**.
+::
+
+
+### `VITE_PWA_ENABLED`
+**This key can only be configured through environment variables.**
+
+Set to `true` if you want to output a PWA application. Set to `false` or omit to get a normal web application.
+A PWA web application can be installed as an application to your phone or desktop computer, but can be tricky to manage and comes with a few footguns.
+Make sure you know what you're doing before enabling this, it **cannot be disabled** after you've set it up once.
+
+Example: `VITE_PWA_ENABLED=no`
+
+### `VITE_APP_DOMAIN`
+**This key can only be configured through environment variables.**
+
+The domain where the app lives. Only required when having OpenSearch enabled.
+
+The value must include the protocol (http/https) but must **not** end with a slash.
+
+Example: `VITE_APP_DOMAIN=https://movie-web.app`
+
+### `VITE_OPENSEARCH_ENABLED`
+**This key can only be configured through environment variables.**
+
+Whether to enable OpenSearch. (the feature that allows a user to add a search engine to their browser). A
+when enabling you **must** also set `VITE_APP_DOMAIN`.
+
+`VITE_OPENSEARCH_ENABLED` must be set to `true` to be enabled. Anything else will be treated as turned off, it's case sensitive so `True` will also be disabled.
+
+Example: `VITE_OPENSEARCH_ENABLED=true`

content/2.self-hosting/_dir.yml

@@ -0,0 +1,2 @@
+title: 'Self-Hosting'
+icon: mdi:server-network

nuxt.config.ts

@@ -0,0 +1,11 @@
+export default defineNuxtConfig({
+  // https://github.com/nuxt-themes/docus
+  extends: '@nuxt-themes/docus',
+  devtools: { enabled: true },
+
+  modules: [
+    // Remove it if you don't use Plausible analytics
+    // https://github.com/nuxt-modules/plausible
+    '@nuxtjs/plausible'
+  ]
+})

package.json

@@ -0,0 +1,21 @@
+{
+  "name": "docus-starter",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "nuxi dev",
+    "build": "nuxi build",
+    "generate": "nuxi generate",
+    "preview": "nuxi preview",
+    "lint": "eslint ."
+  },
+  "devDependencies": {
+    "@nuxt-themes/docus": "latest",
+    "@nuxt/devtools": "^0.8.5",
+    "@nuxt/eslint-config": "^0.2.0",
+    "@nuxtjs/plausible": "^0.2.3",
+    "@types/node": "^20.8.2",
+    "eslint": "^8.50.0",
+    "nuxt": "^3.7.4"
+  }
+}

renovate.json

@@ -0,0 +1,8 @@
+{
+    "extends": [
+      "@nuxtjs"
+    ],
+    "lockFileMaintenance": {
+      "enabled": true
+    }
+}

tokens.config.ts

@@ -0,0 +1,18 @@
+import { defineTheme } from 'pinceau'
+
+export default defineTheme({
+  color: {
+    primary: {
+      50: "#F5E5FF",
+      100: "#E7CCFF",
+      200: "#D4A9FF",
+      300: "#BE85FF",
+      400: "#A861FF",
+      500: "#8E3DFF",
+      600: "#7F36D4",
+      700: "#662CA6",
+      800: "#552578",
+      900: "#441E49"
+    }
+  }
+})

tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}