ravnur-player-public 3.4.2 → 3.4.4

package/src/styles/playlist.css.js

@@ -0,0 +1,84 @@
+import getRightPlaylistStyles from './rplaylist.css';
+import getBottomPlaylistStyles from './bplaylist.css';
+
+export default function getStyles(styles, rect) {
+
+   const rightPlaylistCss = getRightPlaylistStyles(styles, rect);
+   const bottomPlaylistCss = getBottomPlaylistStyles(styles, rect);
+
+   return `
+
+.rplayer__playlist-wrapper {
+   background-color: #000;
+}
+
+.rplayer__playlist {
+  color: ${styles.mainColor}
+}
+
+.rplayer__playlist-header {
+   padding: 8px;
+   margin: 0;
+   font-size: 16px;
+   line-height: 1.4;
+   display: block;
+   overflow: hidden;
+   color: ${styles.mainColor};
+   font-weight: 400;
+}
+
+.rplayer__playlist-current-title {
+   display: none;
+}
+
+.rplayer__playlist-item {
+   position: relative;
+   cursor: pointer;
+}
+
+.rplayer__playlist-item-thumb {
+   position: relative;
+   overflow: hidden;
+}
+
+.rplayer__playlist-of {
+   position: absolute;
+   font-size: 12px;
+   color: ${styles.mainColor};
+}
+
+.rplayer__playlist .rplayer__playlist-item:last-child {
+   margin: 0 !important
+}
+
+.rplayer__playlist-item--current {
+   cursor: inherit;
+   background-color: #757575
+}
+
+.rplayer__playlist-item--current .rplayer__playlist-item-thumb:before {
+   display: block;
+   content: '►';
+   position: absolute;
+   top: 0;
+   bottom: 0;
+   left: 0;
+   right: 0;
+   text-align: center;
+   z-index: 9;
+   background-color: rgba(255,255,255,0.5);
+   text-shadow: 0.125rem 0.125rem 0.5rem #333
+}
+
+.rplayer__playlist-item-thumb img {
+   position: absolute;
+   width: 100%
+}
+
+
+${rightPlaylistCss}
+
+${bottomPlaylistCss}
+
+   `;
+}

package/src/styles/rplaylist.css.js

@@ -0,0 +1,98 @@
+/* eslint max-len: 0 */
+
+export default function getStyles(styles, rect) {
+   let innerWidthWRPl = `calc(100% - ${styles.rplaylistHeight})`;
+   let wrapperWidthR = styles.rplaylistHeight;
+
+   if (rect) {
+      const w = rect.right - rect.left;
+      innerWidthWRPl = w * 0.7 + 'px';
+      wrapperWidthR = w * 0.3 + 'px';
+   }
+
+   return `
+
+.rplayer--fullscreen .rplayer--right-playlist .rplayer__playlist-wrapper {
+   max-height: calc(100vh - 44px);
+   width: 0;
+}
+
+.rplayer--right-playlist .rplayer__playlist-wrapper {
+   width: ${wrapperWidthR};
+   float: right;
+   height: 100%;
+}
+
+.rplayer--right-playlist .rplayer__playlist {
+   background-color: #424242;
+   overflow-y: auto;
+   overflow-x: hidden;
+   position: absolute;
+   top: 78px;
+   bottom: 0;
+   left: 0;
+   right: 0;
+}
+
+.rplayer--right-playlist .rplayer__playlist-wrapper.rplayer__playlist-wrapper--wot-title .rplayer__playlist {
+   top: 22px;
+}
+
+.rplayer--right-playlist .rplayer__playlist-header {
+   max-height: 56px;
+   display: -webkit-box;
+   -webkit-box-orient: vertical;
+   text-overflow: ellipsis;
+   -webkit-line-clamp: 2;
+}
+
+.rplayer--right-playlist .rplayer__inner {
+   width: ${innerWidthWRPl};
+   float: left;
+}
+
+.rplayer--right-playlist .rplayer__playlist-item {
+   padding: 8px;
+   height: 70px;
+   border-top: 1px solid #000;
+}
+
+.rplayer--right-playlist .rplayer__playlist-item-title {
+   font-size: 13px;
+   line-height: 1.4;
+   height: 52px;
+   display: block;
+   overflow: hidden;
+   display: -webkit-box;
+   -webkit-box-orient: vertical;
+   text-overflow: ellipsis;
+   -webkit-line-clamp: 3;
+}
+
+.rplayer--right-playlist .rplayer__playlist-item-thumb {
+   margin-right: 6px;
+   width: 96px;
+   height: 54px;
+   float: left;
+}
+
+.rplayer--right-playlist .rplayer__playlist-item--current .rplayer__playlist-item-thumb:before {
+   font-size: 28px;
+   line-height: 54px;
+}
+
+.rplayer--right-playlist .rplayer__playlist-of {
+   left: 8px;
+   top: 58px;
+}
+
+.rplayer--right-playlist .rplayer__playlist-wrapper.rplayer__playlist-wrapper--wot-title .rplayer__playlist-of {
+   top: 5px;
+}
+
+.rplayer--right-playlist .rplayer__playlist-left-btn, .rplayer--right-playlist .rplayer__playlist-right-btn {
+   display: none !important;
+}
+
+   `;
+}

