@theoplayer/react-native-ui
Version:
A React Native UI for @theoplayer/react-native
128 lines (127 loc) • 7.4 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.THEOplayerDefaultUi = THEOplayerDefaultUi;
exports.UIFeature = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNativeTheoplayer = require("react-native-theoplayer");
var _THEOplayerTheme = require("./THEOplayerTheme");
var _reactNative = require("react-native");
var _TestIDs = require("./utils/TestIDs");
var _ = require("..");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
let UIFeature = exports.UIFeature = /*#__PURE__*/function (UIFeature) {
UIFeature[UIFeature["Chromecast"] = 0] = "Chromecast";
UIFeature[UIFeature["AirPlay"] = 1] = "AirPlay";
UIFeature[UIFeature["Fullscreen"] = 2] = "Fullscreen";
UIFeature[UIFeature["Language"] = 3] = "Language";
UIFeature[UIFeature["Mute"] = 4] = "Mute";
UIFeature[UIFeature["PiP"] = 5] = "PiP";
UIFeature[UIFeature["PlaybackRate"] = 6] = "PlaybackRate";
UIFeature[UIFeature["SeekBar"] = 7] = "SeekBar";
UIFeature[UIFeature["TrickPlay"] = 8] = "TrickPlay";
UIFeature[UIFeature["VideoQuality"] = 9] = "VideoQuality";
return UIFeature;
}({}); // By default, exclude Chromecast, for which an extra dependency is needed.
const defaultExcludedFeatures = [UIFeature.Chromecast];
/**
* A default UI layout which uses UI components from `react-native-theoplayer` to create a basic playback UI around a THEOplayerView.
*/
function THEOplayerDefaultUi(props) {
const {
theme,
config,
topSlot,
bottomSlot,
style,
locale,
excludedFeatures = defaultExcludedFeatures
} = props;
const [player, setPlayer] = (0, _react.useState)(undefined);
const onPlayerReady = player => {
setPlayer(player);
props.onPlayerReady?.(player);
};
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: [_.FULLSCREEN_CENTER_STYLE, {
backgroundColor: '#000000'
}, style],
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeTheoplayer.THEOplayerView, {
config: config,
onPlayerReady: onPlayerReady,
children: player !== undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.UiContainer, {
theme: {
..._THEOplayerTheme.DEFAULT_THEOPLAYER_THEME,
...theme
},
locale: locale,
player: player,
behind: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CenteredDelayedActivityIndicator, {
size: 50
}),
top: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AutoFocusGuide, {
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.ControlBar, {
children: [topSlot, /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Spacer, {}), !_reactNative.Platform.isTV && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
children: [!excludedFeatures.includes(UIFeature.AirPlay) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AirplayButton, {}), !excludedFeatures.includes(UIFeature.Chromecast) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ChromecastButton, {})]
}), !excludedFeatures.includes(UIFeature.Language) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.LanguageMenuButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.SettingsMenuButton, {
children: [!excludedFeatures.includes(UIFeature.VideoQuality) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.QualitySubMenu, {}), !excludedFeatures.includes(UIFeature.PlaybackRate) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PlaybackRateSubMenu, {})]
})]
})
}),
center: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AutoFocusGuide, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CenteredControlBar, {
style: {
width: '50%'
},
left: !excludedFeatures.includes(UIFeature.TrickPlay) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SkipButton, {
skip: -10,
testID: _TestIDs.TestIDs.SKIP_BWD_BUTTON
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {}),
middle: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PlayButton, {}),
right: !excludedFeatures.includes(UIFeature.TrickPlay) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SkipButton, {
skip: 30,
testID: _TestIDs.TestIDs.SKIP_FWD_BUTTON
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {})
})
}),
bottom: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.AutoFocusGuide, {
children: [!_reactNative.Platform.isTV && !excludedFeatures.includes(UIFeature.Chromecast) && !excludedFeatures.includes(UIFeature.AirPlay) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ControlBar, {
style: {
justifyContent: 'flex-start'
},
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CastMessage, {})
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ControlBar, {
children: !excludedFeatures.includes(UIFeature.SeekBar) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SeekBar, {})
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.ControlBar, {
children: [!excludedFeatures.includes(UIFeature.Mute) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.MuteButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.GoToLiveButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.TimeLabel, {
showDuration: true
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Spacer, {}), bottomSlot, !excludedFeatures.includes(UIFeature.PiP) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PipButton, {}), !excludedFeatures.includes(UIFeature.Fullscreen) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_.FullscreenButton, {})]
})]
}),
adTop: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AutoFocusGuide, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ControlBar, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AdClickThroughButton, {})
})
}),
adCenter: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AutoFocusGuide, {
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.CenteredControlBar, {
middle: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PlayButton, {})
})
}),
adBottom: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.AutoFocusGuide, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_.ControlBar, {
style: {
justifyContent: 'flex-start'
},
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.AdDisplay, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AdCountdown, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Spacer, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.AdSkipButton, {})]
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.ControlBar, {
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.MuteButton, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SeekBar, {})]
})]
})
})
})
});
}
//# sourceMappingURL=THEOplayerDefaultUi.js.map