From 7aab02541b4cd3dd793b7386bf57247d35096e5f Mon Sep 17 00:00:00 2001
From: Phuong Dinh <phuongdh@gmail.com>
Date: Mon, 19 Oct 2020 14:42:46 -0400
Subject: [PATCH 1/4] Add simple player with quality selector

---
 app/views/items/show.html.erb | 41 +++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/app/views/items/show.html.erb b/app/views/items/show.html.erb
index 30e050f..bacd873 100644
--- a/app/views/items/show.html.erb
+++ b/app/views/items/show.html.erb
@@ -1,3 +1,6 @@
+<link href="https://vjs.zencdn.net/7.8.4/video-js.css" rel="stylesheet" />
+<link href="https://unpkg.com/@silvermine/videojs-quality-selector/dist/css/quality-selector.css" rel="stylesheet">
+
 <p id="notice"><%= notice %></p>
 
 <p>
@@ -10,5 +13,43 @@
   <%= @item.streams %>
 </p>
 
+<p>
+  <video
+    id="my-video"
+    class="video-js"
+    width="640"
+    height="480"
+    controls
+    preload="auto"
+    data-setup="{}"
+  >
+    <% @item.streams.each do |q, url| %>
+      <source src="<%= url %>" type="application/x-mpegURL" label="<%= q %>"/>
+    <% end %>
+  </video>
+</p>
+
 <%= link_to 'Edit', edit_item_path(@item) %> |
 <%= link_to 'Back', items_path %>
+
+
+<script src="https://vjs.zencdn.net/7.8.4/video.js"></script>
+<script src="https://unpkg.com/@silvermine/videojs-quality-selector/dist/js/silvermine-videojs-quality-selector.min.js"></script>
+
+<script>
+  var options, player;
+
+  options = {
+    controlBar: {
+        children: [
+          'playToggle',
+          'progressControl',
+          'volumePanel',
+          'qualitySelector',
+          'fullscreenToggle',
+        ],
+    },
+  };
+
+  player = videojs('my-video', options);
+</script>
\ No newline at end of file

From ce10e9a50d8c2cebee73903662e0f866afc3b3e2 Mon Sep 17 00:00:00 2001
From: Phuong Dinh <phuongdh@gmail.com>
Date: Wed, 21 Oct 2020 10:42:49 -0400
Subject: [PATCH 2/4] Use new streams format

---
 app/views/items/show.html.erb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/views/items/show.html.erb b/app/views/items/show.html.erb
index bacd873..cee1eae 100644
--- a/app/views/items/show.html.erb
+++ b/app/views/items/show.html.erb
@@ -23,8 +23,8 @@
     preload="auto"
     data-setup="{}"
   >
-    <% @item.streams.each do |q, url| %>
-      <source src="<%= url %>" type="application/x-mpegURL" label="<%= q %>"/>
+    <% @item.streams.each do |stream| %>
+      <source src="<%= stream["url"] %>" type="application/x-mpegURL" label="<%= stream["label"] %>"/>
     <% end %>
   </video>
 </p>

From 4b8bb4abb4375c1874bd9e7f2f3701d3cdc00b4e Mon Sep 17 00:00:00 2001
From: Phuong Dinh <phuongdh@gmail.com>
Date: Wed, 21 Oct 2020 11:58:53 -0400
Subject: [PATCH 3/4] Avoid reinitialize videojs

---
 app/views/items/show.html.erb | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/views/items/show.html.erb b/app/views/items/show.html.erb
index cee1eae..40c0347 100644
--- a/app/views/items/show.html.erb
+++ b/app/views/items/show.html.erb
@@ -21,7 +21,6 @@
     height="480"
     controls
     preload="auto"
-    data-setup="{}"
   >
     <% @item.streams.each do |stream| %>
       <source src="<%= stream["url"] %>" type="application/x-mpegURL" label="<%= stream["label"] %>"/>

From 46f823c00187e2b07471f2154d03f923e8ced0e7 Mon Sep 17 00:00:00 2001
From: Phuong Dinh <phuongdh@gmail.com>
Date: Wed, 21 Oct 2020 13:30:06 -0400
Subject: [PATCH 4/4] Add streaming service

---
 docker-compose.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/docker-compose.yml b/docker-compose.yml
index f190a1a..a37f9b3 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -17,3 +17,9 @@ services:
       - "3000:3000"
     depends_on:
       - db
+  streaming:
+    build: ./nginx
+    volumes:
+      - ./streams:/data
+    ports:
+      - "3333:80"