package/src/svgs.js

@@ -0,0 +1,111 @@
+// @flow
+import { extend, createElement } from './utils';
+
+/* eslint max-len: 0 */
+
+type IconProps = {
+   width?: number,
+   height?: number,
+   viewBox?: string
+}
+
+const DEFAULT_PROPS: IconProps = { width: 32, height: 32, viewBox: '0 0 24 24' };
+
+export const PLAY = 'M8 5v14l11-7z';
+export const PAUSE = 'M6 19h4V5H6v14zm8-14v14h4V5h-4z';
+export const PLAY_CIRCLE = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z';
+export const PAUSE_CIRCLE = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14H9V8h2v8zm4 0h-2V8h2v8z';
+export const REPLAY = 'M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z';
+export const BACKWARD = 'M11 18V6l-8.5 6 8.5 6zm.5-6l8.5 6V6l-8.5 6z';
+export const FORWARD = 'M4 18l8.5-6L4 6v12zm9-12v12l8.5-6L13 6z';
+export const NEXT_TRACK = 'M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z';
+export const PREV_TRACK = 'M6 6h2v12H6zm3.5 6l8.5 6V6z';
+
+export const CROSS = 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z';
+export const BACK = 'M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z';
+export const NEXT = 'M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z';
+
+export const TOC = 'M3 9h14V7H3v2zm0 4h14v-2H3v2zm0 4h14v-2H3v2zm16 0h2v-2h-2v2zm0-10v2h2V7h-2zm0 6h2v-2h-2v2z';
+
+export const CC = 'M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 7H9.5v-.5h-2v3h2V13H11v1c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1zm7 0h-1.5v-.5h-2v3h2V13H18v1c0 .55-.45 1-1 1h-3c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1z';
+
+export const GEARS = 'M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z';
+
+export const DOWNLOAD = 'M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z';
+
+export const HEADPHONE = 'M12 1c-4.97 0-9 4.03-9 9v7c0 1.66 1.34 3 3 3h3v-8H5v-2c0-3.87 3.13-7 7-7s7 3.13 7 7v2h-4v8h3c1.66 0 3-1.34 3-3v-7c0-4.97-4.03-9-9-9z';
+
+export const CHECK = 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z';
+
+export const FULLSCREEN = 'M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z';
+export const EXIT_FULLSCREEN = 'M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z';
+
+export const THEATER_MODE = 'M19 7H5c-1.1 0-2 .9-2 2v6c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2zm0 8H5V9h14v6z';
+export const EXIT_THEATER_MODE = 'M19 6H5c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 10H5V8h14v8z';
+
+export const MUTED = 'M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z';
+export const VOLUME_UP = 'M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z';
+export const VOLUME_DOWN = 'M18.5 12c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM5 9v6h4l5 5V4L9 9H5z';
+
+export const HELP = 'M11 18h2v-2h-2v2zm1-16C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-2.21 0-4 1.79-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4z';
+
+export const SEARCH = 'M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z';
+
+export const C2PA = 'M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm1 18h-2v-6h-2v-2h4v8zm-1-9.75c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z';
+
+export const IMG = 'M20,5A2,2 0 0,1 22,7V17A2,2 0 0,1 20,19H4C2.89,19 2,18.1 2,17V7C2,5.89 2.89,5 4,5H20M5,16H19L14.5,10L11,14.5L8.5,11.5L5,16Z';
+
+export const CLEAR = 'M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z';
+
+export const SPINNER = 'M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z';
+
+export const EXT_LINK = 'M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V12H19V19Z';
+
+export const COMPANY_PLACEHOLDER = [
+   'M8.61609 6.12837C8.61609 5.82152 8.86485 5.57277 9.1717 5.57277H10.1037C10.4105 5.57277 10.6593 5.82152 10.6593 6.12837V7.06035C10.6593 7.36721 10.4105 7.61596 10.1037 7.61596H9.1717C8.86485 7.61596 8.61609 7.36721 8.61609 7.06035V6.12837Z',
+   'M4.52985 6.12839C4.52985 5.82153 4.7786 5.57278 5.08545 5.57278H6.01743C6.32428 5.57278 6.57303 5.82154 6.57303 6.12839V7.06037C6.57303 7.36722 6.32428 7.61597 6.01743 7.61597H5.08545C4.7786 7.61597 4.52985 7.36722 4.52985 7.06037V6.12839Z',
+   'M5.08521 8.97808C4.77836 8.97808 4.52961 9.22684 4.52961 9.53369V10.4657C4.52961 10.7725 4.77836 11.0213 5.08521 11.0213H6.01719C6.32404 11.0213 6.5728 10.7725 6.5728 10.4657V9.53369C6.5728 9.22684 6.32404 8.97808 6.01719 8.97808H5.08521Z',
+   'M4.52961 12.939C4.52961 12.6321 4.77836 12.3834 5.08521 12.3834H6.01719C6.32404 12.3834 6.5728 12.6321 6.5728 12.939V13.871C6.5728 14.1778 6.32404 14.4266 6.01719 14.4266H5.08521C4.77836 14.4266 4.52961 14.1778 4.52961 13.871V12.939Z',
+   'M9.1717 8.97808C8.86485 8.97808 8.61609 9.22684 8.61609 9.53369V10.4657C8.61609 10.7725 8.86485 11.0213 9.1717 11.0213H10.1037C10.4105 11.0213 10.6593 10.7725 10.6593 10.4657V9.53369C10.6593 9.22684 10.4105 8.97808 10.1037 8.97808H9.1717Z',
+   'M8.61609 12.939C8.61609 12.6321 8.86485 12.3834 9.1717 12.3834H10.1037C10.4105 12.3834 10.6593 12.6321 10.6593 12.939V13.871C10.6593 14.1778 10.4105 14.4266 10.1037 14.4266H9.1717C8.86485 14.4266 8.61609 14.1778 8.61609 13.871V12.939Z',
+   {
+      d: 'M0.443359 3.08929C0.443359 1.77279 1.51059 0.705566 2.82708 0.705566H12.362C13.6784 0.705566 14.7457 1.77279 14.7457 3.08929V4.55116H19.1724C20.4889 4.55116 21.5561 5.61839 21.5561 6.93488V16.9107C21.5561 18.2272 20.4889 19.2945 19.1724 19.2945L2.82708 19.2936C1.51059 19.2936 0.443359 18.2264 0.443359 16.9099V3.08929ZM14.7457 6.59435V17.2513H19.1724C19.3604 17.2513 19.5129 17.0988 19.5129 16.9107V6.93488C19.5129 6.74681 19.3604 6.59435 19.1724 6.59435H14.7457ZM12.7025 3.08929L12.7023 17.2504H2.82708C2.63901 17.2504 2.48655 17.0979 2.48655 16.9099V3.08929C2.48655 2.90122 2.63901 2.74875 2.82708 2.74875H12.362C12.55 2.74875 12.7025 2.90122 12.7025 3.08929Z',
+      'fill-rule': 'evenodd',
+      'clip-rule': 'evenodd'
+   }
+];
+
+export const CHEVRON_DOWN = 'M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z';
+
+export const LOCK = {
+   d: 'M6.70684 3.11217C7.33684 2.44551 8.16491 2.09524 9.00049 2.09524C9.83606 2.09524 10.6641 2.44551 11.2941 3.11217C11.9276 3.78248 12.3005 4.71314 12.3005 5.7037V8.38095H5.70049V5.7037C5.70049 4.71314 6.07341 3.78248 6.70684 3.11217ZM4.59837 10.4762C4.59907 10.4762 4.59978 10.4762 4.60049 10.4762C4.6012 10.4762 4.6019 10.4762 4.60261 10.4762H13.3984C13.3991 10.4762 13.3998 10.4762 13.4005 10.4762C13.4012 10.4762 13.4019 10.4762 13.4026 10.4762H14.9891C15.0547 10.4762 15.1843 10.5061 15.3307 10.6854C15.4783 10.8662 15.6002 11.1591 15.6002 11.5238V18.8571C15.6002 19.2219 15.4783 19.5148 15.3307 19.6955C15.1843 19.8749 15.0547 19.9048 14.9891 19.9048H3.01131C2.94565 19.9048 2.81611 19.8749 2.66966 19.6955C2.52205 19.5148 2.4002 19.2219 2.4002 18.8571V11.5238C2.4002 11.1591 2.52205 10.8662 2.66966 10.6854C2.81611 10.5061 2.94565 10.4762 3.01131 10.4762H4.59837ZM3.50049 8.38095V5.7037C3.50049 4.22453 4.05471 2.7866 5.07159 1.71053C6.09192 0.630825 7.50216 0 9.00049 0C10.4988 0 11.9091 0.630825 12.9294 1.71053C13.9463 2.7866 14.5005 4.22453 14.5005 5.7037V8.38095H14.9891C16.7829 8.38095 17.8002 10.0483 17.8002 11.5238V18.8571C17.8002 20.3326 16.7829 22 14.9891 22H3.01131C1.21752 22 0.200195 20.3326 0.200195 18.8571V11.5238C0.200195 10.0483 1.21752 8.38095 3.01131 8.38095H3.50049Z',
+   'fill-rule': 'evenodd',
+   'clip-rule': 'evenodd'
+};
+
+export const INFO = 'M12 0C5.37287 0 0 5.37287 0 12C0 18.6271 5.37287 24 12 24C18.6271 24 24 18.6271 24 12C23.9937 5.37496 18.625 0.00626087 12 0ZM12 22C6.47684 22 2 17.5232 2 12C2 6.47684 6.47684 2 12 2C17.5232 2 22 6.47684 22 12C21.9937 17.52 17.52 21.9937 12 22ZM11 7C11 6.44772 11.4477 6 12 6C12.5523 6 13 6.44772 13 7V13C13 13.5523 12.5523 14 12 14C11.4477 14 11 13.5523 11 13V7ZM12 18C12.552 18 13 17.552 13 17C13 16.448 12.552 16 12 16C11.448 16 11 16.448 11 17C11 17.552 11.448 18 12 18Z';
+
+export const BROADCAST_OFF = 'M 8.0136719 7.0292969 A 1.0001 1.0001 0 0 0 7.3222656 7.3222656 C 2.7995047 11.846068 -1.1842379e-15 18.102792 0 25 C 0 31.897208 2.7995047 38.153932 7.3222656 42.677734 A 1.0001 1.0001 0 0 0 8.7363281 42.677734 L 11.570312 39.84375 A 1.0001 1.0001 0 0 0 11.570312 38.429688 C 8.1286602 34.987084 6 30.242812 6 25 C 6 19.757188 8.1297921 15.013788 11.572266 11.572266 A 1.0001 1.0001 0 0 0 11.572266 10.158203 L 8.7363281 7.3222656 A 1.0001 1.0001 0 0 0 8.0136719 7.0292969 z M 41.957031 7.0292969 A 1.0001 1.0001 0 0 0 41.263672 7.3222656 L 38.427734 10.158203 A 1.0001 1.0001 0 0 0 38.427734 11.572266 C 41.870208 15.013788 44 19.757188 44 25 C 44 30.242812 41.870208 34.986212 38.427734 38.427734 A 1.0001 1.0001 0 0 0 38.427734 39.841797 L 41.263672 42.677734 A 1.0001 1.0001 0 0 0 42.677734 42.677734 C 47.201645 38.154865 50 31.897208 50 25 C 50 18.102792 47.200495 11.846068 42.677734 7.3222656 A 1.0001 1.0001 0 0 0 41.957031 7.0292969 z M 8.0976562 9.5117188 L 9.5195312 10.933594 C 6.1269359 14.664061 4 19.575176 4 25 C 4 30.424712 6.1260807 35.337173 9.5175781 39.068359 L 8.0976562 40.488281 C 4.3450168 36.394537 2 30.995061 2 25 C 2 19.004939 4.3450168 13.605463 8.0976562 9.5117188 z M 41.902344 9.5117188 C 45.654983 13.605463 48 19.004939 48 25 C 48 30.995061 45.655695 36.395442 41.902344 40.488281 L 40.480469 39.066406 C 43.873064 35.335939 46 30.424824 46 25 C 46 19.575176 43.873064 14.664061 40.480469 10.933594 L 41.902344 9.5117188 z M 14.382812 13.398438 A 1.0001 1.0001 0 0 0 13.691406 13.691406 C 10.796092 16.587786 9 20.593819 9 25 C 9 29.406181 10.796092 33.412214 13.691406 36.308594 A 1.0001 1.0001 0 0 0 15.105469 36.308594 L 17.931641 33.482422 A 1.0001 1.0001 0 0 0 17.931641 32.068359 C 16.119902 30.255711 15 27.761761 15 25 C 15 22.238239 16.119902 19.744289 17.931641 17.931641 A 1.0001 1.0001 0 0 0 17.931641 16.517578 L 15.105469 13.691406 A 1.0001 1.0001 0 0 0 14.382812 13.398438 z M 35.587891 13.398438 A 1.0001 1.0001 0 0 0 34.894531 13.691406 L 32.068359 16.517578 A 1.0001 1.0001 0 0 0 32.068359 17.931641 C 33.880098 19.744289 35 22.238239 35 25 C 35 27.761761 33.880098 30.255711 32.068359 32.068359 A 1.0001 1.0001 0 0 0 32.068359 33.482422 L 34.894531 36.308594 A 1.0001 1.0001 0 0 0 36.308594 36.308594 C 39.203908 33.412214 41 29.406181 41 25 C 41 20.593819 39.203908 16.587786 36.308594 13.691406 A 1.0001 1.0001 0 0 0 35.587891 13.398438 z M 14.466797 15.880859 L 15.947266 17.361328 C 14.184764 19.450917 13 22.061346 13 25 C 13 27.938654 14.184764 30.549083 15.947266 32.638672 L 14.466797 34.119141 C 12.335969 31.66133 11 28.50273 11 25 C 11 21.49727 12.335969 18.33867 14.466797 15.880859 z M 35.533203 15.880859 C 37.664031 18.33867 39 21.49727 39 25 C 39 28.50273 37.664031 31.66133 35.533203 34.119141 L 34.052734 32.638672 C 35.815236 30.549083 37 27.938654 37 25 C 37 22.061346 35.815236 19.450917 34.052734 17.361328 L 35.533203 15.880859 z M 25 18 C 21.134 18 18 21.134 18 25 C 18 28.866 21.134 32 25 32 C 28.866 32 32 28.866 32 25 C 32 21.134 28.866 18 25 18 z M 25 20 C 27.757 20 30 22.243 30 25 C 30 27.757 27.757 30 25 30 C 22.243 30 20 27.757 20 25 C 20 22.243 22.243 20 25 20 z';
+
+export const BROADCAST_ON = 'M 8.03125 8.4570312 C 7.770375 8.4589063 7.5103125 8.5625312 7.3203125 8.7695312 C 3.3953125 13.041531 1 18.741 1 25 C 1 31.259 3.3953125 36.958469 7.3203125 41.230469 C 7.7003125 41.644469 8.3569063 41.643094 8.7539062 41.246094 L 10.882812 39.117188 C 11.265812 38.734187 11.263391 38.124656 10.900391 37.722656 C 7.8553906 34.352656 6 29.889 6 25 C 6 20.111 7.8553906 15.647344 10.900391 12.277344 C 11.263391 11.875344 11.265813 11.266812 10.882812 10.882812 L 8.7539062 8.7539062 C 8.5554063 8.5554063 8.292125 8.4551562 8.03125 8.4570312 z M 41.96875 8.4570312 C 41.707625 8.4554062 41.444594 8.5554062 41.246094 8.7539062 L 39.115234 10.884766 C 38.732234 11.267766 38.734656 11.875344 39.097656 12.277344 C 42.143656 15.646344 44 20.111 44 25 C 44 29.889 42.144609 34.352656 39.099609 37.722656 C 38.736609 38.124656 38.734188 38.733187 39.117188 39.117188 L 41.246094 41.246094 C 41.643094 41.643094 42.299687 41.643469 42.679688 41.230469 C 46.604687 36.958469 49 31.259 49 25 C 49 18.741 46.604687 13.041531 42.679688 8.7695312 C 42.489688 8.5625312 42.229875 8.4586563 41.96875 8.4570312 z M 35.625 14.837891 C 35.355125 14.824516 35.079594 14.920406 34.871094 15.128906 L 32.740234 17.259766 C 32.381234 17.618766 32.341969 18.196938 32.667969 18.585938 C 34.123969 20.323937 35 22.561 35 25 C 35 27.439 34.123969 29.675109 32.667969 31.412109 C 32.341969 31.801109 32.381234 32.379281 32.740234 32.738281 L 34.871094 34.871094 C 35.288094 35.288094 35.967516 35.250687 36.353516 34.804688 C 38.625516 32.175687 40 28.748 40 25 C 40 21.252 38.625516 17.824312 36.353516 15.195312 C 36.160516 14.972313 35.894875 14.851266 35.625 14.837891 z M 14.375 14.839844 C 14.105125 14.853219 13.839484 14.974266 13.646484 15.197266 C 11.374484 17.825266 10 21.252 10 25 C 10 28.748 11.374484 32.175688 13.646484 34.804688 C 14.032484 35.250687 14.711906 35.288094 15.128906 34.871094 L 17.259766 32.740234 C 17.618766 32.381234 17.658031 31.803062 17.332031 31.414062 C 15.876031 29.676062 15 27.439 15 25 C 15 22.561 15.876031 20.324891 17.332031 18.587891 C 17.658031 18.198891 17.618766 17.620719 17.259766 17.261719 L 15.128906 15.128906 C 14.920406 14.920406 14.644875 14.826469 14.375 14.839844 z M 25 19 C 21.686 19 19 21.686 19 25 C 19 28.314 21.686 31 25 31 C 28.314 31 31 28.314 31 25 C 31 21.686 28.314 19 25 19 z';
+
+export const ERROR = 'M7.493 0.015 C 7.442 0.021,7.268 0.039,7.107 0.055 C 5.234 0.242,3.347 1.208,2.071 2.634 C 0.660 4.211,-0.057 6.168,0.009 8.253 C 0.124 11.854,2.599 14.903,6.110 15.771 C 8.169 16.280,10.433 15.917,12.227 14.791 C 14.017 13.666,15.270 11.933,15.771 9.887 C 15.943 9.186,15.983 8.829,15.983 8.000 C 15.983 7.171,15.943 6.814,15.771 6.113 C 14.979 2.878,12.315 0.498,9.000 0.064 C 8.716 0.027,7.683 -0.006,7.493 0.015 M8.853 1.563 C 9.967 1.707,11.010 2.136,11.944 2.834 C 12.273 3.080,12.920 3.727,13.166 4.056 C 13.727 4.807,14.142 5.690,14.330 6.535 C 14.544 7.500,14.544 8.500,14.330 9.465 C 13.916 11.326,12.605 12.978,10.867 13.828 C 10.239 14.135,9.591 14.336,8.880 14.444 C 8.456 14.509,7.544 14.509,7.120 14.444 C 5.172 14.148,3.528 13.085,2.493 11.451 C 2.279 11.114,1.999 10.526,1.859 10.119 C 1.618 9.422,1.514 8.781,1.514 8.000 C 1.514 6.961,1.715 6.075,2.160 5.160 C 2.500 4.462,2.846 3.980,3.413 3.413 C 3.980 2.846,4.462 2.500,5.160 2.160 C 6.313 1.599,7.567 1.397,8.853 1.563 M7.706 4.290 C 7.482 4.363,7.355 4.491,7.293 4.705 C 7.257 4.827,7.253 5.106,7.259 6.816 C 7.267 8.786,7.267 8.787,7.325 8.896 C 7.398 9.033,7.538 9.157,7.671 9.204 C 7.803 9.250,8.197 9.250,8.329 9.204 C 8.462 9.157,8.602 9.033,8.675 8.896 C 8.733 8.787,8.733 8.786,8.741 6.816 C 8.749 4.664,8.749 4.662,8.596 4.481 C 8.472 4.333,8.339 4.284,8.040 4.276 C 7.893 4.272,7.743 4.278,7.706 4.290 M7.786 10.530 C 7.597 10.592,7.410 10.753,7.319 10.932 C 7.249 11.072,7.237 11.325,7.294 11.495 C 7.388 11.780,7.697 12.000,8.000 12.000 C 8.303 12.000,8.612 11.780,8.706 11.495 C 8.763 11.325,8.751 11.072,8.681 10.932 C 8.616 10.804,8.460 10.646,8.333 10.580 C 8.217 10.520,7.904 10.491,7.786 10.530';
+
+export default function createSvg($parent: HTMLElement, d: string | any[], props: IconProps = {}) {
+   props = extend({}, DEFAULT_PROPS, props);
+   const $svg = createElement('svg', props, $parent, 'http://www.w3.org/2000/svg');
+
+   if (Array.isArray(d)) {
+      d.forEach((d) => {
+         createElement('path', resolveSvgData(d), $svg, 'http://www.w3.org/2000/svg');
+      });
+   } else {
+      createElement('path', resolveSvgData(d), $svg, 'http://www.w3.org/2000/svg');
+   }
+
+   return $svg;
+}
+
+function resolveSvgData(d) {
+   return typeof d === 'string' ? { d } : { ...d };
+}

