7 files changed, 38 insertions, 0 deletions
diff --git a/app/views/projects/blob/viewers/_image.html.haml b/app/views/projects/blob/viewers/_image.html.haml
new file mode 100644
index 00000000000..640d59b3174
--- /dev/null
+++ b/app/views/projects/blob/viewers/_image.html.haml
@@ -0,0 +1,2 @@
+.file-content.image_file
+  %img{ src: blob_raw_url, alt: viewer.blob.name }
diff --git a/app/views/projects/blob/viewers/_markup.html.haml b/app/views/projects/blob/viewers/_markup.html.haml
new file mode 100644
index 00000000000..ae8f3e05687
--- /dev/null
+++ b/app/views/projects/blob/viewers/_markup.html.haml
@@ -0,0 +1,3 @@
+- blob = viewer.blob
+.file-content.wiki
+  = render_markup(blob.name, blob.data)
diff --git a/app/views/projects/blob/viewers/_notebook.html.haml b/app/views/projects/blob/viewers/_notebook.html.haml
new file mode 100644
index 00000000000..2399fb16265
--- /dev/null
+++ b/app/views/projects/blob/viewers/_notebook.html.haml
@@ -0,0 +1,5 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('notebook_viewer')
+
+.file-content#js-notebook-viewer{ data: { endpoint: blob_raw_url } }
diff --git a/app/views/projects/blob/viewers/_pdf.html.haml b/app/views/projects/blob/viewers/_pdf.html.haml
new file mode 100644
index 00000000000..1dd179c4fdc
--- /dev/null
+++ b/app/views/projects/blob/viewers/_pdf.html.haml
@@ -0,0 +1,5 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('pdf_viewer')
+
+.file-content#js-pdf-viewer{ data: { endpoint: blob_raw_url } }
diff --git a/app/views/projects/blob/viewers/_sketch.html.haml b/app/views/projects/blob/viewers/_sketch.html.haml
new file mode 100644
index 00000000000..49f716c2c59
--- /dev/null
+++ b/app/views/projects/blob/viewers/_sketch.html.haml
@@ -0,0 +1,7 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('sketch_viewer')
+
+.file-content#js-sketch-viewer{ data: { endpoint: blob_raw_url } }
+  .js-loading-icon.text-center.prepend-top-default.append-bottom-default.js-loading-icon{ 'aria-label' => 'Loading Sketch preview' }
+    = icon('spinner spin 2x', 'aria-hidden' => 'true');
diff --git a/app/views/projects/blob/viewers/_stl.html.haml b/app/views/projects/blob/viewers/_stl.html.haml
new file mode 100644
index 00000000000..e4e9d746176
--- /dev/null
+++ b/app/views/projects/blob/viewers/_stl.html.haml
@@ -0,0 +1,12 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('stl_viewer')
+
+.file-content.is-stl-loading
+  .text-center#js-stl-viewer{ data: { endpoint: blob_raw_url } }
+    = icon('spinner spin 2x', class: 'prepend-top-default append-bottom-default', 'aria-hidden' => 'true', 'aria-label' => 'Loading')
+  .text-center.prepend-top-default.append-bottom-default.stl-controls
+    .btn-group
+      %button.btn.btn-default.btn-sm.js-material-changer{ data: { type: 'wireframe' } }
+        Wireframe
+      %button.btn.btn-default.btn-sm.active.js-material-changer{ data: { type: 'default' } }
+        Solid
diff --git a/app/views/projects/blob/viewers/_svg.html.haml b/app/views/projects/blob/viewers/_svg.html.haml
new file mode 100644
index 00000000000..62f647581b6
--- /dev/null
+++ b/app/views/projects/blob/viewers/_svg.html.haml
@@ -0,0 +1,4 @@
+- blob = viewer.blob
+- data = sanitize_svg_data(blob.data)
+.file-content.image_file
+  %img{ src: "data:#{blob.mime_type};base64,#{Base64.encode64(data)}", alt: blob.name }