Skip to content

Commit

Permalink
add contentScale prop
Browse files Browse the repository at this point in the history
  • Loading branch information
LonelyCpp committed Nov 6, 2020
1 parent 25a7a82 commit 96669d8
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 4 deletions.
10 changes: 10 additions & 0 deletions docs/props.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -280,3 +280,13 @@ Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like
### `allowWebViewZoom`

Controls whether the embedded webview allows user to zoom in. Defaults to `false`

---

### `contentScale`

scale factor for initial-scale and maximum-scale in `<meta />` tag on the webpage. Defaults to `1.0`

:::info zoom -
enabling the `allowWebViewZoom` disabled the maximum-scale attribute in the webpage
:::
5 changes: 5 additions & 0 deletions index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,11 @@ export interface YoutubeIframeProps {
* Set this React Ref to use ref functions such as getDuration.
*/
ref?: React.MutableRefObject<YoutubeIframeRef | null>;
/**
* scale factor for initial-scale and maximum-scale in
* <meta /> tag on the webpage
*/
contentScale?: Number;
}

export interface YoutubeMeta {
Expand Down
10 changes: 6 additions & 4 deletions src/PlayerScripts.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ export const MAIN_SCRIPT = (
playList,
initialPlayerParams,
allowWebViewZoom,
contentScale,
) => {
const {
end,
Expand Down Expand Up @@ -93,12 +94,13 @@ export const MAIN_SCRIPT = (
const showClosedCaptions_s = showClosedCaptions ? 1 : 0;
const list = typeof playList === 'string' ? playList : '';
const listType = typeof playList === 'string' ? 'playlist' : '';
const contentScale_s = typeof contentScale === 'number' ? contentScale : 1.0;

// scale will either be "initial-scale=0.8"
let scale = 'initial-scale=0.8';
// scale will either be "initial-scale=1.0"
let scale = `initial-scale=${contentScale_s}`;
if (allowWebViewZoom) {
// or "initial-scale=0.8, maximum-scale=0.8"
scale += ', maximum-scale=0.8';
// or "initial-scale=0.8, maximum-scale=1.0"
scale += `, maximum-scale=${contentScale_s}`;
}

return `
Expand Down
2 changes: 2 additions & 0 deletions src/YoutubeIframe.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ const YoutubeIframe = (props, ref) => {
webViewStyle,
webViewProps,
playbackRate = 1,
contentScale = 1.0,
onError = _err => {},
onReady = _event => {},
playListStartIndex = 0,
Expand Down Expand Up @@ -180,6 +181,7 @@ const YoutubeIframe = (props, ref) => {
playList,
initialPlayerParams,
allowWebViewZoom,
contentScale,
),
}}
userAgent={
Expand Down

0 comments on commit 96669d8

Please sign in to comment.