package/src/types/Logger.js

@@ -0,0 +1,10 @@
+// @flow
+
+export type Player$LoggerFn = (...args: Array<mixed>) => void
+
+export type Player$Logger = {
+   debug : Player$LoggerFn,
+   log   : Player$LoggerFn,
+   warn  : Player$LoggerFn,
+   error : Player$LoggerFn
+}

package/src/types/Options.js

@@ -0,0 +1,179 @@
+// @flow
+
+import type { Player$Logger } from './Logger';
+import type { Player$PlaylistMode } from './Playlist';
+import type { Player$Source } from './Source';
+import type { Player$Translation } from './Translation';
+
+import EventEmmiter from '../microevent';
+
+type Record<K, T> = { [K]: T }
+
+export type Player$CrawlOptions = {
+   text: string,
+   speed: number,
+   backgroundColor: string,
+   textColor: string
+}
+
+export type Player$ExtensionOptions = {
+   logger: Player$Logger,
+   bus: EventEmmiter,
+   i18n: ?$Shape<Player$Translation>,
+
+   showPlay: boolean,
+   showProgress: boolean,
+   showVolume: boolean,
+   showFullScreen: boolean,
+   showTheaterMode: boolean,
+   showClosedCaptions: boolean,
+   showTOC: boolean,
+   showAnnotations: boolean,
+   showQuality: boolean,
+   showAudioTracks: boolean,
+   showPoster: boolean,
+   showError: boolean,
+   showPlaceholder: boolean,
+   showPlaybackRate: boolean,
+   showForward: boolean,
+   showBackward: boolean,
+   showSettings: boolean,
+   showDownload: boolean,
+   showHelp: boolean,
+   showTitle: boolean,
+   showNextFrame: boolean,
+   showPrevFrame: boolean,
+   showCCLayout: boolean,
+   showPrev?: boolean,
+   showNext?: boolean,
+   showCrawl?: boolean,
+   crawl?: Player$CrawlOptions,
+   isProgressLiveStream: ?boolean;
+   useMux: boolean,
+   showC2PA?: boolean,
+   showSubtitles?: boolean,
+}
+
+export type Player$ControllerOptions = {
+   logger: Player$Logger,
+   bus: EventEmmiter,
+
+   isAudio: boolean,
+
+   timecode: number,
+   frameRate: number,
+
+   clip?: ?[number, number]
+}
+
+export type Player$HlsOptions = {
+   maxFragLookUpTolerance: number,
+   maxMaxBufferLength: number
+}
+
+export type Player$MuxOptions = {
+   env_key: string,
+   page_type: '' | 'watchpage' | 'iframe',
+   viewer_user_id: string,
+   experiment_name: string,
+   sub_property_id: string,
+
+   player_name: 'RavnurPlayer',
+   player_version: string,
+   player_init_time: number | null | '',
+
+   video_id: string,
+   video_title: string,
+   video_series: string,
+   video_producer: string,
+   video_content_type: '' | 'short' | 'movie' | 'episode' | 'clip' | 'trailer' | 'event',
+   video_language_code: string,
+   video_variant_name: string,
+   video_variant_id: string,
+   video_duration: number | null | '',
+   video_stream_type: 'live' | 'on-demand',
+   video_encoding_variant: string,
+   video_cdn: string
+}
+
+export type Player$InputOptions = {
+   logger: Player$Logger,
+   loggerLevel: number,
+   i18n: ?$Shape<Player$Translation>,
+
+   timecode: number,
+   frameRate: number,
+
+   autoStart: boolean,
+   startTime: ?number,
+   endTime: ?number,
+
+   playbackRates?: Array<number>,
+
+   accessibility?: boolean,
+
+   useNativeControls: boolean,
+
+   useOriginTimeForPreview: boolean,
+
+   playlistmode: Player$PlaylistMode,
+   plalistAutoGoNext: boolean,
+   playlistitle: string,
+   playlistforcepoint: number,
+   playLoop: boolean,
+   hideplaylist: boolean,
+
+   showExtensions: boolean,
+   alwaysShowExtensions: boolean,
+   extensionsVisibilityTimeout: number,
+
+   skipDelta: number,
+   keyboardListeners: ?{ mixed: mixed },
+   globalKeyboardListeners: boolean,
+   isHandlingKeyboardEvents: boolean,
+
+   bufferingTimeout: number,
+
+   hls: $Shape<Player$HlsOptions>,
+   mux: $Shape<Player$MuxOptions>,
+
+   shaka: Record<string, mixed>,
+
+   isAudio: boolean,
+   isMobile: ?boolean,
+
+   nextTrackThumbnails: ?string,
+   nextTrackTitle: ?string,
+   prevTrackThumbnails: ?string,
+   prevTrackTitle: ?string,
+
+   hlsjsURL: string,
+   shakaURL: string,
+   flashPath: string,
+   muxURL: string,
+
+   savePlayTime?: boolean,
+   aesToken?: string,
+
+   fairplayURL?: string,
+   fairplayCertificateUrl?: string,
+   widevineURL?: string,
+   playreadyURL?: string,
+
+   disableAutoFullScreenOnIOS?: boolean,
+   disableAutoUrlRewrite?: boolean,
+
+   useHTMLPlayer?: boolean,
+   useHLSJSPlayer?: boolean,
+
+   isLive?: boolean,
+   maxQualityLevel?: number,
+
+   qualityLevel: string,
+   startLevel: string,
+}
+
+export type Player$CombineOptions = Player$ExtensionOptions
+   & Player$ControllerOptions
+   & Player$InputOptions
+   & Player$Source

