add splash screen for deliverME

app/assets/stylesheets/application.scss

@@ -427,3 +427,12 @@ a[data-behavior=seekable-timecode] {
   width: 308px;
   height:308px;
 }
+
+// Add checkmark before list item
+#checkmark-list > li {
+  list-style: none;
+  margin-left: -1em;
+}
+#checkmark-list > li:before {
+  content: '\2713\0020';
+}

app/controllers/videos_controller.rb

@@ -3,6 +3,7 @@ class VideosController < ApplicationController
 
   before_action :set_project, only: [:index, :new, :create, :landing]
   before_action :set_video, only: [:edit, :update]
+  before_action :show_splash_screen, only: :index
 
   def landing
     authorize Video, :new?
@@ -60,6 +61,10 @@ class VideosController < ApplicationController
 
   private
 
+  def show_splash_screen
+    render :splash if videos.count.zero?
+  end
+
   def set_project
     @project = policy_scope(Project).find(params[:project_id])
   end

app/helpers/wordmark_helper.rb

@@ -13,10 +13,13 @@ module WordmarkHelper
     css += options[:class].to_s
 
     content_tag(:div, class: css) do
-      safe_join [
+      elements = [
         content_tag(:span, t("shared.#{product_name}")),
         content_tag(:span, t("shared.me"))
       ]
+      prefix = options[:prefix]
+      elements.unshift content_tag(:span, "#{prefix} ") unless prefix.blank?
+      safe_join elements
     end
   end
 end

app/views/videos/splash.html.erb

@@ -0,0 +1,57 @@
+<div class="d-flex flex-row">
+  <div class="d-flex flex-column">
+    <%= product_wordmark :deliver_me, prefix: t('.headings.welcome'), class: "h2" %>
+    <p class="text-muted"><%= t '.headings.subtitle' %>
+  </div>
+
+  <%= link_to t(".actions.book_demo"), 'https://meetings.hubspot.com/bray2', class: "btn btn-primary border align-self-center h-50 ml-auto mr-2 pb-2", target: '_blank' %>
+  <%= link_to t(".actions.upload_video"), [:new, @project, :video], class: "btn btn-success border align-self-center h-50 pb-2" %>
+</div>
+
+<hr>
+
+<div class="pt-2">
+  <div class="row">
+    <div class="col">
+      <div class="card-body p-0">
+        <div class="embed-responsive embed-responsive-16by9">
+          <div class="embed-responsive-item">
+            <table class="w-100 h-100 bg-secondary">
+              <tbody>
+              <tr>
+                <td class="text-center align-middle text-white">
+                  Video tutorial will be available soon
+                </td>
+              </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="row">
+        <div class="col">
+          <h3><%= t '.headings.how_it_works' %></h3>
+          <ol>
+            <li><%= t '.list_items.import_video' %></li>
+            <li><%= t '.list_items.import_EDLs' %></li>
+            <li><%= t '.list_items.AI_generates_documents' %></li>
+            <li><%= t '.list_items.download_documents' %></li>
+          </ol>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <h3><%= t '.headings.benefits' %></h3>
+          <ul id="checkmark-list">
+            <li><%= t '.list_items.reduces_labor_cost' %></li>
+            <li><%= t '.list_items.more_accurate' %></li>
+            <li><%= t '.list_items.simplifies_cue_sheets' %></li>
+            <li><%= t '.list_items.production_elements_logs' %></li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

config/locales/en.yml

@@ -1273,6 +1273,24 @@ en:
     new:
       heading: Upload Video
       subheading: 2 of 2 Files
+    splash:
+      actions:
+        book_demo: Schedule a Demo
+        upload_video: Upload New Video
+      headings:
+        benefits: Benefits
+        how_it_works: How It Works
+        subtitle: Automate your deliverable documents
+        welcome: Welcome to
+      list_items:
+        AI_generates_documents: AI generates deliverable documents
+        download_documents: Download deliverable documents
+        import_EDLs: Import your EDLs
+        import_video: Import your video
+        more_accurate: More accurate than human-generated reports
+        production_elements_logs: Production Elements Logs, and more
+        reduces_labor_cost: Reduces labor costs
+        simplifies_cue_sheets: Simplifies Music Cue Sheets, Graphic Cue Sheets
     update:
       notice: The video has been updated
     video:

config/locales/es.yml

@@ -363,3 +363,22 @@ es:
         manage: Manage (ES)
         open_deliverable: Open Deliverable (ES)
         read_more: read more (ES)
+  videos:
+    splash:
+      actions:
+        book_demo: Schedule a Demo (ES)
+        upload_video: Upload New Video (ES)
+      headings:
+        benefits: Benefits (ES)
+        how_it_works: How It Works (ES)
+        subtitle: Automate your deliverable documents (ES)
+        welcome: Welcome to (ES)
+      list_items:
+        AI_generates_documents: AI generates deliverable documents (ES)
+        download_documents: Download deliverable documents (ES)
+        import_EDLs: Import your EDLs (ES)
+        import_video: Import your video (ES)
+        more_accurate: More accurate than human-generated reports (ES)
+        production_elements_logs: Production Elements Logs, and more (ES)
+        reduces_labor_cost: Reduces labor costs (ES)
+        simplifies_cue_sheets: Simplifies Music Cue Sheets, Graphic Cue Sheets (ES)

spec/controllers/videos_controller_spec.rb

@@ -20,6 +20,7 @@ RSpec.describe VideosController, type: :controller do
     end
 
     it "has a search form" do
+      create(:video, project: project)
       get :index, params: { project_id: project }
 
       expect(response.body).to have_button("search-button")
@@ -43,7 +44,7 @@ RSpec.describe VideosController, type: :controller do
     end
 
 
-    it "renders content" do
+    it "renders content if there are existing videos" do
       video = create(:video, project: project, name: "My Video", number: "001", created_at: 1.day.ago)
 
       get :index, params: { project_id: project }
@@ -58,10 +59,11 @@ RSpec.describe VideosController, type: :controller do
     end
 
     context "when there are no records" do
-      it "renders an empty message" do
+      it "renders splash screen" do
         get :index, params: { project_id: project }
 
-        expect(response.body).to have_content("Videos will appear here")
+        expect(response.body).to have_link "Upload New Video"
+        expect(response.body).to have_link schedule_demo
       end
     end
 
@@ -277,4 +279,8 @@ RSpec.describe VideosController, type: :controller do
   def video_update_params
     attributes_for(:video, :with_graphics_only_edl_file, :with_audio_only_edl_file, name: "Test Video").except(:file)
   end
+
+  def schedule_demo
+    t 'videos.splash.actions.book_demo'
+  end
 end

spec/features/user_managing_videos_spec.rb

@@ -17,6 +17,14 @@ feature "User managing videos" do
     sign_in current_user
   end
 
+  scenario "splash page is shown if there are no existing videos" do
+    Video.delete_all
+    visit project_videos_path(project)
+
+    expect(page).to have_content schedule_demo
+    expect(page).to have_content upload_new_video
+  end
+
   scenario "creating a video", js: true do
     visit project_videos_path(project)
     click_link "Upload New Video"
@@ -115,4 +123,12 @@ feature "User managing videos" do
   def update_video_notice
     t "videos.update.notice"
   end
+
+  def schedule_demo
+    t 'videos.splash.actions.book_demo'
+  end
+
+  def upload_new_video
+    t 'videos.splash.actions.upload_video'
+  end
 end