add link to lbry.tv after content is finished playing

static/app-strings.json

@@ -912,7 +912,6 @@
   "%claimsInChannel% publish": "%claimsInChannel% publish",
   "Publishing": "Publishing",
   "Update published": "Update published",
-<<<<<<< HEAD
   "Delete this file from my computer": "Delete this file from my computer",
   "Are you sure you'd like to remove %title% from LBRY?": "Are you sure you'd like to remove %title% from LBRY?",
   "This will increase the overall bid amount for %title%, which will boost its ability to be discovered while active.": "This will increase the overall bid amount for %title%, which will boost its ability to be discovered while active.",
@@ -920,7 +919,3 @@
   "You deposited %amount% LBC as a support!": "You deposited %amount% LBC as a support!",
   "LBRY Link": "LBRY Link"
 }
-=======
-  "Install Now": "Install Now"
-}
->>>>>>> app plays embed in iframe

ui/component/fileRender/view.jsx

@@ -44,6 +44,7 @@ type Props = {
 
 type State = {
   showAutoplayCountdown: boolean,
+  showEmbededMessage: boolean,
 };
 
 class FileRender extends React.PureComponent<Props, State> {
@@ -52,10 +53,12 @@ class FileRender extends React.PureComponent<Props, State> {
 
     this.state = {
       showAutoplayCountdown: false,
+      showEmbededMessage: false,
     };
 
     (this: any).escapeListener = this.escapeListener.bind(this);
     (this: any).onEndedAutoplay = this.onEndedAutoplay.bind(this);
+    (this: any).onEndedEmbedded = this.onEndedEmbedded.bind(this);
     (this: any).getOnEndedCb = this.getOnEndedCb.bind(this);
   }
 
@@ -82,16 +85,16 @@ class FileRender extends React.PureComponent<Props, State> {
   }
 
   getOnEndedCb() {
-    const { setPlayingUri, currentlyFloating } = this.props;
+    const { setPlayingUri, currentlyFloating, embedded } = this.props;
+
+    if (embedded) {
+      return this.onEndedEmbedded;
+    }
 
     if (!currentlyFloating) {
       return this.onEndedAutoplay;
     }
 
-    // if (embeded) {
-    //   return this.onEndedEmbed
-    // }
-
     return () => setPlayingUri(null);
   }
 
@@ -102,6 +105,10 @@ class FileRender extends React.PureComponent<Props, State> {
     }
   }
 
+  onEndedEmbedded() {
+    this.setState({ showEmbededMessage: true });
+  }
+
   renderViewer() {
     const { mediaType, currentTheme, claim, contentType, downloadPath, fileName, streamingUrl, uri } = this.props;
     const fileType = fileName && path.extname(fileName).substring(1);
@@ -211,7 +218,7 @@ class FileRender extends React.PureComponent<Props, State> {
   }
   render() {
     const { isText, uri, currentlyFloating, embedded } = this.props;
-    const { showAutoplayCountdown } = this.state;
+    const { showAutoplayCountdown, showEmbededMessage } = this.state;
 
     return (
       <div
@@ -221,6 +228,17 @@ class FileRender extends React.PureComponent<Props, State> {
           'file-render__embed': embedded,
         })}
       >
+        {embedded && showEmbededMessage && (
+          <div className="video-overlay__wrapper">
+            <div className="video-overlay__title">{__('View More on lbry.tv')}</div>
+
+            <div className="video-overlay__actions">
+              <div className="section__actions--centered">
+                <Button label={__('Explore')} button="primary" href="https://lbry.tv" />
+              </div>
+            </div>
+          </div>
+        )}
         {!currentlyFloating && showAutoplayCountdown && <AutoplayCountdown uri={uri} />}
         <Suspense fallback={<div />}>{this.renderViewer()}</Suspense>
       </div>

ui/scss/component/_file-render.scss

@@ -154,7 +154,30 @@
   }
 }
 
-<<<<<<< HEAD
+.file-render__embed {
+  height: 100%;
+  width: 100%;
+  position: fixed;
+
+  .video-js {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .vjs-big-play-button {
+      @extend .button--icon;
+      @extend .button--play;
+      border: none;
+      position: static;
+      z-index: 2;
+
+      .vjs-icon-placeholder {
+        display: none;
+      }
+    }
+  }
+}
+
 .video-overlay__wrapper {
   position: absolute;
   left: auto;
@@ -219,27 +242,3 @@
     margin-top: var(--spacing-small);
   }
 }
-=======
-.file-render__embed {
-  height: 100%;
-  width: 100%;
-  position: fixed;
-  .video-js {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    .vjs-big-play-button {
-      @extend .button--icon;
-      @extend .button--play;
-      border: none;
-      position: static;
-      z-index: 2;
-
-      .vjs-icon-placeholder {
-        display: none;
-      }
-    }
-  }
-}
->>>>>>> app plays embed in iframe