package/src/types/Playlist.js

@@ -0,0 +1,3 @@
+// @flow
+
+export type Player$PlaylistMode = 'bottom' | 'right' | 'auto';

package/src/types/Source.js

@@ -0,0 +1,28 @@
+// @flow
+
+export type Player$SourceStatus = 0 | 1 | 2;
+
+export type Player$TimeDataSource = {
+   src: string,
+   label: string,
+   srclang: string,
+   default?: boolean,
+   type?: 'json' | 'vtt',
+   state?: Player$SourceStatus
+}
+
+export type Player$Source = {
+   id: string;
+   src: string,
+   type: string,
+   title: string,
+
+   annotations?: Player$TimeDataSource[],
+   chapters?: Player$TimeDataSource[],
+   cc?: Player$TimeDataSource[],
+   preview?: ?string,
+   poster?: ?string,
+   thumbnails?: ?string,
+
+   clip?: ?[number, number] // [ 10, 300 ] sec
+}

package/src/types/State.js

@@ -0,0 +1,46 @@
+// @flow
+
+import type { Player$TimeDataSource } from './Source';
+import type { Player$TimeData } from './TimeData';
+
+export type Player$CCColor = '#F44336' | '#9C27B0' | '#3F51B5' | '#2196F3' | '#4CAF50' | '#FFEB3B' | '#FF9800'
+                              | '#795548' | '#9E9E9E' | '#FFF' | '#000'
+
+export type Player$CCFontSize = '75%' | '100%' | '125%' | '150%' | '200%'
+
+export type Player$CCFontFamily =
+   '"Courier New", Courier, "Nimbus Mono L", "Cutive Mono", monospace'
+   | '"Times New Roman", Times, Georgia, Cambria, "PT Serif Caption", serif'
+   | '"Deja Vu Sans Mono", "Lucida Console", Monaco, Consolas, "PT Mono", monospace'
+   | 'Roboto, "Arial Unicode Ms", Arial, Helvetica, Verdana, sans-serif'
+
+export type Player$CCLocation = 'over' | 'below'
+
+export type Player$StateCC = {
+   color: Player$CCColor,
+   bgcolor: Player$CCColor,
+   fontSize: Player$CCFontSize,
+   fontFamily: Player$CCFontFamily,
+   location: Player$CCLocation,
+   lang: ?string,
+
+   sources: Player$TimeDataSource[],
+   loading?: boolean,
+   timedata: Player$TimeData[],
+   timedataLang: string
+}
+
+export type Player$StateTOC = {
+   lang: ?string,
+   sources: Player$TimeDataSource[],
+   timedata: Player$TimeData[],
+   timedataLang: string
+}
+
+export type Player$State = {
+   isFullScreen: boolean,
+   isTheaterMode: boolean,
+
+   cc: Player$StateCC,
+   toc: Player$StateTOC
+}

