Skip to content
Snippets Groups Projects
README.md 3.6 KiB
Newer Older
Johannes Kreiner's avatar
Johannes Kreiner committed
# Ext: sg_youtube

<img alt="" src="https://www.sgalinski.de/typo3conf/ext/project_theme/Resources/Public/Images/logo.svg" />
Johannes Kreiner's avatar
Johannes Kreiner committed

License: [GNU GPL, Version 2](https://www.gnu.org/licenses/gpl-2.0.html)

Repository: https://gitlab.sgalinski.de/typo3/sg_youtube

Please report bugs here: https://gitlab.sgalinski.de/typo3/sg_youtube

## Installation / Integration

First install the extension and activate it in the Extension Manager.

### TypoScript integration

* Include the TypoScript in Configuration/TypoScript/setup.typoscript and constants.typoscript in your theme.
Stefan Galinski's avatar
Stefan Galinski committed
* Add your YouTube API key:
```typoscript
plugin.tx_sgyoutube {
	settings {
		# cat=plugin.tx_sgyoutube/file; type=string; label=YouTube API Key
		apiKey = <your-api-key>
	}
}
```

### Registration for more than the free 10.000 quotas per day

It's not 1 quota per 1 API call. Each API has its own costs, which can be seen in the link below.
Currently, at the version 3.2.1 we are using the following APIs:
- "search/list" for channel videos
- "playlistItems/list" for videos from a specific playlist
- "videos/list" for getting the details for each video and the localizations, if needed.

The maximum quota costs would be "102" at the moment for rendering the latest videos from a channel with the video
details and translations.

[Quota Calculator](https://developers.google.com/youtube/v3/determine_quota_cost)

[YouTube API Services - Audit and Quota Extension Form](https://support.google.com/youtube/contact/yt_api_form?hl=en)

#### Caching behaviour

Because of the quota costs we implemented a caching for the calls for each day. The response from the APIs will be saved
and used for 24 hours. Normally the site cache would do it, but it could be, that the cache will be cleared multiple
times in a row, or that the plugin is on an uncached page. The TYPO3 registry is used as a cache. The cleanup is handled
on the fly.
If the `?disableYoutubeCache=1` parameter is added to the URL, this cache will be ignored as well.

#### Possible way to solve the quota limit, if it's still reached

You can use a different API key for specific sites. You can implement a TypoScript page uid check and just change the
key from the "TypoScript integration" topic.
Georgi's avatar
Georgi committed
### Making changes in JavaScript/CSS
Georgi's avatar
Georgi committed

Georgi's avatar
Georgi committed
We are shipping the extension with source files and already minified assets. By default,
Georgi's avatar
Georgi committed
we the minified assets are loaded in the Layout, so that the extension works out of the box just with plug and play.
Stefan Galinski's avatar
Stefan Galinski committed
Should you want to change this behavior, you can do the following:
Georgi's avatar
Georgi committed
- Override the layout path in TypoScript
  local/project_theme/Configuration/TypoScript/Extensions/SgYouTube/Constants.typoscript

Stefan Galinski's avatar
Stefan Galinski committed
```
plugin.tx_sgyoutube {
	settings {
		apiKey = MY_KEY
	}

	view {
		layoutRootPath = EXT:project_theme/Resources/Private/Layouts/SgYouTube/
	}
}

Georgi's avatar
Georgi committed
```
Georgi's avatar
Georgi committed

Stefan Galinski's avatar
Stefan Galinski committed
- Create a new layout file omitting the assets that you would like to change (for example, loading without CSS)
Georgi's avatar
Georgi committed

Georgi's avatar
Georgi committed
```
<div class="tx-sg-youtube">
	<f:asset.script identifier="sgVideoJs" src="EXT:sg_youtube/Resources/Public/JavaScript/Dist/main.bundled.min.js" />
	<f:render section="main"/>
</div>

```

Georgi's avatar
Georgi committed
- Import the CSS or JavaScript source files in your respective asset pipeline and add them externally.
Georgi's avatar
Georgi committed

### Compiling CSS/JS assets with SGC

- Install the sgalinski/sgc-core library via composer
Georgi's avatar
Georgi committed
- Add the sg-youtube extension paths in the .sgc-config.json
- Remove the loading of the compiled CSS/JS assets from Resources/Private/Templates/Youtube/Index.html
- Add import the scss and js module file in the corresponding main.scss and main.js
- Initialize the javascript modules in your main.js: ```
  new SgVideoLightbox();
Stefan Galinski's avatar
Stefan Galinski committed
  SgVideo.initDefault();```