diff --git a/src/views/player/audio.ecr b/src/views/player/audio.ecr
new file mode 100644
index 00000000..0bed59ae
--- /dev/null
+++ b/src/views/player/audio.ecr
@@ -0,0 +1,9 @@
+<audio id="player" class="video-js" data-setup="{}" style="width:100%;" controls>
+    <% adaptive_fmts.each do |fmt| %>
+        <% url = fmt["url"]? %>
+        <% type = fmt["type"]? ? fmt["type"].to_s.split(";")[0] : "" %>
+        <% if type.starts_with?("audio") %>
+        <source src="<%= url %>" type="<%= type %>">
+        <% end %>
+    <% end %>
+</audio>
\ No newline at end of file
diff --git a/src/views/player/video.ecr b/src/views/player/video.ecr
new file mode 100644
index 00000000..ebc5df15
--- /dev/null
+++ b/src/views/player/video.ecr
@@ -0,0 +1,5 @@
+<video id="player" class="video-js" data-setup="{}" style="width:100%;" controls>
+    <% fmt_stream.each do |fmt| %>
+    <source src="<%= fmt["url"]? %>" type="<%= fmt["type"]? ? fmt["type"].to_s.split(";")[0] : "" %>">
+    <% end %>
+</video>
\ No newline at end of file
diff --git a/src/views/watch.ecr b/src/views/watch.ecr
index bdbf4b92..4d428f6e 100644
--- a/src/views/watch.ecr
+++ b/src/views/watch.ecr
@@ -6,21 +6,9 @@
 <% end %>
 
 <% if listen %>
-<audio id="player" class="video-js" data-setup="{}" style="width:100%;" controls>
-    <% adaptive_fmts.each do |fmt| %>
-        <% url = fmt["url"]? %>
-        <% type = fmt["type"]? ? fmt["type"].to_s.split(";")[0] : "" %>
-        <% if type.starts_with?("audio") %>
-        <source src="<%= url %>" type="<%= type %>">
-        <% end %>
-    <% end %>
-</audio>
+<%= render "src/views/player/audio.ecr" %>
 <% else %>
-<video id="player" class="video-js" data-setup="{}" style="width:100%;" controls>
-    <% fmt_stream.each do |fmt| %>
-    <source src="<%= fmt["url"]? %>" type="<%= fmt["type"]? ? fmt["type"].to_s.split(";")[0] : "" %>">
-    <% end %>
-</video>
+<%= render "src/views/player/video.ecr" %>
 <% end %>
 
 <script>