package/src/types/Styles.js

@@ -0,0 +1,11 @@
+// @flow
+
+export type Player$Styles = {
+   accentColor: string,
+   mainColor: string,
+   submenuBgColor: string,
+   submenuColor: string,
+   chaptersBubbleColor: string,
+   pltHeight: string,
+   rplaylistHeight: string
+}

package/src/types/TimeData.js

@@ -0,0 +1,8 @@
+// @flow
+export type Player$TimeData = {
+   id: string,
+   from: number,
+   to: number,
+   text: string,
+   title?: ?string
+}

package/src/types/Translation.js

@@ -0,0 +1,69 @@
+// @flow
+
+export type Player$Translation = {
+   'fullscreen': string,
+   'exit-fullscreen': string,
+   'theater': string,
+   'exit-theater': string,
+   'play': string,
+   'pause': string,
+   'replay': string,
+   'standard-playbackrate': string,
+   'forward': string,
+   'backward': string,
+   'prevframe': string,
+   'nextframe': string,
+   'annotations': string,
+   'quality': string,
+   'audio-track': string,
+   'playback-rate': string,
+   'settings': string,
+   'buffering': string,
+   'cc': string,
+   'chapters': string,
+   'back': string,
+   'settings-fontcolor': string,
+   'settings-fontsize': string,
+   'settings-fontfamily': string,
+   'settings-background': string,
+   'settings-captionlocations': string,
+   'help': string,
+   'download': string,
+   'video-only': string,
+   'video-and': string,
+   'language': string,
+
+   'unapproved-source': string,
+   'translate': string,
+   'translating': string,
+
+   'monoserif'  : string,
+   'propserif'  : string,
+   'monosans'   : string,
+   'propssans'  : string,
+
+   'cc-location-over'    : string,
+   'cc-location-below'   : string,
+
+   'red'     : string,
+   'purple'  : string,
+   'indigo'  : string,
+   'blue'    : string,
+   'green'   : string,
+   'yellow'  : string,
+   'orange'  : string,
+   'brown'   : string,
+   'grey'    : string,
+   'white'   : string,
+   'black'   : string,
+
+   'help-bacward'  : string,
+   'help-play'     : string,
+   'help-skip'     : string,
+   'help-volume'   : string,
+   'help-esc'      : string,
+
+   'no-video'      : string,
+   'no-flash'      : string,
+   'playlist-count-of': string
+}

package/src/utils/absolutizeUrl.js

@@ -0,0 +1,9 @@
+// @flow
+import escapeHTML from './escapeHTML';
+
+export default function absolutizeUrl(url: string): string {
+   var el = document.createElement('div');
+   el.innerHTML = '<a href="' + escapeHTML(url) + '">x</a>';
+   const link = el.firstChild;
+   return link && link instanceof HTMLLinkElement ? link.href : url;
+}