import * as React from "react";
import * as Url from "url-parse";
import { VideoWebView } from "./video-webview";
export const isVimeo = (url: string) => {
  return url.indexOf("vimeo.com/") > -1;
};

export const getVimeoEmbed = (url: string) => {
  let parsedUrl = new Url(url);
  let pathParts = parsedUrl.pathname.split("/");
  let id = pathParts[1];

  return `
  <div style="padding-top: 56.25%; position: relative;">
    <iframe style="position: absolute; top: 0; right: 0; bottom: 0; left: 0;"
      src="https://player.vimeo.com/video/${id}" 
      width="100%"
      height="100%"
      frameborder="0"
      allow="autoplay; fullscreen"
      allowfullscreen></iframe>
  <div>
`;
};

export const VimeoVideo = ({ url }: { url: string }) => {
  let iframe = React.useMemo(() => getVimeoEmbed(url), [url]);
  return <VideoWebView content={iframe} />;
};