From 85e30f0335788a4ee6e6b3c362a3857600ed5f19 Mon Sep 17 00:00:00 2001 From: Krzysztof Moch Date: Thu, 26 Oct 2023 08:54:14 +0200 Subject: [PATCH] feat: move docs to github pages (#3296) * feat(docs): setup nextra * feat(docs): add pages * docs: update introduction page * docs: fix typos * docs: fix links * docs: update README * docs: sync with master * docs: remove old docs * fix(ci/docs): fix typos * fix(ci/docs): fix docs setup * fix(docs): update next config * chore(ci/docs): clean up * chore(docs): add meta tags * chore: apply review changes * docs: move drm into api section * docs: fix next config * docs: fix links * docs: add methods section * chore: sync with main * docs: add missing onAudio events --- .github/actions/setup-bun/action.yml | 34 + .github/workflows/ci.yml | 1 + .github/workflows/deploy-docs.yml | 46 + API.md | 1947 ----------------- README.md | 65 +- docs/.gitignore | 3 + docs/README.md | 15 + .../AppTransportSecuritySetting.png | Bin docs/{ => assets}/tvOS-step-1.jpg | Bin docs/{ => assets}/tvOS-step-2.jpg | Bin docs/{ => assets}/tvOS-step-3.jpg | Bin docs/{ => assets}/tvOS-step-4.jpg | Bin docs/bun.lockb | Bin 0 -> 154871 bytes docs/next-env.d.ts | 5 + docs/next.config.js | 28 + docs/package.json | 20 + docs/pages/_meta.json | 21 + docs/pages/component/_meta.json | 6 + docs/{DRM.md => pages/component/drm.md} | 5 +- docs/pages/component/events.md | 510 +++++ docs/pages/component/methods.md | 182 ++ docs/pages/component/props.md | 795 +++++++ docs/pages/index.md | 77 + docs/pages/installation.md | 247 +++ docs/pages/other/_meta.json | 5 + docs/{ => pages/other}/caching.md | 10 +- docs/{DEBUGGING.md => pages/other/debug.md} | 26 +- docs/pages/other/misc.md | 78 + docs/{PROJECTS.md => pages/projects.md} | 8 +- docs/pages/updating.md | 107 + docs/theme.config.jsx | 39 + package.json | 1 + 32 files changed, 2289 insertions(+), 1992 deletions(-) create mode 100644 .github/actions/setup-bun/action.yml create mode 100644 .github/workflows/deploy-docs.yml delete mode 100644 API.md create mode 100644 docs/.gitignore create mode 100644 docs/README.md rename docs/{ => assets}/AppTransportSecuritySetting.png (100%) rename docs/{ => assets}/tvOS-step-1.jpg (100%) rename docs/{ => assets}/tvOS-step-2.jpg (100%) rename docs/{ => assets}/tvOS-step-3.jpg (100%) rename docs/{ => assets}/tvOS-step-4.jpg (100%) create mode 100755 docs/bun.lockb create mode 100644 docs/next-env.d.ts create mode 100644 docs/next.config.js create mode 100644 docs/package.json create mode 100644 docs/pages/_meta.json create mode 100644 docs/pages/component/_meta.json rename docs/{DRM.md => pages/component/drm.md} (97%) create mode 100644 docs/pages/component/events.md create mode 100644 docs/pages/component/methods.md create mode 100644 docs/pages/component/props.md create mode 100644 docs/pages/index.md create mode 100644 docs/pages/installation.md create mode 100644 docs/pages/other/_meta.json rename docs/{ => pages/other}/caching.md (89%) rename docs/{DEBUGGING.md => pages/other/debug.md} (71%) create mode 100644 docs/pages/other/misc.md rename docs/{PROJECTS.md => pages/projects.md} (66%) create mode 100644 docs/pages/updating.md create mode 100644 docs/theme.config.jsx diff --git a/.github/actions/setup-bun/action.yml b/.github/actions/setup-bun/action.yml new file mode 100644 index 00000000..91390992 --- /dev/null +++ b/.github/actions/setup-bun/action.yml @@ -0,0 +1,34 @@ +name: setup bun +description: Setup bun and install dependencies + +inputs: + working-directory: + description: 'working directory for action' + default: ./ + required: false + +runs: + using: composite + steps: + - name: Setup Bun + uses: oven-sh/setup-bun@v1 + with: + bun-version: 1.0.4 + + - name: Cache dependencies + id: bun-cache + uses: actions/cache@v3 + with: + path: | + **/node_modules + key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**/package.json') }} + restore-keys: | + ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }} + ${{ runner.os }}-bun- + + - name: Install dependencies + working-directory: github.event.inputs.working-directory + if: steps.bun-cache.outputs.cache-hit != 'true' + run: bun install + shell: bash + \ No newline at end of file diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 4ade3875..4f0b43f3 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -3,6 +3,7 @@ on: [push, pull_request] jobs: build: runs-on: ubuntu-latest + steps: - uses: actions/checkout@v3 - uses: actions/setup-node@v3 diff --git a/.github/workflows/deploy-docs.yml b/.github/workflows/deploy-docs.yml new file mode 100644 index 00000000..76f55f9e --- /dev/null +++ b/.github/workflows/deploy-docs.yml @@ -0,0 +1,46 @@ + +name: deploy docs +on: + workflow_dispatch: + push: + branches: + - master + paths: + - '.github/workflows/deploy-docs.yml' + - 'docs/**' + +jobs: + deploy-docs: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v3 + + - name: Setup + uses: ./.github/actions/setup-bun + with: + working-directory: ./docs + + - name: Cache build + uses: actions/cache@v3 + with: + path: | + docs/.next/cache + key: ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**/package.json') }} + restore-keys: | + ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }} + ${{ runner.os }}-nextjs- + + - name: Build docs + run: | + bun --cwd docs build + touch docs/out/.nojekyll + + - name: Deploy docs to GitHub Pages + uses: JamesIves/github-pages-deploy-action@v4 + with: + branch: gh-pages + folder: docs/out + +permissions: + contents: write \ No newline at end of file diff --git a/API.md b/API.md deleted file mode 100644 index b1b25899..00000000 --- a/API.md +++ /dev/null @@ -1,1947 +0,0 @@ -## Table of Contents - -* [Installation](#installation) - * [iOS](#ios-installation) - * [tvOS](#tvos-installation) - * [Android](#android-installation) - * [Windows](#windows-installation) -* [Examples](#examples) - * [iOS](#ios-example) - * [Android](#android-example) - * [Windows](#windows-example) -* [Usage](#usage) -* [iOS App Transport Security](#ios-app-transport-security) -* [Audio Mixing](#audio-mixing) -* [Android Expansion File Usage](#android-expansion-file-usage) -* [Updating](#updating) -* [Contributing](#contributing) - -## Installation - -Using npm: - -```shell -npm install --save react-native-video -``` - -or using yarn: - -```shell -yarn add react-native-video -``` - -Then follow the instructions for your platform to link react-native-video into your project: - -### iOS installation -
- iOS details - -#### Standard Method - -**React Native 0.60 and above** - -Run `npx pod-install`. Linking is not required in React Native 0.60 and above. - -**React Native 0.59 and below** - -Run `react-native link react-native-video` to link the react-native-video library. - -#### Enable Static Linking for dependencies in your ios project Podfile - -Add `use_frameworks! :linkage => :static` just under `platform :ios` in your ios project Podfile. - -[See the example ios project for reference](examples/basic/ios/Podfile#L5) - -#### Using CocoaPods (required to enable caching) - -Setup your Podfile like it is described in the [react-native documentation](https://facebook.github.io/react-native/docs/integration-with-existing-apps#configuring-cocoapods-dependencies). - -Depending on your requirements you have to choose between the two possible subpodspecs: - -Video only: - -```diff - pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec' -+ `pod 'react-native-video', :path => '../node_modules/react-native-video/react-native-video.podspec'` -end -``` - -Video with caching ([more info](docs/caching.md)): - -```diff - pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec' -+ `pod 'react-native-video/VideoCaching', :path => '../node_modules/react-native-video/react-native-video.podspec'` -end -``` - -#### Enable custom feature in podfile file - -##### Google IMA - -Google IMA is the google SDK to support Client Side Ads Integration (CSAI), see [google documentation](https://developers.google.com/interactive-media-ads/docs/sdks/ios/client-side) for more informations. - -To enable google IMA usage define add following line in your podfile: -```podfile -$RNVideoUseGoogleIMA=true -``` - -
- -### tvOS installation -
- tvOS details - -`react-native link react-native-video` doesn’t work properly with the tvOS target so we need to add the library manually. - -First select your project in Xcode. - - - -After that, select the tvOS target of your application and select « General » tab - - - -Scroll to « Linked Frameworks and Libraries » and tap on the + button - - - -Select RCTVideo-tvOS - - -
- -### Android installation -
- Android details - -Linking is not required in React Native 0.60 and above. -If your project is using React Native < 0.60, run `react-native link react-native-video` to link the react-native-video library. - -Or if you have trouble, make the following additions to the given files manually: - -#### **android/settings.gradle** - -Add player source in build configuration - -```gradle -include ':react-native-video' -project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android') -``` - -#### **android/app/build.gradle** - -From version >= 5.0.0, you have to apply these changes: - -```diff -dependencies { - ... - compile project(':react-native-video') -+ implementation "androidx.appcompat:appcompat:1.0.0" -- implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}" - -} -``` - -#### **android/gradle.properties** - -Migrating to AndroidX (needs version >= 5.0.0): - -```gradle.properties -android.useAndroidX=true -android.enableJetifier=true -``` - -#### **MainApplication.java** - -If using com.facebook.react.PackageList to auto import native dependencies, there are no updates required here. Please see the android example project for more details. -/examples/basic/android/app/src/main/java/com/videoplayer/MainApplication.java - -##### For manual linking - -On top, where imports are: - -```java -import com.brentvatne.react.ReactVideoPackage; -``` - -Add the `ReactVideoPackage` class to your list of exported packages. - -```java -@Override -protected List getPackages() { - return Arrays.asList( - new MainReactPackage(), - new ReactVideoPackage() - ); -} -``` - -#### Enable custom feature in gradle file - -##### Enable client side ads insertion -To enable client side ads insertion CSAI with google IMA SDK, you need to enable it in your gradle file. - -```gradle -buildscript { - ext { - ... - RNVUseExoplayerIMA = true - ... - } -} -``` -
- -### Windows installation -
- Windows RNW C++/WinRT details - -#### Autolinking - -**React Native Windows 0.63 and above** - -Autolinking should automatically add react-native-video to your app. - -#### Manual Linking - -**React Native Windows 0.62** - -Make the following additions to the given files manually: - -##### **windows\myapp.sln** - -Add the _ReactNativeVideoCPP_ project to your solution (eg. `windows\myapp.sln`): - -1. Open your solution in Visual Studio 2019 -2. Right-click Solution icon in Solution Explorer > Add > Existing Project... -3. Select `node_modules\react-native-video\windows\ReactNativeVideoCPP\ReactNativeVideoCPP.vcxproj` - -##### **windows\myapp\myapp.vcxproj** - -Add a reference to _ReactNativeVideoCPP_ to your main application project (eg. `windows\myapp\myapp.vcxproj`): - -1. Open your solution in Visual Studio 2019 -2. Right-click main application project > Add > Reference... -3. Check _ReactNativeVideoCPP_ from Solution Projects - -##### **pch.h** - -Add `#include "winrt/ReactNativeVideoCPP.h"`. - -##### **app.cpp** - -Add `PackageProviders().Append(winrt::ReactNativeVideoCPP::ReactPackageProvider());` before `InitializeComponent();`. - -**React Native Windows 0.61 and below** - -Follow the manual linking instuctions for React Native Windows 0.62 above, but substitute _ReactNativeVideoCPP61_ for _ReactNativeVideoCPP_. - -
- -## Examples - -Run `yarn xbasic install` in the root directory before running any of the examples. - -### iOS Example -``` -yarn xbasic ios -``` - -### Android Example -``` -yarn xbasic android -``` - -### Windows Example -``` -yarn xbasic windows -``` - -## Usage - -```javascript -// Load the module - -import Video from 'react-native-video'; - -// Within your render function, assuming you have a file called -// "background.mp4" in your project. You can include multiple videos -// on a single screen if you like. - -