From 3bdc7cb4aab790f82085e5e5c1e5023fc873b742 Mon Sep 17 00:00:00 2001 From: szekelyzol Date: Tue, 10 Oct 2023 18:24:18 +0200 Subject: [PATCH 1/3] Add missing image alt tags p2 --- .../player-customization.md | 20 +++++++++---------- .../get-started/azure-migration.md | 20 +++++++++---------- .../working-with-live-streams.md | 4 ++-- templates/documentation/reference/README.md | 2 +- .../reference/postman-collection.md | 4 ++-- .../sdks/nocode/bubbleio-api-calls.md | 18 ++++++++--------- .../sdks/nocode/bubbleio-player-element.md | 8 ++++---- .../sdks/nocode/bubbleio-plugin.md | 4 ++-- .../sdks/nocode/bubbleio-uploader.md | 2 +- .../documentation/sdks/nocode/contentful.md | 4 ++-- .../sdks/nocode/live-stream-created.md | 2 +- templates/documentation/sdks/nocode/zapier.md | 2 +- .../vod/add-a-thumbnail-to-your-video.md | 2 +- .../vod/get-started-in-5-minutes.md | 2 +- .../documentation/vod/show-video-details.md | 4 ++-- 15 files changed, 49 insertions(+), 49 deletions(-) diff --git a/templates/documentation/delivery-analytics/player-customization.md b/templates/documentation/delivery-analytics/player-customization.md index 2b12370f..644220df 100644 --- a/templates/documentation/delivery-analytics/player-customization.md +++ b/templates/documentation/delivery-analytics/player-customization.md @@ -35,16 +35,16 @@ You can add a clickable custom company logo to your videos. | Parameter Name | Description | Type | Default | |------------------|------------------------------------------------------|---------|--------------------------| | `name` | The name of the player theme | string | | -| `text` | RGBA color for timer text. ![](/_assets/delivery-analytics/player-customization/fac4eaf-Screenshot_2023-03-13_at_10.49.30.png) | string | rgba(255, 255, 255, 1) | -| `link` | RGBA color for all controls. ![](/_assets/delivery-analytics/player-customization/12127f5-Screenshot_2023-03-13_at_10.53.12.png) | string | rgba(255, 255, 255, 1) | -| `linkHover` | RGBA color for controls when hovering over. ![](/_assets/delivery-analytics/player-customization/e72c530-Screenshot_2023-03-13_at_10.58.17.png) | string | rgba(255, 255, 255, 1) | -| `linkActive` | RGBA color for the play button when hovered. ![](/_assets/delivery-analytics/player-customization/cb636b9-Screenshot_2023-03-13_at_11.02.36.png) | string | rgba(255, 255, 255, 1) | -| `trackPlayed` | RGBA color playback bar: played content. ![](/_assets/delivery-analytics/player-customization/bea91e5-Screenshot_2023-03-13_at_11.07.45.png) | string | rgba(88, 131, 255, .95) | -| `trackUnplayed` | RGBA color playback bar: downloaded but unplayed (buffered) content. ![](/_assets/delivery-analytics/player-customization/fabe2f3-Screenshot_2023-03-13_at_11.13.49.png) | string | rgba(255, 255, 255, .35) | -| `trackBackground`| RGBA color playback bar: background. ![](/_assets/delivery-analytics/player-customization/255d36f-Screenshot_2023-03-13_at_11.16.25.png) | string | rgba(255, 255, 255, .2) | -| `backgroundTop` | RGBA color: top 50% of background. ![](/_assets/delivery-analytics/player-customization/5a5e240-Screenshot_2023-03-13_at_11.20.17.png) | string | rgba(0, 0, 0, .7) | -| `backgroundBottom`| RGBA color: bottom 50% of background. ![](/_assets/delivery-analytics/player-customization/554522c-Screenshot_2023-03-13_at_11.23.41.png) | string | rgba(0, 0, 0, .7) | -| `backgroundText` | RGBA color for title text. ![](/_assets/delivery-analytics/player-customization/8ef21b7-Screenshot_2023-03-13_at_11.26.03.png) | string | rgba(255, 255, 255, 1) | +| `text` | RGBA color for timer text. ![Setting the timer text color](/_assets/delivery-analytics/player-customization/fac4eaf-Screenshot_2023-03-13_at_10.49.30.png) | string | rgba(255, 255, 255, 1) | +| `link` | RGBA color for all controls. ![Setting the player control color](/_assets/delivery-analytics/player-customization/12127f5-Screenshot_2023-03-13_at_10.53.12.png) | string | rgba(255, 255, 255, 1) | +| `linkHover` | RGBA color for controls when hovering over. ![Setting the player control hover color](/_assets/delivery-analytics/player-customization/e72c530-Screenshot_2023-03-13_at_10.58.17.png) | string | rgba(255, 255, 255, 1) | +| `linkActive` | RGBA color for the play button when hovered. ![Setting the play button hover color](/_assets/delivery-analytics/player-customization/cb636b9-Screenshot_2023-03-13_at_11.02.36.png) | string | rgba(255, 255, 255, 1) | +| `trackPlayed` | RGBA color playback bar: played content. ![Setting the playback bar color for already played section](/_assets/delivery-analytics/player-customization/bea91e5-Screenshot_2023-03-13_at_11.07.45.png) | string | rgba(88, 131, 255, .95) | +| `trackUnplayed` | RGBA color playback bar: downloaded but unplayed (buffered) content. ![Setting the playback bar color for unplayed, buffered section](/_assets/delivery-analytics/player-customization/fabe2f3-Screenshot_2023-03-13_at_11.13.49.png) | string | rgba(255, 255, 255, .35) | +| `trackBackground`| RGBA color playback bar: background. ![Setting the playback bar background color](/_assets/delivery-analytics/player-customization/255d36f-Screenshot_2023-03-13_at_11.16.25.png) | string | rgba(255, 255, 255, .2) | +| `backgroundTop` | RGBA color: top 50% of background. ![Setting the player's top 50% background color](/_assets/delivery-analytics/player-customization/5a5e240-Screenshot_2023-03-13_at_11.20.17.png) | string | rgba(0, 0, 0, .7) | +| `backgroundBottom`| RGBA color: bottom 50% of background. ![Setting the player's lower 50% background color](/_assets/delivery-analytics/player-customization/554522c-Screenshot_2023-03-13_at_11.23.41.png) | string | rgba(0, 0, 0, .7) | +| `backgroundText` | RGBA color for title text. ![Setting the title text color](/_assets/delivery-analytics/player-customization/8ef21b7-Screenshot_2023-03-13_at_11.26.03.png) | string | rgba(255, 255, 255, 1) | | `enableControls` | Enabled or disabled player controls. | boolean | True | | `enableApi` | Enable/disable player SDK access. | boolean | True | | `forceAutoplay` | Enable/disable player autoplay. | boolean | False | diff --git a/templates/documentation/get-started/azure-migration.md b/templates/documentation/get-started/azure-migration.md index 05b48571..8ec8fceb 100644 --- a/templates/documentation/get-started/azure-migration.md +++ b/templates/documentation/get-started/azure-migration.md @@ -34,15 +34,15 @@ To enable the Video Import Tool access to the videos in your Azure Blob Storage 1. Navigate to your storage account and click on "Shared Access Signature": -![](/_assets/get-started/azure-migration/azure-4.png) +![Generating a Shared Access Signature](/_assets/get-started/azure-migration/azure-4.png) 2. Enable the required parameters: -![](/_assets/get-started/azure-migration/azure-storage-doc-11.png) +![Enabling required parameters](/_assets/get-started/azure-migration/azure-storage-doc-11.png) 3. Ensure that you generate the Shared Access Signature. Once you have the links, copy the Blob Service SAS URL. -![](/_assets/get-started/azure-migration/azure-6.png) +![Copying the Blob service SAS URL](/_assets/get-started/azure-migration/azure-6.png) 4. Finally, paste the URL into the "SAS URL" field of the Import Tool. @@ -134,7 +134,7 @@ let mediaServicesClient: AzureMediaServices; let remoteSasUrl: string = process.env.REMOTESTORAGEACCOUNTSAS as string; ``` -![](/_assets/get-started/azure-migration/azure-1.png) +![Selecting the api.video media service on Azure](/_assets/get-started/azure-migration/azure-1.png) {% capture content %} Note that in the previous step, you will also need to update the .env file and grab the parameters from Azure. In order to do that, navigate to your Azure Media Service, and select the directory that you would like to migrate. {% endcapture %} @@ -143,25 +143,25 @@ Note that in the previous step, you will also need to update the .env file and g 5. Select API keys and copy over the parameters presented in the `.ENV` pane (you can select either User Authentication or Service principal authentication) -![](/_assets/get-started/azure-migration/azure-2.png) +![Selecting API Access for media services](/_assets/get-started/azure-migration/azure-2.png) -![](/_assets/get-started/azure-migration/azure-3.png) +![Selecting the .ENV credentials pane](/_assets/get-started/azure-migration/azure-3.png) 6. To get access to the storage, navigate to the Azure Storage Account → Shared access signature: -![](/_assets/get-started/azure-migration/azure-4.png) +![Generating Shared Access Signature](/_assets/get-started/azure-migration/azure-4.png) 7. Allow the following: -![](/_assets/get-started/azure-migration/azure-5.png) +![Enabling required parameters](/_assets/get-started/azure-migration/azure-5.png) -![](/_assets/get-started/azure-migration/azure-6.png) +![Copying the Blob service SAS URL](/_assets/get-started/azure-migration/azure-6.png) Make sure that you generate the Shared access signature and once you have the links, copy the Blob service SAS URL link to the `.env` file. The parameter you are looking for is `REMOTESTORAGEACCOUNTSAS` 8. Add the api.video API key to the .env file by navigating to the [api.video dashboard](https://dashboard.api.video/overview) and copy the API key value -![](/_assets/get-started/azure-migration/azure-7.png) +![Copying the api.video API key](/_assets/get-started/azure-migration/azure-7.png) 9. Now, `run npm install` in the terminal in order to install all of the node modules 10. Run `npm run build` diff --git a/templates/documentation/live-streaming/working-with-live-streams.md b/templates/documentation/live-streaming/working-with-live-streams.md index 19c79852..7f831bb0 100644 --- a/templates/documentation/live-streaming/working-with-live-streams.md +++ b/templates/documentation/live-streaming/working-with-live-streams.md @@ -177,7 +177,7 @@ If you don't want to retrieve details about a live stream programmatically, you 4. When you click on a container title, you'll get a pop-up with some quick details about the live stream container. If you want full details, click **See details**. This will bring up all information about the live stream container you wanted to review. - ![](/_assets/show-livestream.png) + ![Showing the live stream details](/_assets/show-livestream.png) ## Update a live stream @@ -299,7 +299,7 @@ You can update live stream details from your dashboard if you don't want to retr 4. Click **See details** to open a display of complete information about your live stream. - ![](/_assets/show-livestream.png) + ![Showing the live stream details](/_assets/show-livestream.png) 5. You can change the title of your live stream, upload a thumbnail, and associate a player ID on this screen. When you're done, click **Save**. diff --git a/templates/documentation/reference/README.md b/templates/documentation/reference/README.md index 92fa220d..47d23c83 100644 --- a/templates/documentation/reference/README.md +++ b/templates/documentation/reference/README.md @@ -38,7 +38,7 @@ There are two environments that you can utilize right now. Before you upgrade yo Once you've upgraded you can switch between sandbox and production by toggling the button on the [overview page](https://dashboard.api.video/overview) on the api.video dashboard. -![](/_assets/reference/a3713b2-Screenshot_2023-02-23_at_18.29.00.png "Screenshot 2023-02-23 at 18.29.00.png") +![Switching to the sandbox environment in the Dashboard](/_assets/reference/a3713b2-Screenshot_2023-02-23_at_18.29.00.png "Screenshot 2023-02-23 at 18.29.00.png") {% capture content %} **The sandbox mode has these limitations** diff --git a/templates/documentation/reference/postman-collection.md b/templates/documentation/reference/postman-collection.md index 012573ee..4ebf92d2 100644 --- a/templates/documentation/reference/postman-collection.md +++ b/templates/documentation/reference/postman-collection.md @@ -11,11 +11,11 @@ The official Postman collection for api.video (coming soon!) 1. Click the button above 2. Add your [API key](https://dashboard.api.video/apikeys) to the Variables - ![](/_assets/postman-1.png) + ![Adding api.video API keys as Postman variables](/_assets/postman-1.png) 3. Add the API Key variable to Authorization - ![](/_assets/postman-2.png) + ![Adding the API key as a variable for Postman authorization](/_assets/postman-2.png) ## Switching environments diff --git a/templates/documentation/sdks/nocode/bubbleio-api-calls.md b/templates/documentation/sdks/nocode/bubbleio-api-calls.md index f303bb50..20ef5d80 100644 --- a/templates/documentation/sdks/nocode/bubbleio-api-calls.md +++ b/templates/documentation/sdks/nocode/bubbleio-api-calls.md @@ -15,7 +15,7 @@ In order to use the API, you have to put your api.video private API key in the d To do this, go to the "Plugins" tab on the left, select "Api.video" and paste the value of your api key into the "Api key" field: -![](/_assets/bubbleio_2.png) +![Pasting the api.video API key](/_assets/bubbleio_2.png) ## Action API calls @@ -31,12 +31,12 @@ Let's imagine you'd like to delete a specific video when a user clicks on a butt - first, create a new button element, go in its properties, and click on "Start/edit workflow": -![](/_assets/bubbleio_9.png) +![Defining an action for a button](/_assets/bubbleio_9.png) - in the workflow page, click on "Click here to add an action" and select "authenticate - delete a video" in the "Plugins" tab: -![](/_assets/bubbleio_10.png) +![Selecting an api.video plugin action](/_assets/bubbleio_10.png) - the properties popup of the action appears, enter the video id you want to delete in the "(path) videoId" field, and you're all done. @@ -63,27 +63,27 @@ For example, you can create an upload token for each user of your application. T In the workflow action that sign the users up, click on the "Change another field" button: -![](/_assets/bubbleio_11.png) +![Adding an action to the user creation flow](/_assets/bubbleio_11.png) Then, select "create a new field", and create a field called "uploadtoken", with the type "text": -![](/_assets/bubbleio_12.png) +![Showing the Create a new field modal](/_assets/bubbleio_12.png) Click on the link to associate a value to the field and select "Get data from an external API": -![](/_assets/bubbleio_13.png) +![Associating a value with the new field](/_assets/bubbleio_13.png) Then, select "authenticate - generate upload token" in the API provider field and clear the "TTL" field to have a token that will never expire: -![](/_assets/bubbleio_14.png) +![Setting up token expiration](/_assets/bubbleio_14.png) Finally, close the "authenticate - generate upload token" popup and select "'s token" to use the "token" attribute from the API response: -![](/_assets/bubbleio_15.png) +![Selecting the token attribute from the API response](/_assets/bubbleio_15.png) By doing this, you assign a unique upload token to each user that you can use in the uploader element. This can be considered a good practice because if one of your users abuses the token (if he uploads more than you would like), you'll be able to delete this token from api.video without any impact on your other users. @@ -94,7 +94,7 @@ This API call will return the status of a given video. For more details about vi In response to this call, one value is beneficial: the "playable" value. It indicates whether your video is ready to be played or not yet. For example, you can display a video player only when the video is ready to be played: -![](/_assets/bubbleio_16.png) +![Setting up a conditional action](/_assets/bubbleio_16.png) ### List all videos diff --git a/templates/documentation/sdks/nocode/bubbleio-player-element.md b/templates/documentation/sdks/nocode/bubbleio-player-element.md index 5c68690e..31056f84 100644 --- a/templates/documentation/sdks/nocode/bubbleio-player-element.md +++ b/templates/documentation/sdks/nocode/bubbleio-player-element.md @@ -11,12 +11,12 @@ Bubble.io Player Element ## Basic usage To add a video player to a page of your site, click on the "api.video player" item of the Visual elements list. -![](/_assets/bubbleio_4.png) +![Adding the api.video player element](/_assets/bubbleio_4.png) Then, draw the player on your page using your mouse, like you do we any other Visual component. Once done, double-click on the player to open the window for editing its properties. You should see something like that: -![](/_assets/bubbleio_5.png) +![Editing the properties of the api.video player element](/_assets/bubbleio_5.png) As you can see, there is a list of specific attributes that you can use to customize your player: @@ -32,7 +32,7 @@ As you can see, there is a list of specific attributes that you can use to custo | loop | no (default: false) | boolean | once the video is finished, it automatically starts again | Once you've entered a videoId, you can click on "preview" to see your player in action. -![](/_assets/bubbleio_6.png) +![Previewing the api.video player element](/_assets/bubbleio_6.png) ## Events @@ -55,7 +55,7 @@ Here is the list of all events triggered by the player: To perform an action when an event occurs, go to the workflow tab, create a new workflow, and as a trigger condition, select "Elements -> A api.video player ..." : -![](/_assets/bubbleio_7.png) +![Defining an event and a trigger condition](/_assets/bubbleio_7.png) ## Exposed state diff --git a/templates/documentation/sdks/nocode/bubbleio-plugin.md b/templates/documentation/sdks/nocode/bubbleio-plugin.md index 7c63457f..c4a326da 100644 --- a/templates/documentation/sdks/nocode/bubbleio-plugin.md +++ b/templates/documentation/sdks/nocode/bubbleio-plugin.md @@ -27,12 +27,12 @@ To benefit from all this, the first step is to install the plugin in your applic To install the api.video plugin, when you are on the editing interface of your application, you must go to the "Plugins" tab and click on "Add plugins," as described in the following screenshot. -![](/_assets/bubbleio_1.jpg) +![Adding bubble.io plugins](/_assets/bubbleio_1.jpg) After that, search for the term "api.video" in the window that has just appeared. You should have only one result. Click on the "Install" button. -![](/_assets/bubbleio_3.png) +![Installing api.video's bubble.io plugin](/_assets/bubbleio_3.png) Now you are ready to use the plugin! diff --git a/templates/documentation/sdks/nocode/bubbleio-uploader.md b/templates/documentation/sdks/nocode/bubbleio-uploader.md index 5dc3020e..20c295ba 100644 --- a/templates/documentation/sdks/nocode/bubbleio-uploader.md +++ b/templates/documentation/sdks/nocode/bubbleio-uploader.md @@ -15,7 +15,7 @@ It comes as a customizable button that opens a file selector when clicked. Once To add an uploader element on a page, click on the "api.video uploader" item of the Input form elements list. -![](/_assets/bubbleio_8.png) +![Adding the api.video uploader element](/_assets/bubbleio_8.png) Then, draw the uploader on your page using your mouse, like you do we any other Visual component. You can change the style of the element as you usually do. Once done, double-click on the player to open the window for editing its properties. diff --git a/templates/documentation/sdks/nocode/contentful.md b/templates/documentation/sdks/nocode/contentful.md index 544c05f7..1016a6f4 100644 --- a/templates/documentation/sdks/nocode/contentful.md +++ b/templates/documentation/sdks/nocode/contentful.md @@ -15,7 +15,7 @@ Log into your Contentful account and add the [api.video app](https://www.content Input your api.video API key first. You'll also notice that a list of your JSON objects is listed. The api.video app should be connected to JSON object types in Contentful. If you don't see any objects listed, that's ok. We'll add a JSON object in the next step. -![](/_assets/apivideoapp.jpg) +![Managing your api.video app in Contentful](/_assets/apivideoapp.jpg) ## Adding api.video to content models @@ -63,7 +63,7 @@ In the top menu, choose content, and then pick the model you wish to use (in the The title is 'My Awesome video,' and I'm skipping the YouTube section - it's no longer required! With the api.video app, you can choose a video already uploaded to api.video ("select an existing video") or upload a new video (descriptively named "upload a new video"). -![](/_assets/addingavideo.png) +![Adding a video component](/_assets/addingavideo.png) Now publish the content, and you've added the video for playback! diff --git a/templates/documentation/sdks/nocode/live-stream-created.md b/templates/documentation/sdks/nocode/live-stream-created.md index 69973736..3ccb2bd5 100644 --- a/templates/documentation/sdks/nocode/live-stream-created.md +++ b/templates/documentation/sdks/nocode/live-stream-created.md @@ -13,4 +13,4 @@ Once you choose this trigger, you'll authorize your api.video account with your The test will look for a live stream in your account, so before you test the trigger, make sure your account has a live stream: -![](/_assets/Zapier_5.png) +![Testing the Live Stream Created trigger](/_assets/Zapier_5.png) diff --git a/templates/documentation/sdks/nocode/zapier.md b/templates/documentation/sdks/nocode/zapier.md index da678e03..c42e7316 100644 --- a/templates/documentation/sdks/nocode/zapier.md +++ b/templates/documentation/sdks/nocode/zapier.md @@ -21,7 +21,7 @@ The api.video integration features both triggers and actions, which we will outl ## Triggers A Zapier Trigger is an event that kicks off an automation process. There are 5 Triggers in the api.video integration: -![](/_assets/Zapier_1.png) +![Choosing a trigger event](/_assets/Zapier_1.png) ### Non instant: diff --git a/templates/documentation/vod/add-a-thumbnail-to-your-video.md b/templates/documentation/vod/add-a-thumbnail-to-your-video.md index 47d5b168..367f7ed8 100644 --- a/templates/documentation/vod/add-a-thumbnail-to-your-video.md +++ b/templates/documentation/vod/add-a-thumbnail-to-your-video.md @@ -253,7 +253,7 @@ print(response) api.video also makes it possible for you to add a thumbnail from the dashboard. Both choices discussed in this guide are available here too - Timestamp and Upload image. -![](/_assets/add-thumbnail.png) +![Adding a timestamp or uploading an image as a thumbnail](/_assets/add-thumbnail.png) To get to the area to add a thumbnail in the dashboard: diff --git a/templates/documentation/vod/get-started-in-5-minutes.md b/templates/documentation/vod/get-started-in-5-minutes.md index 657bf155..6cd3e229 100644 --- a/templates/documentation/vod/get-started-in-5-minutes.md +++ b/templates/documentation/vod/get-started-in-5-minutes.md @@ -82,7 +82,7 @@ You can change the default port of 3000 to something of your liking by editing t When you navigate to `http://localhost:3000` with your browser, you should get this screen: -![](/_assets/select-file-to-upload.png) +![Loading the Next.js video uploader frontend](/_assets/select-file-to-upload.png) If you edit `src/pages/index.tsx` you'll find the whole logic of the frontend. The thing you are looking for is the `serverUrl`. This is where you can point the requests to your server, you'll be able to configure the port or the whole url to your server url (by default it's pointing to `http://localhost:5500`) diff --git a/templates/documentation/vod/show-video-details.md b/templates/documentation/vod/show-video-details.md index b3ccdac2..c42c7aef 100644 --- a/templates/documentation/vod/show-video-details.md +++ b/templates/documentation/vod/show-video-details.md @@ -119,13 +119,13 @@ If you don't want to retrieve video details programmatically, you can also view 2. From the menu on the left, choose **Videos**. - ![](/_assets/video-selection.png) + ![Showing the list of videos on the dashboard](/_assets/video-selection.png) 3. Click on the video for which you want to view details. You can use the filtering options to help you find the one you want. 4. When the pop-up for the individual video you chose appears, click **See details** to review all the information about the video. - ![](/_assets/video-details.png) + ![Showing video details on the dashboard](/_assets/video-details.png) ## Conclusion From 0094bd24819ff8815f2f14635dcaf40db01d6be3 Mon Sep 17 00:00:00 2001 From: szekelyzol Date: Wed, 11 Oct 2023 00:38:46 +0200 Subject: [PATCH 2/3] Add missing image alts p3 --- .../delivery-analytics/delivery-analytics-quickstart.md | 4 ++-- templates/documentation/delivery-analytics/domain-referrer.md | 4 ++-- .../delivery-analytics/private-video-get-started.md | 4 ++-- .../delivery-analytics/video-playback-features.md | 2 +- templates/documentation/reference/authentication-guide.md | 2 +- templates/documentation/reference/basic-authentication.md | 2 +- templates/documentation/sdks/nocode/video-created.md | 2 +- templates/documentation/vod/delegated-upload-tokens.md | 2 +- templates/documentation/vod/delete-a-video.md | 2 +- templates/documentation/vod/update-video-details.md | 2 +- templates/documentation/vod/upload-a-video-regular-upload.md | 2 +- templates/documentation/vod/upload-your-first-video.md | 2 +- 12 files changed, 15 insertions(+), 15 deletions(-) diff --git a/templates/documentation/delivery-analytics/delivery-analytics-quickstart.md b/templates/documentation/delivery-analytics/delivery-analytics-quickstart.md index dfc1315f..b6f646e9 100644 --- a/templates/documentation/delivery-analytics/delivery-analytics-quickstart.md +++ b/templates/documentation/delivery-analytics/delivery-analytics-quickstart.md @@ -205,7 +205,7 @@ $playerTheme = $client->playerThemes()->create($playerThemeCreationPayload); The following code will give us this effect: -![](/_assets/delivery-analytics/delivery-quickstart/delivery-quickstart-player-purple.png) +![Showing customized player UI](/_assets/delivery-analytics/delivery-quickstart/delivery-quickstart-player-purple.png) The response that you should expect will contain the `playerId` that we will use in the next step. @@ -372,7 +372,7 @@ func main() { After you've added the image, it will look similar to this: -![](/_assets/delivery-analytics/delivery-quickstart/player-logo.png) +![Showing a custom logo in the api.video player](/_assets/delivery-analytics/delivery-quickstart/player-logo.png) ### Assign the theme to a video diff --git a/templates/documentation/delivery-analytics/domain-referrer.md b/templates/documentation/delivery-analytics/domain-referrer.md index 87063846..195b4932 100644 --- a/templates/documentation/delivery-analytics/domain-referrer.md +++ b/templates/documentation/delivery-analytics/domain-referrer.md @@ -26,11 +26,11 @@ Leveraging the [referer header](https://developer.mozilla.org/en-US/docs/Web/HTT For example, you've requested to allow list: `https://some.domain.com` and the video is hosted in that domain: -![](/_assets/domain-referrer-fig-1.png) +![Showing website domain referrer via inspector tool](/_assets/domain-referrer-fig-1.png) What happens if the same video is embedded in a different website? In this case, the video will return a `403` error, as the referrer header is different from what was allowed: -![](/_assets/domain-referrer-fig-2.png) +![Showing website domain referrer via inspector tool](/_assets/domain-referrer-fig-2.png) ## Domain referrer restriction with videos on native mobile players diff --git a/templates/documentation/delivery-analytics/private-video-get-started.md b/templates/documentation/delivery-analytics/private-video-get-started.md index 82c6386e..0ab8fa07 100644 --- a/templates/documentation/delivery-analytics/private-video-get-started.md +++ b/templates/documentation/delivery-analytics/private-video-get-started.md @@ -53,7 +53,7 @@ Suppose you already have a cool video uploaded. Go to the dashboard and get make Now that the video is private, we can deliver it to users. Here’s a quick snippet in HTML that you can use to play your video in the browser. Just copy the code snippet and replace the URL with your private video URL. You can find the video URLs in the Assets section of the Video Details: -![](/_assets/link-to-video.png) +![Showing the link assets in the Video details screen on the Dashboard](/_assets/link-to-video.png) @@ -130,7 +130,7 @@ Let’s assume that we want to build an app that will display all the private vi On the backend, we will have to do some magic. While with public videos it’s pretty simple as just returning the videos, for private videos we will need to get the session first. Let’s look at the HTML code: -![](/_assets/avh-parameter.png) +![Grabbing the avh parameter for a private video](/_assets/avh-parameter.png) Notice the `avh` parameter in the query string? The `avh` parameter is where you will pass the session token... oh wait, what's a session token?! diff --git a/templates/documentation/delivery-analytics/video-playback-features.md b/templates/documentation/delivery-analytics/video-playback-features.md index aa78c22d..5db96124 100644 --- a/templates/documentation/delivery-analytics/video-playback-features.md +++ b/templates/documentation/delivery-analytics/video-playback-features.md @@ -84,7 +84,7 @@ Video will play to end and automatically restart. This example will autoplay and If your video has captions, you can make them appear by default by adding the #show-subtitles url parameter to the player url: -![](/_assets/show-captions.png) +![Showing video captions in the api.video player](/_assets/show-captions.png) ### 8. Download diff --git a/templates/documentation/reference/authentication-guide.md b/templates/documentation/reference/authentication-guide.md index db1d7989..1b323c31 100644 --- a/templates/documentation/reference/authentication-guide.md +++ b/templates/documentation/reference/authentication-guide.md @@ -28,7 +28,7 @@ You'll need your API key to get started. You can sign up for one here: [Get your 3. You will always be able to choose to use your Sandbox API key. If you want to use the Production API key instead, select a plan and enter your credit card information. 4. Grab the key you want, and you're ready to get started! -![](/_assets/retrieve-api-key.png) +![Managing the API keys in the Dashboard](/_assets/retrieve-api-key.png) ## Basic Authentication diff --git a/templates/documentation/reference/basic-authentication.md b/templates/documentation/reference/basic-authentication.md index c8d00375..176bc9a7 100644 --- a/templates/documentation/reference/basic-authentication.md +++ b/templates/documentation/reference/basic-authentication.md @@ -27,7 +27,7 @@ There are separate API keys for Sandbox and Production [environment](/reference/ In production, you can also manage multiple API keys from your dashboard, for different applications. -![](/_assets/production-api-key.png) +![Managing the API keys on the dashboard](/_assets/production-api-key.png) ### Basic Auth Request 🔒 diff --git a/templates/documentation/sdks/nocode/video-created.md b/templates/documentation/sdks/nocode/video-created.md index a5944a37..984337ab 100644 --- a/templates/documentation/sdks/nocode/video-created.md +++ b/templates/documentation/sdks/nocode/video-created.md @@ -10,7 +10,7 @@ The _Video Created_ Zapier trigger will fire whenever a new video is created at Once you choose this trigger, and authorize your api.video account with your api key (which you can find on the [dashboard](https://my.api.video)), you can further filter the created videos for specific titles or tags that are being created. -![](/_assets/Zapier_2.png) +![Setting up a Video Created trigger using the api.video Zapier plugin](/_assets/Zapier_2.png) Example uses: diff --git a/templates/documentation/vod/delegated-upload-tokens.md b/templates/documentation/vod/delegated-upload-tokens.md index 95d77456..3de73c13 100644 --- a/templates/documentation/vod/delegated-upload-tokens.md +++ b/templates/documentation/vod/delegated-upload-tokens.md @@ -41,7 +41,7 @@ Before you can start uploading your first video, you need to [create an api.vide Once you are logged in to the Dashboard, select the environment of your choice (sandbox or production) and copy your API key. -![](/_assets/retrieve-api-key.png) +![Managing the API keys in the Dashboard](/_assets/retrieve-api-key.png) ## Choose an api.video client diff --git a/templates/documentation/vod/delete-a-video.md b/templates/documentation/vod/delete-a-video.md index 684f4342..de070ba0 100644 --- a/templates/documentation/vod/delete-a-video.md +++ b/templates/documentation/vod/delete-a-video.md @@ -132,7 +132,7 @@ You can delete a video using your dashboard by doing the following: 3. On the Video screen, use the filtering and scrolling features to locate the video you want to delete. Place a checkmark next to one or more videos you want to delete. - ![](/_assets/delete-video.png) + ![Showing the list of videos in the Dashboard](/_assets/delete-video.png) 4. In the center of the screen at the bottom, you'll see a trash can icon. Click the **trash can**. A popup appears asking if you're sure you want to delete the video(s) you selected. diff --git a/templates/documentation/vod/update-video-details.md b/templates/documentation/vod/update-video-details.md index 8518f65c..0f2339bd 100644 --- a/templates/documentation/vod/update-video-details.md +++ b/templates/documentation/vod/update-video-details.md @@ -170,4 +170,4 @@ If you don't want to send an API request with code, you can update video details 3. From the upper right of the pop-up, click **See details**. You'll land on the details screen for your video, and the video ID appears at the top, above the video. - ![](/_assets/update-video-details.png) + ![Showing the video details screen in the Dashboard](/_assets/update-video-details.png) diff --git a/templates/documentation/vod/upload-a-video-regular-upload.md b/templates/documentation/vod/upload-a-video-regular-upload.md index 227d749b..3ce2a5b6 100644 --- a/templates/documentation/vod/upload-a-video-regular-upload.md +++ b/templates/documentation/vod/upload-a-video-regular-upload.md @@ -87,7 +87,7 @@ Install-Package ApiVideo ## Upload a video file -![](/_assets/upload-a-file.png) +![Uploading a video via the API or from your computer](/_assets/upload-a-file.png) ### Create the video object diff --git a/templates/documentation/vod/upload-your-first-video.md b/templates/documentation/vod/upload-your-first-video.md index c7c0f33b..736680d2 100644 --- a/templates/documentation/vod/upload-your-first-video.md +++ b/templates/documentation/vod/upload-your-first-video.md @@ -24,7 +24,7 @@ You can choose to upload a video [from your computer](#upload-a-file-from-your-c ### Upload a file from your computer -![](/_assets/upload-a-file.png) +![Uploading a video via the API or from your computer](/_assets/upload-a-file.png) #### a. Create the video object From 189a2346085d5c774acb3ed49fe5e5978e5f0f7a Mon Sep 17 00:00:00 2001 From: szekelyzol Date: Wed, 11 Oct 2023 01:27:41 +0200 Subject: [PATCH 3/3] Add missing image alt tags p4 --- templates/documentation/sdks/nocode/create-video.md | 2 +- templates/documentation/sdks/nocode/live-stream-ended.md | 2 +- templates/documentation/sdks/nocode/live-stream-started.md | 2 +- templates/documentation/sdks/nocode/video-encoding-completed.md | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/templates/documentation/sdks/nocode/create-video.md b/templates/documentation/sdks/nocode/create-video.md index ee3237ef..aa741102 100644 --- a/templates/documentation/sdks/nocode/create-video.md +++ b/templates/documentation/sdks/nocode/create-video.md @@ -14,4 +14,4 @@ With the Create video action - you can create a video on demand file at api.vide For example: When a new video is uploaded into Amazon S3, you can create a new video, and upload the video (using the publicly available URL) to insert the video into api.video. -![](/_assets/Zapier_4.png) +![Setting up a Create Video trigger using the api.video Zapier plugin](/_assets/Zapier_4.png) diff --git a/templates/documentation/sdks/nocode/live-stream-ended.md b/templates/documentation/sdks/nocode/live-stream-ended.md index d273836d..36152f7a 100644 --- a/templates/documentation/sdks/nocode/live-stream-ended.md +++ b/templates/documentation/sdks/nocode/live-stream-ended.md @@ -12,7 +12,7 @@ The live stream started webhook will fire when the `live-stream.broadcast.ended` When you choose this trigger, you'll authenticate your api.video account with your api key (which you can find on the [dashboard](https://dashboard.api.video/)). When you test the Zap - Zapier uses sample data provided by api.video (no webhook has been created yet) -![](/_assets/Zapier_7.png) +![Setting up a Live Stream Ended trigger using the api.video Zapier plugin](/_assets/Zapier_7.png) Now you can create an action to occur. Here are a few ideas that might be useful (They are all the opposite of the started ideas): diff --git a/templates/documentation/sdks/nocode/live-stream-started.md b/templates/documentation/sdks/nocode/live-stream-started.md index 3e0efd33..bfe75375 100644 --- a/templates/documentation/sdks/nocode/live-stream-started.md +++ b/templates/documentation/sdks/nocode/live-stream-started.md @@ -14,7 +14,7 @@ The live stream started webhook will fire when the `live-stream.broadcast.starte When you choose this trigger, you'll authenticate your api.video account with your api key (which you can find on the [dashboard](https://dashboard.api.video/)). When you test the Zap - Zapier uses sample data provided by api.video (no webhook has been created yet) -![](/_assets/Zapier_6.png) +![Setting up a Live Stream Started trigger using the api.video Zapier plugin](/_assets/Zapier_6.png) Now you can create an action to occur. Here are a few ideas that might be useful: diff --git a/templates/documentation/sdks/nocode/video-encoding-completed.md b/templates/documentation/sdks/nocode/video-encoding-completed.md index 4db59b8f..b1c65a77 100644 --- a/templates/documentation/sdks/nocode/video-encoding-completed.md +++ b/templates/documentation/sdks/nocode/video-encoding-completed.md @@ -15,7 +15,7 @@ For example, a video uploaded at 480p will have 240p, 360p, and 480p webhook ale When you choose this trigger, you'll authenticate your api.video account with your api key (which you can find on the [dashboard](https://my.api.video)). The next request is which encoding size you'd like the Zap to trigger on: -![](/_assets/Zapier_3.png) +![Setting up a Video Encoding Completed trigger using the api.video Zapier plugin](/_assets/Zapier_3.png) In the screenshot above, the zap will fire whenever a 1080p video is encoded at api.video. (This does mean that if a 720p video is uploaded, the Zap will not fire). So choose the size of the video based on what size you'd prefer the Zap to fire on - based on the types of videos uploaded by your users.